/* ==========================================================================
   cc-portal v3.4.1  --  clairmontcounty.org master stylesheet
   Clairmont County Information Systems.  Last revised 08/22/2013 (rlm)
   NOTE: keep IE7 hacks below until Auditor's office upgrades from XP.
   ========================================================================== */

html, body, div, span, h1, h2, h3, h4, p, ul, ol, li, form, label, table, td, th {
    margin: 0; padding: 0;
}

body {
    background: #cfd6de url(../img/bg-tile.gif) repeat-x top;
    background-color: #cfd6de;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #222;
}

.wrap { width: 980px; margin: 0 auto; }
.clear { clear: both; }
img { border: 0; }

a { color: #1a5093; }
a:visited { color: #55308d; }
a:hover { color: #b03636; }

.skiplink { position: absolute; left: -3000px; }

/* ---- notice bar ---------------------------------------------------------- */
#noticebar {
    background: #fdf5d8;
    border-bottom: 1px solid #d9c27a;
    color: #5a4a12;
    padding: 5px 12px;
    text-align: center;
    font-size: 11px;
}

/* ---- utility bar ---------------------------------------------------------- */
#utilbar {
    background: #14284b;
    color: #cdd7e6;
    font-size: 10px;
    padding: 4px 0;
}
#utilbar a { color: #cdd7e6; text-decoration: none; }
#utilbar a:hover { text-decoration: underline; }
#utilbar .left { float: left; }
#utilbar .right { float: right; }
#utilbar .wrap:after { content: ""; display: block; clear: both; }

/* ---- banner ---------------------------------------------------------------- */
#banner {
    background: #1b3a6b url(../img/banner-grad.gif) repeat-x;
    background-color: #1b3a6b;
    border-bottom: 4px solid #c9a227;
    padding: 12px 0 10px 0;
}
#banner .wrap { position: relative; }
#banner .wrap:after { content: ""; display: block; clear: both; }
#seal { float: left; margin-right: 14px; }
#bannertext { float: left; padding-top: 10px; }
#bannertext h1 {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 27px;
    letter-spacing: 2px;
    font-weight: normal;
}
#bannertext h1 a { color: #ffffff; text-decoration: none; }
#bannertext .tagline {
    color: #b8c6dd;
    font-family: Georgia, serif;
    font-style: italic;
    font-size: 12px;
    padding-top: 3px;
}
#sitesearch {
    position: absolute; right: 0; top: 28px;
    color: #b8c6dd; font-size: 11px;
}
#sitesearch input[type=text] { font-size: 11px; padding: 2px; border: 1px solid #7d8fae; }
#sitesearch input[type=submit] {
    font-size: 11px; padding: 1px 8px;
    background: #c9a227; border: 1px solid #8a6f1c; color: #232323;
}

/* ---- top navigation ---------------------------------------------------------- */
#topnav { background: #2c4d80; border-bottom: 1px solid #16294a; }
#topnav ul { list-style: none; }
#topnav li { float: left; border-right: 1px solid #1d355f; }
#topnav li a {
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 12px;
    font-weight: bold;
    padding: 8px 16px;
}
#topnav li a:hover { background: #3a619c; }
#topnav li.active a { background: #ecf0f5; color: #1b3a6b; }
#topnav .wrap:after { content: ""; display: block; clear: both; }

/* ---- breadcrumb ---------------------------------------------------------------- */
#breadcrumb {
    background: #ecf0f5;
    border-bottom: 1px solid #c6cfdb;
    font-size: 11px;
    color: #444;
    padding: 5px 0;
}
#breadcrumb .current { color: #666; }

/* ---- page body ---------------------------------------------------------------- */
#pagebody {
    background: #ffffff;
    border-left: 1px solid #aab4c2;
    border-right: 1px solid #aab4c2;
    padding: 14px 14px 8px 14px;
    width: 950px;
}

#leftcol { float: left; width: 205px; }
#maincontent { float: right; width: 725px; min-height: 420px; }
#maincontent.fullwidth { float: none; width: auto; }

/* ---- sidebar boxes ---------------------------------------------------------- */
.navbox, .infobox { margin-bottom: 14px; border: 1px solid #b9c3d1; }
.navbox h3, .infobox h3 {
    background: #2c4d80 url(../img/h3-grad.gif) repeat-x;
    background-color: #2c4d80;
    color: #fff;
    font-size: 12px;
    padding: 5px 8px;
    font-family: Arial, sans-serif;
}
.infobox h3 { background-color: #5f6f85; }
.navbox ul { list-style: none; }
.navbox li { border-bottom: 1px solid #dde3ea; }
.navbox li a { display: block; padding: 5px 8px; text-decoration: none; font-size: 11px; }
.navbox li a:hover { background: #eef2f7; }
.navbox li a.hot { font-weight: bold; color: #8a1f1f; }
.infobox p { padding: 6px 8px; font-size: 11px; line-height: 1.5; }
.infobox h3 + p { padding-top: 6px; }

/* ---- content typography ---------------------------------------------------- */
#maincontent h1 {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 22px;
    font-weight: normal;
    color: #1b3a6b;
    border-bottom: 2px solid #c9a227;
    padding-bottom: 4px;
    margin-bottom: 10px;
}
#maincontent h2 {
    font-family: Georgia, serif;
    font-size: 16px;
    color: #2c4d80;
    margin: 16px 0 6px 0;
}
#maincontent h3 { font-size: 13px; color: #333; margin: 12px 0 4px 0; }
#maincontent p { line-height: 1.55; margin-bottom: 10px; }
#maincontent ul, #maincontent ol { margin: 0 0 10px 28px; line-height: 1.55; }

.pageupdated {
    color: #888; font-size: 10px; border-top: 1px dotted #ccc;
    margin-top: 22px; padding-top: 4px;
}

/* ---- forms (permit search) ---------------------------------------------------- */
.searchpanel {
    background: #eef2f7;
    border: 1px solid #b9c3d1;
    padding: 12px 14px;
    margin-bottom: 16px;
}
.searchpanel table.formgrid { border-collapse: collapse; }
.searchpanel table.formgrid td { padding: 4px 8px 4px 0; vertical-align: middle; font-size: 12px; }
.searchpanel td.lbl { width: 150px; text-align: right; color: #333; font-weight: bold; padding-right: 10px; }
.searchpanel input[type=text], .searchpanel select {
    font-family: Verdana, Arial, sans-serif;
    font-size: 12px;
    padding: 2px;
    border: 1px solid #8b98aa;
    background: #fff;
}
.searchpanel .btnrow { padding-top: 8px; }
.searchpanel input[type=submit], .searchpanel input[type=reset] {
    font-size: 12px;
    padding: 3px 18px;
    background: #dfe6ef url(../img/btn-grad.gif) repeat-x;
    background-color: #dfe6ef;
    border: 1px solid #7d8fae;
    cursor: pointer;
}
.formnote { font-size: 10px; color: #666; }
.required { color: #a00; }

.msg-error {
    background: #fbeaea; border: 1px solid #cf9d9d; color: #8a1f1f;
    padding: 8px 12px; margin-bottom: 12px; font-size: 12px;
}
.msg-info {
    background: #eaf2fb; border: 1px solid #9db4cf; color: #1f4d8a;
    padding: 8px 12px; margin-bottom: 12px; font-size: 12px;
}
.errorbox {
    background: #fbeaea; border: 2px solid #b03636;
    padding: 12px 16px; margin: 10px 0;
}

/* ---- results tables ---------------------------------------------------------- */
table.datagrid {
    border-collapse: collapse;
    width: 100%;
    margin-bottom: 8px;
    font-size: 11px;
}
table.datagrid th {
    background: #2c4d80;
    color: #fff;
    text-align: left;
    padding: 5px 7px;
    border: 1px solid #1d355f;
    font-size: 11px;
    white-space: nowrap;
}
table.datagrid td {
    border: 1px solid #c6cfdb;
    padding: 4px 7px;
    vertical-align: top;
}
table.datagrid tr.alt td { background: #f0f4f9; }
table.datagrid tr:hover td { background: #fdf5d8; }
td.num { text-align: right; white-space: nowrap; }
td.nowrap { white-space: nowrap; }

.resultmeta { font-size: 11px; color: #444; margin-bottom: 6px; }
.resultmeta strong { color: #1b3a6b; }

/* ---- pager ---------------------------------------------------------------- */
.pager { font-size: 11px; margin: 8px 0 14px 0; }
.pager a, .pager span.cur {
    display: inline-block;
    padding: 2px 7px;
    border: 1px solid #b9c3d1;
    margin-right: 3px;
    text-decoration: none;
}
.pager span.cur { background: #2c4d80; color: #fff; border-color: #1d355f; font-weight: bold; }
.pager a:hover { background: #eef2f7; }
.pager .dots { margin-right: 3px; }

/* ---- detail page ---------------------------------------------------------- */
table.detailgrid { border-collapse: collapse; width: 100%; margin-bottom: 14px; font-size: 12px; }
table.detailgrid th {
    background: #eef2f7;
    text-align: right;
    width: 170px;
    padding: 5px 10px;
    border: 1px solid #c6cfdb;
    color: #333;
    vertical-align: top;
    white-space: nowrap;
}
table.detailgrid td { border: 1px solid #c6cfdb; padding: 5px 10px; }
.statusflag {
    display: inline-block; padding: 1px 8px; font-weight: bold; font-size: 11px;
    border: 1px solid #999; background: #eee;
}
.status-Issued, .status-Approved { background: #e4f2e0; border-color: #7ca86f; color: #285c1c; }
.status-Applied, .status-UnderReview { background: #eaf2fb; border-color: #7f9cc0; color: #1f4d8a; }
.status-Expired, .status-Withdrawn { background: #f0f0f0; border-color: #a5a5a5; color: #555; }
.status-Denied { background: #fbeaea; border-color: #c08b8b; color: #8a1f1f; }

.toolbar { font-size: 11px; margin-bottom: 10px; }
.toolbar a { margin-right: 14px; }

.disclaimer {
    background: #f7f7f2; border: 1px solid #ddd; color: #555;
    font-size: 10px; padding: 8px 10px; margin-top: 14px; line-height: 1.5;
}

/* ---- homepage columns ---------------------------------------------------- */
#hp-left { float: left; width: 455px; }
#hp-right { float: right; width: 250px; }
.newsitem { border-bottom: 1px dotted #bbb; padding: 7px 0; }
.newsitem .ndate { color: #777; font-size: 10px; }
.newsitem a { font-weight: bold; }
.newsitem p { font-size: 11px; margin: 2px 0 0 0; }

.quicklinks { border: 1px solid #b9c3d1; margin-bottom: 14px; }
.quicklinks h3 {
    background: #c9a227; color: #232323; font-size: 12px; padding: 5px 8px;
}
.quicklinks ul { list-style: square; margin: 8px 8px 8px 26px; font-size: 11px; }
.quicklinks li { padding: 2px 0; }

/* ---- footer ---------------------------------------------------------------- */
#footer {
    background: #14284b;
    color: #b6c2d6;
    border-top: 4px solid #c9a227;
    margin-top: 0;
    padding: 16px 0 10px 0;
    font-size: 11px;
}
#footer a { color: #cdd7e6; }
.footcols { overflow: hidden; }
.footcol { float: left; width: 235px; padding-right: 10px; }
.footcol h4 { color: #fff; font-size: 12px; margin-bottom: 6px; }
.footcol ul { list-style: none; }
.footcol li { padding: 2px 0; }
.footcol p { line-height: 1.5; margin-bottom: 8px; }
#footbottom {
    border-top: 1px solid #33456b;
    margin-top: 12px; padding-top: 8px;
    text-align: center;
}
#footbottom .fineprint { color: #6f7f9d; font-size: 10px; padding-top: 3px; }