/*
-----------------------------------------------
Site: TweetApp
Author: Tom Fadial
Name: Base CSS
----------------------------------------------- */


/* Global
----------------------------------------------- */
html {}
body {
	margin: 0; padding: 0;
	border: 0;
	color: #fff;
	font: 12px/1.5 Helvetica, Arial, Verdana, sans-serif;
	background: #a0d12c url(../images/template/body_bg.png) repeat-x;
}

p {margin: 1em 0;}

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

hr {display: none;}


/* Structure
----------------------------------------------- */
#page {
	margin: 0 auto; padding: 60px 100px;
	width: 702px;
	background: url(../images/template/banner_glow_bg.png) no-repeat;
}
	#header {
		position: relative;
		height: 100px;
	}
	#banner {
		margin: -31px 0 0 0; padding: 28px 21px 29px 21px;
		width: 660px; min-height: 180px;
		background: url(../images/template/banner_bg.png) no-repeat;
		position: relative;
	}
	#footer {
		position: relative;
		z-index: 1;
		top: -10px;
	}


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

.clear,
.clearsub li {display: inline-block;}

/* Hides from IE-mac \*/
* html .clear,
* html .clearsub li {height: 1%;}
.clear,
.clearsub li {display: block;}
/* End hide from IE-mac */


/* Headlines
----------------------------------------------- */
h1, h2, h3, h4, h5, h6 {margin: 1em 0;}

h1 {}
h2 {font-size: 1.5em;}
h3 {font-size: 1.3em;}
h4 {font-size: 1.1em;}
h5 {font-size: 1em;}

#header {}
	#header h1 {
		width: 237px; height: 94px;
		background-image: url(../images/template/h1_logo_bg.png);
	}
		#header h1 a {width: 237px; height: 94px;}
	#header p.tagline {
		width: 223px; height: 23px;
		background-image: url(../images/template/p_tagline_bg.png);
	}

#banner {}
	#banner h2 {}
		#banner h2 a {
			width: 218px; height: 180px;
			position: absolute;
			top: 0; left: 0;
		}
	#banner h3 {font-size: 13px; line-height: 1.2;}

#footer {}
	#footer p {
		margin: 0 18px;
		float: right;
		background: url(../images/template/p_footer_bg.png) right no-repeat;
	}
		#footer p a {width: 139px; height: 12px;}


.replace,
#header h1,
#header p,
#banner h2,
.soon p {
	margin: 0; padding: 0;
	font-size: 1px;
	line-height: 1;
	text-indent: -9999px;
	background-repeat: no-repeat;
	overflow: hidden;
}
	.replace a,
	#header h1 a,
	#header p a,
	#banner h2 a {
		display: block;
		overflow: hidden;
	}


/* Header
----------------------------------------------- */
#header {}
	#header .logo {
		position: absolute;
		bottom: 0;
	}
	#header h1.logo {
		bottom: -20px; left: 20px;
		z-index: 10;
	}
	#header p.tagline {left: 260px;}


/* Banner
----------------------------------------------- */
#banner {list-style-type: none;}
	#banner li {
		margin-right: 2px;
		width: 217px; height: 180px;
		float: left;
		position: relative;
	}
	#banner li:hover {background-position: 0 -180px;}
		#banner li .content {padding: 15px 30px; display: none;}
		#banner li:hover .content {display: block;}
			#banner li .content p {line-height: 1.2;}

	#banner li.toomuch {width: 220px; background-image: url(../images/template/li_toomuch_bg.png);}
	#banner li.helpwith {background-image: url(../images/template/li_helpwith_bg.png);}

	#banner li.soon {}
		#banner li.soon p {
			width: 211px; height: 212px;
			background: url(../images/template/postit_bg.png);
			position: relative;
			top: -5px; left: 15px;
		}