/* ---------- screen.css starts here ---------- */

	@import "base.css";
          /* ---------- icons.css starts here ---------- */
@media all {


div#promo div#finance-guides li.info
{ 
	background-image: url(images/i_icon.gif);
	background-position: left;
	text-indent: 17px;
}

li.print a

{
	background-image: url(images/printer.gif)
}

li.email a
{
	background-image: url(images/mail.gif)
}

li.save a
{
	background-image: url(images/printer.gif)
}

li.font-size a
{
	background-image: url(images/type.gif)
}

#relatedlinks h2.related-information
{
	background-image: url(images/icon_topics.gif);  
}

#gallery-series-navigation h3
{
	background-image: url(images/icon_textdoc.gif);  
}

p.jump-related
{
	background-image: url(images/jump_related_arrow.gif);
	background-position: 0% 5px;
	height: 22px;
}

#related #fact-box,
#related #article-trailblock h2.blog,
#related #article-trailblock h2.pictures,
#related #article-trailblock h2.audio,
#related #article-trailblock h2.interactive
{
	background-position: 0 3px;
}

#related #fact-box
{
	background-image: url(images/icon_textdoc.gif);
}

#related #article-trailblock h2.blog
{
	background-image: url(images/icon_textdoc.gif);
}


#related #article-trailblock h2.pictures
{
	background-image: url(images/icon_gallery.gif);
}

#related #article-trailblock h2.audio
{
	background-image: url(images/icon_audio.gif);
}

#related #article-trailblock h2.interactive
{
	background-image: url(images/icon_textdoc.gif);
}

#related #article-trailblock h2.localvideo,
#related div.more-videos h2
{
	background-image: url(images/icon_video.gif);
}

li#larger, a#larger
{
	padding: 0 5px 3px 30px;
	background-position: 12px 0;
	background-image: url(images/icon_textsize.gif);
}

ul.user-details
{
	padding: 2px 5px 3px 16px;
	background-image: url(images/icon_userinfo.gif);
}

ul#article-toolbox li a
{
	background-position: 3px 0;
}

body.cif ul#article-toolbox li a.printable
{
	background-image: url(images/icon_print.gif);
}

body.cif ul#article-toolbox li a#sharelink
{
	background-image: url(images/icon_share.gif)
}

body.cif ul#article-toolbox li a#clippable
{
	background-image: url(images/icon_clip.gif)
}

body.cif ul#article-toolbox li a#sendlink
{
	background-image: url(images/icon_email-friend.gif)
}

body.cif ul#article-toolbox li a#contactlink
{
	background-image: url(images/icon_email-us.gif)
}

body.cif ul#article-toolbox li a#historylink
{
	background-image: url(images/icon_history.gif)
}

body.cif #content ul#article-toolbox li a.save
{
	background-image: url(images/icon_save_for_later.gif)
}

body.cif a.comment-count-info,
body.cif span.comment-count-info
{
	background-image: url(images/icon_comment.gif);
	background-position: left center ;
	padding: 0 0 2px 20px;
	margin-top: 5px;
	display: block;
	clear: both;
}

body.cif div.full a.comment-count-info
{
	border-top: 1px dotted #ccc;
	padding-top: 4px;	
}

#content a.shower, #content a.showerstyle
{
	background-image: url(images/icon_triangle_right.gif);
	padding: 3px 0 2px 20px;
	background-position: -1px 0;
}

#content a.shower.open, #content a.showerstyle.open
{
	background-image: url(images/icon_triangle_down.gif);
	
}

a.shower, a.showerstyle
{
	background-image: url(images/icon_triangle12_right.gif);
	padding: 3px 0 2px 14px;
	background-position: 0 3px;
}

a.shower.open, a.showerstyle.open
{
	background-image: url(images/icon_triangle12_down.gif);
}


a.close
{
	padding: 0px 20px 3px 0px;
	background-position: 76px 0;
	background-image: url(images/icon_close.gif);
}


a.feed
{
	background-image: url(images/icon_rss.gif);
	padding-left: 18px;
	background-position: 0 0;
	padding-top: 1px
}

/*
Bullet images and icons

------------------------------------------------------------------------------*/
body.network #content ul.sublinks li.bullet,
body.network #content ul.sublinks li.localvideo,
body.vss #content ul.sublinks li.bullet,
li.bullet,
body.vss #content ul.sublinks li.localvideo,
li.factsheet
{
	background-position: 0px 1px;
	text-indent: 17px;
}

.video-front div#content div#video-player ul li.bullet,
ul.sublinks li.bullet
{
	background-image: url(images/icon_bullet.gif);
}

body.network #content ul.sublinks li.localvideo,
body.vss #content ul.sublinks li.localvideo
{
	background-image: url(images/icon_video.gif);
}

ul.sublinks li.audio
{
	background-image: url(images/icon_audio.gif);
}

ul.sublinks li.video
{
	background-image: url(images/icon_video.gif);
}

ul.sublinks li.interactive
{
	background-image: url(images/icon_multimedia.gif);
}

ul.sublinks li.gallery
{
	background-image: url(images/icon_gallery.gif);
}

body.network ul#reader-offers li.bullet
{
	text-indent: 0;
	background-image: none;
}

li.factsheet
{
	background-image: url(images/icon_factsheet.gif);
}

p.bullet
{
	background-image: url(images/icon_bullet.gif);
	background-position: 0px 1px;
	text-indent: 17px;
}

#top-table form
{
	background-image: url(images/knife-fork60.gif);
	background-position: 100% 5px;
}
}
          /* ----------  icons.css ends here ----------- */
          /* ----------  screen.css ends here ----------- */
          /* ---------- content-type-trailblock.css starts here ---------- */
/* Trail block and Packages */


div#article-vertical div.article-trailblock
{
	margin-bottom: 40px;
	padding-bottom: 12px;
	padding-left: 5px;
	padding-right: 5px;
}

div#section-contents div.package, 
div#section-contents div.package li.picture
{
	padding-left: 0;
	padding-right: 0;
}

div#section-contents div.package li.picture,
div#section-contents div.package li.package-headline h4
{
	border: none;
}

div#section-contents div.package li.package-headline h4
{
	padding-bottom: 0;
}

div#section-contents div.package li,
div#section-contents div.package li.picture p.linktext
{
	padding-left: 5px;
	padding-right: 5px;
}

div#related div.related-content div.last
{
	padding-bottom: 20px;
}

body.article div#article-vertical h2
{
	border-top: 1px solid;
	font-size: 1em;
	font-family: arial, sans-serif;
	font-weight: bold;
	margin-left: 0;
	padding-left: 0;
	padding-top: 3px;
	padding-bottom: 9px;
}

body.article div#article-vertical h2
{
	border-top: none;
}


body.article div#article-vertical h2.strap,
body.article div#article-vertical h2.major-heading
{
	padding-bottom: 0;
}


/*div.article-trailblock img
{
	position:relative; 
	left: -5px;
}*/


div.article-trailblock img.trail-icon
{
	margin-right: 0;
	vertical-align: top;
}

div.article-trailblock li
{
	border-top: 1px dotted;
	margin-top: 6px;
	padding-top: 3px;
}

div.article-trailblock li.first
{
	margin-top: 3px;
}

div.article-trailblock li.picture-in-trail
{
	padding-top: 0;
}

#section-contents div.article-trailblock li.first,
div.article-trailblock li.first,
#section-contents  div.article-trailblock li.picture-in-trail,
div.article-trailblock li.picture-in-trail,
#section-contents div.article-trailblock li.package-headline,
div.article-trailblock li.package-headline,
ul.package li.package-headline
{
	border-top: none;
}


ul.package
{
	border-bottom: 10px solid;
	margin-bottom: 20px;
}

ul.package li
{
	border-top: 1px dotted;
	padding-top: 5px;
	padding-bottom: 5px;
}

li.package-headline h4
{
	font-family: arial, serif;
	font-weight: bold;
	padding-bottom: 5px;
	padding-top: 5px;
}

div#related ul.package p
{
	margin-left: 0;
	padding-left: 0;
}

/* Trail block and Packages end */

/* Trail block for cartoons to be refactored as CS techdebt */

body.cartoon .article-trailblock
{
	width: 140px;
	float: left;
	margin-bottom: 10px;
	background-color: #ededed;
}

body.cartoon div.related-content .article-trailblock
{
	margin-left: 20px;
}

body.cartoon .article-trailblock li.first
{
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 10px;
}

body.cartoon .article-trailblock li.first h4,
body.cartoon #content .article-trailblock ul.trail li h2.strap
{
	font-family: arial, sans-serif;
	font-weight: bold;
}

body.cartoon h4.package-headline
{
	margin-bottom: 8px;
}

body.cartoon .article-trailblock li.picture
{
	border-top: none;
	margin-top: 0;
}

body.cartoon .article-trailblock li p,
body.cartoon #content .article-trailblock ul.trail li h2.strap
{
	margin-left: 5px;
	margin-right: 5px;
}

body.cartoon .article-trailblock li.normal p,
body.cartoon #content .article-trailblock ul.trail li.normal h2.strap
{
	margin: 0;
}

body.cartoon .article-trailblock li.normal
{
	margin: 0 5px;
}

body.cartoon .article-trailblock li p.picture
{
	margin-left: 0;
	margin-right: 0;
}

body.cartoon #content .article-trailblock ul.trail li h2.strap
{
	font-size: 1em;
	margin: 0 5px 0 5px;
	border-top: none;
	padding-top: 0;
}

body.cartoon .package-headline,
body.cartoon #content .package ul.trail li
{
	margin: 0;
}

body.cartoon #content .package ul.trail li.package-headline,
body.cartoon #content ul.trail li.first
{
	margin: 0 5px;
}

body.cartoon #content .package ul.trail li.package-headline
{
	margin: 0 5px;
}

body.cartoon #content .package ul.trail li p
{
	margin-bottom: 5px;
}

body.cartoon #content .package ul.trail li.picture p
{
	margin: 0;
}

body.cartoon #content .package ul.trail li.picture p.linktext
{
	margin: 0 5px 5px 5px;
}



          /* ----------  content-type-trailblock.css ends here ----------- */
          /* ---------- factbox.css starts here ---------- */
/* CSS for all factboxes, all of the time. If you make changes here, make sure you're not affecting something unexpected */

div#factbox
{
	background-color: #ededed;
	border-top: 1px solid;
	float: left;
	margin-right: 20px;
	overflow: visible;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 10px;
	position: relative;
	width: 130px;
	z-index: 1;
}

div#factbox b
{
	font-weight: bold;
}

div#factbox li.major-heading h4
{
	font-family: arial, sans-serif
}

div#wrapper div#factbox li
{
	border-top: 0;
	margin-bottom: 0;
	width: 130px;
}

div#wrapper div#factbox li.more
{
	border-top: 1px dotted #999;
	margin-top: 5px;
}

div#wrapper div#factbox li.picture
{
	padding-top: 10px;
	position: relative;
	left: -5px;
	width: 140px;
}

div#factbox li.inline
{
	display: inline;
}

div#wrapper div#factbox ul
{
	padding-left: 0;
}
          /* ----------  factbox.css ends here ----------- */
@media all {

body.cartoon #box .main-picture
{
	float: left;
	margin-right: 0;
	min-width: 460px;
	width: auto;
	border-top: 1px solid;
	margin-top: 0;
	margin-bottom: 20px;
}

#main-picture
{
	clear: left;
	float: left;
}

.credit
{
	float: left;
	width: 460px;
}

body.cartoon div.series-navigation h4
{
	padding-bottom: 6px;
}

body.cartoon div.series-navigation
{
	border-bottom: 1px solid;
	float:left; 
	width: 620px;
}

body.cartoon #promo .capsule
{
	float: none;
	width: auto
}

body.cartoon #promo ul.trail
{
	margin: 0;
}

body.cartoon #content div.navigation
{
	float:right;
	width: 140px;
}

body.cartoon #content div.navigation ul.trailblock li.normal
{
	border-top: none;
	margin-top: 0;
}

body.cartoon #content div.navigation ul.trailblock li.last
{
	margin-bottom: 5px;
}

#cartoon-info
{
	max-width: 620px;
	float: left;
}

body.cartoon ul.cartoon-attributes
{
	float: left;
	padding-top: 3px;
	padding-bottom: 10px;
}

body.cartoon ul.cartoon-attributes li
{
	display: inline;
	font-weight: normal;
}

body.cartoon ul.cartoon-attributes li.byline
{
	font-weight: bold;
}

.navigation #article-toolbox-side
{
	border-top: 1px solid;
	float: none;
	margin-bottom: 20px;
}

.navigation .send
{
	top: 0;
	margin-right: 0px;
}

.main-picture #article-toolbox-side
{
	float: right;
	padding-bottom: 10px;
}

.main-picture .send
{
	float: right;
	margin-right: 10px;
}

/* related content  to be made generic when refactored */
div.relatedlinks 
{
	float:left;
	width:140px;
	margin-bottom: 20px;
}

#box div.relatedlinks h3 
{
	border-top:1px dotted;
	margin-top:5px;
	padding-top:2px;
	font-family: arial, sans-serif;
	font-size: 1em;
}

#box div.relatedlinks h3.first
{
	border-top: 1px solid;
}

#content ul.relatedlinks-keywords li
{
	display: inline;
	margin-bottom: 0;
}

/* more on component to be made generic when refactored */
.navigation div.article-trailblock
{
	clear: left;
}

/* gallery navigation */
.gallery-navigation ul
{
	border-top: 1px dotted;
	padding-bottom: 0;
	float: left;
}

#content .gallery-navigation ul li
{
	display: inline;
	margin-bottom: 0;
}

.gallery-navigation ul.normal-cartoon
{
	width: 460px;
}

.gallery-navigation ul.large-cartoon
{
	width: 620px;
}

.gallery-navigation li img
{
	vertical-align: middle;
}

.gallery-navigation ul li.previous
{
	float: left;
}

.gallery-navigation ul li.next
{
	float: right;
}

.gallery-navigation ul li.index
{
	line-height: 1.8em;
}

/* related content to be take out when the real module is reactivated */

div.related-content
{
	float: left;
	width: 620px;
}

#box div.related-content div.relatedlinks h3.first 
{
	margin-top: 0;
}


div.related-content h3
{
	border-top: 10px solid;
	width: 620px;
	margin-bottom: 20px;
}

div.related-content div.relatedlinks h3
{
	width: 140px;
	margin-bottom: 0;
}

/* packages and associated trailblock is in content-type-trailblock.css */

}