/*=====================================
STICKY FOOTER (ryanfait.com) & MAIN IDS
=====================================*/

* { margin: 0; }

html { font-size:1em; }

html, body { height: 100%; }

body {
	font-family: verdana, "Helvetica Neue", Arial, Helvetica, sans-serif;
	background:transparent url(../images/bg-header.png) repeat-x 0 0;
	}

#wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -40em; /* the bottom margin is the negative value of the footer's height */
	}

#footer, #push { height: 40em; } /* .push must be the same height as #footer */





/*=====================================
HEADER & THE ELEMENTS WITHIN
=====================================*/

#header {
	position: relative;
	width: 950px;
	padding-top:5px;
	height: 264px;
	background: transparent url(../images/bg-header-texture.jpg) no-repeat 165px 0;
	}

#logo {
	position:absolute; 
	width: 340px; 
	margin: 110px 0 0 0;
	text-indent: -900000px;
	}

#logo h1 a {
	float: left;
	width: 340px;
	height: 68px;
	padding:0;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -359px;
}

#leaderboard {
	position:absolute;
	width:760px;
	}

#ads-top {
	position:absolute;
	width:190px;
	margin: 0 760px
	}





/*=====================================
MAIN NAVIGATION (header)
=====================================*/

#nav-main {
	position:absolute;
	z-index:10;
	margin: 185px 0;
	padding:0;
	width:950px;
	height:79px;
	}
	
#nav-main ul {
	margin: 0;
	padding:0;
	background:transparent url(../images/nav-main.png) no-repeat 0 0;
	}

#nav-main ul li {
	position:absolute;
	display:block;
	outline:none;
	height:79px;
	text-indent:-90000px;
	margin:0;
	}
	
#nav-main ul li a {
	display:block;
	outline:none;
	height:79px;
	background:transparent url(../images/nav-main.png) no-repeat;
	text-indent:-90000px;
	margin:0;
	}

#nav-main ul li a:hover { background-position: 0 -79px; }

/* BUTTONS INACTIVE */
#nav-main ul li#doing-right		{ width:235px; margin-left: 0px; }
#nav-main ul li#doing-wrong		{ width:238px; margin-left: 235px; }
#nav-main ul li#why-it-matters		{ width:182px; margin-left: 473px; }
#nav-main ul li#about 			{ width:169px; height:49px; margin: 30px 0 0 782px; }

/* BUTTONS HYPERLINKED */
#nav-main ul li#doing-right a 		{ width:235px; background-position:0 0; }
#nav-main ul li#doing-wrong a 		{ width:238px; background-position:-235px 0; }
#nav-main ul li#why-it-matters a 	{ width:182px; background-position:-473px 0; }
#nav-main ul li#about a 		{ width:169px; height:49px; background-position:-655px -30px;}

/* OVER STATES */
#nav-main ul li#doing-right a:hover 	{ background-position:0 -79px }
#nav-main ul li#doing-wrong a:hover 	{ background-position:-235px -79px }
#nav-main ul li#why-it-matters a:hover 	{ background-position:-473px -79px }
#nav-main ul li#about a:hover 		{ background-position:-655px -109px; }

/* PRESSED STATES */
#nav-main ul li#doing-right a:active 	{ background-position:0 -158px }
#nav-main ul li#doing-wrong a:active 	{ background-position:-235px -158px }
#nav-main ul li#why-it-matters a:active { background-position:-473px -158px }
#nav-main ul li#about a:active 		{ background-position:-655px -188px; }

/* ON STATES */
#nav-main ul li#doing-right.live 	{ width:235px; background:transparent url(../images/nav-main.png) no-repeat 0px -232px }
#nav-main ul li#doing-wrong.live 	{ width:238px; background:transparent url(../images/nav-main.png) no-repeat -235px -232px }
#nav-main ul li#why-it-matters.live 	{ width:182px; background:transparent url(../images/nav-main.png) no-repeat -473px -232px }
#nav-main ul li#about.live		{ width:169px; background:transparent url(../images/nav-main.png) no-repeat -655px -262px }





/*=====================================
FUNCTIONS SEARCH (header)
=====================================*/

#search-functions {
	position:absolute;
	top: 125px;
	right: -17px;
	padding:0;
	width:200px;
	height:80px;
	}

#search-quick {
	position: relative;
	width: 156px;
	height: 24px;
	margin: 0 auto;
 	background: transparent url(../images/sprite-master.png) no-repeat 0 -934px;
	}

#search-quick #s {
	float: left;
	padding: 0;
	margin: 4px 0 0 6px;
	width: 125px;
	background: none;
	border: 0;
	outline: none;
	}

#search-quick #go {
	float: right;
	margin: 5px 5px 0 0;
	}

#search-advanced a {
	display:block;
	outline:none;
	height:38px;
	width: 200px;
	margin: 10px 0 0 0;
	background:transparent url(../images/nav-main.png) no-repeat -986px -36px; ;
	text-indent:-90000px;
	}

#search-advanced  a:hover {
	background-position: -986px -115px
	}

#search-advanced a:active {
	background-position:-986px -193px;
	}





/*=====================================
ADVANCED SEARCH FUNCTION (hidden element)
=====================================*/

#search-advanced-outer {
	display: none;
	border: 1px solid #b4b782;
	background:#f4f5eb;
	margin-bottom:3em;
	}

#search-advanced-inner {
	float:left;
	width:908px;
	padding:20px 20px 35px 20px;
	margin:1px;
	background:#e8eac9 url(../images/bg-stripes-fade.png) repeat-x 0 100%;
	}

#search-advanced-inner .colborder {
	padding-right:24px;
	margin-right:25px;
	border-right:1px solid #ddd;
	}

#search-advanced-inner ul {
	list-style-type: none;
	margin:0 0 1.5em 0;
	padding:0em;
	}

#search-advanced-inner ul li {
	display:block;
	line-height:1.75em;
	}

#search-advanced-inner label {
	font-weight: normal;
	}

#search-advanced-inner .button-search {
	position: absolute;
	width: 178px;
	height:48px;
	bottom: 1px;
	right: 1px;
	background: transparent url(../images/bg-search-advanced-swirl.png) no-repeat 0 0;	
	}

#search-advanced-inner .button-search .search {
	float:right;
	margin: auto  2em  2em auto;
	}

#search-advanced-inner .colborder { border-color: #b4b782; }

#search-advanced-inner h6 { margin-bottom: 0.5em; }

#search-advanced-inner ul.tags li { width: 13em; }





/*=====================================
SEARCH BOX (sidebar)
=====================================*/

.search-box {
	background:#eee;
	}

.search-box h6 {
	padding: 1em;
	}

.search-box ul {
	list-style-type: none;
	}

.search-box ul.list-style-inlineblock  {
	padding:0 0 2em 1em;
	}

.search-box ul.list-style-inlineblock li  {
	border-bottom: 0px;
	}

.search-box ul li {
	border-bottom: 1px dotted #aaa;
	line-height:1.5em;
	font-weight: bold;
	padding: 5px 0;
	}

.search-box ul li a {
	font-weight: normal;
	}

.search-box ul li em {
	font-weight: normal;
	color:#777;
	font-style:normal;
	}

.search-box .inline-list {
	margin-left: 1.5em;
	}





/*=====================================
FUNCTIONS SOCIAL
=====================================*/

.function-scale {
	height: 21px;
	padding: 0 0 15px 25px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -475px;
	border-bottom: 1px solid #ddd;
	font-size:10px;
	margin-bottom:18px;
	line-height:18px;	
	}

#functions-social ul {
	list-style-type:none;
	font-size:10px;
	margin-bottom:18px;
	line-height:18px;
	}

#functions-social ul li {
	margin:1em 0;
	color:#777777;
	}

.function-rss {
	height: 18px;
	padding-left: 20px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -547px;
	}

.function-print {
	height: 18px;
	padding-left: 20px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -614px;
	}

.function-email {
	height: 18px;
	padding-left: 20px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -680px;
	}

.function-twitter {
	height: 18px;
	padding-left: 20px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -513px;
	}
	
.function-fb {
	height: 18px;
	padding-left: 20px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -582px;
	}

.function-delicious {
	height: 18px;
	padding-left: 20px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -645px;
	}
	
.function-comment {
	height: 18px;
	padding-left: 20px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -709px;
	}

/*=====================================
PAGINATION (search & category listings)
=====================================*/

#pagination {
	padding: 0em;
	margin: 2em 0em;
	text-align:center;
	}

#pagination a {
	border: 1px solid #dedfde;
	margin-right:0.3em;
	padding:0.3em 0.6em;
	background-position:bottom;
	text-decoration: none;
	color: #0882a6;		
	}

#pagination a:hover, div.meneame a:active {
	border: 1px solid #000;
	background-image:none;
	background-color:#0882a6;
	color: #fff;
	}

#pagination span.current {
	margin-right:0.3em;
	padding:0.3em 0.6em;
	font-weight: bold;
	color: #0882a6;
	}

#pagination span.disabled {
	margin-right:0.3em;
	padding:0.3em 0.6em;
	color: #adaaad;
	}





/*=====================================
MISC. FOOTER CLASSES
=====================================*/

#ads-bottom {
	height:13em;
	background: #e8eac9 url(../images/bg-adspace-bottom.png) repeat-x 0 100%;
	border-top: 1px solid #cfd2a0;
	border-bottom: 1px solid #a9ad6d;	
	}

#nav-bottom {
	min-height:27em;
	background: #cfd2a0;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #e8eac9;	
	}

#nav-bottom h6 {
	padding-left:2em;
	padding-bottom:0.5em;
	}

.footer-links {
	width: 190px;
	background: transparent url(../images/sprite-master.png) no-repeat 0 -1008px;
	}

.footer-links ul {
	list-style-type: square;
	padding: 1em 0 0 2em;
	}




/*=====================================
HYPERLINKS
=====================================*/

a {
	color:#0882a6;
	text-decoration:none;
	}

a:focus, a:hover {
	color:#0882a6;
	text-decoration:underline;
	}
.ads h6 {
	font-size:12px;
	font-weight:bold;
	}

.ads  a, .footer-links a {
	color: #222;
	}

.ads a:hover, .footer-links a:hover {
	text-decoration: underline;
	color: #222;
	}

.tags a {
	color: #777;
	padding-right:0.5em;
	border-right: 1px solid #777;
	}
	
.tags a.last {
	border-right: none;
	}
	
.tags a:hover {
	text-decoration: underline;
	color: #777;
	}





/*=====================================
H1 H2 H3 ETC
=====================================*/

h1 a, a:hover, h2 a, a:hover , h3 a, a:hover , h4 a, a:hover , h5 a, a:hover , h6 a, a:hover { color:#000; }

h1 {
	font-family: georgia, palatino, serif;
	font-size:2em;
	line-height:2em;
	margin-bottom:0em;
	}

h2 {
	font-family: georgia, palatino, serif;
	font-size:1.5em;
	line-height:1.5em;
	margin-bottom:0em;
	margin:0em;
	}

h3 {
	line-height:1.5em;
	font-family: georgia, palatino, serif;
	font-size:1.2em;
	margin-bottom:1.25em;
	margin:0em;
	}

h4 {
	font-family: georgia, palatino, serif;
	font-size:1em;
	font-weight:bold;
	margin-bottom:1.5em;
	}

h5 {
	font-family: georgia, palatino, serif;
	text-transform: uppercase;
}

h6 {
	font-family: verdana, "Helvetica Neue", Arial, Helvetica, sans-serif;
	text-transform: uppercase;
}




/*=====================================
VERTICAL PADDING (extension of Blueprint
'prepend-top' and 'append-bottom')
=====================================*/

.padtop-1 {margin-top:18px;}
.padtop-2 {margin-top:36px;}
.padtop-3 {margin-top:54px;}
.padtop-4 {margin-top:72px;}
.padtop-5 {margin-top:90px;}

.padbottom-1 {margin-bottom:18px;}
.padbottom-2 {margin-bottom:36px;}
.padbottom-3 {margin-bottom:54px;}
.padbottom-4 {margin-bottom:72px;}
.padbottom-5 {margin-bottom:90px;}





/*=====================================
MISC. IDS AND CLASSES
=====================================*/

.image { 
	display:block;
	margin-bottom:1.5em;
	}
.image p.caption + p { text-indent:0; }


#bar {
	position: absolute;
	height: 5px;
	width: 100%;
	margin: 264px auto;
	z-index:-2;
	}

.strap {
	font-size: 0.8333em;
	line-height: 1.44em;  
	margin: 0.5em 0 0;
	color: #777;
}

#endtext { 
	padding: 2em 0 0 0;
	border-top: 1px solid #e8eac9;
	color:#909368;
	}
#endtext p + p  { text-indent:0; }

p + p { margin-top:1.5em; }

p.strap + p { text-indent:0; }


p.incr { margin-bottom:0em; }

.uppercase { text-transform: uppercase; }

.article-multi {
	padding-top: 1em;
	border-bottom:1px dotted #999;
	}

.list-style-inlineblock {
	margin-left: 0;
	list-style-type:none;
	}

.list-style-inlineblock li {
	float: left;
	display:inline;
	margin-right: 0.5em;
	}

ul.inline-list {
	margin-left:0;
	list-style-type:none;
	}

ul.inline-list li { display:inline; }

.borders {border:1px dashed #ff0000;}

.quiet { color: #777; }

#querystring { display:none; }

#querystring ul li { margin-bottom:1em; }

a.remove { margin:0 2em; }

.printOnly { display: none; }

body#right #bar { background-color:#00a009 }
body#wrong #bar { background-color:#c60101 }
body#matters #bar { background-color:#b71196 }
body#search #querystring { display: block; }





/*=====================================
COLORS
=====================================*/

.color_01, a.color_01, a:hover.color_01 { color: #00a009 } /*GREEN*/
.color_02, a.color_02, a:hover.color_02 { color: #c60101 } /*RED*/
.color_03, a.color_03, a:hover.color_03 { color: #b71196 } /*VIOLET*/
.color_04, a.color_04, a:hover.color_04 { color: #ff6c00 } /*ORANGE*/
.color_05, a.color_05, a:hover.color_05 { color: #777777 } /*GREY*/

.background_color_01 { background-color: #00a009 } /*GREEN*/
.background_color_02 { background-color: #c60101 } /*RED*/
.background_color_03 { background-color: #b71196 } /*VIOLET*/
.background_color_04 { background-color: #ff6c00 } /*ORANGE*/
.background_color_05 { background-color: #777777 } /*GREY*/