/* main layout and positioning styles */
html, body {margin: 0; padding: 0;}
body {font-size: medium; font-family: Arial, Helvetica, Verdana, sans-serif; background-color: #E5E7E9;}

#site_container {width: 60em; margin: 0 auto; padding: 1em;}
#header, #main_container {position: relative;}
#content {margin-left: 15em;}
#panels {position: absolute; top: 0; left: 0; width: 14em; padding-right: 1em;}

/*
 * global text styles
 */
a {color: #3F79BF;}
a:link, a:visited {}
a:hover, a:focus, a:active {color: #3399FF;}

a.download {display: block; height: 1.75em; line-height: 1.75; padding-left: 25px; background: url(images/icon_download.gif) no-repeat left center;}

h3 {font-size: 1.25em; padding-left: 25px; background: url(images/icon_heading.gif) no-repeat left center;}
h4 {font-size: 1em;  padding-left: 20px; background: url(images/icon_comment.gif) no-repeat left bottom;}


/*
 * header styles
 */
#header {color: white; font-variant: small-caps; background: url(images/header_background.png) repeat-x;}
#header div.b1 {background: url(images/header_left.png) no-repeat left top;}
#header div.b2 {background: url(images/header_right.png) no-repeat right top;}
#header div.b3 {height: 168px;}

#header h1 {margin: 0; padding: 0; position: absolute; left: 54px; top: 34px; width: 230px; height: 100px; background: url(images/header_logo.gif) no-repeat;}
#header h1 span {position: absolute; left: -1000px;}
#header p {margin: 0; padding: 0; position: absolute; z-index: 1; margin: 0; padding: 0; top: 135px; right: 25px; font-family: Verdana, Arial, Helvetica, sans-serif;}

#header #nav {position: absolute; top: 4px; right: 4px; margin: 0; padding: 10px 2px 50px 96px; width: 172px; height: 100px; list-style: none; background: url(images/header_nav_grid.gif) no-repeat;}
#header #nav a {display: block; padding: 2px 0 2px 1em; height: 20px; line-height: 21px; color: white; text-decoration: none; font-weight: bold; letter-spacing: 0.2em;}
#header #nav a:link, #nav a:visited {}
#header #nav a:hover, #nav a:focus, #nav a:active {font-weight: bold; background: url(images/header_nav_hover.png);}


/*
 * content styles
 */
#content {background: #F5F8FC url(images/content_watermark.jpg) no-repeat right bottom;}

#content div.b1 {background: url(images/content_border_top.png) repeat-x top;}
#content div.b2 {background: url(images/content_border_right.gif) repeat-y center right;}
#content div.b3 {background: url(images/content_border_bottom.gif) repeat-x bottom;}
#content div.b4 {background: url(images/content_border_left.gif) repeat-y center left;}

#content div.e1 {background: url(images/content_edge_right_bottom.png) no-repeat bottom right;}
#content div.e2 {background: url(images/content_edge_left_bottom.png) no-repeat bottom left;}
#content div.e3 {background: url(images/content_edge_left_top.png) no-repeat top left;}
#content div.e4 {background: url(images/content_edge_right_top.png) no-repeat top right;}

#content div.e4 {padding:  0.3em 1.5em 1.5em 1.5em;}
#content div.c {font-size: 1px; height: 0px}

#content h2 {margin: 0; padding: 0; line-height: 40px;}
#content h2 {font-size: 1.25em; font-weight: normal; font-variant: small-caps; font-family: Verdana, Arial, Helvetica, sans-serif; letter-spacing: 0.35em; color: white;}

/*
 * content footer styles
 */
#footer {font-size: 0.75em; color: gray; text-align: center;}
#footer a {color: gray; text-decoration: none;}
#footer a:hover, #footer a:focus, #footer a:active {text-decoration: underline;}


/*
 * panel styles
 */
.panel {background-color: #ECF1F9; margin-bottom: 1em;}
.panel div.b1 {background: url(images/panel_header_background.png) repeat-x top;}
.panel div.b2 {background: url(images/panel_border_right.png) repeat-y right;}
.panel div.b3 {background: url(images/panel_border_bottom.png) repeat-x bottom;}
.panel div.b4 {background: url(images/panel_border_left.png) repeat-y left;}
.panel div.b5 {background: url(images/panel_header_left.png) no-repeat left top;}
.panel div.b6 {background: url(images/panel_header_right.png) no-repeat right top;}
.panel div.b7 {background: url(images/panel_bottom_right.png) no-repeat right bottom;}
.panel div.b8 {background: url(images/panel_bottom_left.png) no-repeat left bottom;}

.panel div.b8 {padding: 0 1em 1em 1em;}
.panel div.c {font-size: 1px; height: 0px}

.panel h2 {margin: 0 0 1em 0; padding: 5px 0 0 0; line-height: 25px;}
.panel h2 {font-size: 0.9em; font-weight: normal; font-variant: small-caps; font-family: Verdana, Arial, Helvetica, sans-serif; letter-spacing: 0.2em; color: white;}

.panel p {margin: 0.5em 0;}
.panel ul {margin: 0; padding: 0 0 0 1.5em;}
.panel a {text-decoration: none;}


/*
 * error styles
 */
.errors {background-color: #F6DFE2;}

.errors div.eb1 {background: url(images/error_top.gif) repeat-x top;}
.errors div.eb2 {background: url(images/error_right.gif) repeat-y center right;}
.errors div.eb3 {background: url(images/error_bottom.gif) repeat-x bottom;}
.errors div.eb4 {background: url(images/error_left.gif) repeat-y center left;}

.errors div.ee1 {background: url(images/error_right_bottom.gif) no-repeat bottom right;}
.errors div.ee2 {background: url(images/error_left_bottom.gif) no-repeat bottom left;}
.errors div.ee3 {background: url(images/error_left_top.gif) no-repeat top left;}
.errors div.ee4 {background: url(images/error_right_top.gif) no-repeat top right;}

.errors div.ee4 {padding:  0.3em 1.5em 1.5em 1.5em;}
.errors div.c {font-size: 1px; height: 0px}


/*
 * special panel styles
 */
#login_panel label {display: block;}
#login_panel input {display: block; margin-bottom: 0.5em;}


/*
 * debug styles
 */
/*
#site_container {border: 1px solid red;}
#main_container {border: 1px solid blue;}
#content {border: 1px solid red;}
#panels {border: 1px solid green;}
*/