/*
	main.css based on Blueprint (http://www.blueprintcss.org/)
	=====================================
*/

body { 
  font-size: 90%;
  color: #290101; 
  background: #fff;
  font-family:Georgia, "Times New Roman", Times, serif;
  background-image: url(../images/bckgrnd.gif);
  background-repeat: repeat-x;
}

#wrapper
{
	width:888px;
	margin:0 auto;
	position:relative;
	background:url(../images/background.gif) no-repeat;
	}


/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #290101; }

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2.3em; margin-bottom: 0.35em; font-family:Helvetica, Arial, sans-serif; 
		font-weight:bold; color:#ffff00; line-height:normal; }
h3 { font-size: 1.5em; line-height: 1; margin-bottom: .5em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; height: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img {
  margin: 0;
}


/* Text elements
-------------------------------------------------------------- */

p           { margin: 0 0 1em; }
p img       { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a:focus, 
a:hover     { color: #000; }
a           { color: #009; text-decoration: underline; }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre,code    { margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; } 


/* Lists
-------------------------------------------------------------- */

li ul, 
li ol       { margin:0 1.5em; }
ul, ol      { margin: 0 1.5em 1.5em 1.5em; }

ul          { list-style-type: disc; }
ol          { list-style-type: decimal; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}

#nav li 	{ 	display: inline;
		list-style-type: none;
		padding-right: 20px;
		}


/* Tables
-------------------------------------------------------------- */

table       { margin-bottom: 1.4em; width:100%; }
th          { font-weight: bold; background: #C3D9FF; }
th,td       { padding: 4px 10px 4px 5px; }
tr.even td  { background: #E5ECF9; }
tfoot       { font-style: italic; }
caption     { background: #eee; }


/* Misc classes
-------------------------------------------------------------- */

.small      { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
.large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
.hide       { display: none; }

.quiet      { color: #666; }
.loud       { color: #000; }
.highlight  { background:#ff0; }
.added      { background:#060; color: #fff; }
.removed    { background:#900; color: #fff; }

.first      { margin-left:0; padding-left:0; }
.last       { margin-right:0; padding-right:0; }
.top        { margin-top:0; padding-top:0; }
.bottom     { margin-bottom:0; padding-bottom:0; }



/* Logo image replacement
-------------------------------------------------------------- */
h1 {
	background:url(../images/kdka-logo.gif) no-repeat top left;
	text-indent:-5000px;
	/*float:left;*/
	width:209px; height:155px;
	position:absolute;
	top:15px;
	z-index:100;
}
h1 a { display:block; width:209px; height:155px;  }
p.dollar {
	background:url(../images/dollar-energy-logo.gif) no-repeat top left;
	text-indent:-5000px;
	float:left;
	width:181px; height:68px;
	position:absolute;
	top:164px;
	left:17px;
	z-index:100;
}

/* Nav
-------------------------------------------------------------- */
#nav ul { height:53px; background:url(../images/red-bkg.gif) repeat-y; margin:0;  }
#nav-links li {
	height:53px;
	overflow:hidden;
	position:absolute;
	padding:0;
	z-index:1;
}
#nav-links a {
	background-position:left top;
	background-repeat:no-repeat;
	display:block;
	height:53px;
	text-indent:-5000px;
}
#n-about { width:151px; right:543px; top:0px;}
	#n-about a { background-image:url(../images/about_the_warmathon.jpg);}
	#n-about a:hover { background-image:url(../images/about_the_warmathon_over.jpg);}

#n-program { width:124px; right:419px; top:0px;}
	#n-program a { background-image:url(../images/program_benefits.jpg);}
	#n-program a:hover { background-image:url(../images/program_benefits_over.jpg);}

#n-support { width:165px; right:254px; top:0px;}
	#n-support a { background-image:url(../images/support_the_warmathon.jpg);}
	#n-support a:hover { background-image:url(../images/support_the_warmathon_over.jpg);}

#n-sponsor { width:133px; right:121px; top:0px;}
	#n-sponsor a { background-image:url(../images/program_sponsors.jpg); }
	#n-sponsor a:hover { background-image:url(../images/program_sponsors_over.jpg); }

#n-auction { width:121px; right:0px; top:0px;}
	#n-auction a { background-image:url(../images/online_auction.jpg);}
	#n-auction a:hover { background-image:url(../images/online_auction_over.jpg);}

#hidden { display:none; }

/* Content
-------------------------------------------------------------- */
#content {
	width:625px;
	min-height:400px;
	height:auto !important;
	height:400px;
	margin-top:111px;
	margin-left:255px;
	margin-bottom: 50px;
	text-align:left;
	}
	
	#main-content {
	min-height:400px;
	height:auto !important;
	height:400px;
	margin-top:111px;
	margin-left:255px;
	margin-bottom: 50px;
	margin-right:200px;
	text-align:left;
	}
	
	#call-out-right {
	width:175px;
	float:right;
	margin-top:111px;
	}

/* Footer
-------------------------------------------------------------- */
#footer {
	height:37px;
	background:url(../images/red-bkg.gif) repeat-y top left;
	position:relative;
}

/*  Note that the classes listed below match the filename. 
	This makes it easier to know exactly what image you are placing on the page.
	
	The width and height must match that of the image.
	If you add more images, don't forget to create .gif files and add them to ie.css.
	(ie6 and lower doesn't understand .png files 
*/
#image { position:absolute; bottom:0; left:0; width:279px;}
	#image.aacouple { width:279px; height:364px; background:url(../images/aa-couple.png) no-repeat;}
	
	#image.woman { width:239px; height:375px; background:url(../images/woman.png) no-repeat;}
	
	#image.father-daughter { width:279px; height:360px; background:url(../images/father-daughter.png) no-repeat;}
	
	#image.african-american-family { width:244px; height:376px; background:url(../images/african-american-family.png) no-repeat;}
	
	#image.older-woman { width:272px; height:351px; background:url(../images/older-woman.png) no-repeat;}
	
	#image.older-couple { width:337px; height:340px; background:url(../images/older-couple.png) no-repeat;}
	
	#image.lil-girl { width:229px; height:378px; background:url(../images/lil-girl.png) no-repeat;}


#footer li {
	height:37px;
	overflow:hidden;
	top:0px;
	position:absolute;
	padding:0;
	z-index:1;
}
#footer a {
	background-position:left top;
	background-repeat:no-repeat;
	display:block;
	height:37px;
	text-indent:-5000px;
}
#f-kdka { width:175px; right:387px; top:0px;}
#f-kdka a { background-image:url(../images/visit_newsradio_1020_kdka.jpg);}
#f-kdka a:hover { background-image:url(../images/visit_newsradio_1020_kdka_over.jpg);}

#f-kdka-tv { width:98px; right:289px; top:0px;}
#f-kdka-tv a { background-image:url(../images/visit_kdka_tv.jpg);}
#f-kdka-tv a:hover { background-image:url(../images/visit_kdka_tv_over.jpg);}

#f-about { width:187px; right:102px; top:0px;}
#f-about a { background-image:url(../images/about_dollar_energy_fund.jpg);}
#f-about a:hover { background-image:url(../images/about_dollar_energy_fund_over.jpg);}

#f-contact { width:102px; right:0px; top:0px;}
#f-contact a { background-image:url(../images/contact_us.jpg);}
#f-contact a:hover { background-image:url(../images/contact_us_over.jpg);}