/*  
Theme Name: Hugbacker
Theme URI: http://hugbacker.com/
Description: The first theme for the Hugbacker blog
Version: 1.0
Author: George Huff
Author URI: http://www.eleven3.com

	eleven3 3.0
	 http://www.eleven3.com/

	This theme was designed by Todd Quackenbush and built by George Huff, We The Media.
	

 */



/************************************************************************

	Site:		hugbacker.com

	Author:		George Huff, We The Media		[www.wtmworldwide.com]  

	Client:		Lisa Cecconi	[http://www.hugbacker.com/]
	
	Notes:		Design and Build
	
	Date:		11-22-08 
				
				
	Listing Order:
	==============

	1 - Global
	2 - Structural
	3 - Header
	4 - Colors
	5 - Left Column
	6 - Ads
	7 - Sidebar
	8 - Footer
	

************************************************************************/

/***********************************************************************
	1 - GLOBAL STYLES
************************************************************************/

body {
	background: #ebebeb url(images/bg_body.gif) center top repeat-y;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #f9f9f9;
}

* { 
	margin: 0; 
	padding: 0; 
	border: 0;
}

a {
	text-decoration:none;
	color: #35797a;
} 
a:hover {
	text-decoration:underline;
}

div.left, div.right {
	float: left;
}



.clear {clear:both;}

.clearfix:after {
        content:".";
        display:block;
        height:0;
        clear:both;
        visibility:hidden;
}

.clearfix {display:block;}
/* End hide from IE Mac *//* end clearing */

/* replace */
.replace {text-indent:-10000px; display: block; width: 100%; height: 100%; outline: none;}

.replace * {text-indent:-10000px;display:block;background-repeat:no-repeat;background-position:left top;background-color:transparent;}
/*.replace a {text-indent:0;}*/
.replace a span {}
/* end replace */



/***********************************************************************
	2 - STRUCTURAL STYLES
************************************************************************/

div#outer_wrapper { background: url(images/bg_outter_wrapper.gif) left top repeat-x;  }
div.inner_wrapper { margin: 0 auto;}

div#container { width: 822px; background: #fff url(images/bg_content.gif) right top repeat-y;}


/***********************************************************************
	3 - HEADER STYLES
************************************************************************/

div#header { height: 260px; background: #35797a; border-left: 2px #132c2c solid; border-bottom: 2px solid #132c2c; position: relative;}

div#site_logo { font-family: "Trebuchet MS", Arial, sans-serif; color: #a9c0b8; position: absolute; left: 43px; top: 155px; }
div#site_logo p { padding-top: 3px; }
div#site_logo p span { color: #fff; }
a#logo_hugbacker { display: block; background: url(images/logo_hugbacker.gif) left top no-repeat; width: 298px; height: 62px;}
a#rss_subscribe { position: absolute; top: 41px; left: 300px; color: #ee7d22; font-weight: bold; text-transform: uppercase; font-size: 10px; background: url(images/icon_subscribe_header.gif) right top no-repeat; padding-right: 20px; line-height: 200%;}

div#search_nav { position: absolute; right: 0px; top: 200px; width: 191px;}
div#search_nav ul { padding-left: 3px;}
div#search_nav ul li { list-style: none; float: left; }
div#search_nav ul li a { font-weight: bold; font-size: 10px; text-transform: uppercase; color: #dcdcdd; }
div#search_nav form { display: block; position: relative; height: 30px;}
div#search_nav form input.textfield { background: url(images/bg_search_textfield.gif) left top no-repeat; width: 137px; height: 18px; position: absolute; left:0; bottom: 0; padding-right: 10px; text-align: right; font-weight: bold; text-transform: uppercase; font-size: 11px; color: #132c2c; padding-top: 4px;}
div#search_nav input.button { position: absolute; bottom: 0; right: 12px;}

/***********************************************************************
	4 - COLOR SETTING STYLES
************************************************************************/

/* For Reference

Sports #479080
Videos #ffc600
Entertainement #173d3d
Business #cc872d
Lifestyle #8aa39a
Events #ff8100
Features #091414
Charitable Orgs #b5b192

*/


/* Posts */

div.sports { border-color: #479080 ;}
div.videos { border-color: #ffc600 ;}
div.entertainment { border-color: #173d3d ;}
div.business { border-color: #cc872d ;}
div.lifestyle { border-color: #8aa39a ;}
div.events { border-color: #ff8100 ;}
div.features { border-color: #091414 ;}
div.charitable_orgs { border-color: #b5b192 ;}

div.sports img { border-color: #479080 ;}
div.videos img { border-color: #ffc600 ;}
div.entertainment img { border-color: #173d3d ;}
div.business img { border-color: #cc872d ;}
div.lifestyle img { border-color: #8aa39a ;}
div.events img { border-color: #ff8100 ;}
div.features img { border-color: #091414 ;}
div.charitable_orgs img { border-color: #b5b192 ;}

div.sports a { color: #479080 ;}
div.videos a { color: #ffc600 ;}
div.entertainment a { color: #173d3d ;}
div.business a { color: #cc872d ;}
div.lifestyle a { color: #8aa39a ;}
div.events a { color: #ff8100 ;}
div.features a { color: #091414 ;}
div.charitable_orgs a { color: #b5b192 ;}

div.sports input.button { background: #479080 ; color: #ccfff4; }
div.videos input.button { background: #ffc600 ; color: #ffef65;}
div.entertainment input.button { background: #173d3d ;}
div.business input.button { background: #cc872d ;}
div.lifestyle input.button { background: #8aa39a ;}
div.events input.button { background: #ff8100 ;}
div.features input.button { background: #091414 ;}
div.charitable_orgs input.button { background: #b5b192 ;}

div.sports a.more-link  { background: #479080 !important; color: #ccfff4;border: 1px solid #479080 !important; }
div.videos a.more-link  { background: #ffc600 !important; color: #ffef65;border: 1px solid #ffc600 !important;}
div.entertainment a.more-link  { background: #173d3d !important; border: 1px solid #173d3d !important;}
div.business a.more-link  { background: #cc872d !important; border: 1px solid #cc872d !important;}
div.lifestyle a.more-link  { background: #8aa39a !important; border: 1px solid #8aa39a !important;}
div.events a.more-link  { background: #ff8100 !important; border: 1px solid #ff8100 !important;}
div.features a.more-link  { background: #091414 !important; border: 1px solid #091414 !important;}
div.charitable_orgs a.more-link  { background: #b5b192 !important; border: 1px solid #b5b192 !important;}

div.sports a.more-link:hover { color: #479080 !important;  }
div.videos a.more-link:hover { color: #ffc600 !important;  }
div.entertainment a.more-link:hover { color: #173d3d !important; }
div.business a.more-link:hover { color: #cc872d !important; }
div.lifestyle a.more-link:hover { color: #8aa39a !important; }
div.events a.more-link:hover { color: #ff8100 !important; }
div.features a.more-link:hover { color: #091414 !important; }
div.charitable_orgs a.more-link:hover { color: #b5b192 !important; }

/* Category Nav */

li.sports span.block { background: #479080 ;}
li.videos span.block { background: #ffc600 ;}
li.entertainment span.block { background: #173d3d ;}
li.business span.block { background: #cc872d ;}
li.lifestyle span.block { background: #8aa39a ;}
li.events span.block { background: #ff8100 ;}
li.features span.block { background: #091414 ;}
li.charitable_orgs span.block { background: #b5b192 ;}

li.sports a:hover { background: #479080; border-left: #4e897c 1px solid; color: #ccfff4 !important;}
li.videos a:hover { background: #ffc600; border-left: #e2b416 1px solid; color: #ffef65 !important; }
li.entertainment a:hover { background: #173d3d; border-left: #0e1f20 1px solid; color: #fff !important;}
li.business a:hover { background: #cc872d; border-left: #b9823a 1px solid;color: #fff !important;}
li.lifestyle a:hover { background: #8aa39a; border-left: #849891 1px solid; color: #fff !important;}
li.events a:hover { background: #ff8100; border-left: #0e1f20 1px solid; color: #fff !important;}
li.features a:hover { background: #091414; border-left: #1d2626 1px solid; color: #fff !important;}
li.charitable_orgs a:hover { background: #b5b192; border-left: #9a9a9a 1px solid; color: #fff !important;}

li.sports a:hover span.block { background: #ccfff4 ;}
li.videos a:hover span.block { background: #ffef65 ;}
li.entertainment a:hover span.block { background: #fff ;}
li.business a:hover span.block { background: #fff ;}
li.lifestyle a:hover span.block { background: #fff ;}
li.events a:hover span.block { background: #fff ;}
li.features a:hover span.block { background: #fff ;}
li.charitable_orgs a:hover span.block { background: #fff ;}

li.sports a:hover strong { color: #ccfff4 ;}
li.videos a:hover strong { color: #ffef65 ;}
li.entertainment a:hover strong { color: #fff ;}
li.business a:hover strong { color: #fff ;}
li.lifestyle a:hover strong { color: #fff ;}
li.events a:hover strong { color: #fff ;}
li.features a:hover strong { color: #fff ;}
li.charitable_orgs a:hover strong { color: #fff ;}


/***********************************************************************
	5 - MAIN CONTENT STYLES
************************************************************************/

div#content { width: 619px; float: left; color: #666; overflow: hidden; font-size: 13px; }

h2.pagetitle {  text-transform: uppercase; padding: 6px 47px; color: #bbb;}

div.post { padding: 28px 34px; border-style: solid; border-left-width: 13px; border-top-width:  1px; border-top-style: solid; }
div.post img { border-width: 13px; margin-bottom: 17px; border-style: solid; margin-top: 10px;  }
div.post h2 { font-family: Tahoma, Arial, sans-serif; font-size: 20px; line-height: 100%;  padding-bottom: 10px; }
div.post p { padding-bottom: 13px; line-height: 160%;}
div.post a.more-link { margin-top: 10px; color: #fff;  font-weight: bold; padding: 5px 7px; width: 200px; -moz-border-radius: 5px;
-webkit-border-radius: 5px; font-size: 11px; font-family: Tahoma; display: block;}
div.post a.more-link:hover { text-decoration: none; background: #ddd !important; border: 1px solid #ccc !important;}

div.post_info { text-transform: uppercase;  font-size: 10px; color: #909090; text-transform: uppercase; padding-bottom: 10px; }
div.post_info h4.photo_credit { float: right; font-weight: normal; font-size: 10px; color: #909090; text-transform: uppercase; }
div.post_info h3 { float: left; clear: left; font-weight: normal; font-size: 10px; color: #909090; text-transform: uppercase; padding-right: 3px;}
div.post_info ul { float: left; list-style: none; }
div.post_info ul li { float: left; padding-right: 4px;  }
a.comments_link { font-weight: bold;}

p.postmetadata { padding: 10px; margin-bottom: 25px; border: 1px solid #ccc; background: #eee; }

div#comment_form, div.contactform { background: #eee; padding: 28px 34px; border: 1px solid #ccc; margin-bottom: 10px;}
div#comment_form label { width: 50px; float: left; display: block; font-size: 12px; padding-top: 5px;}
div#comment_form input.textfield { border: 1px solid #ccc; width: 220px; height: 20px; font-size: 16px; padding: 2px 3px; color: #666;}
div#comment_form textarea { width: 98%; border: 1px solid #ccc; font-size: 16px; padding: 2px 3px; color: #666; font-family: Arial;}
div#comment_form div { padding-bottom: 10px; }
div#comment_form h3 { padding-bottom: 2px; margin-bottom: 10px; border-bottom: 1px solid #ccc;}
div#comment_form span.disclaimer { display: block; padding-top: 10px; font-size: 10px; text-transform: uppercase;}
div#comment_form input.button, input#contactsubmit { padding: 5px 6px !important; color: #fff; font-weight: bold; cursor: pointer;  -moz-border-radius: 5px;
-webkit-border-radius: 5px; font-size: 11px !important; height: auto !important;}

div.wp-caption {}
div.aligncenter { text-align: center; width: 100% !important;}

h3#comments { text-transform: uppercase; font-size: 13px; font-weight: bold; border-bottom: 1px solid #ccc; padding-bottom: 5px; margin-bottom: 10px;}
h3#comments span { text-transform: none;}
ol.commentlist { list-style: none; padding: 10px 0px;}
img.avatar {  float: left; margin-right: 10px; margin-bottom: 10px; border-width: 3px !important;}

div.contactleft { width: 100px; float: left; clear: both;}
div.contactright { padding-bottom: 10px; }
div.contactright input { border: 1px solid #ccc; width: 220px; height: 20px; font-size: 16px; padding: 2px 3px; color: #666; }
div.contactright textarea { border: 1px solid #ccc; width: 98%; font-size: 16px; padding: 2px 3px; color: #666; font-family: Arial; }

div.pagination { height: 22px;border-left: 13px #757575 solid;}
div.pagination div.older { width: 303px; float: left; text-align: right; border-right: 1px solid #fff;}
div.pagination div.newer { width: 302px; float: left;}
div.pagination a { display: block; height: 18px; background: #d8d8d8; font-weight: bold; color: #173c3d; text-transform: uppercase; font-size: 12px;  padding: 4px 30px 0px 30px;}
div.pagination a:hover { color: #fff; background: #173c3d; text-decoration: none;}

/***********************************************************************
	6 - AD STYLES
************************************************************************/

div.ad_180_150 { width: 180px; height: 150px; margin: 12px auto; text-align: center;}
div.ad_160_600 { width: 160px; height: 600px;  margin: 12px auto; text-align: center;}
div.ad_329_118 { width: 329px; height: 118px;  margin: 12px auto; text-align: center;}

ul.ad_sizes { background: #d6e4df; padding: 10px; border: 1px solid #ccc; margin-bottom: 20px;  }
ul.ad_sizes li { width: 40%; float: left; margin-left: 20px; }
ul.ad_sizes li.disclaimer { width: 100%; padding-top: 10px; margin-left: 0px; border-top: 1px dotted #35797a; margin-top: 10px; list-style: none; font-style: italic;}

/***********************************************************************
	7 - SIDEBAR STYLES
************************************************************************/


div#sidebar { width: 203px; float: right; border-top: 1px solid #b3b3b3; }

div#newsletter { background: #a9c0b8; border-left: #9dafa9; border-bottom: #8fa39c 2px solid; height: 95px; padding-left: 11px; padding-top: 14px; position: relative; }
h1#headline_newsletter { background: url(images/text_header_newsletter.gif) left top no-repeat; width: 121px; height: 19px;}
div#newsletter p { color: #173c3d; font-size: 11px; padding-top: 7px; padding-bottom: 7px;}
div#newsletter input.textfield { width: 168px; height: 14px; margin-bottom: 2px; color: #a8a9ac; font-size: 10px; padding-left: 10px; padding-top: 2px;  }
input#newsletter_submit_button {position: absolute; top: 15px; right: 13px;}

div#most_recent_twitter { background: #f1f1f1; border-left: 1px solid #d6d6d6;color: #173d3d; position: relative; padding: 25px 13px 20px 10px;}
div#most_recent_twitter a { color: #173d3d !important; font-weight: bold;}
h1#headline_twitter { background: url(images/text_most_recent_twitter.gif) left top no-repeat; width: 141px; height: 90px; padding-bottom: 10px;}
a#button_follow { position: absolute; top: 27px; right: 11px; width: 66px; height: 24px; background: url(images/button_follow.gif) left top no-repeat;}
div#most_recent_twitter p { line-height: 133%; font-size: 12px;}
p#tweet_details { padding-top: 3px;  }
p#tweet_details a {font-weight: bold; color: #173d3d !important; font-size: 10px;}

ul#categories li { list-style: none;}
ul#categories li strong { display: block; text-transform: uppercase; font-size: 14px; padding-bottom: 2px;}
ul#categories a { color: #0e1f20; display: block; padding: 17px 20px 17px 40px; position: relative; line-height: 100%; border-left: #9a9a9a; }
ul#categories a:hover { text-decoration: none;}
ul#categories span.block { display: block; position: absolute; left: 20px; top: 17px; width: 12px; height: 12px;}


/***********************************************************************
	8 - FOOTER STYLES
************************************************************************/

div#footer { background: #151c1c; height: 190px; border-bottom: 50px solid #415a5a; padding-top: 55px;}
div#footer div.inner_wrapper { width: 729px; }

div#footer ul li { list-style: none; float: left; }
div#footer ul li a { font-weight: bold; font-size: 9px; text-transform: uppercase; color: #dcdcdd; padding-top: 3px;}
div#footer p { clear: left; width: 380px; font-size: 10px; color: #666; padding-top: 12px; line-height: 170%;  }
div#footer a#bug_hugbacker { background: url(images/logo_hugbacker_footer.gif) left top no-repeat; width: 96px; height: 21px; display: block; margin-bottom: 10px;}
a#subscribe_footer { padding-right: 20px; background: url(images/icon_subscribe_footer.gif) right top no-repeat; color: #ee7d22 !important;}
