@charset "UTF-8";


/* ///////// PAGE ELEMENTS */

body  {
	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 */
	background-image: url(../images/bg_tile_2.gif);
	background-repeat: repeat;
	
}

hr {
	background-image: url(../images/hr_bg_tile.gif);
	background-repeat: repeat-x;
}


/* ///////// CONTAINERS */


#shadow_container {
	width: 830px;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	background-image: none; } /* feeding lt IE7 false value; doesn't support PNGs */
	

html>body #shadow_container {
	background-image: url(../images/bg_shadow_tile_2.png);/* feeding standards-compliant browsers true PNG */
	background-repeat: repeat-y;
}	

#container { 
	width: 780px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
} 



/* //// HEADER */

#header {
	padding: 0;
	background-image: url(../images/hdr_bg.jpg);
	background-repeat: no-repeat;
	height: 142px;
	position:relative;
} 

.hdr_logo {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	position: absolute;
	left: 29px;
	top: 95px;
	}

.hdr_contact {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	position: absolute;
	left: 580px;
	top: 110px;
	}
	
	

/* //// NAV */

#nav {
	width: 780px;
	height: 40px;
	background-color:#fff;
	float: left;
	padding: 0 0 5px 0;
}

#navlist {margin: 10px 5px 10px 10px; padding:0; border:0; background-image: url(../images/menuback.gif)}

#nav ul li { display: inline; }

#nav ul li a
	{
	height:20px;
	width: 95px;
	margin-right: 0px;
	background-color:#e6e6e6;
	color: White;
	text-decoration: none;
	border:none;
	float: left;
	
	}

#nav ul li a:hover
	{
	background-color: #e1452b;
	color: #fff;
	text-decoration: none;
	border:none;
	}




/* //// SIDEBAR + MODULES */

#sidebar1 {
	float: right; /* since this element is floated, a width must be given */
	width: 200px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	background: #fff; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 0;
	margin: 0 23px 0 0;
	text-align: center;
}

.module {
	width: 200px;
	margin: 0 auto 20px auto;
	padding-bottom: 5px;
	background: #EBEBEB;
	text-align:center;
}

.module_title { 
	width: 180px;
	height:20px;
	margin: 10px auto 0 auto; }
	
.module_photo {
	padding: 10px;
	padding-bottom: 5px; }	
	

#news_scroll { 
	margin: 0 auto 10px auto;
	text-align: left;
	height:220px;
	width:180px;
	overflow:scroll;
	background: #FFF;	
}

#event_cal { 
	margin: 0 auto 10px auto;
	text-align: left;
	background: #FFF;	
	width:180px;

}

#std_module { 
	margin: 0 auto 10px auto;
	text-align: left;
	width:180px;
	background: #FFF;	
}


/* //// MAIN CONTENT */


#mainContent {
	margin: 0 235px 0 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 0 10px 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background-image: url(../images/div_line_tile.gif);
	background-repeat: repeat-y;
} 
.identpg {
	margin: 0px 30px 0px 30px;
	text-indent:-10px;
	}

#upcoming_events {
	width: 500px;
	height: 400px;
	overflow: scroll;
	}

.event_post {
	background-color: #ECECEC;
	color: #000000;
	padding: 5px 5px 15px 5px;
	margin: 3px 10px 7px 0px;
}

#join_promo { 
	width:500px;
	margin-bottom: 20px;}

#join_btn {position:absolute;
	top:220px;
	left:11px;}	



/* //// FOOTER */


#footer {
	padding: 0 10px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	margin-top: 30px;
	background:#fdfdfd;
	background-image: url(../images/ftr_tile.gif);
	background-repeat: repeat-x;
} 
#footer p {
	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 */
}




/* //// FORMS + TABLES */

form {width:500px;}

tr {padding: 2px 0 10px 0; }

.box_rt_label {margin: 0 10px 0 1px;}

.event_reg_table table {vertical-align:top; width:450px;}

.event_reg_table tr,td { font: .85em/1.5em Helvetica, Arial, sans-serif; padding:4px 5px 1px 0; vertical-align:top;}

.form_labels {text-align:right;}

fieldset {
	width:470px;
	margin: 20px 0;
	padding: 5px 10px;
	*padding-top: -40px; /* ie tweak */
	*margin-bottom: 20px; /* ie tweak */
	background-color:#f1f2f2;
	border: 3px solid #bcbec0;
	border-top-color: #bcbec0;
	overflow:hidden;
}

fieldset fieldset {
	width:450px;
	margin: 0;
	padding:5px;
	background-color:#fff;
	border: 1px solid #bcbec0;
	border-top-color: #bcbec0;
	overflow:hidden;
}

fieldset p {font-size:1em;}

legend {
	padding: 2px 5px;
	color: #bcbec0;
	font-size: .9em;
	font-weight:bold;
}

.onefield {width: 120px; margin-right:8px;}
.short_field {width: 60px; margin-right:10px;}
.long_field {width: 270px;}



/* ///////// TOOLTIP CSS */

a.info{
    position:relative; /*this is the key*/
    z-index:24; background-color:#DFDFDF;
    color:#000;
    text-decoration:none}

a.info:hover{z-index:25; background-color:#FFF}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:15em;
    border:1px solid #000;
    background-color:#DFDFDF; color:#000;
    text-align: center;
	font: normal normal 1em/1.5em Helvetica, Arial, sans-serif;}


/* ///////// MISC. CLASSES */

	
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

.btm_pad_10 {padding-bottom: 10px; }


/* //// PAGE CLASSES */

.home{}
.event_reg{}
.member_reg{}
.members{}
.join {}
.faq {}
.gallery {}
.press {}
.partners {}
.sitemap {}