﻿/* CSS Document */
/* ==========================================================================================
Title:		Decatur Race for the Cure (default stylesheet)
Date: 		April 2008
Author: 	Dan Trewartha, LRS Web Services
Document:	Style.css

DOCUMENT ORGANIZATION:
	-1.0 : HTML Elements
	-2.0 : Layout Elements
	-3.0 : Navigation
	-4.0 : Headings
	-5.0 : Content
		-5.1 : Home Page
		-5.2 : Sub Pages
	-6.0 : Footer
	-7.0 : Misc

DOCUMENT ARRANGEMENT:
	-Order of appearance in HTML

ATTRIBUTE PROPERTY ORDER:
	-Box (width; height; margin; border; padding; outline;)
	-Backgrounds (color; image; repeat; position;)
	-Positioning (display; position; float; clear; z-index; direction; overflow; visibility;)
	-Font (color; family; size; style; weight;)
	-Text (letter-spacing; line-height; align; decoration; indent; transform; vertical-align;)
	-Misc (content; outline; cursor; table-layout;)

ATTRIBUTE LAYOUT:
	selector {
		property: value;
	}

COLOR PALETTE:
	-Content background:;
	-Main font:;
	-Link:;
	-Link hover:;
	-Link visited:;
	-<strong>:;
	-<em>:;
	-<h1>:;
	-<h2>:;
	-<h3>:;
	-<h4>:;
	-<h5>:;
	-nav link:;
	-nav link hover:;
	-nav link visited:;
	
========================================================================================== */




/* ==========================================================================================
=1.0 HTML ELEMENTS
========================================================================================== */
*, html, body{
	margin:0;
	padding:0;
}

html{
	width:100%;	
	position:relative;
}
body{
	width:100%;
	background:#fff;
	position:relative;
	z-index:1;
	font-family:Verdana, Sans-serif;
	color:#fff;
	padding:0 0 65px 0;
}

body {direction:ltr;} 
a img{
	border:0;
	cursor:pointer;
}
a{
	outline:none;
	color:#fff;
	cursor:pointer;
}

.footer a:link
{
	color:#99034d;
	text-decoration:none;
}

.footer a:visited
{
	color:#99034d;
	text-decoration:none;
}

.footer a:hover
{
	color:#99034d;
	text-decoration:underline;
}

.footer a:active
{
	color:#99034d;
	text-decoration:none;
}




	/* ======================================================================================
	=1.1 FONT SIZES
	====================================================================================== */
	html{
		font-size:16px;
	}
	body{
		font-size:75%; /* 16 x .75 = 12px */
	}	
	h1{
		font-size:133%; /* 12 x 1.33 = 16px */
	}
	h2{
		font-size:116.7%; /* 12 x 1.1667 = 14px */
	}
	h3{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	h4{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	p{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	td p{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	ul{
		font-size:100%; /* 12 x 1.00 = 12px */
	}
	ul ul{
		font-size:100%; /* 12 x 1.00 = 12px */
	}





/* ==========================================================================================
=2.0 LAYOUT ELEMENTS
========================================================================================== */
div#page{
	width:1064px;
	margin:0 auto;
	position:relative;
	z-index:2;
}
td#left{
	width:20px;
	margin:0;
	background:url(/Images/b-shadow-left.gif) repeat-y;
}
td#center{
	width:1024px;
	margin:0 auto;
	position:relative;
}
td#right{
	width:20px;
	margin:0;
	background:url(/Images/b-shadow-right.gif) repeat-y;
}
td#bottom-left{
	width:20px;
	height:20px;
	margin:0;
	background:url(/Images/b-shadow-bottom-left.gif) right;
}
td#bottom-center{
	width:1024px;
	height:20px;
	margin:0;
	background:url(/Images/b-shadow-bottom.gif) repeat-x bottom;
}
td#bottom-right{
	width:20px;
	height:20px;
	margin:0;
	background:url(/Images/b-shadow-bottom-right.gif) left;
}
div#container{
	width:1024px;
	margin:0;
	padding:0;
	position:relative;
}
div#header{
	width:100%;
	height:164px;
	margin:0;
	padding:0;
	background:#fff url(/Images/b-hp-bannerArea.gif) no-repeat 80px 100%;
	position:relative;
	z-index:-1;
}
div#sponsorsBar{
	width:100%;
	height:58px;
	margin:0 0 0 0;
	padding:0 0 0 0;
	background:url(/Images/b-n0.gif) repeat-x;
	position:relative;
	z-index:-2;
}
div#sponsorsBarInner{
	width:700px;
	height:58px;
	height:50px;
	margin:0 0 0 0;
	padding:2px 0 0 0;
	/*background:url(/Images/b-sponsors.gif) no-repeat;*/
	position:relative;	
}
div#flashArea{
	width:437px;
	height:684px;
	position:absolute;
	bottom:0;
	right:0;
	z-index:7;
}





/* ==========================================================================================
=3.0 NAVIGATION
========================================================================================== */
div#n1{
	width:565px;
	height:85px;
	margin:0;
	padding:0 0 0 25px;
	position:absolute;
	bottom:0;
	z-index:20;
}
#n1 ul{
	width:565px;
	height:85px;
	margin:0;
	padding:0;
	list-style:none;	
}
#n1 ul li{
	height:85px;
	display:block;
	float:left;	
}
#n1 ul li a{
	height:85px;
	display:block;
	text-indent:-10000px;
}
#n1 ul li a:hover{
	/*background-color:#cd297d;*/
}
#n1 ul li#n1RaceInfo{
	width:118px;
}
#n1 ul li#n1RaceInfo a{
	width:118px;
	background-image:url(/Images/n1-RaceInformation.png);
	background-repeat:no-repeat;
}
#n1 ul li#n1Participate{
	width:116px;
}
#n1 ul li#n1Participate a{
	width:116px;
	background-image:url(/Images/n1-ParticipateVolunteer.png);
	background-repeat:no-repeat;
}
#n1 ul li#n1Donate{
	width:108px;
}
#n1 ul li#n1Donate a{
	width:108px;
	background-image:url(/Images/n1-DonateSponsor.png);
	background-repeat:no-repeat;
}
#n1 ul li#n1Events{
	width:117px;	
}
#n1 ul li#n1Events a{
	width:117px;
	background-image:url(/Images/n1-Events.png);
	background-repeat:no-repeat;
}
#n1 ul li#n1BreastCancer{
	width:106px;	
}
#n1 ul li#n1BreastCancer a{
	width:106px;
	background-image:url(/Images/n1-BreastCancer.png);
	background-repeat:no-repeat;	
}





/* ==========================================================================================
=4.0 HEADINGS
========================================================================================== */
h1{
	width:500px;
	display:block;
}
#h1-breastCancer{
	height:23px;
	background:url(/Images/h1-breastCancer.gif) no-repeat;
	/*margin:0 0 0 25px;*/
}
#h1-volunteer{
	height:24px;
	background:url(/Images/h1-volunteer.gif) no-repeat;
	/*margin:46px 0 0 25px;*/
	margin-top:46px;
}
#h1-participate{
	height:29px;
	background:url(/Images/h1-participate.gif) no-repeat;
	/*margin:0 0 0 25px;*/
}
#h1-raceInformation{
	height:24px;
	background:url(/Images/h1-raceInformation.gif) no-repeat;
	/*margin:0 0 0 25px;*/
}
#h1-donate{
	height:22px;
	background:url(/Images/h1-donate.gif) no-repeat;
	/*margin:0 0 0 25px;*/
}
#h1-sponsor{
	height:29px;
	background:url(/Images/h1-sponsor.gif) no-repeat;
	/*margin:46px 0 0 25px;*/
}
#h1-events{
	height:22px;
	background:url(/Images/h1-events.gif) no-repeat;
	/*margin:0 0 0 25px;*/
}
h1 span{
	visibility:hidden;
}





/* ==========================================================================================
=5.0 CONTENT
========================================================================================== */
div#content{
	width:1024px;
	height:516px;
	background:url(/Images/b-content.jpg) 0 -58px;
}
/*
div#mask{
	width:1024px;
	height:360px;
	margin:0 0 0 0;
	overflow:hidden;
	background:red;
	
}*/
div#scrollarea{
	width:997px;
	height:380px;
	padding:24px 0 24px 27px;
	overflow:auto;
	/*background:blue;	*/
	direction:rtl;
}
p{
	width:500px;
	font-size:12px;
	/*margin-left:27px;*/
	margin-top:9px;	
	margin-bottom:0px;
	line-height:20px;
}

ul{
	width:500px;
	font-size:12px;
	margin-left:27px;
	margin-top:9px;	
	margin-bottom:0px;
	line-height:20px;	
}

h1{
	/*margin-left:27px;*/
}
h2{
	/*margin-left:27px;*/
	margin-top:25px;
	font-weight:bolder;
}




/* ==========================================================================================
=6.0 FOOTER
========================================================================================== */





/* ==========================================================================================
=7.0 MISC
========================================================================================== */
.clear{
	clear:both;
}