/* CSS Document */
body {
	font-size:75%;
	margin:0;	
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background:#fff url(../images/bodybg.jpg) repeat-x fixed;
	/*background-image:url(../images/bg.jpg);
	background-repeat:no-repeat;
	background-position:200px -10px;*/
}

/* Links */
a {
	color:#4db64c;
	font-weight:bold;
}

a:hover {
	color:#A479CE;
	font-weight:bold;
}

a img {
	border:2px solid #4db64c;	
}
/* End Links */

/* Default styles */
img.default {
	border:1px solid #4db64c;
}

img.clear {
	clear:both;
	display:block;
}

/* This is the image that is on the edit_items.php page */
#edit img.default {
	margin-left:150px;
	margin-bottom:10px;
}

.error {
	color:red !Important;
}

.msg {
	color:#993399;
}
/***/

/* Headers */
h1 {
	font-size:130%;
	color:#666699;
}


h2 {
	color:#993399;
	font-size:120%;
	font-family:Arial, Helvetica, sans-serif;
	border-bottom:1px solid #9999CC;	
}

h2.alt_purple {
	color:#ffffff;
	font-size:120%;
	background-color:#8080C0;
	padding:3px;
	border-bottom:1px solid #491AD9;
	font-family:Arial, Helvetica, sans-serif;	
	margin-top:2px;	
	margin-bottom:4px;	
}

h2.alt_yellow {
	color:#ffffff;
	font-size:120%;
	background-color:#FFCC00;	
	padding:3px;
	border-bottom:1px solid #FF9900;
	font-family:Arial, Helvetica, sans-serif;	
	margin-top:2px;	
	margin-bottom:4px;	
}

h3 {
	font-size:100%;
	font-weight:bold;
	color:#FFCC00;
}
/* End Headers /*


/* Layout */
#lang_flags {
	width:900px;
	height:20px;
	margin:0px auto;	
	clear:both;
	background:#eee;
}

#lang_flags img {
	display:block; 
	float:left;
	margin:3px;
}

#lang_flags img.off {
	border:1px solid black;	
}

#lang_flags img.on {
	border:1px solid red;	
}

#banner {	
	background-color:#4db64c;
	height:130px;
	border-top:4px solid #62DF6B;
	/*border-bottom:4px solid #62DF6B;*/
	background:#4db64d url(../images/banner.jpg) no-repeat center center;	
	width:900px;
	margin:0 auto;		
}

#kids_runner {
	width:900px;
	height:50px;
	background:url(../images/bottom_banner.jpg) repeat;
	margin:0 auto;
}

/* Is used to hold two columns when the two column
* layout it used */
#main_content {
	width:900px;
	height:100%;	
	overflow:auto;
	/*border:1px solid #4db64c;	
	border-top:4px solid #4db64c;	*/
	margin:0 auto;	
	background-color:#eee;
}

#col1 {
	width:662px;
	height:100%;	
	border-left:1px solid #4db64c;	
	border-right:1px solid #4db64c;	
	border-top:4px solid #4db64c;	
	margin:0 auto;
	margin-right:6px;
	padding:10px;
	float:left;	
	background-color:#FFC;
}

#col2 {
	width:175px;
	height:100%;		
	padding-bottom:3px;
	margin: 0 10px 10px 10px;
	float:left;
	background:#eee;
}


/* Is only rendered if a user is logged in
* it holds the whole page content */
#container {
	width:900px;
	height:100%;
	overflow:auto;
	margin:0 auto;			
}

/* Is only rendered if a user is logged in
* it holds all of the content, aside from the admin menu */
#inner_container {
	width:770px;
	height:100%;
	overflow:auto;	
	float:left;		
}

/* For one column layout. The main column */
#content {
	width:882px;
	min-height:400px;
	padding:8px;
	height:100%;
	overflow:auto;
	margin:0 auto;	
	border:1px solid #4db64c;	
	border-top:4px solid #4db64c;	
	background:#FFC;
}


#inner_container #content {
	width:720px;
}
/* End Layout */

/* Navigation */
ul#nav {			
	list-style-type:none;	
	margin:0 auto;
	/*border-top:6px solid #ffffcc;
	border-bottom:6px solid #ffffcc;	*/
	border-top:6px solid #8eda8e;
	border-bottom:6px solid #8eda8e;		
	padding:0;	
	width:900px;	
	height:auto;
	overflow:auto;	
	font-size:100%;	
	/*margin-bottom:3px;
	margin-top:3px;	*/
	background:#fff;
}

ul#nav li {
	float:left;		
}

ul#nav a span {
	color:#8A91E6;
	margin-right:3px;
}

ul#nav a {
	font-weight:normal;	
	color:black;	
	text-decoration:none;	
	display:block;
	padding:5px;	
} 

#nav a:hover, #nav a.on:hover {	
	background-color:#FFCC33;
	color:white;	
} 

#nav a.on {
	background-color:#666699;
	color:white;
}

#nav a.on span {	
	color:#cccccc;
}

#nav li ul {
	position: absolute;
	width: 10em;
	left: -999em;
}

#nav li:hover ul {
	left: auto;
}


#nav li:hover ul, #nav li.sfhover ul {
	left: auto;
}

ul#adminNav {
	width:200px;
	background:#4DB64D;
	margin:0;
	padding:0;
	list-style-type:none;
}


ul#adminNav a, ul#adminNav li {
	display:block;
	clear:both;
	width:200px;
	outline:none;
	background:#4DB64D;
}


#footer, #foter ul {			
	list-style-type:none;	
	margin:0 auto;
	/*margin-top:3px;*/
	background:#fff;
	border-top:6px solid #867AB4;
	border-bottom:10px solid #4db64c;
	text-align:center;	
	padding:0;	
	width:892px;
	padding:4px;	
	height:auto;
	overflow:auto;	
	font-size:100%;	
}

#footer li {
	display:inline;
}


#footer a {
	font-weight:normal;	
	color:#666666;				
	text-decoration:none;	
	padding:3px;
} 

#footer a:hover {
} 
/* End Navigation */ 



/* Form elements */
#forgotPass, #donate  {
	width:auto;
	height:auto;	
	margin-left:4px;		
}

form {
	margin-bottom:10px;
}

/* The big forms for one-col layout only */
#add, #edit, #addCat, #editCat, #delCat, #createUserAccount {
	width:500px;
	margin:0 auto;
	padding:6px;	
	border:1px solid #d8ecd8;
}

#sendToMail {
	width:800px;
	margin:0 auto;
	padding:6px;	
	border:1px solid #d8ecd8;
}

/* Align the category forms to the left */
#addCat, #editCat, #delCat {
	margin:0; 
}

/* The small form is only reserved for two-col layouts */
#contactForm, #mailingList, #loginForm  {
	width:320px;
	margin:0 auto;
	padding:6px;
	margin-bottom:10px;
	border:1px solid #d8ecd8;
}

#catList {
	height:100%; overflow:auto
}

/* Make the category textfields shorter */
#catList .textBox {
	width:210px;
}

#catList label {
	margin-right:4px;
}

#catList .defaultButton {
	margin-right:3px;
}

fieldset {
	margin:0;
	padding:0;
	border:0;
	background:#8EDA8E;
	padding:20px;
	margin:0 auto;
}

#catList fieldset {
	margin:0;
	padding:0;
	border:0;
	background:#8EDA8E;
	padding:10px;
	margin:0 auto;
}


.row {		
	padding:3px;
	clear:both;		
}

/*#forgotPass label, #donate label, #edit .col1 {
	width:150px;
	height:auto;
	color:#4db64c;
	float:left;		
}*/

/*#contactForm label, #mailingList label, #loginForm label, #mailingList label, #add label,
#createUserAccount label, #edit label {
	color:#4db64c;
	display:block;
}*/

label {
	color:#630870;
	display:block;
	font-size:115%;
}

.textBox {
	width:270px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:100%;
	border:1px solid #4db64c;	
}

#add .textBox, #edit .textBox, #addCat .textBox, #editCat .textBox, #delCat .textBox {
	width:410px;
}

/* One field does not have an input box in it,
* instead it prints out the username.
* Make it the same width as the input box fields */
#edit .col2 {
	float:left;
}

/* Has a larger width because of the text 'please select an image to be uploaded' */
#add label {
	width:250px;
	height:auto;	
	float:left;
}


/* The cosmetic formatting only for the textboxes */
.textBoxFloat {		
	float:left;
}

.textBoxCos {	
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:100%;
	border:1px solid #4db64c;	
	width:200px;
	
	
}

.textBoxLarge {		
	width:250px;
}

.textBoxMed {	
	width:150px;
}

.textBoxSmall {	
	width:100px;
}

textarea {
	height:100px;
}

.defaultButton {
	background-color:#FFCC33;
	color:#000;
	border:1px solid #FF9900;	
	font-family:Verdana, Arial, Helvetica, sans-serif;	
	font-size:100%;
}

a.defaultButton {
	background-color:#FFCC33;
	color:#FFFFFF;
	padding:2px;	
	font-weight:normal;
	text-decoration:none;
	border:1px solid #FF9900;	
}


#galleryForm .defaultButton {
 	float:left;
}

.flagOld {
	background-image:url(../images/old_item_icon.jpg);
	border:0;
	width:106px;
	height:30px;
	margin-top:-7px;
}

a.defaultButton {
	background-color:#FFCC33;
	color:#FFFFFF;		
	font-weight:normal;
	padding:1px;
	text-decoration:none;
	font-family:Verdana, Arial, Helvetica, sans-serif;	
	font-size:100%;
	border:1px solid #FF9900;	
}

/* End Form Elements */



/* General Formatting */
.right {
	float:right;
}

.left {
	float:left;
}

.wrapImg {
	margin:5px; 	
	border:solid 1px #000000;
}


.box {
	width:auto;
	height:auto;
	border:1px solid #cccccc;
	padding:4px;
	margin:4px auto;
	background:#fff;
}

.box img {
	display:block;
	margin:0 auto;
	border:1px solid #FFCC33;	
}

.box p {
	text-align:left;
	margin:0;
}

.box span {
	margin-right:3px;
}

.border_bottom {
	border-bottom: 1px solid #cccccc;
}


.galleryImgContainer {
	float:left; 
	text-align:center; 	
	height:auto; 
	padding:6px;	
}

.galleryImgContainer span {
	display:block;
	text-align:center;
}

.galleryImgContainer img {
	border:1px solid black;	
	margin-bottom:3px;
	display:block;
}

.itemsContainer {	 
	width:auto; 
	margin-left:5px;
	height:100%; 
	overflow:auto;
	padding:6px;	
	margin-bottom:6px;
	border-bottom:1px solid #4db64c;
}

.itemsContainer span {
	margin-right:4px;
}

.itemsContainer img {
	border:1px solid #4db64c;		
	margin-bottom:3px;
	display:block;
}

.itemsContainer h3 {
	font-size:140%;	
	font-weight:bold;
	margin:0;
	padding:0 0 5px 0;
}

.itemsContainer h3 a {
	color:#248524;	
}

.emphasis {
	color:#4db64c;
}

.alternate {
	color:#6699FF;
}

.no_bullet, #charitiesList {
	list-style-type:none;
	margin:3px;
	padding:0;
}

#charitiesList img {
	border:1px solid black;	
}



#charitiesList h2 {
	border:0;
	text-transform:lowercase;
	display:inline;
}

#splashImg {
	display:block; 
	margin:0 auto; 
	border:1px solid #4db64d; 
	margin-top:20px; 
	width:800px; 
	height:144px;
}

.items {
	float:left; 
	margin-right:8px
}
/* End General Formatting */

#charitiesImgCont {
	margin-top:16px;
	height:auto;
	width:auto;
}

#charitiesImgCont img {
	border:1px solid black;
}

.ag_link {
	text-align:center;
}

.ag_link a {
	color:#666699;
}

.itemImg_holder {	
	width:200px;
	height:100%;
	overflow:auto;
}