/* ------ NOTES ---------------------------------------------------------------

Master Screen Style for Cassini, http://www.

--------- UPDATE INFO ---------------------------------------------------------

Last updated:
Last update made by: Josh Kunin (pixellab@gmail.com)

--------- CONTENTS ------------------------------------------------------------

1: BODY AND UNIVERSAL RESET
2: GLOBAL NAVIGATION
	a) Top navigation
	b) Sidebar navigation
3: PAGE STRUCTURE
	a) Contianers
	b) Header
	c) Main content
	d) Footer
4: SECTION SPECIFIC STYLES
	a) Home page
	b) Section page
5: LISTS
6: FORMS & TABLES
	a) Standard forms
	b) Forms on Edit list page
	c) Tables for forms
7: GLOBALS
	a) Links
	b) Typography
8: MISC

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




/* 1: BODY AND UNIVERSAL RESET
============================================================================ */
body  {
	font: 12px Helvetica, Arial, sans-serif;
	background: #000000;
	margin: 0;
	padding: 15px 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #FFFFFF;
}

p {
	font-family: Helvetica, Arial, sans-serif;
}
* {margin: 0; padding: 0;} /* reset margin and padding for all elements */

li {
	list-style: none; /* removes the bullets from all unordered list */
}

/* 2: NAVIGATION
============================================================================ */
#header ul#homeLinks { /* the ul starting with "JPL HOME" */
	position: absolute; /* move our list to the correct position */
	top: 25px;
	right: 10px;
	padding-bottom: 10px; /* put some padding to get all the divider pipes to line up */
	/*background: url(../images/divider-horiz-black-dropshadow.gif) repeat-x bottom left;*/ /* the line that goes under this list */
	background: url(../images/header-divider-horiz.gif) repeat-x bottom left;
}
#header ul#subscribeLinks { /* the ul starting with "BRING THE UNIVERSE TO YOU" */
	position: absolute; /* move our list to the correct position - a little further down than the first list */
	top: 45px;
	right: 10px;
}
#header li { /* generically define all li in the header div */
	float: left; /* makes the li appear horizontally rather than vertically */
	font-size: 10px;
	/*color: #8193a0;*/
	color: #8193a0;
	position: relative;
}
#header #homeLinks li {
	padding: 0 10px;
	margin: 0;
	text-transform: uppercase;
	/*background: url(../images/divider-vert-black-dropshadow.gif) no-repeat top left;*/ /* the vertical dividers between each li */
	background: url(../images/header-divider-virt.gif) no-repeat top left;
}

#header #subscribeLinks li a {
	padding: 0 10px;
	margin: 10px 0;  /* do the margin opposite to padding to get all the divider pipes to line up */
	/*border-left: 1px solid #8193a0;*/
	background: url(../images/header-divider-virt-universe.gif) no-repeat top left;
	background-position: 0px 2px;
}

#header #homeLinks li.first, #header #subscribeLinks li.first, #header #subscribeLinks li.title {
	background: none; /* tell the first nav item to not have a divider pipe */
	border: none;
}
#header #subscribeLinks li.title {
	font-size: 11px;
	padding: 0 5px; /* position the nav title so it lines up w/ the nav above it */
}

#header a:link, #header a:visited {
	color: #8193a0;
	/*color: #FBF8F8; */
	text-decoration: none;
}

#header a:hover {
	color: #FBF8F8;
}

#footer ul {
	position: absolute;
	top: 25px;
	left: 350px;
}
#footer li {
	float: left;
	font-size: 12px;
	border-left: 1px solid #8193a0;
}
#footer li.first {
	border: none;
}
#footer li a {
	color: #8193a0;
	text-decoration: none;
	text-transform: uppercase;
	display: block;
	padding: 0 20px;
}

#footer #footerContact {
	color: #8193a0;
	font-size: 10px;
	float: right;
}


/* format our list of left nav links and give it a sub menu */
#sidebar {
	font-weight: bold;
	font-size: 13px;
	position: relative;
}

#sidebar ul {
	background: url(../images/background-sidebar-nav-bottom.png) no-repeat bottom left;
	padding-bottom: 10px;

}

#sidebar li {
	/* font-size: 14px; */
	color: #FFEFBF;
	border-bottom: 1px solid #000000;
	position: relative;
}

#sidebar li a {
	color: #FFEFBF;
	text-decoration: none;
	padding: 8px 10px 8px 18px;
	background: url(../images/background-sidebar-nav.gif) repeat-y top left;
	display: block;
}

#sidebar li a:hover {
	background: #7d3f06 url(../images/background-sidebar-nav-hover-on.gif) repeat-y top left;
	color: #FFFFFF;
	display: block;
}

#sidebar li#on {
	background: #7d3f06 url(../images/background-sidebar-nav-sub-on.gif) repeat-y top left;
	color: #FFFFFF;
	display: block;
	/* font-weight: normal; */
	/* font-weight: bold; */
}

#sidebar li#on #showsub {
	background: #7d3f06 url(../images/background-sidebar-nav-on.gif) no-repeat top left;
	color: #ffffff;
	padding: 8px 10px 3px 18px;
	height: 26px;
	display: block;
}

#sidebar li#on #hidesub {
	background: #7d3f06 url(../images/background-sidebar-nav-hover-on.gif) repeat-y top left;
	color: #ffffff;
	height: 23px;
	padding: 8px 10px 3px 18px;
	display: block;
}

body#section #sidebar li.first a { /* for the first link in the sidebar nav so we can have a rounded corner */
	background: url(../images/background-sidebar-nav-top.gif) no-repeat top left;
	padding: 8px 10px 8px 18px;
	display: block;
}
body#section #sidebar li.first a:hover { /* for the first link in the sidebar nav so we can have a rounded corner */
	background: url(../images/background-sidebar-nav-top-on.gif) no-repeat top left;
}
#sidebar li ul { /* nested ul will make a dynamic horizontal dropdown menu. http://www.alistapart.com/articles/horizdropdowns/ */
	/* font-size: 14px; */
	background: none;
	width: 210px;
	padding-left: 1px;
	position: absolute;
	top: 0;
	left: 210px;
	display: none;
	z-index: 999;
}

#sidebar li ul li a {
	background: url(../images/background-sidebar-sub-nav.gif) no-repeat top left;
	color: #FFEFBF;
}

#sidebar li:hover ul, ul#sidebarNav li.over ul { /* nested ul will make an popout menu */
	font-size: 11px;
	display: block;
}

#sidebar li ol {
	padding-left: 10px;
}

#sidebar li ol li { /* nested ol will make an open menu */
	font-size: 11px;
	border-bottom: none;
	position: relative;
}

#sidebar li ol li#subon { /* nested ol will make an open menu */
	padding: 8px 10px 8px 18px;
	color: #ffffff;
	display: block;
}

#sidebar li ol li a {
	color: #DAC991;
	background: none;
}

#sidebar li ol li a:hover {
	color: #ffffff;
	background: none;
}

/* 3: PAGE STRUCTURE
============================================================================ */

/* a) Containers */

#container {
	width: 984px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	position: relative;
}

/* b) Header */

#header {
	background: url(../images/background-header.png) no-repeat top left;
	padding: 0px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. */
	margin: 0 17px; /* alignes the edges of the div with the div edges below it */
	position: relative;
	clear: both;
}
#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. */
	padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
	display: block;
	width: 370px;
	height: 78px;
	border: none;
	background: transparent url(../images/logo.png) no-repeat top left; /* explanation of why to use transparent... http://archivist.incutio.com/viewlist/css-discuss/24174 */
	text-decoration: none;
	text-indent: -9999px; /* moves the text waaaaaaay off screen */
}

/* c) Content */

#pageTitle {
	clear:both;
}
#pageTitle h2 { /* hides the H2 and replaces it with the pagetitle image */
	display: block;
	position: absolute;
	width: 410px;
	height: 66px;
	border: none;
	margin-left: 25px;
	text-decoration: none;
	text-indent: -9999px; /* moves the text waaaaaaay off screen */
}
#content {
	margin: 0;
	padding: 0 0 0 17px; /* using padding if you need to create space/margins for the inner divs */
	background: url(../images/background-content-left.png) repeat-y top left;
	position: relative;
	z-index: 1;
}
#sidebar {
	float: left; /* put the nav in its spot */
	width: 210px; /* the actual width of this div, in standards-compliant browsers, or standards mode in IE will include the padding and border in addition to the width */
	padding: 0;
	position: relative;
	z-index: 99; /* this makes sure the dropdown nav items appear in front of all the other content */
}
#sidebar img { /* this makes the images in the side bar appear with the correct left margin. specific styles may be needed for other images */
	padding-left: 9px;
}

#mainContent {
	margin: 0 0 0 211px; /* left margin on this div element creates makes sure the column down the left side of the page stays */
	padding-top: 13px; /* padding is the space inside the div box and margin is the space outside the div box */
	position: relative;
}

#holdContent { /* need this extra div to push the content down to accomodate the round corner */
	padding: 0 15px 15px 9px; /* padding is the space inside the div box and margin is the space outside the div box */
	position: relative;
	background: url(../images/background-main-content.png) repeat-y top right;
}
#content #roundedCorner { /* because of the dropshadow on top of the rounded content box we need to do some fancy placement */
	background: url(../images/main-content-top.png) no-repeat top right;
	height: 23px;
	width: 756px;
	position: absolute;
	top: -10px;
	right: 0px;
}

#flybystatusbox {
	width: 193px;
	height: 136px;
	position: relative;
	font-weight: normal;
	font-size: 13px;
	left: 9px;
	background: url(../images/background-countdownbox.jpg) no-repeat;
}

#flybystatusbox #boxtitle {
	padding: 6px 0 0 8px;
}

#flybystatusbox #boxsubtitle {
	padding: 6px 0 0 8px;
	color: #DFCD9C;
}

#flybystatusbox #countdowndetail {
	padding: 6px 0 0 8px;
	color: #DFCD9C;
}

#flybystatusbox #countdown {
	color: #ffffff;
	/*background: #004D8F;
	background-color: #003460;*/
	margin: 2px 8px 0 8px;
}

#flybystatusbox #countdown ul {
	background: none;
	display: inline;
}

#flybystatusbox #countdown ul li {
	color: #ffffff;
	list-style: none;
	display: inline;
	border: none;
}

#flybystatusbox #countdown #countdowntimer {
	background: #886F2C;
}

#flybystatusbox #countdown #countdowntimer li {
	padding: 0 20px 0 15px;
	/*background-color: #003460;*/
}

#flybystatusbox #countdown #countdowntimer li.last {
	padding: 0 0 0 10px;
	/*background-color: #003460;*/
}

#flybystatusbox #countdown .timerelement {
	color: #ffffff;
	width: 45px;
	text-align:center;
	font-weight: bold;
	height: 30px;
}

#flybystatusbox #countdown #countdowntimerheader {
	/*background: #004D8F;
	background-color: #003460;*/
}

#flybystatusbox #countdown #countdowntimerheader li {
	padding: 0 5px 0 5px;
}

#sidebarpromos {
	padding: 10px 0;
}

/* d) Footer */

#footer {
	padding: 0 10px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	margin: 0 17px; /* alignes the edges of the div with the div edges above it */
	background: url(../images/background_footer.png) repeat-x top left;
	height: 66px;
	position: relative;
}
#footer a {
	text-decoration: none;
}
#footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
#footer img { /* positions the USA.gov image to the right spot */
	position: absolute;
	border: 0;
	top: 15px;
	left: 20px;
}



/* 4: SECTION SPECIFIC STYLES
/* Might want to move these into separate stylesheets that are called by the specific template
============================================================================ */

/* a) Home page */
/* we want to use this to target the index page */
/*
body#index {
	background: #002854 url(../images/background-index-bodyStretchLine.jpg) repeat-x;
}
*/
body#index { /* we want to use this to target the index page */
    background-color: #002854;
    background-image: url('../images/background-index-bodyStretchLine3.jpg');
    background-repeat: repeat-x;
}

/* we want to use this to target the index page */
/* body#index #indexBackground {
	background: #002854 url(../images/background-index-body.jpg) no-repeat;
	width:1400px;
	virtical-aligh:top;
} */
#indexBackground {
	background-image: url('../images/background-index-body3.jpg');
	background-repeat: no-repeat;
	background-position: 50% 0%;
	height: 1148px;
	/* 	margin: 0px;
	padding: 0px;
	top: 0%; */
	margin-top: -8px;
}

body#index #pageTitle {
	height: 192px;
	width: 100px;
	z-index:-100;
}
body#index #pageTitle h2 {
	height: 192px; /* matches the div height so its easy to put out image on the bottom */
	background: transparent url(../images/pagetitle-cassini-equinox.png) no-repeat bottom;
	padding-left: 15px;
}

body#index #superBanner {
	color: #ffffff;
	padding-top:2px;
}

body#index #holdContent h2 {
	display: block;
	width: 410px;
	height: 19px;
	border: none;
	text-decoration: none;
	text-indent: -9999px; /* moves the text waaaaaaay off screen */
	background: transparent url(../images/header-welcome.png) no-repeat top left;
}
body#index #sidebar li.first { /* homepage exception for the first link in the sidebar nav so we can have a rounded corner */
	color: #FFFFFF;
	background: url(../images/background-sidebar-nav-top-on.gif) no-repeat top left;
	padding: 8px 10px 8px 18px;
	display: block;
}

body#index #cassini {
/*	background: url(../images/background-index-cassini.png) no-repeat top right;*/
	position: absolute;
	top: 217px;
	right: -30px;
	height: 108px; /* make sure it's not so tall it overlaps the searchbox - that would break the searchbox */
	width: 242px;
	z-index: 50;
}

body#index #mainColumn {
	/* float: left;
	width: 460px; */
	position: relative;
}
body#index #subColumn {
	/* margin-left: 462px; */
	padding: 10px 0 0 0;
	position: relative;
}

body#index #subColumn #sectionOne {
	position: relative;
	float: left;
	left: 4px;
}

body#index #subColumn #sectionTwo {
	margin-left: 466px;
	width: 85px;
	position: relative;
}

body#index #introRow {
	padding-bottom: 10px;
	/*height: 205px !important;*/
	height:50px; /* formally 65px */
	z-index: 99;
}
body#index #welcome {
	width: 460px; /* match the width of mainColumn */
	padding-left: 5px;
}
body#index #search form {
	position: absolute;
	top: 30px;
	right: 25px;
	z-index: 99;
}
body#index #moreStories {
	padding: 0 5px;
	width: 250px;
	height: 330px;
	background: url(../images/background-light-blue.png) repeat-y top left;
	color: #000000;
	overflow: auto; /* hide content */
}
body#index #moreStories h3 {
	text-transform: uppercase;
	font-weight: bold;
	font-size: 12px;
	padding: 4px 0;
	color: #80C6FF;
}
body#index #moreStories li {
	border-top: 1px solid #87c9ff;
	position: relative;
	padding: 4px 0;
	display: block;
	font-size: 11px;
}

body#index #moreStories li Strong {
	color: #94D6FF;
}

body#index #moreStories img {
	float: right;
}
body#index #moreStories strong, body#index #moreStories em {
	display: block;
	font-style: normal;
}

body#index #storymenu {
	position: relative;
	left: 4px;
}

body#index #promoContainer {
	position: relative;
	width: 264px;
}

body#index #promoHeader {
	height: 23px;
	background: url(../images/index-promo-header.png) no-repeat left;
}

body#index #promoContainer img {
	border: 1px solid #95D6FF;
}

body#index #tagcloud {
	width:260px;
	height: 214px;
	border: 1px solid #3975A5;
	background: url(../images/background_tagcloud_index.jpg) no-repeat;
	overflow: hidden;
}

body#index .subleft {
	position: relative;
	padding: 0 2px 0;
	float: left;
}

body#index .imageflowFrame  {
	border: none;
	width: 460px;
	height: 215px;
}

body#index .iframeContainer {
	border: none;
	position: relative;
	top: -4px;
}

body#index #homepageflash {
padding-left: 4px;
}

/* b) Section pages */

body#section { /* we want to use this to target the section pages */
    background-color: #002854;
    background-image: url('../images/background-section-bodyStretchLine10.jpg');
    background-repeat: repeat-x;
}

#sectionBackground {
	background-image: url('../images/background-section-body10.jpg');
	background-repeat: no-repeat;
	background-position: 50% 0%;
	height: 1145px;
	/* 	margin: 0px;
	padding: 0px;
	top: 0%; */
	margin-top: -8px;
}

body#section #cassini {
	background: url(../images/background-section-cassini.png) no-repeat top right;
	position: absolute;
	top: 50px;
	right: 0px;
	height: 159px; /* make sure it's not so tall it overlaps the searchbox - that would break the searchbox */
	width: 292px;
	z-index: 50;
}

body#sectionTEMPREPLACE { /* we want to use this to target the sections pages */
	/*background: #002854 url(../images/background-section-body.jpg) no-repeat;*/ /* change image for different background */
}


body#section p {
	padding: 5px 0 5px 0; /* reset padding for p element in the section element */
}


body#section #twitterbanner {
	background: url(../images/twitter-header.jpg) no-repeat top left;
	width: 700px;
	height: 56px;
	position: relative;
}


body#section #pageTitle {
	height: 99px;
}
body#section #pageTitle h2 {
	height: 99px; /* matches the div height so its easy to put out image on the bottom */
	background: transparent url(../images/pagetitle-cassini-equinox.png) no-repeat bottom;
	padding-left: 15px;
}

body#section #introRow {
	background: #2372b2;
	position: relative;
}

body#section #contentRow {
	background: #F3F3F3;
	padding: 10px;
	position: relative;
	color: #000000;
	min-height: 500px;
}

body#section #contentRow a {
	color: #1C6EB7;
}

body#section #contentRow p {
	padding: 0.5em 0 0.5em 0;
}

body#section #contentRow .Title {
	color: #C65B00;
	font-size: 17px;
	font-weight: bold;
	padding: 0.5em 0 0.5em 0;
}

body#section #contentRow .SubTitle {
   font-size: 14px;
   color: #000000;
	font-weight: bold;
}

body#section #contentRow ul {
	padding-left: 25px;
}

body#section #contentRow ul li {
	list-style: disc inside;
}

body#section #contentRow ul li ul li{
	list-style: circle inside;
}

body#section #holdContent {
	padding-right: 32px;
}

body#section h2.sectionTitle { /* use a class so we can make this code generic to all sectiontitles */
	display: block;
	width: 410px;
	height: 59px;
	border: none;
	text-decoration: none;
	text-indent: -9999px; /* moves the text waaaaaaay off screen */
}
body#section .news { /* give the section title the appropriate image */
	background: transparent url(../images/sectiontitle-news.png) no-repeat top left;
}

body#section .mission { /* give the section title the appropriate image */
	background: transparent url(../images/sectiontitle-news.png) no-repeat top left;
}

body#section #search form { /**/
	position: absolute;
	top: 23px;
	right: 25px;
	z-index: 999;
}

body#section #releasedate {
	font-weight: bold;
	padding: 0px;
}

body#section #contentsource {
	font-weight: bold;
	font-style: italic;
	padding: 0px;
}

body#section #articlefeatures {
	position: relative;
	height: 20px;
	white-space: nowrap;
}

body#section #articlefeatures a {
	cursor: hand;
}

body#section #articlefeatures #articlefunctions{
	float: left;
	width: 400px;
}

body#section #articlefeatures #articlefunctions a {
	text-decoration: none;
	cursor: hand;
}

body#section #articlefeatures #textfeatures{
	float: right;
	font-size: 11px;
	display: inline;
}

body#section #tagcloud { padding: 5px 0 5px 0; height:215px; background: url(../images/background_tagcloud_section.gif) no-repeat; overflow: hidden; }

/** SECTION RIGHTRAIL  **/

body#section #RIGHTRAIL #mainColumn {
	float: left;
	width: 470px;
	position: relative;
}
body#section #RIGHTRAIL #subColumn {
	margin-left: 482px;
	position: relative;
}

body#section #RIGHTRAIL #subColumn #railpromos {
	margin: 0px;
	padding: 0px;
	width: 210px;
	color: #000000;
	position: relative;
}

#section #RIGHTRAIL #railpromos ul {
	padding: 0px;
}

body#section #RIGHTRAIL #railpromos ul li {
	list-style: none; /* removes the bullets from all unordered list */
	padding-bottom: 10px;
}

body#section #RIGHTRAIL #railpromos ul li ol {
	/*border: 1px solid #D6D6D6;
	background-color: #E7E7E7;*/
	background: url(../images/background-rightrailpromos.gif) no-repeat top;
	width: 209px !important;

}

body#section #RIGHTRAIL #railpromos ul li ol li {
	padding: 0 10px 13px 20px;
	list-style: decimal inside;
	color:White;
	font-size: 12px;
}

body#section #RIGHTRAIL #railpromos ul li ol li a:link, body#section #RIGHTRAIL #railpromos ul li ol li a:visited {
	color:White;
	text-decoration: none;
}

body#section #RIGHTRAIL #railpromos ul li ol li a:hover {
	color:White;
	text-decoration: underline;
}

body#section #RIGHTRAIL #railpromos ul li ol .first{
	padding: 12px 5px 12px 23px;
	color:White;
	font-weight:bold;
	font-size: 14px;
}

body#section #RIGHTRAIL #railpromos ul li ol img {
	border-bottom: 1px solid #D6D6D6;
}

body#section #RIGHTRAIL .box {
	background: #FFEFBF;
	margin-bottom: 10px;
	padding: 0 0 0 10px;
	position: relative;
}

body#section #RIGHTRAIL .box .box { padding: 0; }

body#section #RIGHTRAIL .box a { text-decoration: none; }

body#section #RIGHTRAIL .box b {
	padding: 0 15px 5px 15px;
	line-height: 30px;
	font-weight: bold;
	font-size: 14px;
}
body#section #RIGHTRAIL .box b.underline { border-bottom: 1px solid #86CBCC; }
body#section #RIGHTRAIL #railpromos .box ul { padding-left: 5px; }


/*body#section #RIGHTRAIL #railpromos ol {
	background-image: url(../images/background-rightrailpromos.gif) !important;
	background-repeat: no-repeat;
}*/

/** SECTION BOTTOMRAIL  **/
body#section #BOTTOMRAIL #subColumn #railpromos {
	margin: 0px;
	padding: 0px;
	color: #000000;
	position: relative;
}
body#section #BOTTOMRAIL #railpromos ul {
	padding: 0px;
}

body#section #BOTTOMRAIL #railpromos li {
	list-style: none; /* removes the bullets from all unordered list */
	display: inline;
}

/* SECTION STORY LIST PAGE */
body#section #featureStory {
	/*padding-bottom: 15px;	*/
	/*padding: 8px;
	background: url(../images/background-newsfeature.jpg) repeat-x top;*/
	width:455px;
	background-color:white;
}

body#section #featureStory .Title {
	padding: 0;
}

/*
body#section #featureStoryBGTop {
	padding-top: 15px;
	background: url(../images/background-newsfeature_top.jpg) repeat-x top;
	width:455px;
}

body#section #featureStoryBGLeft {
	padding-left: 15px;
	background: url(../images/background-newsfeaturefill.jpg) repeat-y left;
	width:455px;
}*/

body#section #featureStory .featureStoryTbl {
	background-color: White;
	width:100%;
}

body#section #featureStory .featureStoryTDTop {
	background: url(../images/background-newsfeature_top.jpg) no-repeat left;
	height:13px;
	width:470px;
}

body#section #featureStory .featureStoryTDContent {
	background: url(../images/background-newsfeaturefill.jpg) repeat-y left;
	width:470px;
	padding-left:11px;
}

body#section #featureStory .featureStoryTDBottom {
	background: url(../images/background-newsfeaturefill.jpg) repeat-y left;
	width:470px;
	height:8px;
}

body#section #featureStory p {
	padding: 1px;
}

body#section #featureStory a {
	text-decoration: none;
}

body#section #featureStory .storySource {
	font-style: italic;
	text-decoration: none;
}

#section #featureStory #featureStoryContent {
	position: relative;
	/*background: url(../images/background-newsfeaturefill.jpg) repeat-y left;
	margin-left:-7px;*/
}

body#section #featureStory #featureStoryBlurb {
	position: relative;
	width: 240px;
	float: left;
}

body#section #featureStory #featureStoryImage {
	position: relative;
	margin-left: 250px;

	width: 200px;
}

body#section #featureStory #featureStoryImage img { width: 100%; }

body#section ol.contentlist {
	padding: 5px 0 5px 30px;
}

body#section ol.contentlist li {
	padding-top: 3px;
	padding-bottom: 3px;
	list-style-type: decimal;
}

body#section ul.contentlist {
	padding: 5px 0 5px 30px;
}

body#section ul.contentlist li {
	padding-top: 3px;
	padding-bottom: 3px;
	list-style-type: disc;
}

body#section #storylist {
	position: relative;
}

body#section #storylist ul {
	padding: 0;
}

body#section #storylist ul li {
	list-style: none; /* removes the bullets from all unordered list */
	padding: 10px 0 10px 0;
	border-bottom: 1px solid #ffffff;
}

body#section #storylist ul li a {
	text-decoration: none;
}


body#section #storylist ul li.last {
	border-bottom: none;
}

body#section #storylist ul li img {
	padding-right: 5px;
	float:left;
}

body#section #storylist ul li.topheadline {
	/*height: 100px;*/
}

body#section #storylist ul li.topheadline img { width: 105px; }

body#section .liststorytitle {
	font-size: 1em;
	font-weight: bold;
	color: #000000;
}

body#section .liststorysource {
	font-style:italic;
	font-size:  0.9em;
	color: #000000;
	text-decoration: none;
}

body#section #storylist .listheader {
	padding-top: 10px;
	/*border-top: 2px solid #000000;*/
	position: relative;
	height: 30px;
}

body#section #storylist .columnLeft {
	float: left;
	width: 350px;
	position: relative;
	font-weight:bold;
	font-style:italic;
}

body#section #storylist .columnRight {
	right: 21px;
	position: relative;
	float:right;
}

body#section #storylist .flybylistheader {
	padding-top: 10px;
	border-top: 2px solid #000000;
	position: relative;
	height: 30px;
}

body#section #storylist .flybyColumnLeft {
	float: left;
	width: 550px;
	position: relative;
}

/* image list style */
#multimedia_header {
	font-size: 1.5em;
	font-weight: bold;
	color:#2270B0;
	padding: 0px 0 10px 0;
	position: relative;
}

#multimedia_header #multimedia_breadcrumb {
	font-size: 14px;
	position: relative;
	height: 25px;
	padding: 0;
	float: left;
	color: #3472AD;
}

#multimedia_header #multimedia_breadcrumb p {
	padding: 0;
}

#multimedia_header #multimedia_breadcrumb #multimedia_breadcrumb_images {
	width: 460px;
}

#multimedia_header #multimedia_breadcrumb #multimedia_breadcrumb_video {
	width: 480px;
}

#multimedia_header #multimedia_selector {
	position: relative;
}

#multimedia_header #multimedia_selector a {
	text-decoration: none;
}

#multimedia_header #multimedia_selector img {
	border: none;
	margin-left: 5px;
	padding: 0px;
}

#multimedia_header #multimedia_selector table {
	position: absolute;
	right: 0px;
}

#multimediadetailsheader .categorytitle {
	font-size: 16px;
	color: #3472AD;
}

table#multimedialist {
	border: 2px solid #D9D9D9;
	background: #F7F7F7;
}

table#multimedialist table.multimedia_imagebox {
/*	background: url(../images/background_imagelist.gif) no-repeat top left; */
}

table#multimedialist table.raw_multimedia_imagebox {
	background: url(../images/background_raw_imagelist.gif) no-repeat top left;
}

table#multimedialist table.multimedia_imagebox td.multimedia_imagebox_image {
	padding: 2px 2px 2px 2px;
	border: 2px solid #D9D9D9;
}
table#multimedialist table.multimedia_imagebox td.multimedia_imagebox_image div{
	height: 121px;
	width: 158px;
	background: #000000;
}

table#multimedialist table.raw_multimedia_imagebox td.multimedia_imagebox_image {
	padding: 3px 0 0 3px;
}

.multimedialist_imagetitle { width: 166px; }

td#multimedialist_paging {
	text-align: center;
	font-weight: bold;
}

td#multimedialist_paging a {
	color:#2270B0;
	text-decoration: none;
}

/* image detail style */
table#imagedetail_imagebox {
	border: 2px solid #D9D9D9;
	background: #F7F7F7;
}

/* 5: LISTS
============================================================================ */


/* 6: FORMS & TABLES
============================================================================ */

#search input { /* gives the search box a nice rounded corner look */
	border: none; /* hides the search box borders */
	padding: 3px 10px;
	width: 133px; /* makes sure the box isn't wider than our background image */
	height: 22px;
	background: transparent url(../images/formelement-searchbox.png) no-repeat top left;
}

/* 7: GLOBALS
============================================================================ */
#nasalogo {
	position: absolute;
	top: 5px;
	left: 25px;
	width: 70px;
	height:70px;
	z-index: 50;
}

#jpllogo {
	position: absolute;
	top: 15px;
	left: 100px;
	width: 275px;
	height: 50px;
	z-index: 50;
}

#leftnavad {
	margin: 9px 0 0 9px;
	/* border: 1px solid #9B8D60; */
	width: 193px;
	height: 58px;
	background: url(../images/ads/twitter-sidebar.jpg) no-repeat top left;
}

#leftnavad2 {
	margin: 9px 0 0 9px;
	/*border: 1px solid #9B8D60;*/
	width: 191px;
   height: 58px;
   background: url(../images/ads/facebook-sidebar.jpg) no-repeat top left;
}

#leftnavad3 {
	margin: 9px 0 0 9px;
	width: 191px;
  height: 123px;
  background: url(../images/ads/cassini_coming_attractions_ad_small.jpg) no-repeat top left;
}

#leftnavad4 {
	margin: 9px 0 0 9px;
	width: 193px;
  height: 149px;
  background: url(../images/Scientist4aDay_ad_209x113.gif) no-repeat top left;
}

/* rotatesaturn */
#rotatesaturn {
	position: absolute;
	left: 550px;
	top: -50px;
}
/* rotatesaturn */

/* Breadcrumb */
#breadcrumb {
	float: left;
	width: 500px;
	padding: 10px 0 0 10px;
	position: relative;
}

#breadcrumb h3 {
	font-style:italic;
	padding-bottom: 5px;
	font-size: 19px;
}

#breadcrumb p {
	border-top: 1px solid #498BBE;
	padding-top: 4px;
	width: 500px;
	color: #AADAEC;
}

#breadcrumb p a {
	text-decoration: none;
	color: #AADAEC;
}

/* tagcloud */
#listcloud { margin: 20px 0 0 0; padding: 0px; text-align: center; }
#listcloud li { display: inline; padding: 0 8px 0 8px; line-height: 2em; }
#listcloud a { padding: 0; margin: 0; text-decoration: none; }
#listcloud a.tag1 { font-size: 0.8em; }
#listcloud a.tag2 { font-size: 0.9em; }
#listcloud a.tag3 { font-size: 1.0em; }
#listcloud a.tag4 { font-size: 1.1em; }
#listcloud a.tag5 { font-size: 1.2em; }
#listcloud a.tag6 { font-size: 1.4em; }
#listcloud a.tag7 { font-size: 1.6em; }
#listcloud a.tag8 { font-size: 1.8em; }
#listcloud a.tag9 { font-size: 1.9em; }
#listcloud a.tag10 { font-size: 2.1em; }

/* section specific listcloud coloring */
/* index */
body#index #listcloud { margin: 0; }
body#index #listcloud li { line-height: 2.7em; }
body#index #listcloud a { color: #A2D5FF; }
body#index #listcloud a.tag1 { color: #4176A6; }
body#index #listcloud a.tag2 { color: #4176A6; }
body#index #listcloud a.tag3 { color: #4176A6; }
body#index #listcloud a.tag4 { color: #6199CC; }
body#index #listcloud a.tag5 { color: #6199CC; }
body#index #listcloud a.tag6 { color: #6199CC; }
body#index #listcloud a.tag7 { color: #82B2DB; }
body#index #listcloud a.tag8 { color: #82B2DB; }
body#index #listcloud a.tag9 { color: #82B2DB; }

/* section */
body#section #listcloud li { padding: 0 7px 0 7px; line-height: 1.8em; }
body#section #listcloud a { color: #2373B2; }
body#section #listcloud a.tag1 { color: #99C0DF; }
body#section #listcloud a.tag2 { color: #99C0DF; }
body#section #listcloud a.tag3 { color: #99C0DF; }
body#section #listcloud a.tag4 { color: #72A5D2; }
body#section #listcloud a.tag5 { color: #72A5D2; }
body#section #listcloud a.tag6 { color: #72A5D2; }
body#section #listcloud a.tag7 { color: #4D8CC2; }
body#section #listcloud a.tag8 { color: #4D8CC2; }
body#section #listcloud a.tag9 { color: #4D8CC2; }
/* section specific listcloud coloring */

/* Image in story */
div.storyimagebox {
	position:relative;
	padding: 2px 5px 2px 5px;
}

div.storyimagebox a {
	text-decoration: none;
}

.storyimagebox_left {
	position:relative;
	float: left;
	padding: 2px 10px 2px 0px;
}

.storyimagebox_left a {
	text-decoration: none;
}

.storyimagebox_right {
	position:relative;
	float: right;
	padding: 2px 0px 2px 10px;
}

.storyimagebox_right a {
	text-decoration: none;
}

td {
	font: 12px Helvetica, Arial, sans-serif;
	color:#000000;
}

div.storyimagecaption {
   font-size: 11px;
   font-style: italic;
   border-bottom: 1px solid #C65B00;
   padding: 5px 0 5px 0;
}

div.storyimagemultimediacaption {
   font-size: 11px;
   width: 200px;
   font-style: italic;
   border-bottom: 1px solid #C65B00;
   padding: 5px 0 5px 0;
}

div#clearfloat {
	clear:both;
}

br.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that contains a float */
	display: none;
}

#liveSearch { /* if the height needs to be dynamic use sliding doors vertically: http://www.alistapart.com/articles/slidingdoors/ */
	background: transparent url(../images/background-livesearch.png) no-repeat top left;
	position: absolute;
	top: 15px;
	/*right: -7px;*/
	right: 0px;
	padding: 46px 0px 0px 0px;
	/*height: 507px;*/
	width: 333px;
	/*display: none;		  >>>>>> comment this line out to see the liveSearh div */
	/*visibility: hidden;	  >>>>>> comment this line out to see the liveSearh div */
	z-index: 50;
}

body#section #liveSearch {
	top: 5px;
}

#liveSearch #results {
	background: #d4e1f4;
	margin: 0 12px 2px 12px;
	position: relative;
	color: #333333;
}
#liveSearch #results h3 {
	background: #9bbae6;
	color: #FFFFFF;
	font-weight: bold;
	padding: 5px;
	font-size: 12px;
}
#liveSearch #results p {
	padding: 5px;
}

#searchResults .searchTerm {
	color: #000000;
	font-weight: bold;
	font-size: 15px;
	font-style: italic;
}

#searchResults .categoryTitle {
	color: #ffffff;
	font-weight: bold;
	font-size: 14px;
}

#searchResults .itemTitle {
	color: #000000;
	font-weight: bold;
	font-size: 12px;
	text-decoration: none;
}

#searchResultsMenu .linkTitle {
	color: #000000;
	font-weight: bold;
	font-size: 12px;
	text-decoration: none;
}

#searchResults .itemSummary {
	color: #000000;
	font-size: 12px;
	text-decoration: none;
}

body#index #results {
	position: relative;
}

body#index #results h3 {
	padding-left:  6px;
}
body#index #results li {
	position: relative;
	padding: 4px 6px 4px 6px;
	display: block;
	font-size: 11px;
	height: 55px;
	/*overflow: hidden;*/
}

body#index #results img {
	float: left;
	padding:  2px 6px 4px 0px;
}

body#index #results strong, body#index #results em {
	display: block;
	font-style: normal;
}


body#section #results {
	position: relative;
}

body#section #results h3 {
	padding-left:  6px;
}
body#section #results li {
	position: relative;
	padding: 4px 6px 4px 6px;
	display: block;
	font-size: 11px;
	height: 55px;
	/*overflow: hidden;*/
}
body#section #results img {
	float: left;
	padding:  2px 6px 4px 0px;
}
body#section #results strong, body#section #results em {
	display: block;
	font-style: normal;
}

@media print {
body#section .noprint {display:none; }
}

body#section #carouselcontainer #carousel  {
	padding: 0px;
}

/* carousel */
body#section #carouselcontainer #carousel li {
	list-style: none;
}
/* carousel */

/* fullscreen style */
#contentFrame {
   background: url(../images/fullscreenframe.png) no-repeat top;
   margin-left: 17px;
   width: 952px;
}

#contentFrame .mainContent {
   padding: 15px;
}

/* rss */
#mainColumn .rssfeed { position: absolute; top: 14px; right: 0; }
#mainColumn .rssfeed a { text-decoration: none; }
#mainColumn .rssfeed img { vertical-align: middle; }
#mainColumn #multimedia_header .rssfeed { top: 10px; }
#mainColumn #multimedia_header .rssfeed a  { font-size: 12px; font-weight: normal; }

/* related images jcarousel */
.jcarousel-skin-tango .jcarousel-container-horizontal { width: 100%; padding: 10px 0 10px 0; }
.jcarousel-skin-tango .jcarousel-clip-horizontal { width: 88%; margin-left: 45px; }