/* CSS Based Layout for Sun Prairie Public Library */

body { background: #cfd2e5 url(../images/layout/gradient.gif) repeat-x top left; font-family: Arial, Helvetica, sans-serif; font-size: 100.1%; margin: 8px; } 
a:link { color: #000066; }
a:visited { color: #333399; }

/* Skip Navigation Link */
#skipper { position: absolute; top: 0; left: 0;	width: 100%; text-indent: -600em; color: #fff; background: transparent; font-size: 0.8em; z-index: -1; }
#skipper:focus, #skipper:hover, #skipper:active { display: block; text-indent: 25px; background: #FFF; font-weight: bold; color: #000; padding: 0.2em 0.2em 0.2em 0; z-index: 5; }

/* Layout Styles */
#wrapper { background: #FFF; width: 80%; padding: 7px; margin: 0 auto; min-width: 775px; }
#header_wrapper { background: #333399 url(../images/layout/sun-bg.jpg) no-repeat right top; }
#header { width: 100%; height: 186px; background: url(../images/layout/summer.jpg) no-repeat left 37px; position:relative; }

#header h1 { position: absolute; left: 0; width: 566px; display: inline; font-size: 1.9em; margin: 0 7px; color: #FFF; }
#header h1 a { color: #FFF; text-decoration: none; }
#header h1 a:hover { text-decoration: underline; }
#contact { margin: 0 0 0 580px; padding: 10px 12px 9px 12px; font-size: .75em; color: #FFF; }
#contact h2 { margin: .9em 0 0 0; font-size: 1.2em; }
#contact p { margin: 0 0 0 0; }
#contact a { color: #FFF; }
#header img { border: 0; position: absolute; bottom: 0; left: 0; }

ul#primarynav { position: absolute; bottom: 0; left: 0; list-style-type: none; margin: 0; padding: 0px 0; background: #FFF; font-size: .9em; width: 580px; border-top: 1px solid #333399; border-bottom: 3px solid #FFE555; }
ul#primarynav li { list-style-type: none; display: inline; margin: 0; padding: 2px 0; background: url(../images/layout/border.gif) no-repeat left bottom;  }
#primarynav li a { color: #000066; font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; text-decoration: none; font-weight: bold; padding: 0 12px; }
#primarynav li a:hover, #primarynav li a:active { background: #FFE555 url(../images/layout/border.gif) no-repeat left bottom; }

#content_wrapper { background: #FFF url(../graphics/nav_bg.gif) repeat-y left top; border-bottom: 3px solid #333399; overflow: auto; }
#navigation { width: 185px; background: #e1e1ff; float: left; }
#content { position: relative; top: 0; margin-left: 195px; padding: 1px 22px 1px 0; background: #FFF;  }
#breadcrumbs { padding: 5px 0; font-size: .8em; }
#pagetitle { font-size: 2em; margin-bottom: 0; font-size: 1.7em; }
#pagecontent { position: relative; padding-left: 25px; font-size: .8em; }

/* Optional Editable Regions */
#pagesubtitle { margin-top: 0; font-size: 1em; }
.lookformore { margin-bottom: 0; font-weight: normal; font-size: .95em; }
.lookformorelinks { margin-top: 0; font-weight: normal; font-size: .95em; }

#navigation ul { list-style-type: none; margin: 0; padding: 0; }
#navigation ul li { list-style-type: none; margin: 0; padding: 5px; font-size: .8em;}
#navigation ul li a { padding: 5px; }
#navigation ul li a:hover, #navigation ul li a:active { background: #FFE555; }
#navigation h2 { color: #000; font-size: .85em; padding: 0 5px; margin: 15px 0 0 0; }
#citylogo { display: block; margin: 15px auto; text-align: center; text-decoration: none; width: 74px; }

#footer { overflow: auto; clear: left; }
.footerlinks { font-size: .7em; float: left; }
.footerlinks p { margin: 0; }
#copyright { display: block; width: 185px; font-size: .7em; float: right; margin: 0; }

/* Calendar Styles */
.calendar, .calendar td { border-collapse: collapse; border: 1px solid #CCC; } 
.daysofweek { color: #FFF; background-color: #333399; font-weight: bold; } 
.days { color: #000; background-color: #E1E1FF; font-weight: bold; }
.daysofweek td, .days td, td.daysofweek, td.days { border: 1px solid #CCC; border-collapse: collapse; }

/* Contribute-Ready Styles */
.highlight { color: #CC0000; }
.topicnav { vertical-align: top; }
.topicnav h2 { margin-bottom: 0; }
.topicnav p { margin-top: 0; }
.textbigger { font-size: 1.1em; }
.textsmaller { font-size: .9em; }
/* Legacy Styles */
.style2 { font-weight: bold; color: #660066; }
.style8 {color: #003333}
.links, .textbold { font-weight: bold; }