@charset "utf-8";

ul.donation-select li{background-color:white;display:block;float:left;text-align:center;margin:0 5px;padding:7px 0px;width:96px;text-decoration:none;border:1px solid #d8dfea;overflow:hidden;}

ul.donation-select li.selected{background:#fff9d7;border:1px solid #e2c822;}
ul.donation-select li:hover{background:#c0ddea;border:1px solid #4598CD;cursor:pointer;}

ul.donation-select li.selected .donation-amount{background:#fff;}
ul.donation-select li .donation-amount{display:block;float:left;margin:0 7px 6px;padding:1.5em 0;width:82px;
  color:#3b5998;font-size:18px;font-weight:bold;background:#f7f7f7;}
  
 ul.donation-select li .donation-comments{font-size:10px;color:#666;}
 ul.donation-select span{display:block;}
 ul.donation-select span input{margin-bottom:6px;}
 ul.donation-select strong{color:#3b5998;font-weight:normal;}



body {
	font: 94% Verdana, Arial, Helvetica, sans-serif;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color:#666666;
	background-image:url(images/Background.jpg);
	background-repeat:repeat-x;
	background-attachment:fixed;
	background-color: #D5D5D5;
}

#Paragraph a{
color: #70c862;
text-decoration: none;
}
#Paragraph a:hover{
color: #70c862;
font-weight:500;
text-decoration:underline;
}


#TabbedPanels1 a{
color: #fff;
text-decoration: none;
}
#TabbedPanels1 a:hover{
color: #C1E2F4;
font-weight:500;
text-decoration:underline;
}



a{
color: #666666;
text-decoration: none;
}
a:hover{
color: #70c862;
}
.oneColFixCtrHdr #container {
	width: 780px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	border: 0px solid #000000;
	text-align: left; /* this overrides the text-align: center on the body element. */
	background-image:url(images/Content.png);
	background-repeat:repeat-y;
	height: 100%;


}
.oneColFixCtrHdr #header {
  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	height: 120px;
	margin: 0 0;
	position:relative;
	z-index: 1

}

.oneColFixCtrHdr #mainContent {
	padding: 0 29px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	margin: 0px 0px;
	

}
.oneColFixCtrHdr #mainContent .r1 {
width: 100%;
height: 245px;
}
.oneColFixCtrHdr #mainContent .r2 {
width: 100%;
height: 100%;
}
.oneColFixCtrHdr #footer {
	padding: 0 35px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background-image:url(images/Footer.png);
	background-repeat: no-repeat;
	background-position: 9px 2px;
	height: 76px;
	margin: 0 0;
}
.oneColFixCtrHdr #footer div {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-size: 70%;
	color:#666666;
}

.clear { clear:both;}
.fleft { float:left}
.fright { float:right}

.firstLetter {font-size: 250%}

h1, h2, h3 {color: #5CC151}
h4 {color: #C1E2F4}
.spryBot {background-attachment:fixed; background-image:url(images/Spry_bot.gif); 
background-repeat:no-repeat; height: 29px; background-position: 0px 0px}




/*  ajax TAB BOX area   */

.tab{
float: left;
height: 32px;
width: 102px;
margin: 0 1px 0 0;
text-align: center;
background: #fff url(images/greentab.jpg) no-repeat;
}
.tabtxt{
margin: 0;
color: #fff;
font-size: 12px;
font-weight: bold;
padding: 9px 0 0 0;
}
.boxholder{
clear: both;
padding: 5px;
background: #dadada;
}

#wrapper p{
margin: 0;
margin-top: -10px; 
padding: 5px;
line-height: 1.5em;
text-align: justify;
border-bottom: 1px solid #dadada;
boder
}
#wrapper table{
margin: 0;
}
.box{
background: #fff;

}


/* ----------------------------  AJAX FORM --------------------------------------- */

.textInput, textarea {	/* General style for my inputs when they're not highlighted */
	width: 100%;	
	font-family:arial;
	background-color:#FFFFFF;
	border:1px solid #ccc;
	color:#666;
}


.inputHighlighted{	/* Highlighting style */
	background-color: #70C862;
	color:#FFF;
	
	border:1px solid #ccc;
}


.textInput, select{	/* General style for my inputs when they're not highlighted */
	width:300px;	
	font-family:arial;
	background-color:#FFFFFF;
	border:1px solid #ccc;
	color:#666;
}


/* General styling for both valid and invalid input */
.invalidInput,.validInput{
	padding:1px;
}
/* Style for invalid input */
.invalidInput{
	border:1px solid #F00;
}

/* Style for valid input */
.validInput{
	border:1px solid #FFF;
}