/* --- ABC Homepage styles --- */
/* created by: Geoff Pack, September 2007 */
/* last modified: Geoff Pack, November 2008 */

body {
	text-align:center;
	font-family:Verdana,Arial,Helvetica,sans-serif; 
	font-size:76%; /* ~12px based on 16px default font size */
	margin:0; padding:0;
	color:#333; background:#5a5a5a url(body_bg.jpg) top left repeat-x;
}
div {text-align:left; margin:0; padding:0;}
p {font-size:0.92em; margin:0px 14px 8px 12px; padding:0; line-height:1.3em;} /* ~11px */
blockquote {font-size:0.92em; margin:0px 18px 8px 18px;}
img {border:0;}
small {font-size:0.833em;} /* ~10px */
.required {color:#d00;}
big {font-size:1.0em;} /* ~12px */
tr {vertical-align:top;}
th, td {font-weight:normal; font-size:0.92em;}
ul, ol {margin:6px 10px 8px 12px; padding:0;}
li {font-size:0.92em; margin:0; padding:0 0 2px 10px; line-height:1.5em;}
ul li {list-style-type:none; list-style-image:none; background-image:url(arrow_orange.gif); background-position:0px 5px; background-repeat:no-repeat;}
hr {margin:5px 8px; padding:0; border-width:0px; height:1px; border-bottom:1px solid #666;}

.smallImg {margin:3px 8px 10px 0; border:1px solid #000;}
.hidden {visibility:hidden; display:none;}
.right {float:right;}
.center {text-align:center}
.clearer {height:1px; clear:both;}
.clearLeft {clear:left;}
.more {float:right;}

p a.more {float:none; margin-left:0.6em;}

.cols2 {width:48%; float:left; border-left:1px solid #ccc;}
.cols3 {width:30%; float:left; border-left:1px solid #ccc;}
.cols4 {width:22%; float:left; border-left:1px solid #ccc;}
.first {border:0;}

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

/* headings and links */
h1, h2, h3, h4 {font-family:Arial,Helvetica,sans-serif;}
h1 {font-size:2.0em; font-weight:normal; margin:0.3em 10px 0.3em 12px; color:#357610;}
h2 {font-size:1.167em; font-weight:normal; margin:0 0 10px 0; padding:5px 15px 1px 12px; color:#fff; background:url(news.gif) top left no-repeat;}
h3 {font-size:1.33em; font-weight:bold; margin:8px 10px 0.3em 12px; padding:0; color:#357610;}
h4 {font-size:1.0em; margin:8px 10px 2px 12px; padding:0; color:#333;}

h2 a {color:#fff; text-decoration:none;}
h2 span.more {font-size:0.788em; margin-top:0.1em;}

a {color:#016ca9; text-decoration:none;}
a:visited {color:#016ca9;}
a:hover, a:active {background:#e0e0e0;}

h2 a, h2 a:visited, h2 a:hover, h2 a:active {padding-left:8px; color:#fff; background:none; background:url(arrow_white.gif) 0 5px no-repeat;}
h2 a:hover {text-decoration:underline;}
h2 a .more, h2 a:visited .more, h2 a:hover .more, h2 a:active .more {color:#ff3300; text-decoration:none;}
h3 a, h3 a:visited, h3 a:hover, h3 a:active {color:#357610;}

/* hidden link text */
a span {display:block; font-weight:600;}

/* ---------------------------------------------- */
/* Main Layout */

#wrapper     {position:relative; width:1000px; margin:0 auto; padding:0 0 30px 0; background:#dddfd4 url(wrapper_bg.gif) top center repeat-y;}
#header      {position:relative; width:990px; height:78px; margin:0 5px; color:#fff; background:#387a11 url(header_bg.jpg)}
#mainContent {width:726px; overflow:hidden; float:left; clear:left; margin:0 0 -5px 13px; background:#f1f0f0 url(maincontent_bg.gif) top left repeat-y;}
#sidebar     {width:250px; float:left; margin:0;}
#explore     {clear:both; margin:0 5px; background:#b6c6b3 url(explore_bg.gif) top left repeat-y;}
#footer      {clear:both; margin:15px 5px 5px 5px;}


/* ---------------------------------------------- */
/* Header and Main Nav */
/* 'Son of Suckerfish' Dropdowns menus: www.htmldog.com/articles/suckerfish/dropdowns/ */

#header #logo {position:absolute; top:20px; left:21px;}

#navBlock {width:990px; margin:0 5px; background:#2b5f0e;}
#mainNav {margin:0; padding:0; height:2em; margin:0 5px; text-transform:uppercase; background:#2b5f0e;}
#mainNav ul {margin:0 0 -1px 0; padding:0; list-style:none; line-height:1.2;}
#mainNav li {float:left; margin:0; padding:0; font-weight:normal; font-size:0.92em; background:none;}
#mainNav a {display:block; color:#fff; text-decoration:none;}
#mainNav li ul {position:absolute; left:-999em; width:990px; margin:-1px 5px 0 5px; background:#769933; z-index:89;}
#mainNav li:hover ul, #mainNav li.sfhover ul {left:0;}
#mainNav li:hover, #mainNav li.sfhover {background: url(nav_hover_bg.gif) bottom center no-repeat;}
#mainNav li a {padding:4px 8px;}
#mainNav li a:hover {background:url(nav_hover_bg.gif) bottom center no-repeat;}
#mainNav li li {font-weight:normal; font-size:0.92em;}
#mainNav li li a {padding:4px 8px;}
#mainNav li li a:hover {text-decoration:underline; background:#769933;}

/* Global Nav Search Form  */
#gN_form {float:right; margin:0; padding:3px 12px 0 12px;}
#gN_form label {display:none;}
#gN_query {display:inline; width:10em; margin:0px 0; padding:0 2px; font-size:12px; background:#fff; border:0;}
#gN_submit {visibility:visible; display:inline; margin:0; padding:0px 3px; font-size:12px; text-transform:uppercase; color:#fff; background:none; border:0;}


/* ---------------------------------------------- */
/* Main Content */

#contentTop {width:990px; height:20px; margin:0; margin:0 5px; background:url(content_top_bg.gif) top left no-repeat;}
#mainContent .bottomCurve {clear:left; height:16px; margin:0; background:url(maincontent_bottom_bg.gif) bottom left no-repeat;}

.feature {float:left; position:relative; width:340px; height:330px; margin:0 -9px 10px 18px; padding:0; background:#fff url(feature_bg.gif) bottom left no-repeat;}
.featureWide {clear:both; width:689px; margin:0 10px 10px 18px; padding:0; background:#fff url(feature_wide_bg.gif) bottom left no-repeat;}
.featureWide2 {clear:both; width:942px; margin:0 10px 10px 18px; padding:0; background:#fff url(feature_wide2_bg.gif) bottom left no-repeat;}
.featureWide2 .topCurve {height:6px; background:url(feature_wide2_top_bg.gif) top left no-repeat;}

.feature img {margin:0 0 0 10px; border:1px solid #666;}
.feature p.updated {margin-bottom:0; }
.feature p.featureNav {position:absolute; left:0; bottom:0.5em;}

/* Features */
#news {background-color:#e5e4d8;}
#tv {}
#kids {}
#grandstand {}
#healthScience {margin-bottom:0;}
#featuredSites {margin-bottom:0;}
.slug {text-transform:uppercase; font-size:0.86em; margin:0 0.25em 0 0; padding:0 0.5em 0 0; color:#666; border-right: 1px solid #ccc;}

/* Feature Headings */
/*#news h2 {background:#bb5c00 url(news.gif) top left no-repeat;}
*/#tv a{background:none; color:#357610; font-weight:700; text-decoration:none;}
#tv h6{background:#1b7198 url(tv.gif) top left no-repeat;}
#kids h2 {background:#368c77 url(kids.gif) top left no-repeat;}
#grandstand h2 {background:#65904e url(grandstand.gif) top left no-repeat;}
#healthScience h2 {background:#6d6da5 url(health.gif) top left no-repeat;}
#featuredSites h2 {background:#878787 url(feature.gif) top left no-repeat;}

/* Watch Now */
.watchNow {clear:both; width:689px; margin:0 10px 10px 18px; padding:0; background:#fff url(feature_wide_bg.gif) bottom left no-repeat;}
.watchNow p {margin:0; padding:10px 12px 14px 36px; background:url(watchnow_bg.gif) top left no-repeat;}
#s2153972 {display:none;} /* empty 'Watch Now' story */
#sportsUpdate p {padding-left:12px; background:url(watchnow_bg2.gif) top left no-repeat;} /* no icon */

/* Best of ABC */
#bestOfABC {position:relative; clear:both; width:676px; margin:0 10px 10px 22px; padding:0 0 5px 0; background:#f0efef url(bestof_bg.jpg) bottom left no-repeat;}
#bestOfABC h2 {background:#366a18 url(bestofabc.gif) top left no-repeat;}
#bestOfFrame {margin:0 10px; overflow:hidden;}
#bestOfScroller {width:auto;}
#bestOfABC .story_small_image {width:320px; float:left; margin-left:10px; border-left:1px solid #ccc;}
#bestOfABC .n1 {border:0;}
#bestOfABC img {float:left; margin:0 12px 5px 12px; padding:3px; background:#fff; border:1px solid #ccc;}
#bestOfABC img.iView_button {float:right; padding:0; margin:5px 12px 0 0; background:transparent; border:0;}
#bestOfABC ul {clear:left;}

/* Best of ABC scroll Buttons */
#bestOfABC .back {position:absolute; top:60px; left:-14px;}
#bestOfABC .next {position:absolute; top:60px; right:-14px;}
#bestOfABC .back img, #bestOfABC .next img {margin:0; padding:0; background:none; border:none;}
#bestOfBack	{background:url(bestof_back.gif) top left no-repeat;}	
#bestOfNext {background:url(bestof_next.gif) top left no-repeat;}
#bestOfBack.off	{background:url(bestof_back_off.gif) top left no-repeat;}	
#bestOfNext.off {background:url(bestof_next_off.gif) top left no-repeat;}

/* Unleashed */
#unleashed {padding:0 0 12px 0;}
#unleashed h6 {background:#da6c00 url(unleashed.gif) top left no-repeat;}
#unleashed h2 {background:none; color:#004461; font-weight:700; text-decoration:underline;}
#unleashed p{text-align:justify;}
#unleashed .cols4 {width:157px; float:left; margin-left:7px;}
#unleashed .cols4 img {float:left; margin:0 12px 5px 12px; padding:3px; border:1px solid #ccc;}
#unleashed .n1 {clear:left; margin-left:10px; border-left:0;}
#unleashed #voteNow img {margin:0 12px; vertical-align:top;}
#unleashed #voteNow a:hover {background:none;}

#unleashed #fora {margin:5px 0 0 15px; clear:left;}
#unleashed #fora img {margin-top:5px; padding:3px; background:#fff; border:1px solid #ccc;}


/* ---------------------------------------------- */
/* Sidebar Content */

#sidebar {}
#sidebar .feature {min-height:5em; margin:5px; padding:0; background:#fff;}

#radioTab {position:relative; left:-5px; width:259px; margin-left:0px; background:#edecec url(radio_tab_bg.gif) top left repeat-y;}
#radioTab .bottomCurve {clear:left; height:31px; margin:0; background:url(radio_tab_bottom_bg.gif) bottom left no-repeat;}

/* Radio */
#radio {width:250px; margin:0 0 -5px -2px; background:#fff url(feature_radio_bg.gif) bottom left repeat-y;}
#radio h2 {background:#ab3200 url(radio.gif) top left no-repeat;}
#radio .highlightImage {float:left; margin:0 8px 8px 10px; border:1px solid #ccc;}
#radio h4 a, #radio h4 a:visited, #radio h4 a:hover, #radio h4 a:active {color:#333;}
#radio table {margin:0 15px 0 15px;}
#radio table td {padding:3px; border-bottom:1px solid #ccc;}
#radio table td b a {color:#333; font-weight:normal;}
#radio img{border-top:5px solid #cccccc; border-bottom:5px solid #cccccc;}
#radio img.z{border:none;}


/* Local */
#sidebar #local {width:250px; margin:0 0 0 -2px; background:#d4e9ea url(feature_local_bg.gif) bottom left no-repeat;}
#sidebar #local h2 {margin:0 6px 6px 3px; padding:4px 6px; color:#fff; background:#0a6fa3;}
#sidebar #local h2 a {margin-left:8px;}
#sidebar #local p {margin:0px 16px 8px 16px; color:#444;}
#localRadio {font-size:1.0em;}
#localRadio b, #localRadio b a, #localRadio b a:visited, #localRadio b a:hover, #localRadio b a:active {color:#18642e;}
#locationButton {float:right; margin:-2px 0 0 0;}
#changeLocation {padding-bottom:1em;}

/* Weather */
#weather {position:relative; margin:0 1px 0px 1px; padding-bottom:10px;}
#weather h4 {padding-top:5px; margin-left:16px; margin-right:17px; border-top:1px solid #969696;}
#weatherFrame {margin:0 16px 5px 16px; overflow:hidden;}
#weatherScroller {width:1200px;}
#sidebar #local #weatherScroller p {float:left; width:220px; margin:0; padding:0.5em 0; font-size:0.92em; line-height:1.5em;}
#weather .high {color:#f30;}
#weather .low  {color:#03f;}
#weather .day img {float:left; margin:0 10px 5px 0;}
#weather .day strong {text-transform:uppercase; font-size:1.083em;}
#weatherNav {margin-bottom:0; padding-bottom:1px; font-size:0.9em;}
#weatherNav a {margin-right:10px; padding-left:7px; background:url(arrow_blue.gif) 0px 4px no-repeat; }


/* Shop */				
#shop, #innovation, #services, #transcripts, #noticeboard {width:250px; margin:14px 0 14px 2px;  padding-bottom:0.3em; background:#fff url(shop_bg.gif) bottom left no-repeat;}
#shop {position:relative; margin-top:0;}
#shop h2 {margin-bottom:0px; padding:2px 11px 1px 11px; background:#114867 url(shop.gif) top left no-repeat}
#shop h3 {margin:-1.6em 0 0.7em 0; padding:0.3em 5px; font-size:1.0833em; text-align:center; color:#fff; background:#000; opacity:0.7;}
#shop h3 a {color:#fff;}
#shop h3 a:hover {color:#fff; background:none;}
#shop img {border:0;}
#shop a.preview {position:absolute; top:2.8em; left:4px;}
#shop a.buy {position:absolute; top:2.8em; right:4px;}
#shop a.buy:hover, #shop a.preview:hover {background:none;}

/* Promo */
#innovation {background:none; padding:0;}

/* Services */
#services {}
#services h2 { padding:2px 11px 1px 11px; background:#aa6719 url(services.gif) top left no-repeat}
#services .promo {clear:both; margin:7px 8px; padding:7px; background:#ececec; border:1px solid #afafaf;}
#services .promo img {float:left; margin-right:6px;}
#services a {clear:both; margin:0 22px; padding:0; background:#ececec; border:1px solid #afafaf; display:block}

/* Transcripts */
#transcripts {}
#transcripts h2 {padding:2px 11px 1px 11px; background:#7a7a7a url(transcripts.gif) top left no-repeat}
#transcripts ul {margin:1em 10px 2em 11px;}
#transcripts li {line-height:1.2; margin-bottom:0.8em; padding:0 0 0 11px; background:url(arrow_grey.gif) 3px 6px no-repeat;}

/* Noticeboard */
#noticeboard {}
#noticeboard h2 {padding:2px 11px 1px 11px; background:#7a7a7a url(transcripts.gif) top left no-repeat}
#noticeboard img {float:left; margin:2px 8px 5px 12px; padding:0; border:1px solid #ccc;}


/* ---------------------------------------------- */
/* Explore the ABC */

#explore h2 {font-size:1.4em; font-weight:normal; margin:20px 20px 10px 20px; padding:0 0 7px 0; color:#333; background:transparent; border-bottom:1px solid #9caba1;}
#explore h2 a {color:#333; padding-left:0; background:none;}
#explore h2 a .more, #explore h2 a:visited .more, #explore h2 a:hover .more, 
#explore h2 a:active .more {color:#333; text-decoration:none; padding-left:0; background:none;}

#explore ul {margin-left:10px; padding-left:0;}
#explore li {font-weight:bold; margin:0 0 2em 12px; padding:0 0 0 11px; background:url(arrow_green.gif) 3px 5px no-repeat;}
#explore ul ul {display:inline;}
#explore li li {display:inline; font-weight:normal; margin:0; padding:0 5px 0 0; background:transparent;}

#explore a {color:#333;}

#explore .cols3 {width:30%; float:left; border-left:1px solid #9caba1;}
#explore .first {border:none;}
#explore .topCurve {height:12px; margin:0; background:url(explore_top_bg.gif) top left no-repeat;}
#explore .bottomCurve {height:16px; margin:0; background:url(explore_bottom_bg.gif) bottom left no-repeat;}


/* ---------------------------------------------- */
/* Footer */
#footer .bottomCurve {height:16px; margin:0; background:url(explore_bottom_bg.gif) bottom left no-repeat;}
#footer p {text-align:center;}
#footer a {color:#333;}
#footerLogo {position:relative; top:4px;}


/* ---------------------------------------------- */
/* Slideshows */

.highlights {position:relative;}
.highlights .highlightImg {display:block; background:#aaa;}
.highlights #tv0, .highlights #news0 {display:block;}
.highlights div {position:absolute;}

.slideshowNav {position:absolute; top:159px; left:11px; width:307px; height:18px; margin:0; padding:4px 0 0 8px; font-size:12px; z-index:88; color:#000; background:#fff; opacity:0.7;}
.slideshowNav a {margin:0 4px; padding:0; background:none;}
.slideshowNav img {margin:0; padding:0 2px; vertical-align:top; background:none; border:0;}
.slideshowNav a.number {padding:0px 5px 1px 5px; color:#fff; background:#000;}
.slideshowNav a.number:hover, .slideshowNav a.on {background:#468a01;}

#tv p.video {float:right; margin:0 14px 0 4px;}
#tv p.video img {border:0; background:0;}
#tv p.video a {background:0;}


/* ---------------------------------------------- */
/* Lightbox Styles */

#lightbox {margin:0; padding:5px; background:#eee; border:0px solid #000; border-width:0 3px 3px 0;}
#lightbox img {border:none; clear:both;} 
#lightboxDetails {}	
#lightboxDetails p {margin:2px 0 0px 0;}	
#lightboxCaption {float:left; margin-right:10px;}
#keyboardMsg {float:right;}
#closeButton {top:0px; right:0px;}
#overlay img {border:none;}
#overlay {opacity:.7; background:#000;}
#player {z-index:100;}

#foraTvVideo {margin:0; padding:0; width:640px; height:520px; border:1px solid #000; z-index:95;}


/* ---------------------------------------------- */
/* FAQ page */

body#faqs {}
body#faqs h1, body#faqs h3, body#faqs p {margin-left:26px; margin-right:45px;}
body#faqs h3 {margin-top:2em;}

body#faqs #mainContent {clear:left; width:979px; overflow:hidden; margin:0 0 -5px 13px; background:#f1f0f0 url(maincontent_wide_bg.gif) top left repeat-y;}
body#faqs #mainContent .bottomCurve {clear:left; height:16px; margin:30px 0 0 0; background:url(maincontent_bottom_wide_bg.gif) bottom left no-repeat;}
body#faqs #mainContent img.screenshot {float:right; margin:0 0 0 18px;}

#homepageFAQs {width:581px; min-height:21em; margin-top:2em; background:#e5e4d8 url(feature_med_bg.gif) bottom left no-repeat;}
#homepageFAQs h2 {background:#bd6000 url(homepage_faqs.gif) top left no-repeat;}

#generalFAQs {min-height:21em; margin-top:2em; margin-left:27px; background-color:#e5e4d8;}
#generalFAQs h2 {background:#bd6000 url(general_faqs.gif) top left no-repeat;}

#feedback {min-height:20em; margin-top:12px; padding-bottom:1em;}
#feedback h2 {font-size:1.33em; font-weight:bold; margin:8px 10px 0.3em 18px; padding:0; color:#357610; background:none;}
body#faqs #feedback p {margin-left:18px;}
#feedback form {margin:2em 0}
#feedback form .cols2 {border:0;}


/* ---------------------------------------------- */
/* This is for the iView swf promo in the featured site box */
/* SWF object replaces the highlight image so the styles need to be applied to it also */
#iViewImg {display:block; margin:0 0 0 10px; width:315px; border:1px solid #666;}
#iViewImg img {margin:0; border:0;}

#olympicsBanner {width:690px; margin:0 0 10px 18px; padding:0;}