/* 
Unleashed styles
created by: Geoff Pack, November 2009
last modified: May 2010
*/

@import url(/includes/css/globalNav.css); 

body {background:#000 url('images/body_bg.jpg') top center no-repeat; background-attachment:fixed;}

/* links */
a.more {float:none; margin-left:5px; padding-left:8px; font-size:0.92em; background:url('images/more_bg.gif') center left no-repeat; }
a.more span {display:none;}

a.button {display:inline; float:right; margin:0 0 0 10px; padding:3px 11px 3px 0; color:#333; background:url('images/button_bg_right.gif') center right no-repeat;}
a.button span {display:inline; margin:0; padding:3px 10px 3px 10px; background:url('images/button_bg_left.gif') center left no-repeat;}
a.button:link, a.button:visited {color:#333;}
a.button:hover {text-decoration:underline;}

/* over-ride news buttons */
body.unleashed a.button {font-family:Verdana,Arial,Helvetica,sans-serif; font-weight:bold; font-size:0.92em; height:auto; line-height:1.2;}
body.unleashed a.button span {height:auto; line-height:1.2;}


/* ---------------------------------------------- */
/* Header */

#unleashedHeader {position:relative; height:110px; background:url('images/header_bg2.png') top left repeat-y;}
#abcLogo 	{position:absolute; top:13px; left:19px; width:150px height:57px; display:block;}
h1 			{position:absolute; top:0px; left:179px; width:430px height:80px; margin:0;}
p#debate 	{position:absolute; top:18px; left:605px; width:9em; line-height:1.25; color:#fff;}

#nav {height:30px; background:none; border-bottom:none;}
#nav a {color:#fff; text-shadow:none;}
#nav ul {width:100%; margin-top:80px; background:url('images/nav_bg3.png') top left no-repeat;}
#nav ul ul {margin-top:0;}
.banner1 #nav, .banner2 #nav, .banner3 #nav, .banner4 #nav, .banner5 #nav {background:none;}

body.home #nav li.unleashed a,
body.archive #nav li.unleashed a, 
body.story_page #nav li.unleashed a, 
body.contributors #nav li.contributors a,
body.bio_page #nav li.contributors a {background:#000; border-right:1px solid #333; border-left:1px solid #333;}

/* ---------------------------------------------- */
/* Main layout */

div.page_margins {background:transparent;}
div.page {background:#fff url('images/page_bg2.png') top center repeat-x; /*overflow:auto;*/}
#sidebar {width:220px; float:left; margin:0 0 0 20px; padding-bottom:10px;}
#sidebar .section {margin-bottom:20px;}
#sidebar #unleashedTools ul {margin-left:8px;}

#pageClearer {clear:both;} /* this is for Firefox - oveflow:auto on div.page was breaking in FF on really long pages (with 200+ comments) */

#mainContent {width:700px; float:left; margin:0 0 0 10px; padding:0 0 2em 0;}
body.widePage #mainContent {width:940px;} /* no sidebar */
#mainContent img {background:#ccc;}

#mainContent h2 {margin:0 0 1.5em 0; padding:3px 0 7px 0; font-size: 1.2em; text-transform:uppercase; letter-spacing: 0.2em; color:#7b7b7b; border-bottom:2px solid #999;}
#mainContent h3 {font-size:1.3em; color:#000;}
#mainContent h3 a, h3 a:visited, h3 a:link {color:#000;}
#mainContent h3 a:active, h3 a:hover {color:#000;}

#mainContent .cols2 {float:left; width:340px; margin:10px 0;}
#mainContent .col1 {margin-right:20px;}


/* ---------------------------------------------- */
/* Home page */

/* general story layout */
.story {clear:both; margin:5px 0 15px 0; overflow:auto; /*background:#ff0;*/}
.story img {float:left; margin:0; background:#ccc;}
.story h3 {margin:5px 0 0 120px; padding:5px 0 0 0;}
.story h4 {margin:2em 0 0 120px;}
.story ul, .story ol, .story table, .story blockquote {margin:0 0 1em 140px;}
.story ul li {margin:2px 0; padding-left:13px; background:url('images/li_bg.gif') 0px 2px no-repeat;}
.story p {margin:0 0 0.5em 120px;}
.story p span.blockquote {display:block; margin:1em 20px; font-size:0.95em;}
.story p.author {margin:0 0 -2px 0; padding:1px 0; text-transform:uppercase; font-weight:bold;}
.story p.author a, .story p.author span {padding:1px 5px; color:#fff; background:#000;}
.story p.comments {margin-top:0.5em; margin-right:50px; border:1px solid #d6d6d6; border-width:1px 0;}
.story p.comments a {}
.story p.comments a span {color:#f60; font-weight:bold;}

/* featured stories - home page and story page */
#featuredStory {margin:10px 0 10px 0; border-bottom:3px solid #f60; overflow:visible;}
#featuredStory h2 {border-bottom:3px solid #f60;}
#featuredStory h3 {margin:0 0 0 0; padding:10px 0; font-size:1.9em; font-weight:normal; color:#000;}
#featuredStory img {float:right; margin:-1px 0 0 16px; border:2px solid #666;}
#featuredStory img.authorImg {float:left; margin:0; border:0;}
#featuredStory p.description {display:block; margin-top: 1em;}
#featuredStory p.comments {max-width:210px;}

#featured2 {clear:both; margin-top:5px; background:#f5f5f5 url('images/feature_bg.gif') bottom left repeat-x; overflow:auto;}
#featured2 .story {clear:none; float:left; width:200px; margin:5px 0 5px 20px; padding:10px; overflow:none;}
#featured2 .first {margin-left:0;}
#featured2 .story img {float:none; margin:0; border:1px solid #666;}
#featured2 .story h3 {margin-left:0; font-size:1.3em; font-weight:bold; color:#000;}
#featured2 .story p {margin-left:0;}
#featured2 .story p.author {margin-top:-4px;}
#featured2 p.description, #hotTopics p.description, #recentStories p.description {display:none;}

#hotTopics, #recentStories, #soapbox, #elsewhere {margin:10px 0 30px 0;}

#soapbox {}
#soapbox p {margin-bottom:2em; text-indent:20px; color:#666; background:url('images/quote_left.gif') top left no-repeat;}
#soapbox p em {padding-right:20px; font-size:1.2em; font-family:Georgia,Times,'Times NewRoman',serif; color:#000; background:url('images/quote_right.gif') bottom right no-repeat;}
#soapbox p span.handle {text-transform:uppercase;}

#elsewhere h3 {margin:1em 0 1em 0; padding-bottom:6px; font-size:1.0em; text-transform:uppercase; border-bottom:7px solid #ebebeb;}
#elsewhere p {margin-bottom:2em;}
#elsewhere p a, #elsewhere p a:link, #elsewhere p a:visited {color:#666; padding-right:15px; background:url('images/external.gif') center right no-repeat;}

div.columnists 	{width:340px; margin-top:10px;}
div.blogs 		{width:340px; margin-top:10px; margin-left:20px;}


/* ---------------------------------------------- */
/* Stories list page */

#storiesList {margin:10px 0; border-bottom:3px solid #f60;}
#storiesList h2 {border-bottom:3px solid #f60;}

#storiesList .story {}
#storiesList .story img {}
#storiesList .centreCol {width:190px; float:left; margin-left:20px;}
#storiesList .story h3 {margin-left:0; margin-top:5px;}
#storiesList .story p.comments {margin-left:0; }
#storiesList .story p.description {width:330px; margin-left:360px;}

/* find by date */
#findByDate {float:left; width:340px; margin:10px 0; overflow:auto;}
#findByDate h3 {margin:0 0 1em 0; padding:3px 5px; font-size:1.0em; text-transform:uppercase; color:#000; background:#f0f0f0;}
#findByDate h4 {clear:both; margin:0 0 5px 0; padding:4px 5px; font-size:1.0em; color:#f60;}
#findByDate ul {clear:both;}
#findByDate li {margin:0 0 5px 0; padding:0; font-size:0.92em;}
#findByDate li a {display:block; padding:2px 3px; text-decoration:none; color:#000; background:url('images/button_bg.gif') bottom left repeat-x; border: 1px solid #999; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
#findByDate li a:hover {background:#ddd;}

#dateFortnight {float:left; width:160px;}
#dateMonths {float:left; width:160px; margin-left:20px;}
#findByDate .monthList li {float:left; margin-right:12px;}
#findByDate .monthList li a {width:2.6em;}

/* find by subject */
#findBySubject {float:left; width:340px; margin:10px 0 10px 20px;}
#findBySubject ul {}
#findBySubject li {margin:2px 0; padding-left:13px; background:url('images/li_bg.gif') center left no-repeat;}

/* find by contributor */
#contributorsAZ, .contributorsAZ {clear:both; margin:10px 0; padding:10px 0;}
ul.contributorsList {overflow:auto; text-align:justify;}
ul.contributorsList li {float:left; margin:0; padding:0;}
ul.contributorsList li a {display:block; width:1.7em; margin:0 1px 2px 0; padding:1px 1px 1px 1px; text-align:center; text-decoration:none; color:#000; background:url('images/button_bg.gif') bottom left repeat-x; border: 1px solid #999; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
ul.contributorsList li a:hover {background:#ccc;}
ul.contributorsList li a.active {background:#ccc;}


/* ---------------------------------------------- */
/* Contributors pages */

body.contributors .story {}
body.contributors .story img {}
body.contributors .centreCol {width:220px; float:left; margin-left:16px;}
body.contributors .story h3 {margin-left:0;}
body.contributors .story p.comments {margin-left:0; }
body.contributors .story p.description {margin-left:0; margin-top:5px;}
body.contributors .story h4 {width:340px; margin-left:360px; margin-top:0;}
body.contributors .story ul {width:300px; margin-left:360px;}
body.contributors .story li {padding-left:10px; background:url('images/more_bg.gif') 0px 3px no-repeat; }


/* ---------------------------------------------- */
/* Story pages */

body.story_page #featuredStory, body.bio_page #featuredStory {min-height:120px; margin-bottom:1em; padding-bottom:1em; background:url('images/feature_bg2.gif') bottom left repeat-x;}
body.story_page #featuredStory img.featureImg {}
body.story_page #featuredStory h3 {margin-top:0; padding-top:0;}
body.story_page #featuredStory p {margin-top:10px;}
body.story_page #featuredStory p.comments {margin-top:0; margin-left:0;}

/* sharing links */
#mainContent ul#sharing_links {position:relative; clear:left; margin-left:110px; padding-top:1em; padding-bottom:2em; font-size:0.92em;}
#mainContent ul#sharing_links li {float:left; padding:0; background:none;}
#mainContent #sharing_links a.button {float:left;}
#mainContent #sharing_links a.button span {display:block; width:130px;}
#mainContent #sharing_links a.button.email span {padding-left:30px; background:url('images/button_email_bg_left.gif') center left no-repeat;}
#mainContent #sharing_links a.button.share span {padding-left:30px; background:url('images/button_share_bg_left.gif') center left no-repeat;}
#mainContent #sharing_links a.button.printf span {padding-left:30px; background:url('images/button_print_bg_left.gif') center left no-repeat;}

/* social bookmarking links */
#social_bookmarking {position:absolute; top:-13em; left:70px; width:25em; overflow:auto; padding:1em; background:#fff; border:4px solid #ccc;}
#social_bookmarking li {float:left; width:10em; margin:0.5em 1em;}
#social_bookmarking li img {float:none; margin:0 5px 0 0; vertical-align:text-top; border:0;}
#social_bookmarking li.close {position:absolute; width:1.5em; top:-0.6em; right:-0.95em; font-size:1.25em; text-align:center; background:#ccc;}
#social_bookmarking li a:hover {text-decoration:none; color:#f60;}

/* comments */
p#houseRules {width:10em; float:right; text-align:right; font-size:0.92em; margin-right:1em; margin-top:0.5em;}
div#comments {clear:both;}
div#comments h2 {padding-bottom:1em; border-bottom:3px solid #d6d6d6;}
div#comments h2 span {color:#f60; margin-right:auto;}
div#comments h3 {font-size:1.0em; color:#666;}
div#comments ul li {padding-top:0.7em;}
div#comments ul li ul {border-left:0;}
div#comments ul li p.date {font-size:0.92em;}
div#comments p.links a, div#comments p.links a:link {padding-right:25px; padding-left:7px; font-weight:bold; color:#333; background:url('images/arrow_small.gif') center left no-repeat;}
div#comments p.links a:visited {color:#333;}

#commentNumbersTable {border-collapse:collapse;}
#commentNumbersTable tr:nth-child(odd) {background-color:#eee;}
#commentNumbersTable tr:nth-child(even) {background-color:#fff;}
#commentNumbersTable th, #commentNumbersTable td {padding:3px 5px; border:1px solid #eee;}
#commentNumbersTable col.comments {width:140px; white-space:nowrap;}
#commentNumbersTable td p.comments {margin:0; font-size:1.0em; line-height:1.2; white-space:nowrap;}
#commentNumbersTable td p.comments a {padding-left:0; background:none;}
#commentNumbersTable td p.comments a span {color:#f60; font-weight:bold;}


/* ---------------------------------------------- */
/* wide page - Nolan */

body.widePage .columns3 {width:285px; float:left; margin:10px 0 10px 30px;}
body.widePage .newRow {clear:both; margin:10px 0 10px 11px;}
body.widePage .columns3 img {margin:0;}
body.widePage #mainContent .columns3 p {margin:4px 0 4px 0; line-height:1.5em;}
body.widePage .columns3 p.caption {font-style:italic; text-align:center;}
