@charset "utf-8";


/* CSS Document */

body
{
	text-align: center;
	background: #030;
}
/* some browsers ignore the auto margins, so body tag has center align used to center the page
problem with this rule is that all content on the page is now center-aligned. To overcome the center alignment problem, a new declaration is added within the containing block rule set – “text-align: left”*/
div#container_example
{
	margin-left: auto;
	margin-right: auto;
	width: 50em;
	text-align: left;
}

/* To center the div in the viewport, we apply "auto" margins to left and right. To move the div away from the top and bottom of the viewport we use a margin of 10px. These can be combined into one shorthand CSS declaration: "margin: 10px auto". This will apply a margin of 10px to the top and bottom and auto margins to the left and right.  */

#container
{
	margin: 10px auto 0;
	color: #333;
	font-size: 1.1em;
	line-height: 130%;/* for readability  more or less, try it with the font selected */
	width: 780px;

}
#container p {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: normal;
	line-height: 1.1;
}

/* To style the top div, we will set a background color, padding and a border across the bottom. The three declarations will be: "padding: .5em;" to add padding to the div, "background-color: #ddd;" to add a background color and "border-bottom: 1px solid gray" to apply a border to the bottom of the div.  */

#header
{
	padding: 0.5em;
	background-color: #E4EEDB;
	text-align: center;
	height: 210px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
#headerPage
{
	text-align: center;
	height: 50px;
	width: 780px;
	background: #F3F4E8;
	background-color: #E4EEDB;
}
#headerPage h1
{
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-align: center;
	margin: 0em;
	padding: 0em;
	line-height: 1.2;
	text-transform: uppercase;
 
}


#header p {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight: bold;
	text-transform: uppercase;
	color: #000;
	float: left;
	text-align: center;
	height: 120px;
	margin-top: 0px;
	padding-left: 3.5em;
	padding-top: 2em;
}


.header{
	background: #9CF;
	text-align: left;
	margin: 10px;
	padding: 10px;
	border: thin solid #033;
	clear: right;
	width: 140px;
	float: left;
	height: 160px;
}


/* Inside the top banner there is an H1 tag. We want the words to sit .5em in from the top and left edge of the div. Browsers add different amounts of padding above an H1, it is easiest to remove all padding and margin from this H1 and let the div provide the padding. This is achieved by using a descendant selector - "#top h1 { padding: 0; margin: 0;}". */

#header img
{
	float: left;
	clear: both;
	border: thin solid #030;
	padding: .2em;
}

#header h1
{
padding: 0;
margin: 0;
}

/* Next, we set the margin to "0", add 1em of padding (which will move the text away from the edges of the div). */

#mainContent
{
	float: left;
	width: 455px;
	margin: 0;
	padding: 1em;
	text-align: left;
	margin-top: 0px;
	background: #F3F4E8;
	border-right: thick groove #900;
	border-left: thick groove #900;
	border-top: thick groove #900;
	color: #000;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
#mainContent #imgbox p {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-align: center;
	font-size: .9em;
	margin: 0px;
	padding: 0px;
}

#mainContent img {
	text-align: center;
	padding: 1px;
	border: thin solid #030;
	margin: 0px auto;
	display: block;
}


/* To float the left nav, we need to use the rule: "#leftnav {float: left;}". When a div is set to float, a width must also be included, so we can add another declaration: "width: 160px;". */

#leftnav1
{
float: left;
width: 160px;
}

/* This next step is the most important of the entire process. The "leftnav" div has been floated, so text from the "content" div will flow down its left edge and then wrap around under it. To make the text appear as it is in a new column, we apply margin-left to the "content" div, making sure that the width is greater than the overall width of the "leftnav" div. In this case, we will use "margin-left: 200px", which will give us 40px margin between the leftnav and the main content. 
We will also apply a border to the left of the "content" div. This could be a problem if the "leftnav" div is longer than the main content. If this is the case, the border can be applied to the right side of the "leftnav" div instead of the "content" div. */

#mainContent h1 {
	line-height: 1.1;
	text-align: center;
}
li {
	color: #000;
	text-align: left;
	list-style: none;
	padding: 0;
	margin: 0;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
ul li {
	margin: 0px 20px 0px -25px;
	font-weight: 100;
	line-height: 1.4em;
	font-size: 97%;
}
dl dt {
	color: #900;
	margin: 0px 0px 10px 12px;
	font-weight: bold;
	line-height: 1.4em;
	font-size: 1em;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
dl dd {
	color: #000;
	font-weight: bold;
	line-height: 1.4em;
	font-size: 0.95em;
	margin-top: 0px;
	margin-left: 12px;
	margin-bottom: 20px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
ul li span {
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.2em;
	padding: 9px;
}
.bold {
	font-size: 1.1em;
	font-weight: bold;
}

#faqlist ul span {
	font-weight: bold;
	color: #900;
}
#faqlist ul li {
	font-size: 1em;
	font-weight: normal;
	line-height: 1.2em;
	margin-top: 1em;
	display: block;
}

#content1
{
margin-left: 200px;
border-left: 1px solid gray;
}
 
 /* To add padding to the content div use "padding: 1em;".  */
 
#rightContent
{
	border-right: thick groove #900;
	padding: 1em;
	text-align: left;
	float: left;
	width: 230px;
	margin-top: 0px;
	background: #F3F4E8;
	border-top: thick groove #900;
}
 /* To style the footer, we first need to set it to "clear: both". This is critical, as it will force the footer below any floated elements above. We then add "padding: .5em" and "margin: 0" . */
 
#footer
{
	clear: both;
	margin: 0;
	height: 70px;
	background: #F3F4E8;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	border-top: thick groove #900;
	border-right: thick groove;
	border-bottom: thick groove;
	border-left: thick groove;
}
#header h4 {
	color: #900;
	text-align: center;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	margin: 1em 0 0 0;
}
.startParagraph {
	font-size: 1.2em;
}
.startParagraphRed {
	color: #900;
	font-size: 1.2em;
	font-weight: bold;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	line-height: 1.3;
}

#navbar {
	padding-bottom: 0.5em;
	padding-top: .5em;
}
#navcontainer
{
	background: #F3F4E8;
	width: 10em;
	margin: 0 auto;
	padding: 1em 0;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1em;
	text-align: left;
	text-transform: uppercase;
}

ul#navlist
{
	text-align: left;
	list-style: none;
	padding: 0;
	margin: 0 auto;
	width: 90%;
}

ul#navlist li
{
display: block;
margin: 0;
padding: 0;
}

ul#navlist li a
{
display: block;
width: 100%;
padding: 0.5em 0 0.5em 2em;
border-width: 1px;
border-color: #ffe #aaab9c #ccc #fff;
border-style: solid;
color: #777;
text-decoration: none;
background: #f7f2ea;
}

#navcontainer>ul#navlist li a { width: auto; }

ul#navlist li#active a
{
background: #f0e7d7;
color: #800000;
}

ul#navlist li a:hover, ul#navlist li#active a:hover
{
color: #800000;
background: transparent;
border-color: #aaab9c #fff #fff #ccc;
}
ul#faqlist li span
{
	margin: 0 20 0 -25;
	padding: 10;
	font-weight: bold;
	color: #900;
}
.picture2 {
	background-color: #F9F9F9;
	padding: 3px;
	text-align: center;
	width: 300px;
	font-family: Arial, sans-serif;
	font-size: 0.8em;
	line-height: 1.4em;
	color: #000;
	margin: 0px auto;
} 

.picture2 img {
	border: 1px solid #030;
	vertical-align:middle;
	margin-bottom: 2px;
	padding: 1px;
	margin-top: 13px;
} 
.center {
	text-align: center;
}
.caps {
	text-transform: uppercase;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #900;
	text-align: center;
	line-height: 1.4em;
}
.redtext {
	color: #900;
}
ul.QandA li.Q {
 
	padding:0 0 0 20px;
}

ul.QandA li.A {
 
	padding:0 0 16px 20px;
}