/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

body{
	background-color:#eeeeee;
}


td{
	padding: 5px;
}




#header{
	padding: 10px 0;
	background-color:#fff;
}

#logo{
	float: left;
}

#links{
	float: right;
	width: 158px;
	height: 36px;
	text-align: center;
	margin: 0 auto;
}

#search{
	float: right;
	width: 239px;
	height: 36px;
}


#topMenu{
	float: right;
	margin-bottom: 10px;
	margin-right: 10px;
	font: 12px "verdana";
	font-weight: bold;
	font-size: 12px;
	color: #000;
	
}

#topMenu ul{
	display: inline;
}

#topMenu ul li{
	padding-left: 20px;
	font: 12px "verdana"  ;
	font-weight: bold;
	color: #000;
	display: inline;
}

#topMenu ul li a:link{
	text-decoration: none;
	font: 12px "verdana"  ;
	font-weight: bold;
	color: #000;
}

#topMenu ul li a:hover{
	text-decoration: none;
	color: #81bc00;
	font: 12px "verdana"  ;
	font-weight: bold;
}




/* #Page Styles
================================================== */


#centreBar{
	background-color: #019cdc;
	width: 100%;
	padding: 20px 0 20px 0;
	margin: 0 auto;
	background-image:url(../images/image_bg.jpg);
}

#slider, #pageSlider{
	float: left;
	text-align: right;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #fff;
	font-size: 14px;
	height: 200px; 
	overflow: hidden;
}

#sliderCaption, #pageSliderCaption{
	position: relative; 
	top: -200px; 
	left: -40px; 
	display:none;
}




#slider h3, #pageSlider h3{
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #fff;
	font-size: 20px;
	font-weight: 100;
	text-align: left;
	padding-left: 15px;
}


#middleMenu ul li{
	background-image: url(../images/white_bullet_arrow.png); 
	background-repeat:no-repeat; 
	background-position:center left;
	padding-left: 30px;
	padding-top: 15px;
	font: 14px "verdana" ;
	font-weight: bold;
	color: #fff;
	display: block;
	height: 35px;
	margin: 0px;
	
}

#middleMenu ul li a:link, #middleMenu ul li  a:active, #middleMenu ul li  a:visited{
	text-decoration: none;
	color: #fff;
	margin-left: 5px;
	
}

#middleMenu ul li a:hover{
	text-decoration: none;
	color: #019cdc;
}

#intro{
	padding: 20px 0;	
}

#memberLogin {
	padding: 20px 0 0 0;
	margin-bottom: 10px;	
}

#memberLoginToggle{
	display:none;  /*Dont show this on full size pages - its just for mobile devices */
}




#homeMemberLogin{
	border: solid 1px #d3d3d3;
	background-color: #f8f8f8;
	padding: 10px 10px 0px 10px;
}	

#homeMemberLogin h3{
	font: 18px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	color: #bfbdbe;
}
	
#homeMemberLogin input{
	border: solid 1px #d7d5d6;
	background-color: #ebe7e8;
	font: 11px arial #333;
	width: 95%;
	
	background-repeat:no-repeat; 
	background-color: #ebe7e8; 
	background-position: left center;
}

#homeMemberLogin .user{ background-image:url(../images/btn_username.png);  }
#homeMemberLogin .pass { background-image:url(../images/btn_password.png);  }

#homeMemberLogin  input:hover { background-image:none}
#homeMemberLogin  input:focus { background-image:none}



#newsHeadlines{
	background-color: #d1effc;
		
}


#newsHeadlines h2, #donate h2{
	background-color: #ffaa00;
	display: block;

	color: #fff;
	font: 14px "verdana"  ;
	font-weight: bold;
	padding: 5px;
}

#newsHeadlines a:link, #newsHeadlines a:active, #newsHeadlines a:visited{
	color: #019cdc;
	text-decoration: none;
}


/* subMenu for internal pages
================================================== */
#mainText ul { list-style: square outside; margin-left: 30px; }

#subMenu ul li{
	background-color: #ffffff;
	
	font: 14px "verdana";
	font-weight: bold;
	color: #999999;
	display: block;
	min-height: 40px;
	margin: 0px;
	list-style-image: none;
}

#subMenu ul li a:link, #subMenu ul li  a:visited{
	text-decoration: none;
	color: #999999;
	background-image:url(../images/submenu_bg_white.png);
	background-repeat:no-repeat;
	padding-left: 50px;
	padding-top: 4px;
	padding-bottom: 4px;
	display: block;
	min-height: 30px;
	margin-bottom: 5px;
}

#subMenu ul li a:active {
	text-decoration: none;
	background-color: #ffffff;
	background-image:url(../images/submenu_bg_orange.png);
	background-repeat:no-repeat;
	color: #fff;
	padding-left: 50px;
	padding-top: 4px;
	padding-bottom: 4px;
	display: block;
	min-height: 30px;
}

#subMenu ul li a:hover{
	text-decoration: none;
	color: #ffb219;
	background-image:url(../images/submenu_bg_white.png);
	background-repeat:no-repeat;
	padding-left: 50px;
	padding-top: 4px;
	padding-bottom: 4px;
	display: block;
	min-height: 30px;
}

/* Contact Form  =================== */
#contactForm textarea{
	width: 85%;
}


#eventForm input{
	width: 60px;
}

#eventForm input{
	width: 60px;
}

#eventForm input{
	width: 60px;
}



/* #footer
================================================== */


#footer{
	background-color:#00877b;
	color: #fff;
	font: 10px arial;
	padding: 10px;
	margin-top: 20px;
}

#footer img{
	vertical-align: -50%;
}

#footerLinks{
	float: right;
	color: #fff;
}
	
#footerLinks a:link, #footerLinks a:active, #footerLinks a:hover, #footerLinks a:visited{
	color: #fff;
	text-decoration: none;
}




/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		
		#topMenu{
			text-align: center;
		}


		#topMenu ul{
			text-align: center;
			line-height: 25px;
		}



		
		#slider{
			float: left;
			text-align: right;
			font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-weight: bold;
			color: #fff;
			font-size: 14px;
			height: 140px; 
		}

		#sliderCaption{
			position: relative; 
			top: -85px; 
			left: -40px; 
			display:none;
			
		}
		
		#pageSlider{
			float: left;
			text-align: right;
			font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-weight: bold;
			color: #fff;
			font-size: 14px;
			height: 90px; 
		}

		#pageSliderCaption{
			position: relative; 
			top: -85px; 
			left: -40px; 
			display:none;
			
		}

		#slider h3, #pageSlider h3{
			font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
			color: #fff;
			font-size: 18px;
			line-height: 18px;
			font-weight: 100;
			text-align: left;
			padding-left: 15px;
		}

		
		#slider img{
			float: none;
			width: 100%;
			margin: 0 auto;
		}
		
		#pageSlider img{
			float: none;
			width: 100%;
			margin: 0 auto;
		}
		
		
		#middleMenu ul li{
			margin: 0 auto;
			width: 90%;
		}
		
		#memberLogin{
			margin-top: -20px;	
			/*display:none;       ==============*/
		}
		
		#memberQuickLogin{
			display:none;
		}
		
		#memberLoginToggle{
			display:block;
			border: solid 0px #efefef; 
			background-color:#ffffff; 
			padding: 10px; 
			clear: both;	
		}
		
		#memberLoginTop{
			padding: 20px 0 0 0;
			margin-bottom: 10px;	
		}
		
		#intro{
			padding: 10px;	
			width: 95%;
		}
		
		#newsHeadlines{
			margin-bottom: 10px;
		
		}
		
		/* Internal Page  =================== */
		#mainText{
			float: left;
			width: 90%;
			left: -20px;
			position: relative;
		}
		
		/* Contact Form  =================== */
		#contactForm textarea{
			width: 95%;
		}
		
		/* Footer  =================== */
		#footer img{
			vertical-align: -30%;
		}
		
		
		
		}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		
		
		#links{
			float:none;
			clear: both;
			text-align: center;
			padding-left: 65px;
		}

		#search{
			float:none;
			clear: both;
			padding: 0;
			width: 90%;
		}
		
		#topMenu{
			clear: both;
			float: none;
			margin: 0 auto;
		}

		#topMenu ul{
			
			display:block;
		}

		#topMenu ul li{
			padding-left: 0px;
			font: 12px "verdana" ;
			font-weight: bold;
			border-bottom: solid 1px #333;
			display: block;
			text-align: center;
		}


		#topMenu ul li a:link{
			text-decoration: none;
			font: 12px "verdana"  ;
			font-weight: bold;
			color: #000;
		}

		#topMenu ul li a:hover{
			text-decoration: none;
			color: #ff9900;
			font: 12px "verdana"  ;
			font-weight: bold;
		}



		#slider{
			float: left;
			text-align: right;
			font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-weight: bold;
			color: #fff;
			font-size: 14px;
			height: 100px; 
		}

		#sliderCaption{
			position: relative; 
			top: -65px; 
			left: -40px; 
			display:none;
			
		}
		
		#pageSlider{
			float: left;
			text-align: right;
			font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-weight: bold;
			color: #fff;
			font-size: 14px;
			height: 65px; 
		}

		#pageSliderCaption{
			position: relative; 
			top: -65px; 
			left: -40px; 
			display:none;
			
		}

		#slider h3, #pageSlider h3{
			font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
			color: #fff;
			font-size: 18px;
			line-height: 18px;
			font-weight: 100;
			text-align: left;
			padding-left: 15px;
		}

		
		#slider img{
			float: none;
			width: 100%;
			margin: 0 auto;
		}
		
		#pageSlider img{
			float: none;
			width: 100%;
			margin: 0 auto;
		}
		
		
		#middleMenu ul li{
			margin: 0 auto;
			width: 90%;
		}
		
		#memberLogin{
			margin-top: -20px;	
			/*display:none;       ==============*/
		}
		
		#memberQuickLogin{
			display:none;
		}
		
		#memberLoginToggle{
			display:block;
			border: solid 0px #efefef; 
			background-color:#ffffff; 
			padding: 10px; 
			clear: both;	
		}
		
		#memberLoginTop{
			padding: 20px 0 0 0;
			margin-bottom: 10px;	
		}
		
		#intro{
			padding: 10px;	
			width: 95%;
		}
		
		#newsHeadlines{
			margin-bottom: 10px;
		
		}
		
		/* Internal Page  =================== */
		#mainText{
			float: left;
			width: 90%;
			left: -10px;
			position: relative;
		}
		
		/* Contact Form  =================== */
		#contactForm textarea, #contactForm input{
			width: 85%;
		}
		
		/* Footer  =================== */
		#footer img{
			vertical-align: -30%;
		}
		
	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/