/*
File:			custom.css
Description:	Custom styles for Thesis

More information about styling your Thesis installation using this file can be found
in the User's Guide:
	http://diythemes.com/thesis/rtfm/customizing-thesis-with-customcss/       */
	

/* -----------------    begin actual coding below     --------------------- */

/* --------- #008738 = green */
/* --------- #00cc51 = green link */
/* --------- #7d7d7d = grey */

/* --------- #00c659 = green link (old)*/


.custom body {
	}

.custom p {
	font-size: 0.9em;
	line-height: 1.3em;
	text-align: justify;
	orphans: 4;
	}


/* --------- This is the header for the sidebar lists */
.custom #sidebars h3 {
	margin: -20px 0px 0px 0px;
	padding: 0px 0px 6px 0px;
	font-family: "Arial Black", "Arial Bold", Arial, sans-serif;
	font-weight: bold;
	letter-spacing: 0.025em;
	text-transform: lowercase;
	color: #777777;
	}

/* --------- This hides the page titles */
.custom div.headline_area h1,
.custom #post-834 .headline_area h2 {
	display: block;
	text-indent: -9999px;
	}

/* --------- This un-hides the blog page titles (when it's just 1 blog per page) */
.custom div.headline_area h1.entry-title {
	display: block;
	text-indent: 0px;
	}

/* --------- This is the new title for each page */
.custom h1.new-title {
	text-align: left;
	display: block;
	margin: -30px 0px 10px 0px;
	font-family: "Arial Black", "Arial Bold", Arial, sans-serif;
	font-size: 1.4em;
	line-height: 1.4em;
	font-weight: normal;
	letter-spacing: -0.005em;
	}

/* --------- This is the new title for the link in "dual pages" */
.custom h1.new-title a {
	border: 0px 0px 2px 0px;
	}

/* --------- This is the image for the tab spacer on "dual pages" */
.custom img.spacer {
	margin: 0px -64px -12px -24px;
	}


/* ---------  This is the Search box */
.custom input#s {
	margin: 10px 0px -20px 0px;
	}

/*
.custom p.headline_meta {
	letter-spacing: 1px;
	}
*/

.custom h3 {
	padding: 0;
	margin: 0;
	font-size: 1em;
	line-height: 2em;
	}

.custom h4 {
	padding: 0;
	margin: -8px 0px 4px 0px;
	font-size: 1em;
	line-height: 2em;
	font-weight: normal;
	}

.custom img.right {
	float: right;
	}




/* --------- The About Title box */
.custom div.AboutTitle {
	margin: -10px 0px 0px 0px;
	padding: 8px 2px 2px 2px;
	text-transform: uppercase;
	font-size: 0.9em;
/*	text-indent: 10px;
*/	text-align: center;
	background: #008738;
	line-height: 1em;
	color: #ffffff;
	font-weight: bold;
/*	letter-spacing: 0.5em;
*/	}

/* --------- The About Title box */
.custom div.AboutTitle p {
	text-align: center;
	}

/* --------- Here's the indent for the "About list" */

.custom ul.AboutList {
	margin: -8px 0px 0px 0px;
	padding: 10px 10px 1px 10px;
	color: #000000;
	text-transform: none;
	font-variant: normal;
	font-size: 1.2em;
	text-indent: 0px;
	text-align: left;
	line-height: 1em;
	letter-spacing: 0em;
	background-color: #ffffff;
	list-style-type: none;
	}

.custom div.search {
	margin: -6px 0px 12px 0px;
	padding: 0px 0px 0px 0px;
	}

/* --------- This is the Search Results page */
.search-container {
	margin: 0;
	padding: 0;
	display: block;
	width: 400px;
	}

/* --------- This is the Search Results page */
#cse-search-results {
	margin: 0;
	padding: 0;
	display: block;
	width: 400px;
	}







/* donate button */
a.donate {
	margin: 0;
	padding: 0;
	display: block;
	text-indent: -1000em;
	width: 180px;
	height: 60px;
	background-image: url('http://g21m.org.s62546.gridserver.com/wp-content/uploads/donate-sprite.jpg');
	background-repeat: no-repeat;
	}

a.donate:hover {
	margin: 0;
	padding: 0;
	background-position: 0 -60px;
	}

a.donate:active {
	margin: 0;
	padding: 0;
	background-position: 0 -120px;
	}
	
a:active {
	margin: 0;
	padding: 0;
	outline: none; /* fixes dotted outline in Firefox */
	}

:focus { -moz-outline-style: none; } /* fixes dotted outline in Firefox */










.custom strong {
	font-weight: bold;
	letter-spacing: -0.05em;
	}

/* --------- Drop-Caps */
.custom span.drop_cap {
	margin: 0px 0px 0px 0px;
	padding: 6px 2px 0px 0px;
	color: #7d7d7d;
	font-weight: bold;
	font-size: 4.2em;
	}

/* --------- This is the superscript code (as in "st" "rd" "nd", etc.)*/
.custom sup {
	
	}

/* --------- This is the underline code */
.custom span.underline {
	text-decoration: underline;
	}

/* --------- This is for inline (body) <ul> (indented bullets) */
.custom ul.body, ol.body {
	font-size: 0.9em;
	text-indent: -12px
	margin: 0px 0px 0px 0px;
	padding: 0px 36px 0px 12px;
	line-height: 1.4em;
	}

/* this is the blockquote */
.custom blockquote {
	display: block;
	margin: 0px 18px 0px 18px;
	padding: 0px 0px 0px 0px;
	border: none;
	color: #000000;
	}


/* --------- This is the code defining the pullquotes */
/* Top quote */
.custom pullquote {
	float: right;
	background-image: url('images/open-quote.jpg');
	background-repeat: no-repeat;
	background-position: 10px top;
	border: none;
	margin: 0px 0px 12px 12px;
	padding: 35px 15px 0px 45px;
	font-size: 0.95em;
	line-height: 1.3em;
	color: #777777;
	}

/* Bottom quote */
.custom pullquote span.quote {
	background-image: url('images/close-quote.jpg');
	background-repeat: no-repeat;
	background-position: right bottom;
	display: block;
	padding: 0px 35px 30px 0px;
	font-size: 0.95em;
	line-height: 1.3em;
	}

/* --------- This is the code for the captions (right or left) under the pullquote (or anywhere else) */
.custom #caption-right {
	float: right;
	font-size: 80%;
	line-height: 130%;
	}
.custom #caption-left {
	float: left;
	font-size: 80%;
	line-height: 130%;
	clear: both;
	}

.custom div.top-pic-left {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border: none;
	height: 120px;
	float: left;
	}

.custom div.top-pic-right {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border: none;
	height: 120px;
	float: right;
	}



.custom #photo-credit {
	border: 0px 0px 0px 0px;
	margin: 4px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	width: 520px;
	height: 24px;
	clear: both;
	float: right;
	text-align: right;
	font-size: 0.7em;
	line-height: 1em;
/*	height: 50px;
	clear: both;
*/	}

.custom div.ccicon {
	background: url(http://green21.org/wp-content/themes/thesis_15/custom/images/ccSmall.png);
	border: 0px 0px 0px 0px;
	margin: -2px 0px 0px 4px;
	padding: 0px 0px 0px 0px;
	width: 14px;
	height: 14px;
	background-repeat: no-repeat;
	float: right;
	}










/* ----------  Begin header replacement code   ---------------- */

/* This is the (copied) code allowing our own image header (instead of WordPress's default image) */

/* This line sets up the clickable background image based on the site title's link
- DIY: Adjust the height & width attributes to reflect the actual size of your image
- DIY: Change the filename of your image to reflect the actual header's file name */
.custom #header #logo a {
	display: block;
	height: 75px;
	width: 228px;
	background: url('images/header.jpg');
	background-repeat: no-repeat;
	outline: none;
	float: none;
	}

/* This line gets rid of the site title & tagline by putting them way out to the left */
.custom #header #logo,
.custom #header #tagline {
	text-indent: -9999px;
	}

/* This line collapses the vertical space of the tagline so there's no unnecessary
white space after the header image (it's a bit of a kludge, but it seems to work) */
.custom #header #tagline {
	height: 0;
	}

/* This line removes the padding from the header so the background image sits close to the nav menu,
the bottom border of the header, and the sides of the content */
.custom #header {
	padding: 0;
	border-bottom: solid white 20px;
	}

/* ----------   This moves logo to the right */
.custom #logo {
	margin: 0px 0px 0px 303px;
	}

/* ----------   End header replacement code    ---------------- */






/*---:[ green box nav menu styles (old) ]:---*/

/*.custom ul#tabs {
	list-style: none;
	border: 1px solid #dddddd;
	border-width: 0 0 1px 1px;
	}
.custom ul#tabs li {
	margin-bottom: -0.1em;
	background: #00cc51;
	border: 1px solid #dddddd;
	border-left: 0;
	float: left;
	}
.custom ul#tabs li.current_page_item, ul#tabs li.current-cat {
	padding-bottom: 0.1em;
	background: #ffffff;
	border-bottom: 0;
	}
.custom ul#tabs li a {
	display: block;
	line-height: 1em;
	color: #ffffff;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	}
.custom ul#tabs li a:hover {
	color: #444444;
	font-weight: bold;
	text-decoration: underline;
	}
.custom ul#tabs li.current_page_item a, ul#tabs li.current-cat a {
	cursor: default;
	color: #000000;
	font-weight: normal;
	}
.custom ul#tabs li.current_page_item a:hover, ul#tabs li.current-cat a:hover {
	text-decoration: none;
	}
.custom ul#tabs li.rss {
	padding-right: 0;
	border: none;
	background: none;
	float: left;
	}
.custom ul#tabs li.rss a {
	padding-right: 16px;
	color: #000000;
	font-weight: normal;
	background: url('images/icon-rss.gif') 100% 50% no-repeat;
	}
*/















/* ------------- Drop Down Navs ------------ */

/* ----------- The nav div */
ul#tabs {
	margin: 0;
	padding: 0;
	list-style: none;
	border-width: 0px 0px 2px 0px;
	border-color: #008738;
	border-style: solid;
	}

/* ----------- The buttons and their border
				??? this is the box (div) ???  */
ul#tabs li {
	margin: 0;
	padding: 0;
	background-color: #ffffff;
	border: none;
	float: left;
	position: relative;
	font-size: 1.2em;
	}

/* ----------- This is the link to the respective page in the Nav and Dropdown menus (minus the margins - see above)
				??? this is the text (a) ???  */
ul#tabs li a {
	margin: 0;
	padding: 3px 6px 5px 11px;
	display: block;
	font-weight: bold;
	color: #008738; /* green */
	text-transform: lowercase;
	letter-spacing: 0.025em;
	}

/* ----------- This is the text only on the Nav menu only (no dropdown menus) */
ul#tabs li a:hover {
	margin: 0;
	padding: 3px 6px 5px 11px;
	font-weight: bold;
	color: #00cc51; /* link green */
	text-decoration: none;
	}

/* ----------- Indicates page you're on when it's in the Nav (only) */
ul#tabs li.current_page_item,
ul#tabs li.current-cat {
	margin: 0;
	padding: 0;
	background: #ffffff; /* white */
	}

ul#tabs li.current_page_item a,
ul#tabs li.current-cat a {
	cursor: default;
	color: #000000; /* black */
	}

ul#tabs li.current_page_item a:hover,
ul#tabs li.current-cat a:hover {
	text-decoration: none;
	}



ul#tabs li.current_page_item li a,
ul#tabs li.current-cat li a {
	cursor: pointer;
	color: #008738; /* green */
	}

ul#tabs li.current_page_item li a:hover,
ul#tabs li.current-cat li a:hover {
	color: #00cc51; /* green link */
	text-decoration: none;
	}

/*	ul#tabs li.current_page_item li.current_page_item a:hover,
	ul#tabs li.current-cat li.current_page_item a:hover {
	color: #1d0392; /* some color */
/*	text-decoration: none;
	}
*/





/* ----------- Indicates page you're on when it's in a dropdown (only) */
ul#tabs li li.current_page_item,
ul#tabs li li.current-cat {
	background: #ffffff; /* white */
	}

/* ----------- underlines page you're on when it's in a dropdown (only) ???and it's a hyperlink??? */
ul#tabs li li.current_page_item a,
ul#tabs li li.current-cat a {
	text-decoration: none;
	}

ul#tabs li li.current_page_item  a:hover,
ul#tabs li li.current-cat a:hover {
	text-decoration: none;
	color: #000000; /* black */
	}




ul#tabs li li:hover {
	background-color: #ffffff; /* white */
	color: #000000;
	text-decoration: none;
	}
	



ul#tabs li ul {
	list-style: none;
	position: absolute;
	left: -9999px;
	border-width: 0px 0px 0px 2px;
	border-style: solid;
	border-color: #008738; /* green */
/*	outline: 2px solid #0a81d5; /* teal */
	float: left;
	background-color: #ffffff; /* white */
	overflow: hidden;
	}

ul#tabs li:hover ul {
	left: auto;
	display: inline-block;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px -1px;
	}

ul#tabs li ul li {
	padding: 0px 0px 0px 0px;
	float: left;
	display: block;
	clear: both;
	font-size: 0.8em;
	color: #008738; /* green */
	}



/* ------------ Here is the width of the dropdown <li>s */
ul#tabs li ul li a {
	color: #008738; /* green */
	width: 125px;
	}

/* ------------ These are the hover aspects of links in dropdown only (not main nav) */
ul#tabs li ul li a:hover {
	color: #00cc51; /* green link */
	text-decoration: none;
	background-color: #ffffff; /* white */
	}



/* ------------ This is the top of the <li>s after the first in the dropdown menu
				it seems to do nothing */
ul#tabs li ul li + li {
	border: 20px solid #ff99oo; /* orange */
	}



ul#tabs li.rss {
	padding: 0px 12px 0px 0px;
	background: none;
	border: none;
	float: right;
	}
		
ul#tabs li.rss a {
	padding-right: 16px;
	background: url('images/icon-rss.gif') 100% 50% no-repeat;
	}


 













/* ------------ This is the h1 element for all pages */
.custom div.headline_area {
	
	}



/* ------------ This is the body element for all pages */
.custom div.format_text {
	
	}







/* --------- This makes circles (disc) for <ul> items */
.custom ul {
	list-style-type: disc;
	}

/* --------- This removes circles (disc) for the sidebar */
.custom div#sidebars ul {
	list-style-type: none;
	}


/* --------- This is stuff to change the color of the links (duh) */
.custom a			{ color: #008738; text-decoration: none; outline: none; /* fixes dotted outline in Firefox */}
.custom a:visited	{ color: #7d7d7d; outline: none; /* fixes dotted outline in Firefox */}
.custom a:hover		{ color: #00cc51; text-decoration: none; outline: none; /* fixes dotted outline in Firefox */}
.custom a:active	{ color: #000000; outline: none; /* fixes dotted outline in Firefox */}

/* --------- This is supposedly the correct way to order the link stuff
				*/
/* .custom a			{ color: #008738; text-decoration: none; outline: none; /* fixes dotted outline in Firefox */}
/* .custom a:visited	{ color: #7d7d7d; outline: none; /* fixes dotted outline in Firefox */}
/* .custom a:hover		{ color: #00cc51; text-decoration: none; outline: none; /* fixes dotted outline in Firefox */}
/* .custom a:focus		{ color: #7d7d7d; outline: none; /* fixes dotted outline in Firefox */}
/* .custom a:active	{ color: #000000; outline: none; /* fixes dotted outline in Firefox */}




/* --------- This is list stuff for the sidebar */
li.widget ul {
	/* line-height adjusts leading */
	line-height: 1.1em;
	}
li.widget li {
	/* the margin shortens space between <li>s */
	margin: -2px 0px 0px 0px;
	list-style: none;
	font-size: 0.9em;
	font-weight: bold;
	line-height: 1.1em;
	letter-spacing: -0.015em;
	}




/* this is to make bio pages line up to the pics (62px high) in the Green21 Team page
   (not the individual bios pages) */
.custom div.x-space {
	height: 62px;
	clear: both;
	}


/* --------- The formatting for the individual bio pages */
.custom div#bioPage p {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 14px 80px;
	line-height: 1.3em;
	orphans: 4;
	}

.custom h2.captionBio {
	margin: -18px 0px -12px -80px;
	padding: 0px 0px 16px 80px;
	line-height: 1em;
	font-size: 1em;
	font-weight: bold;
	color: #7d7d7d;
	}

.custom img#bio {
	margin: 0px 0px 0px -80px;
	padding: 18px 18px 0px 0px;
	width: 150;
	height: 150;
	float: left;
	}

.custom p.bio {
	text-align: right;
	margin: 200px 0px -120px 0px;
	padding: 0px 0px 0px 0px;
	}

.custom ul.bio {
	text-align: right;
	list-style-type: none;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	}