@charset "UTF-8";
/* CSS Document */

/*BODY*/

body {
	background:			#666 url(../images/fades/pagebgfade-1x625.png) repeat-x fixed top; /*gray 666*/
	background-attachment: 	fixed;
	background-position: 		top;
	margin:				0;
	margin-top:			50px;
	padding:				0;
	border:				0;
	text-align: 				center;
	/*I like Cochin's italic. I like Berkeley and Hoefler Text. Hoefler Text italicized is nice. Apple Garamond BT size 16. Palatino, StempelGaramond, Apple Garamond BT and ITC Giovanni okay. New Berolina MT is a nice script.*/
	color:				#d9ffd9;
	font: normal 14px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "Lucida Sans Regular", "Lucida Sans Roman", "Lucida Sans Demibold", "Gill Sans", "Trebuchet MS", Tahoma, "Bell Gothic", "Berliner Grotesk", Calibri, Charcoal, Folio, Frutiger, "Gill Sans Condensed", Helvetica, "Hoefler Text", HogwardsWizard, "HogwartsWizard Bold", sans-serif;
}



/*IMAGES THAT ACT AS LINKS automaticallly are automatically given a border. I hate this default border. this gets rid of that yucky border.*/
a img { 
	border: none;
} 




/*PARAGRAPHS AND LINEBREAKS*/
p {
	margin: 			0;
	margin-top:		0.4em; /*before a paragraph, this much vertical space is inserted*/
	margin-bottom:		0.4em; /*after a paragraph, this much vertical space is inserted*/
	padding:			0;
	line-height: 		1.8em; /*site's default "leading"*/
}

.linebk-one-and-a-half {
	display:			block;
	margin-top:		1.5em;
}
.linebk-double {
	display:			block;
	margin-top:		2em;
}



/* BOX */
*.box { 
	display:		block; 
	visibility:		visible; 
	padding: 		10px; 
}




/*HEADINGS*/
h1, h2, h3, h4, h5, h6 { 
	margin: 			0;
	padding:			0;
	font-weight:		normal;
	text-indent:		0;
	font-family:		Georgia, "ITC Giovanni", Berkeley, "Apple Garamond BT", Palatino, StempelGaramond, serif;
	letter-spacing:		-1px;
	word-spacing:		2px; /*doesn't show up unless you do Live View*/
	line-height:		1.2em; /*headings' default "leading"*/
	padding-bottom: 	0; /*in px. if want more vertical space below heading, make this positive. doesn't accept negative values*/
}
/*Hogwartswizard, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "Lucida Sans Regular", "Lucida Sans Roman", "Lucida Sans Demibold", "Gill Sans", "Trebuchet MS", Tahoma, "Bell Gothic", "Berliner Grotesk", Calibri, Charcoal, Folio, Frutiger, "Gill Sans Condensed", Helvetica, "Hoefler Text", sans-serif;*/


/*HEADING 1*/
h1 { 	
	font-size: 			4.2ex; /*4.2ex*/
	color:			#3f573f; /*3f573f green is correct; don't change*/
}

#lightgraystretchpane h1 { 	
	color:			#123; /*123 site's default blue; overriding green*/
}



/*HEADING 2*/
h2 { 	
	font-size: 			3.8ex; /*3.8ex*/
	color:			#123; /*123 site's default dark-blue*/
}
#bluepane #quickmenu h2 {
	font-size: 			2.9ex;
	color:			#223; /*223. dark blue-gray*/
}
#bluepane #sitemapmodule h2 {
	font-size:			2.9ex;
	color:			#ffffcc; /*ffffcc*/
}
#greenpane h2 {
	font-size:			2.9ex;
	color:			#bca45a; /*ca45a site's default gold; may later change it to bca55f*/
}



/*HEADING 3*/
h3 { 	
	font-size: 			3.2ex; /*3.2ex*/
	color:			#555; /*gray*/
	letter-spacing:		0pt;
}



/*HEADING 4*/
h4 { 
	font-size: 			2.1ex; /*was 2.6ex*/
	color:			#440000; /*dark reddish-brown*/
	letter-spacing:		0pt;
	font-style:			italic;
}
#bluepane h4 {
	font-size:			2.1ex;
	letter-spacing:		0pt;
	font-style:			normal;
}
#lightgraystretchpane h4 { 	
	color:			#edc; /*edc pale pink; overriding green*/
	font-style:			italic;
}



/*HEADING 5*/
h5 { 	
	font-size: 			2ex; /*2ex*/
	color:			#034; /*034*/
	letter-spacing:		0pt;
}
#greenpane h5 { 	
	color:			#777; /*a gray*/
}




/*h6 IS RESERVED FOR SCREENREADER ONLY*/
h6 {	
	position:			absolute; 
	left:				-99px; 
	top:				-99px; 
	width:			1px; 
	height:			1px; 
	overflow:			hidden;
	font-size: 			1em; 
	color:			black;
} 



/*TOP SPACER, WHICH CONTROLS THE TOP EMPTY SPACE*/
#topspacer { 
	height: 			0;
}



/* LINKS */
a {
	color:			#ffffcc; /*ffffcc or white site's default link color; sample font color lightcoral*/
	text-decoration:		underline;
	border:			none;
}
a:hover { 
	color:			#ffffcc; /*deeppink sample font color*/
	text-decoration:		underline;
	/*background-color:	#888 or #666;*/
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* PAGE */
#page {
	width: 			990px;
	margin-left: 		auto; /*auto margins (in conjunction with a width) center the page.*/
	margin-right: 		auto; /*auto margins (in conjunction with a width) center the page.*/
	text-align: 			left; /*this overrides the text-align: center on the body element. */
	background-color:	#333; /*page's medium gray*/
	padding:			10px;
}


/* WRAP OUTER CONTAINER */
#wrap {
	background:	#123 url(../images/fades/bluefade-1x281.png) repeat-x bottom; /*wrap container's dark-blue base color*/
}




/* TOP */
#topthird { 
	display: 			block;
	height:			394px;
}



/* PRE-HEADER HORIZONTAL MENU BAR. DETAILS ARE AT THE PRODROPLINE CSS. DON'T ADD ANYMORE HERE.*/
#preheadermenu { 
	width:			100%;
	height:			68px; /*a "fix": has to do with 1 or 2 pixels under submenu*/
	background-color:	#1b1b1b; /*a "fix": has to do with 1 or 2 pixels under submenu. changes background of horizontal menu to its default #1b1b1b, I think, so as not to see the blue horizontal line*/
}
/*Don't add anymore here. Add it to prodropline css.*/



/* MID-HEADER SLIDESHOW AND RANDOM IMAGE GENERATOR*/
#midheaderslideshow .outsidein {
	width:		990px;
	height:		300px; /*300px*/
	display:		block;	
}



/* FLOATING DRUID OR TREE LOGO*/
#logocontainer {
	position: 				relative;
	width:				100%;
	z-index: 				11; /*was 11*/
}
#homepagelogo {
	position: 				absolute;
	top:					-280px; /*-83px for Druid logo; this adjusts how high up the page the "Druid" OR "tree" image is. The higher the negative, the higher the image is.*/
	left: 					-25px; /*for Druid logo -30px*/
	background: 			transparent;
	visibility: 				visible;
}



/* FLOATING NEOPAGAN LOGO*/
#logocontainerneopagan {
	position: 				relative;
	width:				100%;
	z-index: 				11; /*was 11*/
}
#homepagelogoneopagan {
	position: 				absolute;
	top:					-265px; /*this adjusts how high up the page the "Neopagan" image is. The higher the negative, the higher the image is.*/
	right: 				-20px;
	background: 			transparent;
	visibility: 				visible;
}



/* POST-HEADER BREADCRUMBS */
#postheaderbread { 
	width: 			100%;
	color:			#686868;
}
#postheaderbread *.breadcrumbs { 
	float: 			right;
	padding: 			5px;
	padding-right:		10px;
}
#postheaderbread { 
	
}



/* MIDDLE THIRD*/
#middlethird { 
	width:		100%; 
	display: 		block;
}



/*GOLDGRAYANDGREENWRAP*/
#goldgrayandgreenwrap {
	float:			left; /*since this element is floated, a width must be given.*/
	width:		760px; /*760px*/
	display:		block;
	height:		100%; /*I want this to stretch the height; does it? it seems to.*/
	background:	#2b3c2b url(../images/fades/greenfade-1x281.png) repeat-x bottom; /*2b3c2b site's default dark green*/
}



/*GOLDANDGRAYWRAP*/
#goldandgraywrap {
	float:			left; /*since this element is floated, a width must be given.*/
	width:		490px;
	display:		block;
}



/*GOLDPANE*/
#goldpane { 
	float:				left; /*since this element is floated, a width must be given.*/
	width:			490px;
	background:		#bca45a url(../images/fades/beigefade-1x100.png) repeat-x left top; /*bca45a site's default gold*/
	border-bottom:		#1e2934 solid 10px; /*1e2934 solid gray, best guess simulating the horizontal grayish-blue bar below gold pane.*/
}
#goldpane *.outsidein {
	height:			auto;
	overflow:			hidden;
	margin:			10px; /*this needs to be 10px!*/
}



/*LIGHTGRAYPANE*/
#lightgraypane {
	float:				left; /*since this element is floated, a width must be given.*/
	width:			490px; /*269px 490px*/
	background:		#666 url(../images/fades/ltgraytopfade-1x400.png) repeat-x left top; /*666 gray*/
	border-bottom:		#1e2934 solid 10px; /*1e2934 solid gray, best guess simulating the horizontal grayish-blue bar below gold pane.*/
}
#lightgraypane *.outsidein {
	height:			auto;
	overflow:			hidden;
	margin:			10px; /*this needs to be 10px!*/
}
#lightgraypane p { 
	text-indent: 		40px; /*this indents the paragraph*/
}



/*LIGHTGRAYSTRETCHPANE*/
#lightgraystretchpane {
	float:				left; /*since this element is floated, a width must be given*/
	width: 			760px; /*was 740px where I thought box is 20px less wide than other boxes. this and relative and top and left position the box.*/
	position:			relative;
	/*top:			10px;*/
	/*left:			10px;*/
	background:		#666 url(../images/fades/ltgraytopfade-1x400.png) repeat-x left top; /*666 gray*/
	/*margin-bottom:	8px;*/
	border-bottom:		#1e2934 solid 10px; /*1e2934 solid gray, nearly invisible horizontal grayish-blue bar below stripespane*/
}
#lightgraystretchpane .outsidein {
	height:			auto;
	margin:			10px; /*this needs to be 10px!*/
}



/*DARKGRAYPANE*/
#darkgraypane {
	float:				left; /*since this element is floated, a width must be given*/
	width:			760px;
	background:		#1b1b1b url(../images/fades/dkgrayfade-1x90.png) repeat-x left top;
}
#darkgraypane .outsidein {
	height:			auto;
	overflow:			hidden;
	margin:			10px; /*this needs to be 10px!*/
}
#darkgraypane p { 
	margin-top:		1em; /*before a paragraph, this much vertical space is inserted*/
	text-indent: 		40px; /*this indents the paragraph*/
}



/*STRIPESPANE*/
#stripespane {
	float:				left; /*since this element is floated, a width must be given*/
	width: 			760px; /*was 740px where I thought box is 20px less wide than other boxes. this and relative and top and left position the box.*/
	position:			relative;
	/*top:			10px;*/
	/*left:			10px;*/
	background:		#bca45a url(../images/fades/beigefade-1x100.png) repeat-x left top; /*bca45a gold; site's default gold*/
	/*margin-bottom:	8px;*/
	border-bottom:		#1e2934 solid 10px; /*1e2934 solid gray, nearly invisible horizontal grayish-blue bar below stripespane*/
}
#stripespane .outsidein {
	height:			auto;
	margin:			10px; /*this needs to be 10px!*/
}
#stripespane table {
	width:			100%;
	color:			#123; /*123 site's default dark-blue*/
	background-color:	transparent;
	margin-top:		1em; /*before a paragraph, this much vertical space is inserted*/
}
#stripespane table tr.odd {
	background:		#3c553c; /*3c553c a green color*/
}



/*ALL TABLES*/
td {
	text-align:			left;
	vertical-align:		top;
}



/*STRETCHGOLD*/
#goldstretchpane {
	float:				left; /*since this element is floated, a width must be given*/
	width: 			760px; /*was 740px where I thought box is 20px less wide than other boxes. this and relative and top and left position the box.*/
	position:			relative;
	/*top:			10px;*/
	/*left:			10px;*/
	background:		#bca45a url(../images/fades/beigefade-1x100.png) repeat-x left top; /*bca45a gold; site's default gold*/
	/*margin-bottom:	8px;*/
	border-bottom:		#1e2934 solid 10px; /*1e2934 solid gray, nearly invisible horizontal grayish-blue bar below stripespane*/
}
#goldstretchpane .outsidein {
	height:			auto;
	margin:			10px; /*this needs to be 10px!*/
}



/*GREENPANE*/
#greenpane {
	float:				left; /*since this element is floated, a width must be given*/
	width:			270px; /*270px: do I need this here? yes.*/
	display:			block;
	background-color:	transparent; /*its green background color comes from goldgrayandgreenwrap*/
}
#greenpane p {
	color:			#bca45a; /*bca45a site's default gold*/
	text-indent: 		25px; /*this indents the paragraph*/
	margin-top:		0.75em; /*before a paragraph, this much vertical space is inserted*/
}
#greenpane .outsidein {
	margin:			10px; /*this needs to be 10px!*/
}
#greenpane #greenblog {
	background:		url(../images/modbgt/modbgt5-1x400.png) repeat-x;
}
#greenpane #greennews {
	background:		url(../images/modbgt/modbgt5-1x400.png) repeat-x;
}
/*#greenpane #greenblog .readmore :hover,
#greenpane #greenblog .readmore :active {
	background:		url(../images/blog-and-news/moreblog-hover.png) no-repeat right top;
}
#greenpane #greennews .readmore :hover,
#greenpane #greennews .readmore :active {
	background:		url(../images/blog-and-news/morenews-hover.png) no-repeat right top;
}*/



/*BLUEPANE*/
#bluepane { 
	float:				right; /*since this element is floated, a width must be given*/
	width: 			230px; 
	display:			block;
	background-color:	transparent; /*its blue background color comes from wrap*/
	color:			#ffffcc; /*ffffcc or white is the default color font in bluepane*/
	padding:			0; /*zero out padding*/
	padding-bottom:	0; /*padding-bottom here does absolutely nothing*/
	margin:			0; /*zero out margin*/
	line-height:		1.5em; /*bluepane has its own leading*/
}
#bluepane .outsidein .quickmodule {
	background:		url(../images/modbgt/modbgt2-15x175.png) repeat-x; /*don't touch this. this is the inner blue background fade from light to dark.*/
}
#bluepane li {
	list-style:			none; /*this gets rid of the default bullets*/
}


/*QUICKLINKS OF BLUEPANE*/
#bluepane ul.quicklinks {
	margin:			0; /*zero out margin*/
	padding:			0; /*zero out padding*/
	padding-top:		10px; /*space between list's title and list itself*/
	padding-bottom:	10px;
}

/*applies to all links in quicklinks*/
#bluepane ul.quicklinks a { 
	text-decoration:		none; /*this gets rid of underline*/
}
#bluepane ul.quicklinks a:link {
	background:		url(../images/menubgdots/menubgdots-20x14-blue-rounded.png) no-repeat left top;
	background-position:	0 -1px; /*probably 0 to -3px. negative numbers make dots go higher.*/
	padding-left:		17px; /*this is the distance between bullet and description*/
	/*color:			maroon sample font color*/
}
#bluepane ul.quicklinks a:visited {
	background:		url(../images/menubgdots/menubgdots-20x14-green-rounded.png) no-repeat left top;	
	background-position:	0 -1px; /*probably 0 to -3px. negative numbers make dots go higher.*/
	padding-left:		17px; /*this is the distance between bullet and description*/
	/*color:			fuchsia sample font color*/
}
#bluepane ul.quicklinks a:hover, 
#bluepane ul.quicklinks a:active {
	background:		url(../images/menubgdots/menubgdots-20x14-gold-rounded.png) no-repeat left top;
	background-position:	0 -1px; /*probably 0 to -3px. negative numbers make dots go higher.*/
	padding-left:		22px; /*this is the distance between bullet and description*/
	/*color:			teal sample font color*/
}



/*SITEMAPMODULE OF BLUEPANE. KEEP HEADINGS HERE*/
#bluepane #sitemapmodule {
	background:		url(../images/modbgt/modbgt3-5x5.png) repeat top left;
}
#bluepane #sitemap {
	background:		url(../images/modbgt/modbgt3topfade-5x85.png) repeat-x;
}
#bluepane .outsidein {
	margin:			10px; /*this needs to be 10px!*/
}
#bluepane ul.sitemenu {
	margin:			0; /*zero out margin*/
	padding:			0; /*zero out padding*/
	padding-top:		10px; /*space between list's title and list itself*/
	padding-bottom:	10px;
	margin-left:		15px; /*if positive, indents everything to the right a bit*/
}
/*keep h4 heading here*/
#bluepane li.sitecategory h4 {
	color:			#bca45a; /*bca45a gold; site's default gold*/
	padding-top:		10px;
}
#bluepane ul.sitelinks {
	padding-left:		10px; /*indents the list items to the right*/
}

/*applies to all "ul" in sitemenu*/
#bluepane ul.sitemenu a { 
	text-decoration:		none; /*gets rid of underline*/
}
#bluepane ul.sitemenu a:link {
	background:		url(../images/menubgdots/menubgdots-20x14-blue-rounded.png) no-repeat left top;
	background-position:	0 -1px; /*probably 0 to -3px. negative numbers make dots to higher.*/
	padding-left:		17px; /* this is the distance between bullet and description*/
}
#bluepane ul.sitemenu a:visited {
	background:		url(../images/menubgdots/menubgdots-20x14-green-rounded.png) no-repeat left top;	
	background-position:	0 -1px; /*probably 0 to -3px. negative numbers make dots  to higher.*/
	padding-left:		17px; /*this is the distance between bullet and description*/
}
#bluepane ul.sitemenu a:hover, 
#bluepane ul.sitemenu a:active {
	background:		url(../images/menubgdots/menubgdots-20x14-gold-rounded.png) no-repeat left top;
	background-position:	0 -1px; /*probably 0 to -3px. negative numbers make dots go to higher.*/
	padding-left:		22px; /*this is the distance between bullet and description*/
}

/*SITEHOME TREATED DIFFERENTLY SO DON'T HAVE TWO "HOMES." KEEP H4 HERE.*/
#bluepane #sitemapmodule #sitemap .sitemenu li h4 a {
	color:			#bca45a; /*bca45a gold; site's default gold*/
	margin-left:		-15px;
}
#bluepane #sitemapmodule #sitemap .sitemenu li a {
	background:		none;
}
#bluepane #sitemapmodule #sitemap .sitemenu li a:link {
	color:			#bca45a; /*bca45a site's default gold*/
}
##bluepane #sitemapmodule #sitemap .sitemenu li a:visited {
	color:			#ffffcc; /*darkorange sample font color*/
}
##bluepane #sitemapmodule #sitemap .sitemenu li a:hover,
##bluepane #sitemapmodule #sitemap .sitemenu li a:active {
	color:			#ffffcc; /*lime sample font color*/
}



/* BOTTOM THIRD FOOTER */
#bottomthird { 
	display: 			block;
	text-align:			center;
	padding:			10px;
	color:			#1b1b1b;
}
#bottomthird p {
	line-height:		1em;
	margin-top:		0.5em; /*before a paragraph, this much vertical space is inserted*/
	font-size:			9px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */


/* ARTICLE1 */
*.article1 p { 
	margin-top:	1em; /*before a paragraph, this much vertical space is inserted*/
	text-indent: 	40px; /*this indents the paragraph*/
}


/* ROLLUP */
/**.rollup-trigger { 
	cursor:	pointer;
}*/
*.rollup-trigger:hover { 
	color:	#ffffcc; /*aqua sample font color*/
}


/* READ MORE */
*.readmore { 
	text-align:		right;
	padding-top: 	7px;
}


/* LINE BREAKS */

*.linebreaksingle { 
	display:		block; 
	margin-top:	0; 
}

*.linebreakoneandahalf { 
	display:		block; 
	margin-top:	1.5em; 
}

*.linebreaktwo { 
	display:		block; 
	margin-top:	2em; 
}

*.linebreakthree { 
	display:		block; 
	margin-top:	3em; 
}

*.linebreakfour { 
	display:		block; 
	margin-top:	4em; 
}


/* TOOLS */
*.clearboth  { 
	clear:				both; 
	margin:			0; 
	background-color:	transparent; 
}
*.clearleft {
	clear:				left;
}
*.clearright {
	clear:				right;
}
*.clearnone {
	clear:			none;
}
*.hidden { 
	position:		absolute; 
	top:			-99px; 
	left:			-99px; 
	width:		1px; 
	height:		1px; 
	overflow:		hidden; 
}
p.noindent {
	text-indent:	0;
}


/*IMAGES*/
img.cm {
	vertical-align:	center;
}
img.windmama {
	float:				left;
	display:			inline;
	position:			relative;
	width:			183px;
	height:			164px;
	margin-top:		10px;
	margin-left:		0;
	margin-right:		10px;
	margin-bottom:		10px;
}
img.candlemama {
	float:				right;
	display:			inline;
	position:			relative;
	width:			184px;
	height:			164px;
	margin-top:		10px;
	margin-right:		0;
	margin-left:		10px;
	margin-bottom:		10px;
}



/*SPAN FONT COLORS*/
span.ochre1 {
	color:			#a0522d;
	font-weight:		bold;
}
span.ochre2 {
	color:			#cd853f;
	font-weight:		bold;
}
span.ochre3 {
	color:			#deb887;
	font-weight:		bold;
}