body {margin:0 0 0 10px; font-family:Arial,Helvetica,Verdana,sans-serif;}

/* */
/* zero these values, avoids wierd cross browser problems and simplifies code */
h1, h2, h3, h4, ul, li {margin:0; padding: 0}

/* */
/* Set up some color */
/* h1, h2 {color: #036868} */
div.box h2 {color:black}
a {color:#669933}
a:visited {color:#99CC33}
a:active {color:black}


dt {font-weight:bold; float:left; display:inline; margin-right:0.25em; }
dd {margin-bottom:1em;}
li, p, dt, dd {line-height:125%;}
img {border-style:none} /* solves annoying IE problem in one of the sidebars may no longe rbe necessary */
p {margin: 0; margin-bottom:0.75em;}

/* */
/* Set up sections */
#mainnav, #header {font-size:small; }
#mainnav p {padding-right:7px}
#header {width: 600px; }
#printpromo {display:none}

/* */
/* Navigation */
/* DOCUMENT HOW THE SERVER SIDE INCLUDES WORK AND HOW THE IDS ARE STRUCTURED*/
#mainnav li, #header li {list-style:none}
#mainnav li {margin-bottom:.8em; padding: 4px}
#mainnav ul li ul li {
   font-size:x-small; 
   color:white;
   margin-left:12px; 
   margin-bottom:0.3em;
   display:none;}
#mainnav ul li ul li a {
   text-decoration:underline; 
   color:white;
   }
/* This mess with nested divs appears to help with ie. Confirm */
#mainnav_container {
   width: 135px;
   position: absolute;
   left:10px;
   top:75px;
   }
#mainnav {
	width:125px;
	border-right:2px solid #669933
	}

/* */
/* Header styling */
#header img {padding: 5px 0 5px 0; }
#header {border-bottom:2px solid black; width:790px}
div#header div#searchform	{
    position:absolute;
    top:22px;
    left:660px;
    }
div#header div#searchform label	{
    display: none;
	margin: 0;
	padding: 0;
	font-size: 9px;
	}
div#header div#searchform form	{
	margin: 0;
	padding: 0;
    display:inline;
	}	
div#header div#searchform input	{
	padding: 0;
    margin-left:3px;
    font-size: 9px;
    font-family:arial, helvetica, verdana, sans-serif;
    display:inline;	
    width:auto}
div#header div#searchform #s-q {
	width:80px;
	}


/* Front page third column formatting */
/* hopefully the new design won't need this */
#announce img  { display: block;
    margin-left: auto;
    margin-right: auto}
#announce {width:120px;
    position: absolute;
   left:680px;
   top:75px;
   font-size:small;
   }
#announce p {margin-top:0}
#announce h2 {color: #336633; font-size:medium; font-weight:bold; text-align:center}
#announce p.descript {font-size:x-small; text-align:center}


/* Box styling */
div.box {
   background: #f2ffca;
   width:33%;
   float:right;
   padding:10px;
   margin:0 0 1em 1em;
   font-size:75%
   }



/* We might not be using this anymore. Check */
.yellow {background: #f2ffca; padding:5px}
div.yellow p {font-size:small; text-align:center; margin:0; padding:0;}
div.yellow img {margin-left: auto;
    margin-right: auto;} /* not working to center the image... */
/* We might not be using this anymore. Check */
span.new {color:#006600; font-weight:bold; font-size:medium}


/* */
/* Lays out each section */
#frontpage, #archive, #article, #general, #bookstore, #toc {
	margin-left:160px;
	margin-top: 25px; 
	width:470px;
	margin-bottom:35px;
	}
#article, #archive, #bookstore, #general, #toc {width:630px}
#footer {margin-top:2em;}
#footer p {margin-bottom:0}
/* whatsposted is used on the front page only and will likely be removed when we finish the reorg */
/* #whatsposted,  */
#footer {font-size:small;}

#frontpage div.currentissue img {display:block}
#frontpage div.currentissue {float:left; margin:10px 10px 0 0; }
#frontpage div.currentissue p {font-size:small; width:168px; text-align:center}


/* used on the front page, maybe somewhere else too? */
span.descript {font-size:small}

/* */
/* needed, at least for now in the yellow boxes */
p.firstgraph {margin-top:0px; padding-top:0px;} 


p.quote {margin-left:30px; font-style:italic}
.clear {clear:both}


/* */
/* This allows us to style all of the mentions fo the Dollars and Sense name.  */
span.mag {
color:#669933;
font-weight:bold;
font-style: italic;
}

ul.from_magazine {margin-top:0.5em;}
ul.from_magazine, ul.from_magazine li {list-style:none; margin-bottom:1em;}


/* */
/* Archive homepage styling */
#archive ul, #archive li {font-size:small}
#archive .year {width:200px; float:left; display:inline; margin-bottom:1em}
#archive li {list-style:none}


/* */
/* Bookstore styling */
#bookstore h3, #bookstore h4 {margin-bottom:0; padding-bottom:0}
#bookstore dd {margin-bottom:0;}
span.isbn {white-space:nowrap}
#bookstore ul.booklist {}
#bookstore ul.booklist {border-top:2px solid gray;}
#bookstore ul.booklist li {
  padding: 1em 0 0 0; 
  border-bottom:2px solid gray;  
  clear:left; 
  list-style:none}
#bookstore ul.booklist li img {float:left; margin: 0 10px 10px 0}
#bookstore img.bookcoverdetail {float:left; margin: 20px 20px 20px 0}

/* used: explain where */
ul.bookschedule li {font-style:italic} 
ul.bookschedule span.details {display:block; font-style:normal}
ul.bookschedule {margin-bottom:0.5em;}

/* used: explain where */
ul.booksubmenu {clear:both; border-bottom:2px solid #669933; padding:0; margin:0}
ul.booksubmenu li {list-style:none; display:inline;padding:4px; margin-right:4px}
ul.booksubmenu li a {font-weight:bold;} 

/* do I use this? */
ul.booksubmenu li.active a {color:white;font-weight:bold; text-decoration:none} 
ul.booksubmenu li.active { background: #669933; }

/* used: does some fancy formatting in individual book table of contents.   */
#toc h2 {text-align:center; border-bottom: 1px solid #669933; margin: auto; margin-bottom:5px; }
#toc img {float:left; margin: 0px 10px 10px 0; padding:0}
#toc #features {width:45%; float:left;}
#toc #regulars {width:45%; float:right} 
#toc li {list-style:none; margin-bottom:1em;}
#toc span.section {font-weight:bold; display:block}
#toc li p {margin:0; padding: 0}
#toc li p.headline  {font-weight:bold; font-size:medium}
#toc li p.teaser {font-style:italic}
#toc li p.author {}
#toc ul li ul {margin-left:1em; margin-bottom:0.5em}
#toc ul li ul li {margin-bottom:0.5em} 

div.clear {clear:both}




ul.toc * {list-style:none;}
ul.toc li {margin-top:1em; font-weight:bold}
ul.toc li ul li {margin-left:2em; margin-top:0; font-weight:normal}
ul.toc span.author {font-style:italic; margin-left:2em; font-weight:normal; display:block}


/* */
/* Article formatting, basics */
#article h1 {font-size:24px}
#article h2 {font-style:italic; font-weight:normal; font-size:large}
#article h3 {font-size:medium}
#article p {text-indent:2em}
#article p.noindent {text-indent:0;}
#article p.author {text-indent:0;  margin-top:0.5em; text-transform: uppercase}
#article p.cite {text-indent:0; margin-top:0}
#article p.authorbio {
	font-size:small; 
	font-style:italic; 
	text-indent:0; 
	}
#article p.authorbio i {
	font-style:normal
	}
#article div.seealso {   background: #f2ffca;
   width:148px;
   float:right;
   padding:10px;
   margin:0 0 1em 1em;
}
#article div.seealso p {text-indent:0; font-size:75%; margin:0; padding:0}
#endmatter {
	border-top: 1px solid silver;
	padding-top:0.5em;
	}
#endmatter p {
	font-size:small; 
	text-indent:0;
	}
#bookstore ul.plainlist {margin-left:2em}
#bookstore ul.inventory li, #bookstore ul.plainlist li {list-style:none;}
#bookstore ul.inventory li {margin-bottom:0.5em;}
#bookstore form.mailer div.radioblock input {display:inline; float:none} 


/* */
/* Article formatting, advanced */
/* Article list styling */
#article ul {margin-left:4em}
#article ul.plainlist {margin-left:0}
#article ul.plainlist li {list-style:none; margin-bottom:1em}
#article table { border-collapse: collapse;}
#article table td, #article table th {
   background:white; 
   padding:4px; 
   border:1px solid #303030; 
   font-size:small;
   }
#article table caption {text-align:left; font-weight:bold}
#article div.intro {font-style:italic;}
#article div.intro i {font-style:normal;}

/* */
/* box style special cases.  */
#article div.box ul {
	 margin-left:0; 
   }
#article div.box ul li {
	padding-left:15px;
	margin-bottom:0.75em;
	margin-left:0;
	text-align:left;
}

/* */
/* Article types */
/* Ask Dr. Dollar question */
#article div.dollar p {margin-left:125px} /* what does this do?  */
#article div.dollar h1 {margin-left:125px; font-size:large}
#article div.dollar h1 + p {text-align:right; margin-top:0} /* how does this look in ie?  */
#article div.dollar h2 {margin-left:125px; font-size:medium; font-weight:bold; color:black}
#article div.dollar + p {clear:both; margin-top:3em;} /* what does this do?  */
#article div.dollar img {float:left; margin:0}

/* */
/* Up against the wall street journal box */
div.wsj {width: 400px;
	border: 1px solid #666;
	border-right:3px solid #3e3e3e;
	border-bottom:3px solid #3e3e3e;
	padding:10px 10px 0 10px;
margin-bottom:1em;
	background: #f7f7f7;
    }
div.wsj h2, div.wsj p {
	font-family: Georgia, "Georgia Ref", Times, "Times New Roman", serif; 
	color:#181818
	}
div.wsj h2 {text-align:center}
div.wsj p {
	font-size:80%; 
	text-align:justify
	}


/* */
/* All images places inline in an article get floated right. This is for simple, often small, images with no captions.  */
#article img {float:right; margin: 1em 0 1em 1em;}

/* */
/* Complex images that include a caption are wrapped in a div class="image" and the caption in p tags */
#article div.image {
	float: right;
	padding: 10px 0px 10px 10px;
	margin: 0px 0 10px 10px;
	}
#article div.image img {
	float:none; 
	margin:0; 
	padding:0} 

/* */
/* More complex illustrations, such as tables, are wrapped in a div class="figure" 
By default it will use the full width*/
#article div.figure {
	padding: 10px;
	margin: 10px 0 10px 0px;
	}

/* */
/* To float smallerfigures to one side, add a left or right to the class, ie. class="figure right" and the whole unit will float */
#article div.right {
	float:right; 
	margin:0 0 10px 10px; 
	padding: 0 0 10px 10px;
	}
#article div.left {
	float:left; 
	margin:0 10px 10px 0; 
	padding: 0 10px 10px 0;
	}
	
/* */
/* Formats table sources and image captions */
#article div.figure p, #article div.image p {margin: 0; font-size:small; text-indent:0 }

/* */
/* This is the formatting for the sentence below the authors name that says what issue it is from.*/
#article div.from {
	float:right;
	width:168px;
	margin:0 0 10px 20px;
	}

#article div.from p {
	text-align:center; 
	margin:0;  
	text-indent:0; 
	font-size:x-small;
	}
#article div.from p.printversion {display:none;}
#article div.from img {margin:3px 0 0 0;}

/**/
/* Formats forms generally but not the header search or the page specific features */
form.mailer div.row {
  clear: both;
  padding-top: 10px;
  }
form.mailer div.row span.label {
  float: left;
  width: 150px;
  text-align: right;
	font-weight:bold;
  }
form.mailer div.row span.formw {
  float: right;
  width: 250px;
  text-align: left;
  } 
form.mailer {display:block;}
form.mailer label {width: 300px;}
form.mailer label, form.mailer input, form.mailer textarea {
        display: block;
        float: left;
        margin-bottom: 10px;
		font-size:large;
		}
form.mailer input, form.mailer textarea {background:#f2ffca;}
form.mailer input.submit {width:auto; margin-left:270px; clear:both}
form.mailer label {text-align: right; padding-right: 20px;}
form.mailer br {clear: left;}
form.mailer input.submit {display:block}
div.radioblock {width:700px;}
div.radioblock input {padding-left:15px;}

.promoheader	{font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 10pt;
	font-weight: bold;
	color: #669933;}
	
.promotext	{font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 9pt;
	font-weight: none;
	color: #000000;}