@charset "utf-8";

/* This design copyrighted 2009 Lisa DeVoto and may not be reproduced. */
/* www.lisadevoto.com */

/* Easton Learning Foundation, www.eastonlearningfoundation.org */ 

/* Colors used:

ELF green (from logo) -
shorthand hex #063

yellow - 
shorthand hex #ff6
RGB 255/255/102

blues (for links) - 
shorthand hex #66f
shorthand hex #00f

grays -
shorthand hex #ddd
shorthand hex #ccc
shorthand hex #999
shorthand hex #666

*/

/* Reset */
#html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td {
	margin: 0; 
	padding: 0;
} 

body  {
	background: url(images/background.jpg) top no-repeat;	
	color: black;	
	font-family: "Lucida Sans", Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0; 
	padding: 0;
	text-align: center; 
}

body.plain  {	/* For popup pages */
	background-color: white;
	background-image: none;
	color: black;	
	font-family: "Lucida Sans", Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0; 
	padding: 0;
	text-align: left; 
}

.hide	{	/* Used with Skip navigation link to make it invisible in CSS-capable browsers */
	left: -9999px;
	position: absolute;
}
	
#container { 
	background-color: #ff6;
	border-left: 2px #063 solid;
	border-right: 2px #063 solid;
	margin: 0 auto; 
	position: relative;
	width: 950px; 
	text-align: left; 
} 

#header	{
	background-color: white;
	border-bottom: 6px #063 solid;
	height: 130px;
	padding: 0 10px;
}

#header a { 
	display: block;
} 

#header a:link, a:visited, a:hover, a:active	{	/* Values need to be listed in this order - link, visited, hover, active */
	background: none;
	text-decoration: none;
}

#header p	{
	color: #063;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 21px;
	font-style: italic;
	font-weight: normal;
	padding: 60px 0 0 200px;
}

.fltrt { /* Used to float an element to the right in the page. The floated element must precede the element it should be next to on the page. Used for donation button in header. */
	float: right;
	margin: 25px 25px 0 0;
	padding: 0;
}

#specialhome	{
	background-color: #eee;
	border: 4px solid #ddd;
	padding: 10px;
}

#maincontent {  /* Used on the home page only, content is used on other pages */ 
	background-color: white;
	border-left: 2px #063 solid;
	border-right: 2px #063 solid;
	margin: 0px 170px 0px 155px; 
	padding: 10px 15px;
	min-height: 550px;
}

#content { 	/* Used on all pages except the home page */ 
	background-color: white;
	border-left: 2px #063 solid;
	margin: 0px 0px 0px 155px; 
	padding: 10px 15px;
	min-height: 550px;
}

#plainpage {	/* For popup pages */ 
	background-color: white;
	margin: 0px 0px 0px 0px; 
	padding: 10px 15px;
}

#nav {
	background-color: #ff6;
	left: 0;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 138px;
	width: 150px; 
	z-index: 1000; /* This prevents the third level menus from disappearing behind nav-right */
}
		 
#nav-right {  /* Used only on the home page */
	background-color: #ff6;
	margin: 0;
	padding: 5px 5px 0 5px;
	position: absolute;
	right: 0;
	top: 138px;
	width: 150px; 
	z-index: 0; /* This prevents the third level menus from disappearing behind this div */
}

#box	{	/* Used on individual grants pages */
	background-color: #eee;
	margin: 10px 10px 25px 0;
	padding: 5px 15px;
	
}

#boxadvisors	{	/* Used on advisors page */
	background-color: #eee;
	margin: 10px 10px 25px 0;
	padding: 15px 15px 5px 15px;
}

#donationbox	{	/* Used for STARS info box on online donation page */
	border: 1px solid black;
	float: right;
	margin: 5px;
	padding: 15px;
	width: 250px;
}

p  {
	margin: 0 0 15px 0; 
}

p.grants  {	/* Used for a quoted paragraph on individual grants pages - this includes the beginning quote */
	background: url(images/firstquotes.png) no-repeat top left;
	font-style: italic;
	font-weight: bold;
	margin: 0 0 5px 0;
	padding: 20px 15px 15px 15px;
}

p.quote	{	/* Used for the name of the person being quoted on individual grants pages */
	font-size: 11px;
	font-style: normal;
	font-weight: bold;
	padding: 0 0 5px 0;
	text-align: right;
}

p.formtext	{	/* Used on online donation page */
	margin: 0 0 0 25px;
}

p.donation	{	/* Used for images at bottom of nav */
	margin: 25px 0 10px 0;
}

p.bod	{	/* Used for board of directors page */
	margin: 0;
	padding: 0;
}

p.email	{	/* Used for board of directors page */
	font-size: 11px;
	margin: 5px 0 0 0;
	padding: 0;
	text-align: center;
}

p.grantsawarded	{
	background-color: #ff6;
	color: #063;
	font-family: "Arial Narrow", Verdana, Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: bold;
	margin: 20px 0;
	text-align: center;
}

p.triviabee	{	
	font-size: 14px;
	font-weight: bold;
	margin: 5px 0 15px 0;
	padding: 0;
	text-align: center;
}

h1  {
	background: url(images/grayline.jpg) left bottom no-repeat;
	color: #063;
	font-family: "Arial Narrow", Verdana, Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: bold;
	margin: 2px 0 5px 0;
	padding: 0 0 5px 0;
	text-align: left; 
}

h2  {
	background: url(images/shadedline.gif) top left no-repeat;
	color: black;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	margin: 10px 0 5px 0; 
	padding: 0;
	text-align: left; 
}

h2.noback  {	/* Used on individual grant pages */
	background-image: none;
}

h2.right	{
	background-image: none;
	text-align:right;	
}

h2.nobackcentered  {	/* Used on individual grant pages */
	background-image: none;
	text-align: center;
}

h3  {
	color: black;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	margin: 5px 0 0 0; 
	padding: 0;
	text-align: left;
}

h4, h5, h6  {
	color: black;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	margin: 5px 0 0 25px; 
	padding: 0;
	text-align: left;
}

h4.centered  {
	color: black;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: italic;
	font-weight: bold;
	margin: 5px 0 0 25px; 
	padding: 0;
	text-align: center;
}

img	{	
	display: block;
	border: 0;
}

img.specialhomeimage	{	
	display: block;
	border: 1px solid black;
}

img.photo	{	/* Used for photos */
	margin: 3px 10px 3px 3px;
	border: 2px solid #063;
}

img.quotes	{	/* Used for a quoted paragraph on individual grants pages - this is the end quote */
	margin: 0;
	padding: 0;
	float: right;
}

img.anniversary	{	
	margin: 3px 10px 3px 10px;
}

img.logos	{
	display: inline;
	vertical-align: top;
	margin: 0 0 0 20px;
}

ul {
	list-style: disc url(images/bullet.gif);
	padding: 0;
	margin: 0 0 20px 15px;
}

ul li {
	margin: 0 0 10px 0;
}

ol	{
	padding: 0;
	margin: 0 0 20px 20px;
}

table	{
	border: none;
	width: 100%;
}

table tr td	{
	vertical-align: top;
}
	
table.grants	{	/* Used on individual grants pages */
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 0px;
	width: auto;
}

table.grants tr td	{
	padding: 0 20px;
}

table.grantforms	{	/* Used on page listing grant application forms */
	font-size: 12px;
	font-weight: bold;
	margin: 0 0 10px 0;
	width: 90%;
}

table.grantforms tr td	{
	margin: 0;
	padding: 5px 15px;
}

table.advisors	{
	margin-bottom: 10px;
}

table.advisors tr td	{
	padding: 10px 0;
}

table.videos	{	/* Used on videos page */	
	font-size: 12px;
	font-weight: bold;
	width: auto;
}

table.videos tr	{
}

table.videos tr td	{
	padding: 0 5px 20px 0px;
	vertical-align: middle;
}

table.auction	{	/* Used on anniversary party page */	
	font-size: 12px;
	font-weight: normal;
	width: auto;
}

table.auction tr	{
}

table.auction tr td	{
	padding: 0 5px 20px 0px;
	vertical-align: top;
}

table.auction tr td h4	{
	background: url(images/shadedline.gif) top left no-repeat;
	font-size: 14px;
	margin: 5px 0 0 0; 
}

table.auction tr td h4.centered	{
	background: none;
	margin: 5px 0 0 0; 
	color: black;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: italic;
	font-weight: bold;
	padding: 0;
	text-align: center;
}

table.auction tr td h5	{
	background: none;
	font-size: 12px;
	margin: 5px 0 0 0; 
}

table.buytickets tr td	{
	padding: 0 5px 20px 0px;
	vertical-align: middle;
}

table.auctionbids	{
	border: none;
	color: #063;
	font-size: 13px;
	margin: 0;
	padding: 0;
	width: auto;
}

table.auctionbids tr	{
	margin: 0;
	padding: 0;
}

table.auctionbids tr td	{
	margin: 0;
	padding: 0 5px 0 0;
}
	
table.teams	{	/* Used on trivia bee team page */
	font-size: 12px;
	margin: 0 0 10px 0;
	width: 90%;
}

table.teams tr td	{
	margin: 0;
	padding: 5px 15px 15px 15px;
}

table.teams tr td.nospace	{
	padding-bottom: 0;
}

hr.short	{
	margin: 10px 0 0 0;
	width: 500px;
}

#nav ul {	
	font-size: 13px;
	font-family: "Lucida Sans", Arial, Helvetica, sans-serif;
	font-weight: bold;
	list-style: none;
	margin: 0;
	padding: 20px 20px 20px 15px;
}

#nav ul li	{
	list-style-image: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: relative;
	text-align: right;
	vertical-align: bottom; /* Workaround for IE problem of menu items not spacing closely */
}

#nav ul li li	{
	text-align: left;
}

#nav ul ul ul	{
	font-size: 11px;
	font-weight: normal;
	left: 100%; /* to position submenus to the right of their containing block */
	position: absolute;
	top: 0;
	width: 100%;
}

#nav li ul  {	/* Controls the location of submenu items */
	display: none; /* Submenus are not displayed by default */
	position: absolute;
	top: -22px;
}

#nav li ul li ul  {	/* Controls the location of submenu items */
	display: none; 
	left: 161px; /* Placement of third set of menus */
	position: absolute;
	top: -190px;
	width: 175px;
}

#nav li ul li ul.nothigh  {	/* Controls the location of submenu items that are not names of grants */
	display: none; 
	font-size: 13px;
	left: 160px; /* Placement of third set of menus */
	position: absolute;
	top: -22px;
	width: 50px;
}

#nav li ul li  {	/* Controls the width of submenu items */
	background-color: white;
	border: 2px solid #063;
	list-style-image: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 175px;
}

#nav li ul li ul li  {	/* Controls the width of submenu items */
	background-color: white;
	border: 1px solid #063;
	list-style-image: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 350px;
}

#nav li ul li ul.nothigh li  {	/* Controls the width of submenu items */
	background-color: white;
	border: 2px solid #063;
	list-style-image: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 225px;
}

#nav li ul li ul li a	{
	width: 350px;
}

#nav li ul li ul.nothigh li a	{
	width: 215px;
	padding: 5px; 
}

#nav li ul li.longsecond	{	/* For submenus that are long */
	width: 250px;
}

#nav li ul li.longsecond a	{
	width: 235px; 
}

#nav ul li a {
	display: block;	
	padding: 5px 5px 5px 10px;
	width: 120px;
} 

#nav ul li ul li a	{
	width: 160px;
}
	
#nav ul li li li a {
	display: block;	
	padding: 1px 0 1px 1px; 
	width: 175px;
} 
	
#nav li:hover ul  { 
	display: block;
 }

#nav-right h1	{
	background: none;
	color: #063;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-variant: small-caps;
	font-weight: bold;
	padding: 5px 10px 0 0;
	text-align: center;
}
	
#nav-right p {
	color: #666;
	font-size: 12px;
	font-weight: bold;
	margin: 0;
	padding: 0 5px 20px 0;
	text-align: center;
}

#nav-right p.event {
	color: black;
	font-size: 12px;
	font-weight: bold;
	padding: 5px 5px 0 0;
	text-align: center;
}

#nav-right p.eventleft {
	color: black;
	font-size: 12px;
	font-weight: normal;
	padding: 10px 5px 0 0;
	text-align: left;
}

/* Fix IE. Hide from IE Mac - Workaround for IE to make list items in menu stack closely \*/
* html ul li {float: left; height: 1%; }
* html ul li a {height: 1%; }

#nav a {
/*	display: block;	*/
/*	padding: 5px 5px 5px 10px; */
}

/* here and nothere classes are required for the you-are-here effect, nothere is required to switch back classes for nested li submenu items */

#nav ul li.here a	{
	color: #999;
}

#nav ul li.here a:hover	{
	color: white;
}

#nav ul li.nothere a	{
	color: #063;
}

#nav ul li.longsecondnothere	{
	width: 250px;
}
	
#nav ul li.longsecondhere a	{
	width: 235px;
	color: #999;
}

#nav ul li.longsecondnothere a	{
	width: 235px;
	color: #063;
}

#nav ul li.longsecondnothere a:hover	{
	color: white;
}

#nav li ul li.longsecondhere	{	/* For the you-are-here effect */
	width: 250px;
}

#nav a:link, #nav a:visited	{
	color: #063;
}

#nav li a:hover	{
	background: #063;
	color: white;
	text-decoration: none;
}

div#nav ul ul ul,
div#nav ul ul li:hover ul ul
{
	display: none;
}

div#nav ul ul li:hover ul,
div#nav ul ul ul li:hover ul
{
	display: block;
}

div#nav li, div#nav li:hover{
	position: relative;
}

div#nav li ul{
	display: none;
	left: 120px; 
	position: absolute;
	top: -20px; 
}

div#nav ul ul,
div#nav ul ul ul,
div#nav ul li:hover ul ul,
div#nav ul li:hover ul ul ul
{
	display:none;
}

div#nav ul li:hover ul,
div#nav ul ul li:hover ul,
div#nav ul ul ul li:hover ul
{
	display:block;
}

#footer { 
	background-color: #063;
	margin: 0;
	padding: 0 10px;
	text-align: center;
} 

#footer p {
	color: white; 
	margin: 0; 
	padding: 3px 0;
	font-size: 12px;
	font-weight: bold;
}

#footer p.smaller	{
	color: #ccc;
	font-size: 10px;
}
	
#footer a:link, #footer a:visited	{	
	color: white;
	text-decoration: underline;
}
 
#footer a:hover	{
	background: white;
	color: #063;
}

strong {
	font-weight: bold;
	font-style: normal;
}

em {
	font-weight: normal;
	font-style: italic;
}

acronym	{
	border-bottom: 1px dotted black;
}

p.donation	a {
	text-decoration: none;
	background: none;
}

p.donation a:link, p.donation a:visited, p.donation a:hover, p.donation a:active	{
	background: none;
	text-decoration: none;
}

a:link {
	background: none;
	color: blue;
	font-weight: bold;
	text-decoration: none;
}

a:visited {
	background: none;
	color: #66f;
	font-weight: bold;
	text-decoration: none;
}

a:hover {
	background: blue;
	color: white;
	font-weight: bold;
	text-decoration: underline;
}

a:active {
	background: none;
	color: blue;
	font-weight: bold;
	text-decoration: none;
}

img a	{
	background: none;
	text-decoration: none;
}

img a:link, img a:visited, img a:hover, img a:active	{
	background: none;
	text-decoration: none;
}

#nav table a:link, #nav table a:visited, #nav table a:hover, #nav table a:active {	/* For search box */
	background: none;
	color: #666;
	text-decoration: underline;
}

#nav-right a:link, #nav-right a:visited {
	background: none;
	color: blue; 
	font-weight: bold; 
	text-decoration: none; 
}

#nav-right a:hover {
	background: blue;
	color: white; 
	font-weight: bold; 
	text-decoration: underline; 
}

#nav-right a:active {
	background: none;
	color: blue; 
	font-weight: bold; 
	text-decoration: none; 
}

h2 a:link, h2 a:visited {
	background: url(images/shadedline.gif) left no-repeat;
	color: blue;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	margin: 10px 0 5px 0; 
	padding: 0;
	text-align: left; 
}

h2 a:hover, h2 a:active  {
	background-color: blue;
	background-image: none;
	color: white;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	margin: 10px 0 5px 0; 
	padding: 0;
	text-align: left; 
}

h3 a:link, h3 a:visited {
	color: blue;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	margin: 5px 0 0 0; 
	padding: 0;
	text-align: left;
}

h3 a:hover, h3 a:active {
	background-color: blue;
	color: white;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	margin: 5px 0 0 0; 
	padding: 0;
	text-align: left;
}

.formtext	{	/* For forms */	
	margin: 0 0 0 25px;
}

.label	{	/* For forms */
	font-size: 10px;
	font-weight: bold;
	margin: 0 0 0 25px;
	padding: 0;
}

.labelrequired	{	/* For forms */
	color: red;
	font-size: 10px;
	font-weight: bold;
	margin: 0 0 0 25px;
	padding: 0;
}

.labelnoindent	{	/* For forms */
	font-size: 10px;
	font-weight: bold;
	margin: 50px 0 0 0; /* Used top margin instead of top padding to make it easier to click in the field */
	padding: 0;
}

.labelnoindentrequired	{	/* For forms */
	color: red;
	font-size: 10px;
	font-weight: bold;
	margin: 50px 0 0 0; /* Used top margin instead of top padding to make it easier to click in the field */
	padding: 0;
}

.superscript	{	/* For footnotes */
	font-size: 11px;
	font-style: italic;
	margin: 0;
	padding: 0; 
	vertical-align: super;
}

.centeredform	{
	text-align: center;
}