/* Zero out standard (and inconsistent) web browser formatting of (X)HTML */
html, body, h1, h2, h3, h4, h5, h6, ol, ul, li, blockquote {
padding: 0;
margin: 0;
}

/* Set standard size to overcome inconsistent browser default heading font sizes */
h1, h2, h3, h4, h5, h6 {
font-size: 1em;
}


/* -- Global Styles -- */
body {
background: #99CCCC;
margin-top: 25px;
}


/* -- Global Typography and  Links -- */
.h1 {
font-family: arial, helvetica, sans-serif;
font-size: 25px;
font-style: normal;
font-weight: bold;
color: #000000;
}

.h2 {
padding: 0;
margin: 0;
font-family: arial, helvetica, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: bold;
color: #000000;
}

.subheading {
font-weight: bold;
font-size: 12px;
font-family: arial, sans-serif;
color: #000000;
line-height: 16px;
}

.citation {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
}

a:link, a:visited, {
text-decoration: none;
color: #0033CC;
}

a:hover  {
color: #FF0000;
text-decoration: underline;
}



/* -- MAJOR PAGE CONTAINERS -- */
#pagewrapper {
/* Styles borders, colors, margins, etc. for entire page */
width: 760px; /* Set width for entire page contents container */
padding: 10px; /*To provide consistent padding between all inner content containers and edge of page wrapper*/
margin: 0 auto 0 auto; /*Center container on page*/
text-align: left; /*to make IE display wholepage div in center of screen*/
border: 2px solid #c00;
background-color: #ffffff;
}



#headerwrapper {
padding: 0 0 3px 0;
margin: 0;
float: left;
border-bottom: 2px solid #ffcc00;
width: 760px;
}


#headertext {
padding: 0 3px 0 0;
margin: 66px 0 0 0;
float: left;
width: 610px;
}

#headertext h1 {
padding: 0;
margin: 0;
font-weight: bold;
font-style: normal;
font-size: 2em;
font-family: arial, verdana, helvetica, sans-serif;
color: #000000;
text-align: right;
}

#headertext h2 {
padding: 0;
margin: 0;
font-weight: bold;
font-style: normal;
font-size: 1.5em;
font-family: arial, verdana, helvetica, sans-serif;
color: #000000;
text-align: right;
}

#headertext h3 {
padding: 0;
margin: 0;
font-weight: bold;
font-style: normal;
font-size: 10px;
font-family: arial, verdana, helvetica, sans-serif;
color: #c00;
text-align: right;
}


#headerimage {
border: 0px solid black;
padding: 0;
margin: 0;
float: right;
width: 146px;
height: 142px;
background-image: url(graphics/john.jpg);
background-repeat: repeat-no;
}



#content {
display: inline;
float: left;
width: 500px;
padding: 10px 20px 10px 10px;
margin-top: 5px;
margin-left: 155px; /* Set to allow gutter between columns; 150 + 5 */
background-color: #ffffff;
font-size: .80em;
font-family: verdana, arial, helvetica, sans-serif;
font-weight: normal;
line-height: 110%;
}


#content ul li {
list-style-position: outside;
margin: 0 0 0 32px;
}

#content ol li {
list-style-position: outside;
margin: 0 0 0 32px;
}



#mainnav {
float: left;
padding: 0;
margin: 0 0 10px -685px;
width: 150px; /* Set fixed width */
border-right: 2px solid #ffcc00;
background: #e0e0e0;
}

#mainnav h4 {
padding: 5px;
margin: 8px 0 0 8px;
width: 100px;
font-weight: bold;
font-size: 11px;
font-family: arial, verdana, helvetica, sans-serif;
color: #ffffff;
line-height: 12px;
border: 2px #FFF000 outset;
background-color: #00709E;
text-transform: uppercase;
}


#mainnav ul {
/* IE uses margin to adjust lists; Firefox uses padding. Use both in style to ensure correct application and uniform results by both browsers*/
margin: 0;
padding: 0;
}

#mainnav li {
padding: 0;
margin: 3px 0 0 8px;
width: 120px;
list-style-type: none;
font-weight: bold;
font-size: 11px;
font-family: arial, verdana, helvetica, sans-serif;
line-height: 10px;
}

#mainnav ul a {
display: block;
}

#mainnav a:link, a:active, a:visited {
color: #000000;
text-decoration: none;
padding: 3px 0 3px 4px;
margin: 0;
}

#mainnav a:hover {
background-color: #999;
border-left: 3px solid #FFF000;
color: red;
width: 120px;
margin: 0px 0px 0px 8px;
padding-left: 5px;
}



/* -- FOOTER --*/
#footer {
clear: both;
padding: 0;
margin: 0;
text-align: center;
border-top: 1px solid black;
}


#footermenu {
padding: 0;
margin: 8px 0 8px 0;
font-weight: bold;
color: #333;
font-size: 10px;
font-family: verdana, arial, helvetica, sans-serif;
}

#footermenu ul {
margin: 0;
padding: 0;
list-style: none;
}

#footermenu ul li {
display: inline;
margin: 0 20px 0 0;
}

#footermenu a {
text-decoration: none;
font-weight: bold;
border-bottom: 2px dotted #A5E410;
}

#footermenu a:hover {
background-color: #FFC423;
}



/* -- HTML Pages --*/
.htmltable {
border: 1px solid black;
border-collapse: collapse;
}

.htmltable th {
padding: 5px;
font-weight: bold;
font-size: 12px;
font-family: arial, sans-serif;
color: #000000;
text-align: left;
background-color: #E0E0E0;
}

.htmltable td {
padding: 5px;
vertical-align: top;
}

.htmltable tr.example {
padding: 0;
vertical-align: top;
font-family: verdana;
font-weight: bold;
background-color: yellow;
}

.htmltable tr.empty {
padding: 0;
height: 10px;
border-bottom: 1px dotted #E0E0E0;
}

/* --- HTML Color Pages --*/
.table-content {
width: 500px;
border-spacing: 0px;
border: 1px solid black;
margin-right: auto;
margin-left: auto;
background: #FFFFFF;
}

.table-content td {
padding: 5px;
}


.table-colorchart {
border-spacing: 10px;
border: 1px solid black;
margin-right: auto;
margin-left: auto;
background: #FFFFFF;
}

.table-colorchart td {
padding: 10px;
}


.table-display {
padding: 3px;
border-spacing: 0px;
border: 1px solid black;
vertical-align: middle;
margin-right: auto;
margin-left: auto;
background: #FFFFFF;
}



/* -- Speaking Pages --*/
#speech {
padding: 10px;
margin: 0 auto 0 auto; /*Center container on page*/
text-align: left; /*to make IE display wholepage div in center of screen*/
width: 550px;
border: 1px solid black;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
font-style: normal;
font-weight: normal;
background-color: #ffffff;
}



/* -- Research Pages --*/
.example {
font-family: "Times New Roman";
font-size: 12px;
background-color: #FFFF10;
}


/* -- Writing Pages --*/
#paradigmtable {
width: 90%;
border: 1px solid black;
border-collapse: collapse;
}

#paradigmtable th {
padding: 8px;
font-family: arial;
font-weight: bold;
font-size: 14px;
text-align: center;
background-color: silver;
}

#paradigmtable tr.odd {
background-color: #e0e0e0;
}

#paradigmtable tr.even {
border-top: 1px solid #ffcc00;
border-bottom: 1px solid #ffcc00;
border-right: 0;
border-left: 0;
}

#paradigmtable td {
padding: 8px;
vertical-align: top;
}