@charset "utf-8";

/* resets */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em,
img, ins, kbd, q, samp, small, strike, strong, sub, sup,
tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
{ margin: 0;  padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; }
table { border-spacing: 0; border-collapse: collapse; }
caption, th, td { text-align: left; font-weight: normal; }
:focus { outline: 0; }
ul { list-style: none; }

/* basic utils */
.imgleft    { float: left; margin: 0 15px 18px 0; }
.imgright   { float: right; margin: 0 0 18px 15px; }
.clear      { clear: both; padding-top: 1px; }
.clearleft  { clear: left; padding-top: 1px; }
.clearright { clear: right; padding-top: 1px; }
.relative   { position: relative; }
.left       { float: left; }
.right      { float: right; }
.center     { text-align: center; }
.mb10       { margin-bottom: 10px; }
.mt10       { display: block; margin-top: 10px; }
.mt20       { display: block; margin-top: 20px; }
.hidden     { display: none; }

/* typography */
html    { font: 16px/19px 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: normal; color: #555; }

h1, h2, h3, h4 { position: relative; display: block; font-weight: normal; color: #0071BC; }
h1      { font-size: 30px; line-height: 36px; margin-bottom: 3px; }
h1 span { display: block; padding: 0 0 2px 0; margin-bottom: 13px; border-bottom: 2px solid #b3b3b3; }
h2      { font-size: 30px; line-height: 33px; margin-bottom: 3px; }
h2 span { display: block; padding: 0 0 3px 0; border-bottom: 2px solid #b3b3b3; }
h3      { font-size: 24px; line-height: 28px; }
h4      { font-size: 18px; line-height: 22px; }

#search-results, .lake_search label, .quiet, #gnav   { font-size: 12px; font-weight: bold; }

a       { color: #0071BC; text-decoration: none; }
a:hover { color: #0071BC; text-decoration: underline; }

.details-table td, .serif  { font-family: Georgia, Times New Roman, Times, serif; color: #404055; }

p       { margin-bottom: 10px; }

/* body */
body { position: relative; text-align: center; background: #F8F8F8; }

/* masthead */
#masthead { position: relative; text-align: left; width: 850px; height: 60px; margin: 0 auto; z-index: 1; }
#masthead .klm-astra-logo { display: block; position: absolute; top: 0; left: 15px; width: 400px; height: 60px; background: transparent url(http://media.kansaslakemaps.com/images/elements/klm-astra-logo.png) bottom left no-repeat; }
#masthead .kbs-ku-logo { position: absolute; right: 15px; top: 0; height: 60px; width: 180px; background: transparent url(http://media.kansaslakemaps.com/images/elements/kbs-ku-logo.png) bottom right no-repeat; }

/* container and blocks */
.container { position: relative; text-align: left; width: 850px; margin: 0 auto; clear: both; background: #fff; border: 2px solid #B3B3B3; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }

#main-content { position: relative; width: 820px; padding: 15px; }

.content-sm, .content-md { position: relative; padding: 0 15px 0 0; float: left; }
.content-sm { width: 260px; height: 100%; }
.content-md { width: 530px; height: 100%; }

/* lake details table */
.details-table th { color: #0071BC; padding: 0 10px 3px 0; width: 130px; }
.details-table td { padding: 0 0 3px; width: 400px; }

/* image border */
#main-content img { width: 250px; padding: 5px; border: 2px solid #B3B3B3; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

/* global nav and search header */
#search-header, #gnav { position: relative; display: block; padding: 10px 15px; color: #555; }
#search-header { border-bottom: 2px solid #B3B3B3; }
#gnav { border-top: 2px solid #B3B3B3; }

.gnav-active { background: #ddd; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#gnav-links li { display: inline; float: left; margin: 0 5px 0 0; }
a.quiet, #gnav-links li a { display: block; float: left; padding: 5px 10px; color: #555; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
a.quiet:hover, #gnav-links li a:hover { background: #ddd; text-decoration: none; }

#search-results { padding: 5px 0; }
.search-query { color: #333; background: #e5e5e5; margin-left: 5px; padding: 5px 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

/* search */
.lake_search { position: relative; float: right; padding: 2px 0; }
.lake_search label { padding: 0 10px 0 0; }
.lake_search_input { width: 130px; border: 2px solid #B3B3B3; background: #F2F2F2; padding: 3px 23px 3px 3px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.lake_search_button { position: absolute; top: 3px; right: 2px; padding: 0; width: 22px; height: 22px; border: none; color: #b3b3b3; background: url(http://media.kansaslakemaps.com/images/elements/search-icon-sm.png) center center no-repeat; }

/* browse table */
.browse-table a { display: block; color: #555; }
.browse-table a:hover { color: #0071BC; }

.browse-table td { position: relative; padding-right: 15px; }
.browse-table .last { padding-right: 0px; }

.browse-table-head a { display: block; height: 20px; color: #555; border-bottom: 2px solid #b3b3b3; padding: 0 0 5px 0; margin: 0 0 10px 0; font-size: 18px; }
.browse-table-head a:hover { color: #0071BC; border-color: #0071BC; text-decoration: none; }

.browse-table td .browse-active, .browse-table .browse-active, .browse-table .browse-active a { color: #0071BC; border-color: #0071BC; }

/* browse columns */
.browse-icon { float: left; margin-left: 10px; height: 20px; width: 20px; display: block; background: #fff url(http://media.kansaslakemaps.com/images/elements/klm-icons.png) -9999px -9999px no-repeat; }

.browse-lake .browse-icon 	{ background-position: 0 0; }
.browse-area .browse-icon 	{ background-position: -20px 0; }
.browse-depth .browse-icon 	{ background-position: -40px 0; }
.browse-county .browse-icon { background-position: -60px 0; }
.browse-city .browse-icon 	{ background-position: -80px 0; }

.browse-lake a:hover .browse-icon, .browse-lake .browse-active .browse-icon 	{ background-position: 0 -20px; }
.browse-area a:hover .browse-icon, .browse-area .browse-active .browse-icon 	{ background-position: -20px -20px; }
.browse-depth a:hover .browse-icon, .browse-depth .browse-active .browse-icon 	{ background-position: -40px -20px; }
.browse-county a:hover .browse-icon, .browse-county .browse-active .browse-icon  { background-position: -60px -20px; }
.browse-city a:hover .browse-icon, .browse-city .browse-active .browse-icon 	{ background-position: -80px -20px; }

.browse-lake 	{ width: 255px; }
.browse-area 	{ width: 110px; }
.browse-depth 	{ width: 95px; }
.browse-county 	{ width: 150px; }
.browse-city 	{ width: 150px; }

/* percent browse */
.browse-percent { position: relative; display: block; background: #e3e3e3; white-space: nowrap; }
.browse-active .browse-percent { background: #CADCFF; }

/* download */
.download-button a { display: inline-block; border: solid 2px #b3b3b3; color: #555; padding: 5px 10px 5px 5px; height: 18px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.download-button a:hover { border: solid 2px #0071bc; color: #0071bc; text-decoration: none; }
.download-icon { float: left; height: 20px; width: 20px; background: url(http://media.kansaslakemaps.com/images/elements/klm-icons.png) -100px 0px; margin-right: 5px; }
a:hover .download-icon { background-position: -100px -20px; }

/* errors */
.error-noresults { text-align: center; width: 100%; padding: 50px 0; color: #ccc; }

/* footer */
#footer { position: relative; text-align: left; font-size: 12px; line-height: 14px; width: 850px; height: 100px; margin: 0 auto; z-index: 0; color: #999; }
.footer-kwo { position: absolute; top: 5px; right: 15px; display: block; background: transparent url(http://media.kansaslakemaps.com/images/elements/kwo-logo.png) top left no-repeat; height: 50px; width: 90px; }
.footer-kwo-info { position: absolute; text-align: right; top: 0; right: 110px; padding: 10px 0; width: 300px; height: 70px; color: #999; }
#footer a { font-weight: bold; }

.footer-kwo-info a         { color: #666; }
.footer-kwo-info a:hover   { color: #333; text-decoration: none; }