@charset "utf-8";
/* CSS Document */

/*Setting page default*/ 
/*if font size is set at 100% it means that the default font is 16px, hence 1em=16px*/

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	font-weight: normal;
	background-color: #6d9293;
}
html{
font-size:100%/*WinIE6- text resize adjust*/
}

div, h1, h2, h3, h4, h5, h6, p, ul, ol, form{
	padding: 0;
	margin: 0;
	list-style-type: none;
}
table {
	border-collapse: inherit;
	border-spacing: 0;
}
a {
	text-decoration: none;
	color: #BD9C5A;
}
a:hover {
	color: #597A7E;
	text-decoration: underline;
}
/*End setting page default*/ 

#Container {/*this is the box which surrounds the whole page and the font size is set at .75em or 12px*/
	margin: auto;
	font-size: .75em;
	line-height: 1.6em;
	border: .25em solid #FF8843;
	padding-top: .83em;
	padding-right: 1.67em;
	padding-bottom: .83em;
	padding-left: 1.67em;
	background-color: #FFFFFF;
	width: 66.67em;
}

*html #Container {/*IE earlier than 6 hack*/
	width: 70em;
	w\idth: 66,67em;
}

#Container #banner {/*top of page with the titles of articles and the Mosaic plus logo*/
	background-image: url(../Images-permanent/mosaic-plus.gif);
	background-repeat: no-repeat;
	background-position: 0em 0em;
	height: 2.75em;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 4.58em;
	z-index: 1030;
}

/*Start Left Navigation formating*/

#Container #main #main-nav {/*main nav is the box which surrounds the entire left navigation*/
	float: left;
	width: 10.5em;
	padding-right: 1.25em;
	position: relative;
	left: 0em;
	top: .33em;
	font-size: 1.2em;
	color: #BD9C5A;
	padding-left: 0em;
	z-index: 1020;
}
*html #Container #main #main-nav{/*IE earlier than 6 hack*/
	width: 14em;
	w\idth: 12.75em;
}
#Container #main #main-nav  li {/*setting the space between each list items on the left navigation*/
	margin-bottom: .7em;
}

#Container #main #main-nav .nav-title {/*this define the style for the main title of the navigation bar*/
	height: 1.4em;
	font-weight: bold;
	color: #6D9293;
	margin-top: 0em;
	text-align: left;
	text-decoration: none;
	display: block;
}
#Container #main #main-nav .nav-right-top {/*round corner box*/
	background-image: url(../Images-permanent/corner-top-right.gif);
	background-repeat: no-repeat;
	background-position: right top;
	margin-top: .65em;
	margin-bottom: 1.5em;
}
#Container #main #main-nav .nav-left-top {/*round corner box*/
	background-image: url(../Images-permanent/corner-top-left.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#Container #main #main-nav .nav-right-bot {/*round corner box*/
	background-image: url(../Images-permanent/corner-bot-right.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
}
#Container #main #main-nav .nav-left-bot {/*round corner box*/
	background-repeat: no-repeat;
	background-position: left bottom;
	background-image: url(../Images-permanent/corner-bot-left.gif);
	padding: .8em;
}

#Container #main  .spacing {/*just helps control spacing in the  text if needed*/
	letter-spacing: -1px;
}

/*End Left Navigation formating*/

/*start main section*/

#Container #main #content {/*dark green box surrounding the main section*/
	margin-left: 13.92em;
	background-color: #597A7E;
	padding-right: 1em;
	padding-left: 1em;
	padding-bottom: 1em;
	background-image: url(../Images-permanent/white-square.gif);
	background-repeat: repeat-x;
	z-index: 1000;
}
#Container #main #content #inside .picassa {
	text-align: center;
}
#Container #main #content #inside {/*light green box with main test*/
	background-color: #EEF8F8;
	padding-right: 0.8em;
	padding-bottom: 0.4em;
	padding-left: 0.8em;
	border: 1px solid #597A7E;
	padding-top: .4em;
	color: #577475;
}

#Container #main #content #inside .li-bullet {/*first level bulleted text with orange bullet*/
	background-image: url(../Images-permanent/bullet-orange.gif);
	background-repeat: no-repeat;
	background-position: left .5em;
	padding-left: 1em;
	padding-top: 0em;
	text-indent: 0em;
}

#Container #main #content #inside .li-bullet-green-green {/*first level bulleted text with orange bullet*/
	background-image: url(../Images-permanent/bullets-green-green.gif);
	background-repeat: no-repeat;
	background-position: left .5em;
	padding-left: 1em;
	padding-top: 0em;
	text-indent: 0em;
}
#Container #main #content #inside .li2-bullet {/*ssecond level bulleted text with green bullet*/
	background-image: url(../Images-permanent/bullet-green.gif);
	background-repeat: no-repeat;
	background-position: left .5em;
	padding-left: 1em;
	text-indent: 0em;
	margin-left: 1em;
}
#Container #main #content #inside a {/*setting color for links inside main text*/
	color: #577475;
	text-decoration:underline;
}

#Container #main #content #inside a:hover {/*setting color for links in hover state inside main text*/
	color: #FF8843;
	text-decoration:underline;
}

#Container #main #content #inside .img-left {/*left image text wrap*/
	margin-right: .83em;
	margin-top: .42em;
	float: left;
}
#Container #main #content #inside .img-right {/*right image text wrap*/
	margin-top: .83em;
	margin-left: .83em;
	float: right;
}
#Container #main #content #inside .img-center {/*center image text wrap*/
	margin: auto;
	margin-top: 1.25em;
	margin-bottom: 1.25em;
}
#Container #main #content .thank-you {/*this box can be used to put a text thanking volunteers*/
	color: #C14E5F;
	padding: .5em;
	border: 4px double #8d9c5a;
	background-color: #ffffff;
	font-size: 1.1em;
}

#Container #main #content #inside p {/*setting the space between paragraphs*/
	margin-bottom: .4em;
}
#Container #main #content #inside .dropcap {/*we do drop caps too*/
	float:left;
	font-size:4em;
	line-height:.7em;
	padding-top:0.1em;
	font-weight: normal;
	font-family: Georgia, "Times New Roman", Times, serif;
	margin-right: .08em;
} 
#Container #main #content #inside .subtitle {/*bold green subtitles inside main text*/
	font-weight: bold;
	margin-bottom: 0em;
	padding-bottom: 0em;
}
#Container #main #content #inside .section {/*bold orange main header inside the content page*/
	color: #FF8843;
	margin-top: 0.5em;
	font-weight: bold;
	margin-bottom: 0em;
	font-size: 1.2em;
}
#Container #main #content #inside .signature {/*author signature*/
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	text-align: right;
	font-size: 1.2em;
}
#Container #main #content #inside .highlights {/*highlighting words inside text, in color orangy*/ 
	color: #D9471F;
}
#Container #main #content #inside li {/*first level bulleted text inside text and content page*/
	text-indent: 1em;
	font-size: 1.1em;
	font-weight: normal;
}
#Container #main #content #inside .li2 {/*second level bulleted text inside text and content page*/
	text-indent: 2em;
	font-weight: normal;
}
#Container #main #content #inside .img-list {/*orange arrow at the end of the list*/
	padding-top: .2em;
	vertical-align: baseline;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

#Container #main #content #inside .line-background {/*creating subsection titles with a green line and arrow in the background*/
	background-image: url(../Images-permanent/arrow-background.gif);
	background-repeat: no-repeat;
	background-position: left center;
	height: 2em;
	padding-top: 1em;
	padding-right: 1em;
	padding-bottom: 1em;
	padding-left: 1em;
}
#Container #main #content #inside .line-background .line-title {/*this is the box with the green border which comes on top of the subsection titles with a green line and arrow in the background*/
	font-size: 1.2em;
	font-weight: bold;
	background-color: #EEF8F8;
	text-align: center;
	border: 1px solid #005A7C;
	width: 60%;
	margin-right: auto;
	margin-left: auto;
	padding: .1em;
}
#Container #main #content #inside .quotes {/*defining text style for quotes inside main text*/
	font-family: Georgia, "Times New Roman", Times, serif;
	background-image: url(../Images-permanent/quotes.gif);
	background-repeat: no-repeat;
	background-position: left top;
	font-style: italic;
	margin-bottom: .83em;
	padding-top: .2em;
	padding-right: .3em;
	padding-bottom: 0em;
	padding-left: .3em;
}
#Container #main #content #inside .quotes p {
	margin-bottom: 0em;
	padding-bottom: 0em;
}
#Container #main #content #inside .quotes .signature2 {/*quote signature*/
	text-align: right;
	padding: 0em;
	margin-top: -.83em;
	margin-right: 0em;
	margin-bottom: 0em;
	margin-left: 0em;
}

#Container #main #content #inside .text-box {/*green background text boxes with white text*/
	font-size: 1em;
	font-weight: normal;
	color: #D6D6D6;
	background-color: #597A7E;
	text-align: justify;
	padding-top: 0.4em;
	padding-right: .8em;
	padding-bottom: .4em;
	padding-left: .8em;
	margin-bottom: .4em;
}
#Container #main #content #inside .text-box .text-box-title {/*text box title-lighter background and darker font*/
	color: #597A7E;
	background-color: #EEF8F8;
	padding-top: .4em;
	padding-right: .8em;
	padding-bottom: .4em;
	padding-left: .8em;
	width: 26.8em;
	font-weight: bold;
}
*html #Container #main #content #inside .text-box .text-box-title{
	width: 32.8em;
	w\idth: 26.8em;
}
/*The following styles were originally created for a page which contained only quotes and their author's name. I had defined a span style to highlight the author's names, it turned out that IE for some unknown reason did not like to have a span tag near a left floated div-the right float was fine-and it simply cut out the bottom part of the pciture and the text at the bottom of the div, so please if you use the following CSS quote style make sure to have no span nearby. Please also remember to define a paragraph style in the page itself if needed*/
#Container #main #content #inside .caption-box {
	padding: 0.6em;
	border: .083em solid #597A7E;
	width: 25em;
	margin-top: .4em;
}
*html #Container #main #content #inside .caption-box{/*IE earlier than 6 hack*/
	width: 26.37em;
	w\idth: 25em;
}
#Container #main #content #inside .caption-box-left {
	float:left;
	margin-right: 1em;
}
#Container #main #content #inside .caption-box-right {
	float:right;
	margin-left: 1em;
	color: #597A7E;
}
.clearfloat:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
#Container #main #content #inside .text-box a {
	color: #FFFFFF;
	text-decoration: underline;
}
#Container #main #content #inside .text-box a:hover {
	color: #FF8843;
}

#Container   #content  #inside  .toc-ul  {
	margin-left: 0em;
	padding-left: 0px;
	margin-bottom: 0px;
}
#Container #content #inside .toc-ul a {
	color: #577475;
}

#Container   #content  #inside  .toc-ul  .toc-li  {
	font-size: 1.1em;
	font-weight: bold;
	color: #FF8843;
	margin-left: 0px;
	margin-top: .3em;
	margin-bottom: 0px;
	padding: 0px;
}
#Container   #content  #inside  .toc-ul  .toc-li2  {
	font-weight: bold;
	color: #577475;
	margin-left: 2em;
	font-size: 1em;
}
#Container   #content  #inside  .toc-ul  .toc-li3  {
	font-weight: normal;
	margin-left: 3em;
}
#Container #content #inside .toc-ul .top {
	text-align: right;
}

#Container #main #content #inside .dot-dot-dot {
	font-family: Wingdings;
	font-size: 2em;
	color: #F60;
	text-align: center;
	margin-top: .1em;
	margin-bottom: .1em;
}