﻿html {
      height: 100.1%; 
}

body
{
	margin: 0;
	padding: 0;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 76%;/* font sizing in ems, baby. if you want to change anything, just change this.*/
	/*funny thing happens at 75% and lower. opera goes to a nice small size, but moz and ie pc change almost not at all. seems 76% is as small as you can go and stay the same across browsers. poop.*/
	font-size-adjust: .71;  /*New feature for Firefox 3. this value is a pretty good for matching up with IE */
	color: #555;
	background-color: #fff;
}
a:link, 
a:visited
{
	color:#000000;
}

a:hover
{
	color:#111111;
	text-decoration:underline;
} 
div.center-ie5 /* this is needed in IE5 to center content*/
{
	text-align:center;
	width:100%;
}
.MenuItem a
{
    display: block;
    text-align: center;
    text-transform: uppercase;
/*    letter-spacing: .45em; */
    text-decoration: none;
    color:#AAAAAA;
}
.MenuStatic
{
    border-top:solid 5px #AAAAAA;
    color:#AAAAAA;
}
.MenuHover, .MenuHover a, .MenuHover a:hover
{
    border-top:solid 5px #095183;
    color:#333333;
}
.MenuSelected, .MenuSelected a, .MenuSelected a:hover
{
    border-top:solid 5px #095183;
    color:#333333;
}

p {
	font-size: 1.0em;
    line-height:1.8em; /*FF*/
    #line-height:1.5em; /*IE */	
	margin:.8em 0em .8em 0em;
}

ol, ul, li, dl {/*
	list-style: none;*/
	font-size:1.0em;
    line-height:1.8em; /*FF*/
    #line-height:1.4em; /*IE */		
	margin-top:0.2em;
	margin-bottom:0.1em; 
}

li > p {
	margin-top: 0.2em;
}

pre {/*moz 1.0/1.1/1.2.1, net 7.0/7.01 make this way too small, but i'm not going to go larger because monospace tends to run you into overflow pretty quick. prior moz and net are okay.*/
	font-family: monospace;
	font-size: 1.0em;
}

strong, b {
	font-weight: bold;
}
	
img { border:none; }

img.banner {
	display:block;		/*this line removes the ~3px space beneath images */
}

img.right {
	float:right;
	padding:4px 4px 10px 10px;
}

img.left {
	float:left;
	padding:4px 10px 10px 4px;
}
	
/*	BEGIN MAJOR BLOCKS SECTION	*/
div.container {
	margin-top:2px;
	margin-left:auto;
	margin-right:auto;	
	border-width:0px;
	width:750px;
	text-align:left;
}
div.notfooter {
    border: 1px solid #095183;
}
div.top{
    height:auto;
    border-bottom:1px solid #095183;  
    padding:3px 12px 3px 12px;
    margin-bottom:0px;
}
div.title{
    float:left;
    width:450px;
}
div.contactus
{
    float: right; /*    height: 20px;*/
    margin-top:12px;
    width: 250px;
    font-size: .95em;
    text-transform: uppercase;
    text-decoration: none;
    color: #666666;
    text-align: right;
    vertical-align: bottom;
    position: relative;
}
div.contactus a
{
    text-decoration: none;
    color: #666666;
}
div.menu
{
    width: 100%;
    position: relative;
    vertical-align: bottom;
    clear:both;
}
div.bottommenu, div.bottommenu a
{    
    /*    padding:0 0 .1em 0; */
    text-align:-moz-center; /*FF*/
    #text-align:center; /*IE */    
    height:30px;
    clear: both;
    background-image: url( 'Images/sliver_bottom.jpg' );
    background-repeat: repeat-x;
    color: #FFFFFF; 
    background-color: #095183;
    font-size:.94em;
    text-decoration: none;
    letter-spacing: .15em;

}
div.bottommenuitems
{
    display: inline;
    position: relative;
    top: 11px;

}

div.bottommenuitems a
{
    background-image: none;
}
div.bottommenuitems a:hover
{
    color:#999999;
}

div.leftpic {
	float:left;
	width:229px;
	padding:5px;
}



div.main
{
    width: 490px;
    margin: .5em 0em 0em 0em;
    padding: .75em 3em .5em 0em; /* use padding instead of margin for multicolumn layouts because of a really odd ie5pc bug where it sometimes relates the width of an unrelated menu div to this div. i'll, uh, write about that somewhere. it was hard to figure out what was causing it, so i want this note here to remind me. */
    float: right;
    font-size: 1em;
}
div.mainnopics
{
    width: 720px;
    margin: .5em 0em 0em 0em;
    padding: .75em 1em .5em 0em; /* use padding instead of margin for multicolumn layouts because of a really odd ie5pc bug where it sometimes relates the width of an unrelated menu div to this div. i'll, uh, write about that somewhere. it was hard to figure out what was causing it, so i want this note here to remind me. */
    float: right;
    font-size: 1em;
}

div.left
{
    font-size: 1em;
    font-weight: bold; 
    padding: 3.5em 0em 0em 1.5em;
    width: 180px;
    height: 380px;
    text-align: center;
}
div.leftnopics
{
    width: 0px;
    height: 0px;
}
div.footer {
/*	margin-left:auto;
	margin-right:auto; */
    margin:	0px auto;
    padding:0px 0px 5px 0px;
	width:748px;
	display:block;
	clear:both;
    text-align:-moz-center; /*FF*/
    text-align:center; /*IE */
	background:#ffffff;
}
div.fineprint {
	padding:5px;
	width:700px;
	font-size:.8em;
}
/*	END MAJOR BLOCKS SECTION	*/


/*	BEGIN TITLES AND TEXT HEADER SECTION	*/

/*the following classes are to demonstrate better line heights for narrow columns*/	
.pagetitle
{
    color: #095183;
    font-size: 1.2em;
    font-weight: bold;
    left: 1em;
}
.narrow1{
	width: 50%;
	line-height: 1.3em;
	}
.narrow2{
	width: 50%;
	line-height: 1.5em;
	}
div.upperrightpic {
    width:280px;
    float:right;
    text-align: center;
    margin:0em 0em 1.2em 1.2em;
}

div.upperleftpic {
/*    width:280px; */ 
    float:left;
    text-align: center;
    margin:0em 1.2em 1.2em 0em;
}

.caption1 {
    color:#6C9D31;
    font-size:1.05em;
    font-weight:bold;
    position:relative;
    top:4px;
}
.caption2 {
    color:#095183;
/*    font-size:.97em; */
    position:relative;
    top:4px;
}
div.rightpic {
    width:180px;
    float:right;
    text-align: center;
    margin:2em 0em 1.2em 1.2em;
}
h1 {
	font-size: 2.0em;
	font-weight: normal;
	margin-top: 0em;
	margin-bottom: 0em;/*both set to zero and padding in header div is used intead to deal with compound ie pc problems that are beyound summary in a simple comment.*/
	}
h2 {
	color:#095183;
	font-size: 1.7em;
	margin: .75em 0em .5em 0em;
	font-weight: normal;
	}
h3 {
	color:#095183;
	font-size: 1.25em;
	margin: 0em 0em -.25em 0em;
	font-weight: bold;
	}
h4
{
    color: #ef3b39; /* "Books for Budding Brains" red */
    font-size: 1.2em;
    margin: 1.2em 0em -.25em 0em;
    font-weight: bold;
    font-style: italic;
    text-transform: uppercase;
}
h5 {
	font-size: 1.0em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
h6 {
	font-size: 0.8em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
/*	END TITLES AND TEXT HEADER SECTION	*/