@import url("reset.css");

/* text styles */

body { font-family: "Helvetica Neue", "HelveticaNeue", Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; color: #444444; background: url(body-bg.jpg) top center no-repeat; background-color: #FFFFFF; }
p { margin: 0px 0px 20px 0px; }
em { font-style: italic; }
strong { font-weight: bold; }

ul { list-style: disc; margin: 0px 0px 20px 20px; }
ol { list-style: decimal; margin: 0px 0px 20px 20px; }

h1 { font-size: 36px; line-height: 36px; font-weight: bold; margin: 0px 0px 10px 0px; color: #000000; text-shadow: 0px -1px 0px #ffee86; }
h2 { font-size: 24px; line-height: 30px; font-weight: bold; margin: 0px 0px 20px 0px; }
h2.headline { font-size: 21px; line-height: 27px; color: #000000; }
h3 { font-size: 18px; line-height: 24px; font-weight: bold; margin: 0px 0px 5px 0px; }
h4 { font-size: 14px; line-height: 14px; font-weight: bold; margin: 0px 0px 12px 0px; color: #8d8350; text-transform: uppercase; letter-spacing: 1px; }

/* page structure */

.container { width: 940px; margin: 0px auto; }
#header { width: 100%; margin: -8px 0px 20px 0px; padding: 20px 0px; background: url(header-bg.png) top left repeat-x; background-color: #ffde00; border-top: 8px solid #000000; border-bottom: 8px solid #000000; }
#header h3 { text-transform: uppercase; color: #000000; margin: 0px; }
#content { float: left; width: 620px; min-height: 550px; margin: 0px 40px 20px 0px; }
#sidebar { float: left; width: 280px; }
#footer { clear: both; width: 100%; margin: 20px 0px 0px 0px; padding: 20px 0px; background-color: #000000; color: #FFFFFF; text-align: center; }
#footer a { color: #FFFFFF; text-decoration: none; }
#footer a:hover { color: #FFFF99; text-decoration: underline; }

/* navigation styles */

#nav { width: 926px; height: 28px; margin: 10px auto 0px auto; }
#nav ul { list-style: none; margin: 0px; }
#nav ul li { display: inline; }
#nav ul li a { float: left; display: block; padding: 5px 12px; margin: 0px 10px 0px 0px; background-color: #000000; color: #FFFFFF; font-size: 18px; line-height: 18px; font-weight: bold; text-decoration: none; border-top-left-radius: 10px;border-top-right-radius: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; }
#nav ul li a:hover { background-color: #efce0a; text-decoration: none; color: #FFFFFF; text-shadow: 0px -1px 0px #9d8929; }
#nav ul li a#current { background-color: #efce0a; text-decoration: none; color: #FFFFFF; text-shadow: 0px -1px 0px #9d8929; }

/* fancy chart */

.chart { margin: 0px 0px 20px 0px; border-top: 1px solid #444444; border-left: 1px solid #444444; }
.chart tr th { padding: 5px; vertical-align: top; border-bottom: 1px solid #444444; border-right: 1px solid #444444; background-color: #444444; color: #FFFFFF; font-weight: bold; text-align: left; }
.chart tr td { padding: 5px; vertical-align: top; border-bottom: 1px solid #444444; border-right: 1px solid #444444; }

/* fancy button */

a.button { padding: 10px 12px; font-size: 16px; line-height: 16px; font-weight: bold; color: #FFFFFF; text-shadow: 0px -1px 1px #000000; background: url(a-button-bg.png) top left repeat-x; background-color: #555555; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; text-decoration: none; }
a.button:hover { background-color: #444444; }

/* miscellaneous */

.floatleft { float: left; margin: 5px 20px 10px 0px; border: 1px solid #000000; }
.floatright { float: right; margin: 5px 0px 10px 20px; border: 1px solid #000000; }