﻿/* 
author: jon@threefivedesign.com
modified: 
*/

@import url("reset.css");
@import url("typography.css");

/* basic tags */
body
{
    background: #f2efea;
    font: 62.5%/1.4 Arial, Sans-Serif;
    text-align: left;
    color: #252525; /*font: 8.5pt Arial, Sans-Serif; text-align: left; color: #252525;*/
}

.hide
{
    display: none;
}
.last
{
    margin-left: 0;
    margin-right: 0;
}

hr
{
    border-width: 0 0 1px;
    border-bottom: 1px dotted #a7d9e7;
    margin: -0.4em 0 1.7em;
    background: none;
    height: 1px;
    clear: both;
}

img
{
    display: block;
    margin: 0;
    padding: 0;
}

/* typography */

/* links */
a, a:focus, a img, img
{
    outline: none;
    border: none;
}
a:link, a:visited
{
    text-decoration: none;
    color: #009fc3;
}
a:hover, a:active
{
    text-decoration: underline;
    color: #005288;
}

/* layout */
#wrap
{
    margin: 0 auto;
    width: 970px;
    background: #fff; /* url(../grid.png) ;   */
}

#skip a
{
    display: block;
    width: 970px;
    padding: 7px 0;
    text-align: center;
    font-weight: bold;
    background: #333;
    color: #fff;
}

/* header section */
#header
{
    margin-bottom: 12px;
    border-bottom: 1px solid #5183af;
    width: 100%;
    float: left;
}

#logo
{
    margin: 9px 10px 4px;
    display: block;
    float: left;
}

/* search */
#searchbox
{
    margin: 46px 10px 0 0;
    padding: 0;
    width: auto;
    float: right;
    background: #f2f0ec url(../imgs/search-tlc.gif) top left no-repeat;
    display: none;
}

#searchbox DIV
{
    margin: 0;
    padding: 7px 10px 6px;
    background: url(../imgs/search-trc.gif) top right no-repeat;
}

#searchbox label
{
    width: auto;
    padding: 2px 0;
    background: none;
}

#searchbox input
{
    margin: 0;
    padding: 2px;
    font: 1em/1.4 Arial, Sans-Serif;
    text-align: center;
    vertical-align: middle;
    background: #a89c89;
    color: #fff;
    border: none;
    width: auto;
    cursor: pointer;
}

#searchbox #search
{
    width: 158px;
    margin-right: 2px;
    text-align: left;
    background: #fff;
    color: #a89c89;
    border: 1px solid #fff;
    border-width: 1px 0;
}

#searchbox #search-submit
{
}

#searchbox #search:hover, #searchbox #search:active, #searchbox #search:focus
{
    color: #444;
    border-bottom-color: #a89c89;
}

#searchbox input:hover, #searchbox input:active, #searchbox input:focus
{
    background: #444;
}

/* navigation */
#navigation
{
    width: 970px;
    padding: 0;
    background: #dbe5f0;
    border-top: 1px solid #5183af;
    clear: both;
    float: left;
    font-size:1.15em;
}

#navigation ul
{
    margin: 0 10px;
    list-style: none;
}

#navigation li
{
    padding: 0;
    float: left;
}

#navigation li a
{
    display: block;
    padding: 7px;
    font-size: 1em;
    text-align: center;
    text-decoration: none;
    color: #009fc3;
}

#navigation li a:hover, #navigation li a.active
{
    background: url(../imgs/nav-on.jpg) bottom left repeat-x;
    color: #005288;
}

#primary-nav
{
    float: left;
}

#other-nav
{
    float: right;
}

/* menus */
.menu
{
    width: 970px;
    clear: both;
    float: left;
    display: none;
    background: #f2f0ec url(../imgs/menu-bg.jpg) bottom left repeat-x;
    border-top: 1px solid #fff;
}

#navigation .menu ul
{
    display: block;
    float: left;
    padding: 0;
}

#navigation .menu li
{
    float: left;
    width: auto !important;
    min-width: 170px;
    width: 170px;
    padding-right:40px;
    line-height:1.5em;    
}

#navigation .menu li a
{
    margin-right: 10px;
    padding: 0;
    float: left;
    text-align: left;
    background: none;
    color: #a89c89;
}

#navigation .menu li a:hover
{
    color: #444;
    background: none;
}

.menu p
{
    float: right;
    width: 430px;
    margin-bottom: 0;
    padding: 1.4em 1em;
}

.menu DIV.col
{
    border-right: 1px dotted #666;
}

.menu h2
{
    margin: 14px 10px;
}

.menu h3
{
    margin: 14px 10px 3px;
}

/* log in form */
#form-login
{
    padding: 0;
    margin: 0 10px 14px;
    vertical-align: middle;
}

#form-login legend
{
    font-size: 1.4em;
    line-height: 1em;
    color: #009fc3;
    margin: 0 0 14px;
    padding: 0;
}

#form-login label
{
    display: inline;
    float: none;
    text-align: left;
    vertical-align: middle;
    padding: 0; /*	font-weight: bold;*/
}

#form-login input
{
    display: inline;
    float: none;
    margin: 0 1em;
    padding: 0.5em;
    vertical-align: middle;
    font: 1em/1.4 Arial, Sans-Serif;
    text-align: left;
    color: #252525; /* font-weight: bold;*/
    background: #fff;
    border: none;
    width: auto;
}

#form-login input#rememberme
{
    width: auto;
    cursor: pointer;
}

#form-login input#login
{
    width: auto;
    padding: 0.4em 0.5em;
    cursor: pointer;
    text-align: center;
}


#form-login input:hover, #form-login input:active, #form-login input:focus
{
    background: #a89c89;
    color: #fff;
}

/* content */
#content
{
    margin-left: 10px;
    height: auto !important;
    min-height: 58em;
    height: 58em;
}

/* banner */
#banner
{
    clear: both;
    float: left;
    margin: 0 0 14px;
    padding: 0;
    width: 950px;
    background: #a8dbeb;
    color: #fff;
}

#banner img
{
    float: left;
    margin: 0 10px 0 0;
}

#banner h1
{
    padding: 14px 0;
    margin-bottom: 0;
    color: #fff;
}

.inset
{
    margin: -4px 10px 12px 0;
    float: left;
    border-bottom: 1px dotted #5183af;
    background: #dae3f2 url(../imgs/demo-on-bg.jpg) bottom left repeat-x;
}

/* column module */
.col
{
    float: left;
    margin: 0 10px 10px 0;
    width: 110px;
    text-align: left;
}

/* column spans */
.cs2
{
    width: 230px;
}
.cs3
{
    width: 350px;
}
.cs4
{
    width: 460px;
}
.cs5
{
    width: 590px;
}
.cs6
{
    width: 700px;
}
.cs9
{
    width: 500px;
}
.full
{
    width: 950px;
}

/* sidebar */
#sidebar
{
    display: block;
    padding-top:20px;
    text-align:justify;
    margin-left:20px;
}

#sidebar p, #sidebar ul, #sidebar blockquote
{
    width: 330px;
}

#sidebar IMG { text-align:center; }

#video-testimonal
{
    width: 290px;
    height: 182px;
    margin-bottom: 14px;
    border: 1px solid #009fc2;
}

/* home page */

/* customer panel */
#customer-panel
{
    width: 950px;
    margin-top:5px;
    margin-bottom: 14px;
    float: left;
    background: #fff;
}

#customer-panel .inner
{
    display: block;
    background: #005288;
    color: #fff;
    overflow: hidden;
    float: left;
    height: 222px;
    margin-bottom: 0;
    width: 800px;
}

.user
{
    /*width: 950px; nch*/
    height: 280px;
    margin: 0;
    padding: 0;
    display: block;
    background: #005288;
    float: left;
}
.user IMG { width:470px; }
.user .txt 
{
    font-size:1.2em;
    padding:1em;
    margin-left:470px;
    width:290px;
}

#customer-panel p
{
    padding-right: 10px;
}

#customer-panel a
{
    color: #fff;
}


#user-nav
{
    display: block;
    float: left;
    width:120px;
    list-style: none;
    margin: 0;
    padding: 0;
    background: #fff;
}

#user-nav li
{
    display: block;
    float: left;
    width: 120px;
    background: #dbe5f0;
    background-repeat: no-repeat;
    background-position:3px;
    padding-left: 22px;
    border-right:1px solid #5183AF;
    border-bottom:1px solid #5183AF;
    margin-top:1px;
}

#user-nav li a
{
    display: block;
    padding: 6px 9px;
    text-decoration: none;
    color: #005288;
}

#user-nav .govmetric { margin-top:0; padding-top:1px; }

#user-nav li:hover, #user-nav li.active
{
    background-color: #005288;
}
#user-nav li:hover a, #user-nav li.active a
{
    color: #fff;
}

/* product panel */
#product-panel
{
    background: #f0f7fd url(../imgs/product-panel-bg.jpg) top left repeat-x;
    border-bottom: 1px dotted #a7d9e7;
    margin-bottom: 13px;
    padding-bottom: 0;
    height: 182px;
    line-height: 1em;
}

#customer-panel img, #product-panel img
{
    float: left;
    margin: 0 10px 0 0;
    padding: 0;
}

#customer-panel h2, #product-panel h2
{
    margin-top: 14px;
    font-size: 2em;
    line-height: 1.4em;
}

#customer-panel h2
{
    color: #fff;
}


#product-panel ul
{
    float: left;
    display: block;
    list-style: none;
    margin: 0;
    padding: 0;
}

#product-panel li
{
    float: left;
    margin: 0;
    padding: 0;
}

#product-panel a
{
    display: block;
    float: left;
    margin: 0 5px 0 0;
    padding: 5px 5px 7px;
    width: 138px;
    font-size: 1.4em;
    line-height: 1em;
    font-weight: bold;
    text-decoration: none;
    background: #009fc3;
    color: #fff;
}

#product-panel a:hover
{
    background: #005288;
    text-decoration: none;
}

/* footer */
#footer
{
    clear: both;
    display: block;
    margin: 0;
    padding: 0 10px 14px;
    text-align: center;
}

.inner
{
    width: 950px;
    margin-bottom: 17px;
    padding: 0;
    background: #dbe5f0;
    border: 1px solid #5183af;
    border-width: 1px 0;
    float: left;
}

#calltoaction
{
    width: 570px;
    padding: 28px 10px 14px;
    font-size: 1.4em;
    line-height: 1em;
    font-weight: bold;
    color: #005288;
}

#calltoaction strong, #calltoaction a
{
    color: #009fc3;
}

#calltoaction p
{
    margin-bottom: 0;
}

/* demo */
#demo
{
    width: 180px;
    margin: 0;
    padding: 0;
}

#demo a
{
    display: block;
    margin: 0;
    padding: 14px 10px 27px;
    border: 1px dotted #5183af;
    border-width: 0 1px;
    font-size: 1.4em;
    line-height: 1em;
    font-weight: bold;
    color: #005288;
    background: url(../imgs/demo-on-bg.jpg) bottom left repeat-x;
}

#demo a:hover
{
    text-decoration: none;
}

#demo a img
{
    float: left;
    margin-right: 1em;
    background: transparent;
}

/* web metric */
#webmetric
{
    /*width: 300px;*/
    margin: 0;
    padding: 5px 10px 0 9px;
    text-align:center;
}
#webmetric #intro { float:left; font-size:1.4em; width:149px; font-weight:bold; }
#webmetric #snippet
{
    text-align: center;
    width:150px;
    margin-top: 6px;
    vertical-align:top;
}

#footer #webmetric p
{
    margin-bottom: 0;
    padding: 0;
    border: none;
    text-align: center;
}

#webmetric form
{
    width: 149px;
    margin: 0;
    padding: 0;
    text-align: center;
}

#webmetric input
{
    display: inline; /*width: 28px; height: 28px;*/
    margin: 0;
    padding: 0;
    background: none;
    border: none;
}

/* lower footer */
#low-nav
{
    margin: 0 auto;
    display: block;
    clear: both;
    list-style: none;
}

#low-nav li
{
    display: inline;
}

.legal
{
    clear: both;
    margin-bottom: 0;
}


/* hacks */
html
{
    height: 100%;
    margin-bottom: 1px;
}

/* so long and thanks for all the fish */



/* ROL ADDITIONS */
#main-content, #sidebar
{
    font-size: 1.4em !important;
}

#sidebar UL LI
{
    list-style-type: disc;
}

#gmUsers
{
    border: 1px solid #aaa;
    padding: 8px;
    background-color: #eee;
    margin: 1em 0 1em 0;
}
#gmUsers LI
{
    font-size: 0.9em;
    list-style: none !important;
    float: left;
    width: 15%;
    padding:0;
    margin:0;
}
#gmUsers LI.live, #gmUsers LI.in_progress
{
    height: 2.5em;
    margin-left: 10px;
    padding-left: 27px;
    background-repeat: no-repeat;
    background-position: 5px center;
}
#gmUsers LI.live
{
    background-image: url('../images/gmaps/green_sm.png');
}
#gmUsers LI.in_progress
{
    background-image: url('../images/gmaps/yellow_sm.png');
}

#mapKey
{
    list-style: none;
    float: left;
    margin-left: 760px;
    width: 150px;
    border: 1px solid #aaa;
    padding: 8px;
    background-color: #eee;
}
#mapKey LH, #gmUsers LH
{
    font-weight: bold;
    font-size:1.1em;
}
#mapKey LI { margin-left: 1em; }
#mapKey LI IMG { margin-right:0.8em; }



#navigation .login
{
    margin-left: 10px;
}



IMG
{
    display: inline;
}

.accessibility_link { float:right; padding:8px 14px; }

#main-content { width:570px !important; }
#main-content H1 { font-size:2em; }
#main-content H2 { font-size:1.5em; }
#main-content H3 { font-size:1.2em; }
#main-content H4 { font-size:1.1em; }

#benefits { border-top:3px dotted #009FC3; border-bottom:3px dotted #009FC3; font-size:1.2em; color:#009FC3; }
#benefits H3 { float:left; width:80px; background-color:#DBE5F0; height:100%; padding:5px 10px 5px 5px; }
#benefits #benefitsList { float:left; padding: 5px 0 0 15px; width:800px !important; font-size:1.2em; }
#benefits #benefitsList UL { margin:0; padding:0; width:750px !important; }

.local-gov  { background-image:url(/images/icons/local-gov.png) !important; }
.housing  { background-image:url(/images/icons/housing.png) !important; }
.health  { background-image:url(/images/icons/health.png) !important; }
.comm-safety  { background-image:url(/images/icons/community-safety.png) !important; }
.private-sector  { background-image:url(/images/icons/private-sector.png) !important; }
.insight  { background-image:url(/images/icons/insight.png) !important; }
.comment  { background-image:url(/images/icons/comment.png) !important; }
.govmetric  { background-image:url(/images/icons/govmetric.png) !important; }

#news-panel { font-size:1.2em; }
#news-panel H3 { margin-bottom:0.6em; }
#news-panel UL LI { margin-bottom:0.4em; }
#klantinfocus_flag { float:right; margin:3px; text-decoration:none; }