/* Base skin Essential Baby (low vision) - $Revision: 7230 $ $Date: 2010-02-08 10:18:38 +1100 (Mon, 08 Feb 2010) $ $Author: jkorff $ */
/*
 ____  _    _        ____ ____ ____
/ ___|| | _(_)_ __  / ___/ ___/ ___|
\___ \| |/ / | '_ \| |   \___ \___ \
 ___) |   <| | | | | |___ ___) |__) |
|____/|_|\_\_|_| |_|\____|____/____/  for Essential Baby skin. High contrast version.
Fairfax Digital CSS framework

Author:    Jens Korff
Born:      August 2008
Modified:  Update in first line
-----------------------------------------------------------------------------------------
NOTES:
		- This are low vision amendments to the base skin.

Colour scheme:
--------------
dark link color:	#007cc3 (dark blue)
bright link color:	#f93 (orange)
dark bg color:		#000000 (black)
light bg color:		#777777 (dark grey)
font colour:		#ffffff {white)
*/

/* --------------------------------------------------------------------------------------
   =Global
   -------------------------------------------------------------------------------------- */
html {background-color:#000}
body {color:#fff;font:160%/1.4 Arial, Helvetica, sans-serif;background:#000 none}
/* Bright blue link colour: */
a {color:#f93!important}
a:hover {color:#fff!important}
p,dl,small,em,strong,cite,span {color:#fff!important}

/* Accessibility: Make focused element clearly visible: */
html body a:focus,html body .smh a:focus,html body .theage a:focus,html body .watoday a:focus,html body .brisbanetimes a:focus
	{background-color:#ff0!important;color:#000!important}


/* --------------------------------------------------------------------------------------
   =Layout: Reduce to one column only
   -------------------------------------------------------------------------------------- */
.wrap {background-color:#000}
#content {width:100%}
	#content > div {width:100%}
	#content > h2 {width:100%;padding:0}
	/* ----- IE fixes ----- */
	* html #content div {width:100%}
	* html #content h2 {width:100%;padding:0}
	* html #content .sidebar {width:100%}
.aside {width:100%}


/* --------------------------------------------------------------------------------------
   =Headings and header components
   -------------------------------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 {color:#fff!important}
.cT-mediaTypeHeading {color:#fff;border-width:5px}
.cN-headingPage .ad {top:auto;bottom:0/* Cater for possible text wraps and put ad in bottom-right rather than top-right corner. */}
.cN-headerRich,.aside .cN-headerRich {background-color:#000;border-width:5px}


/* --------------------------------------------------------------------------------------
   =Network strip top (network-wide static component)
   -------------------------------------------------------------------------------------- */
.nN-whiteStrip {height:auto;border-bottom:5px solid #999;font-size:100%;background-color:#000}
	.nN-whiteStrip a:link,.nN-whiteStrip a:visited {color:#fff}
	.nN-whiteStrip a:hover,.nN-whiteStrip a:active {text-decoration:underline}
	.nN-whiteStrip .links {width:auto}
	.nN-whiteStrip li {border-width:5px}
	.nN-whiteStrip .memberCentre li {background:#707070 none}


/* --------------------------------------------------------------------------------------
   =Header
   -------------------------------------------------------------------------------------- */
.header {background-color:#000;border-bottom:5px solid #ccc}
	.header h1 {background-color:#000}

.mT-headerMultimedia h1 {height:auto;width:auto}
	.mT-headerMultimedia h1 a {height:auto;width:auto}

/* Let dropdowns assume natural position and width: */
#nav {height:auto;background:none!important;border:5px solid #f93}
#nav:after {/*apply cfix:*/content:".";display:block;height:0;clear:both;visibility:hidden;font-size:0}
	#nav.hasSubNav {padding:0}
	#nav.hasSubNav li.selected a{background-color:#666}
	#nav.hasSubNav li.selected a:hover{color:#000!important}
	#nav a:hover{color:#fff!important}
	#nav li {border-right:5px solid #fff}
	#nav li.selected {width:100%}
	#nav li ul {top:auto}
	#nav ul li a {width:11em;color:#fff!important}
	/* Avoid hiding nav with subnav: */
	#nav ol {position:static;float:left;height:auto;background-color:#666}
	#nav ol li {border:0}
	#nav .selected ol a {position:static;background-image:none;border-right:5px solid #666;white-space:pre}
	#nav .selected ol a:hover {color:#007cc3!important}
	#nav .selected ol .last a {border-right:0}
	#nav .hasDropdown {background:transparent url(img/sprite-base-skin-smh-low-vision.gif) no-repeat 101% 8px;padding-right:1.4em}
	/* ----- IE fixes ----- */
	* html #nav {height:1%}
	*+ html #nav {height:1%}

/* Sponsor */
.promo-learning #nav .sponsor-1 {position:absolute;right:0;top:0}

	/* Breadcrumb */
	.breadcrumb {height:auto;line-height:1.8}
		.breadcrumb a {color:#fff!important}

	/* Alternative formats */
	.altFormats {clear:right;height:auto}
		.altFormats li {background:none}
		.altFormats a {color:#fff!important}


/* --------------------------------------------------------------------------------------
   =Images
   -------------------------------------------------------------------------------------- */
.cT-imageLandscape p,.cT-imagePortrait p,.cT-imageMultimedia p,.cT-imageMultimedia h4 {background-color:#000;border:5px solid #ccc}
.cT-imageGallerySnapshot p {background-color:#000;border:5px solid #ccc;border-bottom-width:0}
.cT-imageGallerySnapshot ul {background-color:#000;border:5px solid #ccc;border-top-width:0}

/* Overlays ("More photos" or "Play video" icons)
   Icon scheme:
   x-coords: photos:0, photos hover:116, play:230, play hover:344
   y-coords: smallest:0, small:26, medium:56, large: 92
*/
	/* Default image: For .cN-storyHeadlineLead img, 32x92 px: medium icon */
	.play-video span, .more-photos span {height:32px;width:92px;background:transparent url('img/sprite-base-skin-news-low-vision.gif') no-repeat 0 -56px}
	.play-video span {background-position:-230px -56px}
	.more-photos:hover span {background-position:-116px -56px}
	.play-video:hover span {background-position:-344px -56px}
	/* span-5: small icon */
	.span-5 .more-photos span,.span-5 .play-video span {height:25px;width:67px}
	.span-5 .more-photos span {background-position:0 -26px}
	.span-5 .more-photos:hover span {background-position:-116px -26px}
	.span-5 .play-video span {background-position:-230px -26px}
	.span-5 .play-video:hover span {background-position:-344px -26px}
	/* span-8: large icon */
	.span-8 .more-photos span,.span-8 .play-video span {height:44px;width:111px}
	.span-8 .more-photos span {background-position:0 -92px}
	.span-8 .more-photos:hover span {background-position:-116px -92px}
	.span-8 .play-video span {background-position:-230px -92px}
	.span-8 .play-video:hover span {background-position:-344px -92px}
	/* span-11: large icon */
	.span-11 .more-photos span,.span-11 .play-video span {height:44px;width:111px}
	.span-11 .more-photos span {background-position:0 -92px}
	.span-11 .more-photos:hover span {background-position:-116px -92px}
	.span-11 .play-video span {background-position:-230px -92px}
	.span-11 .play-video:hover span {background-position:-344px -92px}
	/* span-11 & cN-relatedCoverage: medium icon */
	.span-11.cN-relatedCoverage .more-photos span,.span-11.cN-relatedCoverage .play-video span {height:32px;width:92px}
	.span-11.cN-relatedCoverage .more-photos span {background-position:0 -56px}
	.span-11.cN-relatedCoverage .more-photos:hover span {background-position:-116px -56px}
	.span-11.cN-relatedCoverage .play-video span {background-position:-230px -56px}
	.span-11.cN-relatedCoverage .play-video:hover span {background-position:-344px -56px}


/* --------------------------------------------------------------------------------------
   =Multimedia
   -------------------------------------------------------------------------------------- */
.cN-multimediaGroup {border-bottom:5px solid #ccc}
	.cN-multimediaGroup li {width:100%}
	.cN-multimediaGroup .cN-tabBox {padding-top:1.5em}
	.cN-multimediaGroup .cN-tabBox h4 a {background-image:none}
	.cN-multimediaGroup .last {margin-right:6px}
	.cN-multimediaGroup div li {width:15%;min-height:11em;height:auto}


/* --------------------------------------------------------------------------------------
   =Article
   -------------------------------------------------------------------------------------- */
.cT-callToAction {border:5px solid #ccc}

.statement {border-bottom:5px solid #ccc}

.cN-relatedCoverage {border-width:5px;padding:0;width:100%}
	.cN-relatedCoverage h3 {float:none;margin:0 0 .5em}
	.cN-relatedCoverage .cN-story, .cN-relatedCoverage .cN-storyImageLead, .cN-todayInSection .cN-story {border-bottom:0}
	.cN-relatedCoverage .cN-story cite,.cN-relatedCoverage cite,.cN-todayInSection .cN-story cite {background-image:none;border-right:5px solid #ccc}

.cN-todayInSection {border-top:5px solid #ccc;padding:0;width:100%}

.cN-otherWebLinks {border-width:5px;padding:0;width:100%}
	.cN-otherWebLinks h3 {margin:0;float:none}
	.cN-otherWebLinks li {color:#fff;border-width:5px}

.cT-reviewDetails {border-width:5px}

.cN-storyCommentLatest {border-width:5px}

.cT-relatedCoverageContentPage, .cN-todayInSection {border-width:5px;width:100%;padding:0}


/* --------------------------------------------------------------------------------------
   =Comments
   -------------------------------------------------------------------------------------- */
.cT-comments h3 {border-top:5px solid #fff}
	.cT-comments h3 + p {border-width:5px}
	.cT-comments blockquote {border-top:5px solid #ccc}
	.cT-comments blockquote cite {background:none;padding:0}
	.cT-comments blockquote cite:before {content:"Posted by: "}
	.cT-comments form {background:#000}

.cT-socialCommenting p {border-width:5px}
	.cT-socialCommenting ul.show,.cT-socialCommenting ol.show {background:#000 none;border:5px solid #ccc;left:50%;width:350px;height:auto}
	.cT-socialCommenting ul li {background:transparent none}
	.cT-socialCommenting ol.show {left:20px;width:90%}
	.cT-socialCommenting ol li {color:#fff}
	.cT-socialCommenting ol li em {position:static}
	.cT-socialCommenting ol li em:before {content:"("}
	.cT-socialCommenting ol li span {background-image:none;position:static;text-indent:0}
	.cT-socialCommenting ol li span:after {content:")"}


/* --------------------------------------------------------------------------------------
   =Story components
   -------------------------------------------------------------------------------------- */
/* Story common styles */
	.cN-storyImageLead cite,.cN-storyHeadlineLead cite {background-image:none;border-right:5px solid #ccc}
	.media-image .wof {position:static;background-color:#000;border:5px solid #777}
	.comments span {width:auto;height:1.1em;background:#000 none;color:#000!important}

/* cT-storyTools */
.cT-storyTools {border-width:5px}
	.cT-storyTools li {border-width:0}
	.cT-storyTools a {padding-left:25px;background:transparent url('img/sprite-base-skin-news-low-vision.gif') no-repeat -700px 0}
	.cT-storyTools .email a {background-position:-620px -100px}
	.cT-storyTools .print a {background-position:-596px -122px}

.cT-storyDetails .single {border-left:5px solid #ccc}
	.publication {height:auto}

.cN-story,.cN-storyImageLead,.cN-storyHeadlineLead {border-top:5px solid #ccc;padding-top:.5em}

.cN-storyHeadlineOnly {border-top:5px solid #ccc;border-bottom:0;padding-top:.5em}

.cT-disclaimer {border-width:5px}

/* cN-storyHeadlineLead: star rating (e.g. in Drive skin) */
.star {border-bottom:none}
	.star small {display:none}
	.star cite {border:0;height:auto;width:auto;text-indent:0;margin:0}


/* --------------------------------------------------------------------------------------
   =Straps
   -------------------------------------------------------------------------------------- */
.cT-strapFeature .media-image, .cT-strapFeature .media-video {width:100%}
.cT-strapHeading {border-width:5px;color:#fff}
.cT-strapHeading span {top:auto;bottom:0}
	.cT-strapHeading span a {color:#6fc3f4;background:none;border-right:5px solid #ccc}
	.cT-strapHeading span a.last {border:0}
.cT-strapFeature h2 a {color:#fff}
	.cT-strapFeature .storyColumn {width:100%}
	.cT-strapFeature .storyFirst {border-bottom:0}
.cT-strapMagazine div {width:100%}
.cT-strapMediaTypes div {width:100%}


/* --------------------------------------------------------------------------------------
   =Tabulator components
   -------------------------------------------------------------------------------------- */
/* cN-tabBox */
/* Lots of 'important' styles here to override instances of cN-tabBox which have additional classes. */
.cN-tabBox{width:auto!important}
.cN-tabBox div {width:auto;height:auto;border:5px solid #ccc!important;background:transparent none!important}
	.cN-tabBox h4 {width:auto!important;height:auto!important;background-image:none!important;text-indent:0}
	.cN-tabBox h4 a {background:transparent none;text-indent:0;color:#fff!important;padding:10px}
	.aside .cN-tabBox div {width:99%;height:auto}
	.aside .cN-tabBox div div {background-color:transparent}
	.aside .cN-tabBox .fdVideoWof {background-color:#000}
	.cN-tabBox h3 {color:#fff!important;background:none!important}
	.cN-tabBox .tab2 h4 {left:25%!important}
	.cN-tabBox .tab3 h4 {left:50%!important}
	.cN-tabBox .tab4 h4 {left:75%!important}
	.cN-tabBox label {color:#fff!important;width:auto!important}
	.cN-tabBox select,.cN-tabBox input {width:auto!important;height:auto!important;font-size:1em!important;background-image:none!important}
	.cN-tabBox li{background:none!important;padding-top:20px!important}
	.cN-tabBox blockquote{background:none!important}
	.tab2 .more, .tab3 .more, .tab4 .more {background:none!important;border-top:none!important}

/* --------------------------------------------------------------------------------------
   =Pagination
   -------------------------------------------------------------------------------------- */
.cN-pagination .prev a {background:none}
	.cN-pagination .next a {background:none}
	.cN-pagination .page, .cN-pagination .prev, .cN-pagination .next {border:5px solid #ccc}


/* --------------------------------------------------------------------------------------
   =Forms
   -------------------------------------------------------------------------------------- */
	input {font-size:1em}
	/* Comment form */
	#makeComment {background-color:#000}
	#makeComment h4 {border-width:5px;background-color:#000}
	.cT-comments textarea {font-size:100%}
	.securityCode img,.securityCode label {width:auto;height:auto}

/* --------------------------------------------------------------------------------------
   =Navigators
   -------------------------------------------------------------------------------------- */
.cT-refineGroups {width:12em}
	.cT-refineGroups h3 {background:none}
.cN-groupNavigator {border-top:5px solid #ccc}
	.cN-groupNavigator li {color:#fff}
	.cN-groupNavigator h4 {border:0}
	.cN-groupNavigator h4 a {color:#6fc3f4}
	.cN-groupNavigator h4 span {background:none}
	.cN-groupNavigator.open h4 span {background:none;text-indent:0;width:3.7em;overflow:hidden;white-space:nowrap}
	.cN-groupNavigator.open h4 span:before {content:'Collapse  '}
	/* ----- IE fixes ----- */
	* html .cN-groupNavigator.open h4 span {text-indent:-9000px}
	*+ html .cN-groupNavigator.open h4 span {text-indent:-9000px}

.cT-linkArchive {border-width:5px;background-color:#777}
.cT-linkWebSearch {background-color:#777}
.cN-navigatorDateOption li {background-color:#000}


/* --------------------------------------------------------------------------------------
   =Search
   -------------------------------------------------------------------------------------- */
.cN-searchBox {clear:both}
	.cN-searchBox form {position:static;float:none;width:auto;height:auto;background:transparent none}
	.cN-searchBox form h2 {position:static;font:normal 1em Arial, Helvetica, sans-serif}
	.cN-searchBox label input {height:auto;width:auto;background:#fff none}
	.ddown,.cN-searchBox .open,.ddown ul {width:150px;height:auto;background:#000 none}
		.ddown ul {top:25px;border:5px solid #ccc;width:250px}
		.ddown .selected {width:auto;border:5px solid #ccc}
		.header form {margin-bottom:30px}
		.btnSubmit {position:absolute!important;font-size:100%;background:none;width:auto;height:auto;color:#fff;left:300px;background-color:#f93}

.cN-indicatorResults {color:#fff}

.cT-sortOptions {color:#fff}

.cT-matchingSections {border-width:5px}
	.cT-matchingSections h3,.cT-matchingSections dl {background-color:#000}
	.cT-matchingSections a {color:#007cc3}

.cT-searchResult {border-top:5px solid #ccc}
	.cT-searchResult em {background-color:#777}


/* --------------------------------------------------------------------------------------
   =Site-specific components
   -------------------------------------------------------------------------------------- */
.cS-latestVideo h3 {border-width:5px}
	.cS-latestVideo li {width:30%}
	.fdVideoWof {background-color:#777}

.cS-breakingNews h3 {border-top:5px solid #f00;color:#f00}

.cS-latestArticlesVideos .articles li {color:#fff}

.cS-mostViewed h3 {border-width:5px}
	.cS-mostViewed li {color:#fff}

.cS-getQuotesCharts {background-color:#000;border-width:5px}
	.cS-getQuotesCharts label {color:#fff}

.cS-newsletter h3 {border-width:5px}

.cS-photoGalleryLinks {background:transparent none}
	.cS-photoGalleryLinks h3 {border-width:5px;border-color:#ccc}
	.cS-photoGalleryLinks ul {margin:0;padding:0;width:100%;background-color:transparent}
	.cS-photoGalleryLinks li {background:transparent none;height:250px;width:15%}
	.cS-photoGalleryLinks p a {height:auto;padding:0;position:static;display:inline}

/* Super Gallery (need to wrap styles in class 'cT-multimediaElement' since base gallery CSS comes after this CSS in HTML document) */
.cT-multimediaElement .gallery {width:100%;background:#000 none}
	.cT-multimediaElement .gallery h1 {font-size:1.6em!important;width:auto}
	.cT-multimediaElement .gallery li a {height:auto;background:transparent none}
	.cT-multimediaElement .gallery li.pages {background:transparent none}
	.cT-multimediaElement #imgWrapper {margin:0 auto}
	.cT-multimediaElement #imgWrapper #thumbnails {top:-32px;width:auto}
	.cT-multimediaElement .gallery p.caption {width:100%;bottom:52px}
	.cT-multimediaElement .gallery ul.options {background:transparent none;border-top:5px solid #fff}
	.cT-multimediaElement #autoplay a {padding-right:7px}
	.cT-multimediaElement ul.options li#autoplay {height:auto;width:325px;background:transparent none}
	.cT-multimediaElement #moreGalleries a,.cT-multimediaElement #emailAFriend a,.cT-multimediaElement #share a,.cT-multimediaElement #share {padding:3px 5px 0;background:transparent none}
	.cT-multimediaElement #share ul {width:auto;top:-115px;border:5px solid #fff}
	.cT-multimediaElement .aboutScreen {width:600px;height:180px;top:52px;left:126px;border:5px solid #fff}
	.cT-multimediaElement .aboutScreen a {width:120px;right:-516px;top:100px;background-image:none}
	.cT-multimediaElement .dialogue {width:650px;border:5px solid #fff;left:152px}
		.cT-multimediaElement .dialogue h3 {font-size:1em}
		.cT-multimediaElement .dialogue h3 span a {font-size:1.2em;background:transparent none}
		.cT-multimediaElement .dialogue ul.moreGalleries {width:100%}
		.cT-multimediaElement .moreGalleries li {width:50%;margin-bottom:1em}
		.cT-multimediaElement .dialogue ul.fRows {width:100%;margin:0}
		.cT-multimediaElement .dialogue ul.fRows li {width:100%}
		.cT-multimediaElement .dialogue label {width:250px}
		.cT-multimediaElement .dialogue .showEnd {width:560px}
		.cT-multimediaElement ul.showEnd li {margin:0 0 0 1em;font-size:2em;background:transparent none!important}
		.cT-multimediaElement .showEnd li a {width:auto;padding:0}
		.cT-multimediaElement .showEnd li.email a {background-image:none}
		#emailAFriendScreen {height:auto;top:60px}
		.cT-multimediaElement .moreGalleriesH4 {top:155px}

.cS-poll h3 {border-width:5px;border-color:#ccc;border-bottom:0}
	.cS-poll dd span {margin-right:-60px}
	.cS-poll .cT-disclaimer {border-width:5px}
	.cS-poll h4 {border:0}

/* [cS-tagCloud] Tag cloud */
.cS-tagCloud, .cS-tagCloud h3 {background:none}
	.cS-tagCloud .cloud, .cS-tagCloud .controller {display:none!important}  /* force tag cloud view to be hidden */
	.cS-tagCloud ol {display:block!important}  /* force list view to show */

/* Rotators */
.cS-storyImageLeadRotator .wof {width:100%}

/* [cS-latestArticles] latestForums */
.cS-latestArticles.latestForums{background:none;border:5px solid #fff}
.cS-latestArticles.latestForums h3{background:none}

.my-life .cT-strapHeading{height:2em}
.my-life .cN-storyImageLead .wof{position:relative;width:auto}

/* --------------------------------------------------------------------------------------
   =Footer
   -------------------------------------------------------------------------------------- */
.c5 .s1, .c5 .s2, .c5 .s3, .c5 .s4, .c5 .s5 {border-width:5px;border-left:5px solid #ccc/* User feedback: vertical lines help */;padding-left:5px}
	.c5 .s2, .c5 .s4 {margin:0 5px}
	.c5 h2 {font-size:120%;background:transparent}
	.c5 h2 a {color:#6fc3f4}
	.classifieds .puff {height:auto;min-height:140px}
	.classifieds .puff h5 {font-size:100%}
	.classifieds ul {border-top:0;font-size:100%}
	.classifieds li {color:#fff;margin-left:.7em}
	.classifieds li a {color:#6fc3f4!important;background:none;text-indent:0;height:auto}
	.classifieds li a:hover {color:#fff!important}
.top5 {background:#000 none}
	.top5 div {height:auto!important}
	.top5 h2 {border-top:5px solid #ccc;border-bottom:3px solid #ccc}
	.top5 h5 {font-size:100%;margin:0}
	.top5 li {color:#fff;font-size:100%}
	.top5 ol li a {color:#6fc3f4}
	.top5 div a {position:static;background:none;text-indent:0;height:auto;color:#6fc3f4}
/* Section links */
.fSectionLinks {border-width:5px;border-top:5px solid #ccc;font-size:100%}
	.fSectionLinks li {border-width:5px;padding-right:.5em;white-space:pre}
	.fSectionLinks li a {color:#6fc3f4}
	/* ----- IE fixes ----- */
	*+ html .fSectionLinks li {white-space:normal}

/* Masthead links */
.fMastheadLinks {font-size:100%}
.fMastheadLinks ul {width:100%}
	.fMastheadLinks li.first + li {border:0;padding:0}
	.fMastheadLinks li + li {display:inline;border-left:5px solid #ccc;padding-left:.4em;white-space:pre}
	.fMastheadLinks li.first {display:block;border:0;margin-top:1em}
	.fMastheadLinks li a {color:#6fc3f4}
	/* ----- IE fixes ----- */
	*+ html .fMastheadLinks li + li {white-space:normal}



/* --------------------------------------------------------------------------------------
   =Advertising
   -------------------------------------------------------------------------------------- */
.ad small {display:block}
.footer .ad {border-width:5px}
.cA-gutter {display:none}
.hasGutter-full .wrap {padding:0}

.ad small {background:none}