/* ------ NOTES -----------------------------------------
 
 NC Skin CSS template
 Version: 0.4
 Dependencies: reset.css, base.css, brand.css
 N.B. "spot" is on white, "offset" is on black
 
------------------------------------------------------ */

/* Borders */
#PrimaryContent a.tab.selected,
#PrimaryContent .tabContent,
#relatedBrandLinks li,
body div#EpisodeGuideList,
body div#SeriesList h2,
div#clipsContainer,
div#clipsContainer ul#clipsList li h3,
body#clipDetail #clipContainer ul.links li,
div#newsAndArticles,
.mainContent,
.episodeLink,
#ArticleList .articles {
    border-color: #1b855d;
}

ul.jumpPoints li a,
div#SeriesSummary ul.jumpPoints li a,
div#SeriesList ul.jumpPoints li a,
div#EpisodeGuideList ul.jumpPoints li a,
div#EpisodeList li ul.jumpPoints li a,
div#clipContainer ul.jumpPoints li a,
div#EpisodeSummary ul.jumpPoints li a,
body#categoryPage ul.jumpPoints li a,
body#pictureDetail ul.jumpPoints li a {
	background-color: #1b855d;
}

.jumpLinks li.dropdown ul li.selected a,
.jumpLinks li.dropdown ul li a:hover,
.jumpLinks li.dropdown ul li a:focus,
.jumpLinks li.dropdown ul li a:active {
	border-bottom-color: #1b855d;
}

/* Typography */
a:focus,
a:hover,
a:active,
div#clipsContainer ul#clipsList li h3 a:hover,
div#newsAndArticles li h4 a,
div#newsAndArticles li h4 a,
.flashPrimaryColor,
h1#background,
#announcement p,
div#BM_episodeGuide li h5 a:focus, 
div#BM_episodeGuide li h5 a:hover, 
div#BM_episodeGuide li h5 a:active,
#Category h3.tabHeading,
#comments #listComments ol li div.line span.username a,
#comments div#postCommentThanks div.postCommentBody p a,
#comments .formrow a
{
    color: #1b855d;
}

.flashSecondaryColor {
	color: #1b855d;
}

/* Backgrounds */
a.tab.selected,
#catchUpEpisodes a.tab,
div#QuickLinks ul,
div#QuickLinks ul li a span,
#CastAndCrew h3,
#EpisodeMusic h3,
.tabContent h4,
div#clipsContainer h2,
#TxInfo,
#relatedLinksList,
div#clipsContainer ul#clipsList li .clipsInfo .playClip,
body#articleLanding #FeaturedArticle h3 a,
#announcement,
.pagination li.active span,
.pagination a:focus,
.pagination a:hover,
.pagination a:active,
body#catchUp .playLink,
div#EpisodeList li h3, 
div#BM_episodeGuide li h5,
.relatedContentModule h2,
a.arrowLink,
h3.arrowLink a,
.contentModule a.arrowLink,
.contentModule a.arrowLink:focus,
.contentModule a.arrowLink:hover,
.contentModule a.arrowLink:active,
.contentModule a.arrowLink span,
div#PrimaryContent h2.subHeader,
#SecondaryContent .relatedContent .contentModule,
.jumpLinks li.dropdown ul li.selected a,
.jumpLinks li.dropdown ul li a:hover,
.jumpLinks li.dropdown ul li a:focus,
.jumpLinks li.dropdown ul li a:active,
#SecondaryContent .contentModule,
.invert-colour a.arrowLink:hover,
.invert-colour a.arrowLink:focus,
.invert-colour a.arrowLink:active,
.invert-colour a.arrowLink:hover span,
.invert-colour a.arrowLink:focus span,
.invert-colour a.arrowLink:active span
{
	background-color: #1b855d;
}

h1#foreground,
#pictureGallery .jumpLinks li.dropdown ul li a:hover,
#pictureGallery .jumpLinks li.dropdown ul li a:focus,
#pictureGallery .jumpLinks li.dropdown ul li a:active,
body#articleLanding #FeaturedArticle h3 a,
body.skin-blackwhite .pagination li a:focus,
body.skin-blackwhite .pagination li a:hover,
body.skin-blackwhite .pagination li a:active,
body.skin-blackwhite .pagination li.active span,
a.arrowLink:focus span,
a.arrowLink:hover span,
a.arrowLink:active span,
body.skin-blackwhite .contentModule .bodyLink, 
body.skin-blackwhite .contentModule .bodyLink:hover,
body.skin-blackwhite .contentModule .bodyLink:active,
body.skin-blackwhite .contentModule .bodyLink:visited,
body.skin-green .contentModule .bodyLink, 
body.skin-green .contentModule .bodyLink:hover,
body.skin-green .contentModule .bodyLink:active,
body.skin-green .contentModule .bodyLink:visited,
body.skin-purple .contentModule .bodyLink, 
body.skin-purple .contentModule .bodyLink:hover,
body.skin-purple .contentModule .bodyLink:active,
body.skin-purple .contentModule .bodyLink:visited, 
body.invert-skin #ArticleList #FeaturedArticle h3 a:focus,
body#articleLanding #FeaturedArticle h3 a:focus,
body.invert-skin #SecondaryContent .nonSkinContentModule  p a,
.invert-colour a.arrowLink span
{
    color: white;
}

/* INVERTED SKINS */

body.invert-skin h1#foreground,
body.invert-skin #ArticleList #FeaturedArticle h3 a,
body.invert-skin .pagination li a,
body.invert-skin .pagination li a:focus,
body.invert-skin .pagination li a:hover,
body.invert-skin .pagination li a:active,
body.invert-skin .pagination li.active span,
body.invert-skin #EpisodeMusic h3,
body.invert-skin .contentModule .bodyLink:hover,
body.invert-skin .contentModule .bodyLink:active,
body.invert-skin .contentModule .bodyLink:visited,
body.invert-skin #comments #listComments ol li div.line span.username a,
#comments div#postCommentThanks div.postCommentBody p a,
body.invert-skin #comments .formrow a,
body.invert-skin #PrimaryContent .titleBar h2, 
body.invert-skin #Category h3.tabHeading,
body.invert-skin .jumpLinks li.dropdown ul li.selected a,
body.invert-skin .jumpLinks li.dropdown ul li a:hover,
body.invert-skin .jumpLinks li.dropdown ul li a:focus,
body.invert-skin .jumpLinks li.dropdown ul li a:active,
ul.lgIcn li a:focus,
ul.lgIcn li a:hover,
ul.lgIcn li a:active,
body.invert-skin .relatedContentModule h2,
body.invert-skin div#PrimaryContent h2.subHeader ,
body.invert-skin #announcement p,
body.invert-skin #SecondaryContent .contentModule ,
body.invert-skin .invert-colour a.arrowLink:hover span,
body.invert-skin .invert-colour a.arrowLink:focus span,
body.invert-skin .invert-colour a.arrowLink:active span
{
 	color: black;
}

body.invert-skin #SecondaryContent .nonSkinContentModule{ /* must come after color:black rule, is an override */
	color:white;
}

/* Displaced images that are within the arrowLink need transparent background */
div#EpisodeGuideList .info-teaser a.arrowLink .displace, 
div#EpisodeGuideList .info-teaser a.arrowLink .displace,
.nonSkinContentModule a.arrowLink,
.nonSkinContentModule a.arrowLink:focus,
.nonSkinContentModule a.arrowLink:hover,
.nonSkinContentModule a.arrowLink:active {
	background-color: transparent;	
}

/* "Get More" arrow links added separately as the colours are different */
body#articleLanding #FeaturedArticle h3 a:focus,
#moreShowInfo .tabContent a.arrowLink span,
.nonSkinContentModule a.arrowLink span {
	background-color:black;
}

#moreShowInfo .tabContent a.arrowLink span {
	padding:1px 4px;
}

body.skin-blackwhite #ArticleList #FeaturedArticle h3 a:focus,
body.skin-blackwhite div#QuickLinks ul li a:focus span, 
div#QuickLinks ul li.active a:focus span,
body.invert-skin div#QuickLinks ul li.active a:focus span,
#moreShowInfo .tabContent a.arrowLink:focus span,
#moreShowInfo .tabContent a.arrowLink:hover span,
#moreShowInfo .tabContent a.arrowLink:active span,
.nonSkinContentModule a.arrowLink span:hover,
.nonSkinContentModule a.arrowLink span:focus,
.nonSkinContentModule a.arrowLink span:active,
body.invert-skin  .nonSkinContentModule a.arrowLink span:hover,
body.invert-skin  .nonSkinContentModule a.arrowLink span:focus,
body.invert-skin  .nonSkinContentModule a.arrowLink span:active {
	background-color:white;
	color:black;
}

/* Comments links that on inverted skin pages need to be underlined to show they're links */
body.invert-skin #comments #listComments ol li div.line span.username a,
#comments div#postCommentThanks div.postCommentBody p a,
body.invert-skin #comments .formrow a {
	text-decoration:underline;
}
.invert-colour,
.invert-colour a.arrowLink span{
	background-color:black;
	color:white;
}