@charset "UTF-8";
/* CSS Document */

body {
	font-size: 75%;
	color: #222;
	background: #f6f6f6;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
}
#wrapper {
	width:960px;
	margin:0 auto; /*Centers The Main Wrapper Div */
	border:1px solid #CCC;
}
#header {
	position:relative;
	height:100px;
	background:#fff;
}
#logo {
	float:left; /* float the logo to the left*/
	width:190px;
	height:50px;
	margin:20px 0px 0px 60px; /* Add a margin to the top and left: Top Right Bottom Left*/
	background:url(../images/striders_logo.jpg); /* If you Change the logo make sure its dimension match or change the width and/or height*/
}
.sales_bg {
	background: url(../images/3.jpg) center no-repeat;
}
.race_bg {
	background: url(../images/1.jpg) center no-repeat;
}
.group_bg {
	background: url(../images/2.jpg) center no-repeat;
}
.club_bg {
	background: url(../images/4.jpg) center no-repeat;
}
/* Added for SEO purpases: add your tagline and it will be hidden from viewers but not SEO bots
-------------------------------------------------------------- */
#logo h1 {
	color:#333;
	/* This is the trick*/
	text-indent:-99999px;
}
#address {
	float:right; /* float the div to the right*/
	width: 200px;
	height:46px;
	margin:20px 35px 0px 0px; /* Add a margin to the top and right:  Top Right Bottom Left*/
	text-align:left;
	color:#999;
	font-size:10px;
	line-height:12px; 	/* set the leading*/
}
#nav {
	position:absolute;
	height:42px;
	width:860px;
	background:#0072bc;
	top:80px;
	left:50px;
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the time or keep it. It degrades gracefully */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#slider {
	height:340px;
	background:#999;
}
#header_image {
	height:250px;
}
.header_map {
	height:350px;
	background:#999;
}
/* Content
-------------------------------------------------------------- */

#calendar {
	width:920px;
	height:600px;
	margin:20px 20px 20px 20px;
	background:#CCC;
	float:left;
}
#breadcrumb {
	height:30px;
	background:#f6f6f6;
	border-bottom:#CCC 1px solid;
	border-top:#CCC 1px solid;
}
#breadcrumb h3 {
	font-size:11px;
	color:#333;
	margin:10px 0px 0px 20px;
	font-family:Arial, Helvetica, sans-serif;
}
#content {
	position:relative;
	background:#fff;
	overflow:auto;
}
#blue_break {
	height:30px;
	background:#0072bc;
	border-top:1px solid #015d99;
	border-bottom:1px solid #015d99;
}
#footer {
	height:100px;
	background: #fff;
}
.specials {
	background:#CCC;
	width: 650px;
	height:237px;
	float:left;
	margin:20px 0px 0px 20px;
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the time or keep it. It degrades gracefully */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.subscribe {
	background:#f9f5d2;
	width: 250px;
	height:237px;
	float:left;
	margin:100px 0px 0px 20px;
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the time or keep it. It degrades gracefully */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.subscribe_top {
	height:50px;
	background:#ecd587 url(../images/subscribe.jpg) left no-repeat;
	-moz-border-radius: 5px;/* rounded corners on button : mozila browsers*/
	-webkit-border-radius: 5px;/* rounded corners on button : Safari, Chrome browsers*/
}
.subscribe_center {
	height:35px;
	padding:10px;
	background:#f1e7a0;
	color:#676133;
	font:Arial, "Helvetica", sans-serif;
	size:12px;
}
.subscribe_bottom {
	height:170px;
	background:#f9f5d2;
	margin:5px 0px 0px 0px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.subscribe_form {
	height:30px;
	width:230px;
	border:1px solid #ecd587;
	margin:5px 0px 5px 10px;
	color:#676133;
	font:Arial, "Helvetica", sans-serif;
	font-size:16px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.form_submit {
	width:75px;
	height:30px;
	background:#d49337;
	font-size:13px;
	color: #fff;
	margin-left:167px;
	text-decoration: none;
	font-weight:bold;
	/* Start of CSS 3 browser enabled effects*/
	
	-moz-border-radius: 5px;/* rounded corners on button : mozila browsers*/
	-webkit-border-radius: 5px;/* rounded corners on button : Safari, Chrome browsers*/
	text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25); /* Adds shadow to text*/
	border-style:none;
}
.linebreak {
	height:0px;
	width:900px;
	margin:0 auto;
	border-top:1px solid #ccc;
}
.race_events {
	width:430px; /* Added 10px padding so wich realy makes this div 450px */
	min-height:300px;
	margin:20px 0px 20px 20px; /* top right bottom left */
	padding:10px 10px 10px 10px; /* adds padding to the sides of the div Note: if you increase the padding then you will have to subtract to the width or the div will not fit!*/
	float:left;
	border:1px dotted #CCC;
}
.race_events {
	font-family:Arial, 'Helvetica', sans-serif;
	size:20px;
}
.index_news {
	width:630px; /* Added 10px padding so wich realy makes this div 450px */
	margin:20px 0px 20px 20px; /* top right bottom left */
	padding:10px 10px 10px 10px; /* adds padding to the sides of the div Note: if you increase the padding then you will have to subtract to the width or the div will not fit!*/
	float:left;
}
.index_news h1 {
	font-family:Arial, 'Helvetica', sans-serif;
	size:20px;
}
.index_events {
	width:430px; /* Added 10px padding so wich realy makes this div 450px */
	margin:20px 0px 20px 20px; /* top right bottom left */
	padding:10px 10px 10px 10px; /* adds padding to the sides of the div Note: if you increase the padding then you will have to subtract to the width or the div will not fit!*/
	float:left;
}
.index_event h1 {
	font-family:Arial, 'Helvetica', sans-serif;
	size:20px;
}
.club {
	width:900px; /* Added 10px padding so wich realy makes this div 450px */
	margin:20px 0px 20px 20px; /* top right bottom left */
	padding:10px 10px 10px 10px; /* adds padding to the sides of the div Note: if you increase the padding then you will have to subtract to the width or the div will not fit!*/
	float:left;
}
.gold {
	background:#FF6 url(../images/gold.jpg) center no-repeat;
	width:350px;
	height:100px;
	float:left;
	margin:0px 30px 20px 75px; /* top right bottom left */
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the time or keep it. It degrades gracefully */
		padding:10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.silver {
	background:#CCC url(../images/silver.jpg) center no-repeat;
	width:350px;
	height:100px;
	float:left;
	margin:0px 0px 20px 20px; /* top right bottom left */
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the time or keep it. It degrades gracefully */
		padding:10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#gold_list {
	width:400px;
	margin:20px 0px 20px 20px; /* top right bottom left */
	list-style:none;
	float:left;
}
#Silver_list {
	width:400px;
	margin:20px 0px 20px 20px; /* top right bottom left */
	list-style:none;
	float:left;
}
.siver_hlgt {
	background:#CCC;
}
.gold_hlgt {
	background:#e9d386;
}
#group_training {
	width:620px;
	margin:20px 50px 20px 20px; /* top right bottom left */
	font-family:Arial, "Helvetica", sans-serif;
	font-size:18px;
	float:left;
}
#left {
	width:300px;
	margin:20px 0px 20px 20px; /* top right bottom left */
	float:left;
}
#right {
	width:300px;
	margin:20px 0px 20px 20px; /* top right bottom left */
	float:left;
}
#striders_logo {
	margin:20px 50px 20px 20px; /* top right bottom left */
}
.float_right {
	float:right;
}
#contact_top {
	width:900px;
	margin:30px 0px 20px 30px; /* top right bottom left */
}
#contact {
	position:relative;
	width:650px;
	margin:20px 0px 20px 30px; /* top right bottom left */
	float:left;
}
#contact h3 {
	font:Arial, Helvetica, sans-serif;
	font-size:16px;
	margin:50px 0px 10px 0px;
}
#contact_address {
	background: #E7E7E7;
	width:200px;
	padding:5px 5px 5px 5px;
	border:1px solid #ccc;
	float:right;
	margin:30px 30px 0px 0px;
}
#maps {
	position:absolute;
	width:350px;
	height:300px;
	left:301px;
	z-index:1;
	top: 9px;
}
#name {
	width:250px;
	height:30px;
	background: #f2f2f2;
	border:#CCC 1px solid;
	font-size:14px;
	font-weight:bold;
	color: #999;
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the time or keep it. It degrades gracefully */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#email {
	width:250px;
	height:30px;
	background: #f2f2f2;
	border:#CCC 1px solid;
	font-size:18px;
	font-weight:bold;
	color:#333;
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the time or keep it. It degrades gracefully */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#comments {
	width:600px;
	height:200px;
	background: #f2f2f2;
	border:#CCC 1px solid;
	font-size:18px;
	font-weight:bold;
	color:#333;
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the time or keep it. It degrades gracefully */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
/* Lava Menu Start
-------------------------------------------------------------- */

#lava a {
	text-decoration:none;
	color:#FFF;
	font:Arial, Helvetica, sans-serif;
	font-size:16px;
	text-shadow:#000;
}
#lava {
	position:relative; /* you must set it to relative, so that you can use absolute position for children elements */
	text-align:center;
	width:900px;
	height:40px;
	margin:0 auto;
	margin-top:8px;
}
#lava ul {
	margin:0; /* remove the list style and spaces*/
	padding:0;
	list-style:none;
	display:inline;
	position:absolute; /* position absolute so that z-index can be defined */
	left:30px; /* center the menu, depend on the width of you menu*/
	top:0;
	z-index:100; /* should be higher than #box */
	width: 858px;
}
#lava ul li {
	margin:0 25px; /* give some spaces between the list items */
	float:left; /* display the list item in single row */
}
#lava #box {
	position:absolute; /* position absolute so that z-index can be defined and able to move this item using javascript */
	left:0;
	top:0;
	z-index:50; /* should be lower than the list menu */
	background:#0068ac; /* image or color of the right rounded corner */
	height:25px;
	padding-right:8px; /* add padding 8px so that the tail would appear */
	margin-left:-10px;/* self-adjust negative margin to make sure the box display in the center of the item */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#lava #box .head {
	background:#0068ac; /* image or color of the left rounded corner */
	height:25px;
	padding-left:10px; /* self-adjust left padding to make sure the box display in the center of the item */
	/* Adds 5px rounded courners to menu: Take this out and add divs to each side with a gif when you get the 		time or keep it. It degrades gracefully */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

/* Footer Menu
-------------------------------------------------------------- */



.footer_menu {
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
}
.footer_menu ul {
	margin: 10px 0 0 -15px;
	text-align:left; /*set value to left */
}
.footer_menu ul li {
	display: inline;
}
.footer_menu ul li a {
	color: #ccc;
	margin-right: 5px; /*spacing between each menu link*/
	margin-left:5px;
	text-decoration: none;
}
.footer_menu ul li a:hover, .footer_menu ul li a.selected {
	color:#666;
}
.footer_menu_spacer {
	color:#ccc;
}
#copyright {
	color:#ccc;
	margin:0 0 0 20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	text-decoration:none;
}
#copyright a:hover a:link {
	text-decoration:none;
	color:#333;
}
/* Odds and ends
-------------------------------------------------------------- */

p a:link, a:link {
	color:#06F;
}
p a:visited, a:visited {
	color:#CCC;
}
.form {
	margin:0px 0px 50px 0px;
	font-size:14px;
	color:#999;
}

img.floatleft { 

	margin:10px;
	border:3px solid #ccc;
	float:left;
	
}

img.floatright { 

	padding:20px;
	border:#06C 3 px solid;
	float:right;
	
}


/* -------------------------------------------------------------- 
  
   link-icons.css
   * Icons for links based on protocol or file type.
   
   See the Readme file in this folder for additional instructions.

-------------------------------------------------------------- */

/* Use this class if a link gets an icon when it shouldn't. */
body a.noicon {
	background:transparent none !important;
	padding:0 !important;
	margin:0 !important;
}

/* Make sure the icons are not cut */
a[href^="http:"], a[href^="mailto:"], a[href^="http:"]:visited, a[href$=".pdf"], a[href$=".doc"], a[href$=".xls"], a[href$=".rss"], a[href$=".rdf"], a[href^="aim:"] {
 padding:2px 22px 2px 0;
 margin:-2px 0;
 background-repeat: no-repeat;
 background-position: right center;
}

/* External links */
a[href^="http:"] {
background-image: url(icons/external.png);
}
a[href^="mailto:"] {
background-image: url(icons/email.png);
}
a[href^="http:"]:visited {
background-image: url(icons/visited.png);
}

/* Files */
a[href$=".pdf"] {
background-image: url(icons/pdf.png);
}
a[href$=".doc"] {
background-image: url(icons/doc.png);
}
a[href$=".xls"] {
background-image: url(icons/xls.png);
}
 
/* Misc */
a[href$=".rss"], a[href$=".rdf"] {
background-image: url(icons/feed.png);
}
a[href^="aim:"] {
background-image: url(icons/im.png);
}