html,
body {
    height: 100%;
    font-family: 'Open Sans', sans-serif;
}

body {
    background-color: #F8F8F8;
}

#loginContain {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-align: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    padding-top: 40px;
    padding-bottom: 40px;
    height: 100%;
    margin: 0 auto;
}

.form-signin {
    width: 100%;
    max-width: 400px;
    padding: 15px;
}

    .form-signin .form-control {
        position: relative;
        box-sizing: border-box;
        height: auto;
        padding: 10px;
        font-size: 16px;
    }

        .form-signin .form-control:focus {
            z-index: 2;
        }

    .form-signin input[type="text"] {
        margin-bottom: -1px;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }

    .form-signin input[type="password"] {
        margin-bottom: 10px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

#formInputDiv {
    background-color: #ffffff;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

    #formInputDiv:hover {
        box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
    }

p {
    line-height: 22px;
    padding: 5px 0 5px 0;
    font-size: 12px;
}
/* LOGIN */
#mask {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9000;
    background-color: #000;
    display: none;
}

#loginLogo {
    width: 230px;
    height: 35px;
}

#boxes {
    width: 300px;
    margin: auto;
}

    #boxes h2 {
        font-size: 16pt;
        text-align: center;
        margin: 5% 0%;
    }

#loginContainer {
    width: 80%;
    background-color: #fff;
    padding: 5% 10%;
}

.loginField {
    margin: 10px 0px;
}

.LoginTextBoxMain {
    width: 92%;
    padding: 3px 3px;
    border: 2px solid #DFDFDF;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
}

input {
    width: 92%;
    padding: 3px 3px;
    vertical-align: top;
}

#loginContainer label {
    font-size: 10pt;
    font-weight: bold;
    margin: 2% 0%;
    display: inline-block;
}

.formFooter {
    width: 100%;
    padding-top: 5%;
    padding-bottom: 5%;
}

#btnLogin {
    background-color: #41B8E0;
    color: #fff;
    padding: 5px 10px;
    outline-width: 0;
}

    #btnLogin:hover, #btnLogin:focus {
        background-color: #289FC7;
        cursor: pointer;
    }

.LoginFailureText {
    display: none;
}

.errorDisplayed {
    color: #D93025;
    font-weight: bold;
    font-size: 12px;
    display: inline-block;
    width: 100%;
    text-align: center;
    height: 100%;
}

.check {
    margin-left: 10px;
    padding: 10px;
    border: 2px solid #666666;
    color: #333;
    background-color: #FFFFFF;
}

.buttonpush {
    margin: 10px 0 0 20px;
    padding: 0;
}

.close {
    margin: 0 20px 0 20px;
    padding-top: 10px;
    color: #FFFFFF;
    float: right;
}

.SearchBox {
    border: 0px !important;
    background-color: #ffffff;
    padding: 0px;
}

/* LOGIN PANEL */

.btnLogInCls {
    background-image: url('../App_Themes/eDataTrace/Images/Login-btn1.jpg');
    background-position: left top;
    border-style: none;
    border-width: 0px;
    background-repeat: no-repeat;
    width: 81px;
    height: 28px;
}

.btnLogInCancel, a.btnLogInCancel:link, a.btnLogInCancel:active, a.btnLogInCancel:Visited {
    font-family: Arial;
    color: #ffffff;
    font-size: 12px;
    text-decoration: underline;
    background-color: Transparent;
    border-style: none;
    border-width: 0px;
}

a.btnLogInCancel:Hover {
    font-family: Arial;
    color: #ffffff;
    font-size: 12px;
    text-decoration: none;
    background-color: Transparent;
    border-style: none;
    border-width: 0px;
}

#logo {
    float: left;
    margin: 8px 0 0 0;
    height: 83px;
}



.labeltext {
    line-height: 15px;
    padding: 5px 0 5px 0;
    font-size: 13px;
}

.dropdownlist {
    border: 1px solid #CFCFCF;
    color: #333333;
    font-size: 12px;
    font-weight: lighter;
    height: 28px;
    margin: 0 5px 10px 0;
    padding: 4px;
    font-family: Arial;
    width: 250px;
}

.linksdesc {
    width: 270px;
    border: 0px solid red;
}

.helplinks {
    font-weight: bold;
    color: Black;
}

p {
    line-height: 22px;
    padding: 5px 0 5px 0;
    font-size: 12px;
}

.container {
    margin: 0 auto;
    width: 930px;
}

.container2 {
    margin: 0 auto;
    width: 930px;
    padding: 0 10px 0 10px;
}

/* Header */
#header-bg {
    background-image: url(../images/header-bg2-black1.jpg);
    background-repeat: repeat-x;
}

#header {
    background-position: top;
    height: 119px;
}

#header-inner {
    height: 124px;
    width: 930px;
    margin: 0 auto;
    position: relative;
}

#logo {
    float: left;
    margin: 8px 0 0 0;
    height: 83px;
}

#toptag {
    float: left;
    position: relative;
    top: 60px;
    left: -45px;
    color: #fff;
}

#livechat {
    padding: 10px 20px 0px 0px;
    margin-top: -5px;
    float: left;
    font-weight: bold;
}

#meta a:link {
    font-size: 14px;
    color: #fff;
    text-decoration: none;
}
/* unvisited link */
#meta a:visited {
    font-size: 14px;
    color: #fff;
    text-decoration: none;
}
/* visited link */
#meta a:hover {
    font-size: 14px;
    color: #fff;
    text-decoration: none;
}
/* mouse over link */
#meta a:active {
    font-size: 14px;
    color: #fff;
    text-decoration: none;
}
/* selected link */

#meta {
    float: right;
    height: 40px;
    margin: 35px 0 0 0;
    position: relative;
}

#login {
    display: block;
    width: 81px;
    height: 28px;
    background: url("../images/login-button.jpg") no-repeat 0 0;
    float: left;
}

    #login:hover {
        background-position: 0 -28px;
    }

    #login span {
        display: none;
    }

#meta a.button {
    /* Sliding right image */
    background: transparent url('../images/right2.png') no-repeat scroll right;
    display: block;
    float: left;
    height: 28px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
    margin-right: 0px;
    padding-right: 24px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */ /* FONT PROPERTIES */
    text-decoration: none;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
}

    #meta a.button span {
        /* Background left image */
        background: transparent url('../images/left2.png') no-repeat;
        display: block;
        line-height: 14px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
        padding: 7px 0 0 18px;
        height: 39px;
        margin: 0 0px 0 0;
    }

    #meta a.button:hover {
        /* Sliding right image */
        background: transparent url('../images/right_active2.png') no-repeat scroll right;
        display: block;
        float: left;
        height: 28px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
        margin-right: 0px;
        padding-right: 24px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */ /* FONT PROPERTIES */
        text-decoration: none;
        color: #fff;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        font-weight: bold;
    }

        #meta a.button:hover span {
            /* Background left image */
            background: transparent url('../images/left_active2.png') no-repeat;
            display: block;
            line-height: 14px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
            padding: 7px 0 0 18px;
            height: 28px;
            margin: 0 0px 0 0;
        }

#bottom-header {
    width: 100%;
    float: left;
    margin: 7px 0 0 0;
}

/* buttons */
button {
    border: 0;
    cursor: pointer;
    font-weight: bold;
    padding: 0 47px 0 0;
    padding-right: 50px;
    text-align: center;
    margin: 0 0 0 -5px;
}

    button span {
        position: relative;
        display: block;
        white-space: nowrap;
        padding: 0 0 0 20px;
    }

    /*blue buttons*/
    button.submitBtn {
        background: url(../images/right.png) right no-repeat;
        font-size: 1.3em;
    }

        button.submitBtn span {
            height: 50px;
            line-height: 50px;
            background: url(../images/left.png) left no-repeat;
            color: #333;
        }

        button.submitBtn:hover {
            background: url(../images/right_active.png) right no-repeat;
        }

            button.submitBtn:hover span {
                background: url(../images/left_active.png) left no-repeat;
            }

button {
    width: auto;
    overflow: visible;
}

    button span {
    }

/* Content Area */
#content-stretch-sub {
    background: #8f0100;
    border: 1px #535353 solid;
    padding: 0px 11px 0 16px;
    height: 50px;
    width: 900px;
    margin: 0 auto;
}

#content h1 {
    font: 28px Arial, Helvetica, sans-serif;
    font-weight: bold;
    margin-bottom: -10px;
    margin: 10px 0 0 20px;
    color: #FFFFFF;
    position: relative;
}
/*#content h1 span { background: url(../images/gradient-red.png) repeat-x; position: absolute; display: block; width: 475px; height: 20px;}*/
#register {
    background-color: #990000;
    border-bottom-color: #AA0000;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-top-color: #AA0000;
    border-top-style: solid;
    border-top-width: 1px;
    display: block;
    float: left;
    height: 23px;
    padding-top: 5px;
    text-align: center;
    width: 81px;
    color: #FFFFFF;
    text-decoration: none;
    margin-right: 2px;
}

    #register:hover {
        background-color: #AA0000;
        background-position: 0 -28px;
    }

    #register span {
    }

#loginnew {
    background-color: #990000;
    border-bottom-color: #AA0000;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-top-color: #AA0000;
    border-top-style: solid;
    border-top-width: 1px;
    display: block;
    float: left;
    height: 23px;
    padding-top: 5px;
    text-align: center;
    width: 81px;
    color: #FFFFFF;
    text-decoration: none;
    margin-right: 2px;
}

    #loginnew:hover {
        background-color: #AA0000;
        background-position: 0 -28px;
    }

    #loginnew span {
    }

.modalBackground {
    background-color: Black;
}

.overlay {
    position: fixed;
    z-index: 999999999;
    top: 0px;
    left: 0px;
    background-color: #000;
    border: 0px;
    width: 100%;
    height: 100%;
    filter: Alpha(Opacity=70);
    opacity: 0.70;
    opacity: 0.70;
}
/* Content
------------------------------------------------------*/
#content-inner {
    width: 907px;
    padding: 20px 0px 20px 20px;
    float: left;
    background-color: #FFFFFF;
    border: 1px solid #535353;
    margin: 0 0 25px 0;
}

#content-inner-full {
    width: 907px;
    padding: 28px 0px 20px 20px;
    float: left;
    background-color: #FFFFFF;
    border: 1px solid #333333;
    margin: 0 0 20px 0;
}

#content-left {
    float: left;
    width: 902px;
    border: 2px white solid;
}

#content-left-open {
    float: left;
    width: 420px;
}

#side-box {
    float: left;
    width: 250px;
    margin-left: 34px;
}

#side-box-open {
    float: left;
    width: 443px;
    margin-left: 34px;
}

#side-box a, #side-box a:visited {
    color: #8f0100;
    margin-bottom: 0px;
}

#side-map {
    float: left;
    width: 493px;
    margin-left: 34px;
}

    #side-map h2 {
        padding-bottom: 4px;
        color: #8f0100;
    }

#side-box h2 {
    color: #8f0100;
    padding-bottom: 0px;
    color: #8f0100;
}

.maincontent {
    padding-bottom: 18px;
}

    .maincontent a, .maincontent a:visited {
        color: #8f0100;
    }

    .maincontent h2 {
        margin-bottom: 2px;
        color: #8f0100;
        font-size: 18px;
        text-transform: capitalize;
    }

    .maincontent h4 {
        margin-bottom: 2px;
        color: #8f0100;
        font-size: 14px;
        text-transform: capitalize;
    }

ul.news-list {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    font-size: 12px;
}

    ul.news-list li {
        line-height: 18px;
        padding: 10px 0px;
        border-bottom: 1px solid #ccc;
    }

        ul.news-list li a {
            text-decoration: none;
        }

            ul.news-list li a:hover {
                text-decoration: underline;
            }

.service-item {
    width: 286px;
    float: left;
    padding-bottom: 20px;
}

.spacer {
    width: 30px;
    float: left;
    display: block;
    height: 100%;
}

.services-icon {
    width: 77px;
    height: 100px;
    float: left;
    padding-top: 30px;
}

#nav-menu {
    font-size: 14px;
}


/* Navigation styling */
.sf-menu, .sf-menu * {
    margin: 0;
    padding: 0;
    list-style: none;
    z-index: 100;
}

.sf-menu {
    line-height: 1.0;
}

    .sf-menu ul {
        position: absolute;
        top: -999em;
        width: 200px; /* left offset of submenus need to match (see below) */
    }

        .sf-menu ul li {
            width: 100%;
        }

    .sf-menu li:hover {
        visibility: inherit; /* fixes IE7 'sticky bug' */
    }

    .sf-menu li {
        float: left;
        position: relative;
        border-right: 1px solid #8e8c8c;
    }

        .sf-menu li.last {
            border-right: none;
        }

        .sf-menu li.current a {
            color: #fff;
        }

        .sf-menu li a:hover {
            color: #d30100;
        }

    .sf-menu a {
        display: block;
        position: relative;
    }

    .sf-menu li:hover ul, .sf-menu li.sfHover ul {
        left: 0;
        top: 22px; /* match top ul list item height */
        z-index: 100;
    }

        .sf-menu li.sfHover ul li {
            left: 0;
            top: -1px; /* match top ul list item height */
            z-index: 100;
        }

ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul {
    top: -999em;
}

ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul {
    left: 14em; /* match ul width */
    top: 0;
}

ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul {
    top: -999em;
}

ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul {
    left: 14em; /* match ul width */
    top: 0;
}

/*** DEMO SKIN ***/
.sf-menu {
    float: left;
    margin-bottom: 0em;
}

    .sf-menu a {
        /*	border-left:	1px solid #fff; 						border-top:		1px solid #CFDEFF; 					*/
        padding: 0px 42px;
        text-decoration: none;
    }

        .sf-menu a, .sf-menu a:visited {
            /* visited pseudo selector so IE6 applies text colour*/
            color: #fff;
        }

    .sf-menu li {
        /*background:		#BDD2FF;*/
    }

        .sf-menu li li {
            background-image: none !important;
            border-left: solid 1px #323232;
            border-right: solid 1px #323232;
            border-bottom: solid 1px #323232;
            background-color: #161616;
        }

            .sf-menu li li a {
                padding: 8px 10px;
            }

                .sf-menu li li a:hover, .sf-menu li li li a:hover {
                    background-color: #202020;
                }

            .sf-menu li li li {
                background-image: none !important;
                background-color: #ffffff;
            }

                .sf-menu li li li.top {
                    border-top: solid 1px #969696;
                }

                .sf-menu li li li a {
                    padding: 8px 10px;
                }

    .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
        outline: 0;
    }

    .sf-menu li:hover, .sf-menu li.sfHover {
        outline: 0;
    }


    /*** arrows **/
    .sf-menu a.sf-with-ul {
        padding-right: 42px;
        min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
    }

.sf-sub-indicator {
    position: absolute;
    display: block;
    right: .75em;
    top: 1.05em; /* IE6 only */
    width: 10px;
    height: 10px;
    text-indent: -999em;
    overflow: hidden;
    background: url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}

a > .sf-sub-indicator {
    /* give all except IE6 the correct values */
    top: .8em;
    background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator {
    background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator {
    background-position: -10px 0;
}

.sf-menu ul a > .sf-sub-indicator {
    background-position: 0 0;
}
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator, .sf-menu ul a:hover > .sf-sub-indicator, .sf-menu ul a:active > .sf-sub-indicator, .sf-menu ul li:hover > a > .sf-sub-indicator, .sf-menu ul li.sfHover > a > .sf-sub-indicator {
    background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
}

    .sf-shadow ul.sf-shadow-off {
        background: transparent;
    }

#countymain {
    float: right;
    width: 640px;
    height: auto;
    border: 0px solid #ccc;
    float: right;
    margin-top: 8px;
}

#countysidebar {
    float: left;
    width: 260px;
    height: 700px;
    border: 0px solid red;
}

.gridData {
    border-width: 1px;
    border-style: solid;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
    float: left;
    text-align: Left;
    font-size: 12px;
    font-weight: lighter;
    font-family: Arial;
    color: #404040;
    padding-top: 10px;
    border-collapse: collapse;
    border-color: #ccc;
}

.Label {
    padding-bottom: 10px;
}

.sterik {
    color: #FE0000;
}

#boxes #dialog6 {
    color: #FFFFFF;
    height: 300px;
    padding: 14px 0 25px;
    width: 500px;
}

#boxes #dialog6 {
    color: #FFFFFF;
}

#dialog6 {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
}

    #dialog6 h2 {
        color: #FFFFFF;
        font-size: 18px;
        margin: 3px 0 20px;
        text-align: center;
    }


#boxes #dialog7 {
    color: #FFFFFF;
    height: 110px;
    padding: 14px 0 25px;
    width: 400px;
}

#boxes #dialog7 {
    color: #FFFFFF;
}

#dialog7 {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
}


    #dialog7 h2 {
        color: #FFFFFF;
        font-size: 18px;
        margin: 3px 0 20px;
        text-align: center;
    }

.submit-btn {
    background-image: url('../images/submit-bg.jpg');
    background-position: left top;
    background-repeat: repeat-x;
    border: 1px solid #A90100;
    color: #FFFFFF;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
    font-weight: bold;
    height: 28px;
    padding: 0 17px;
}

.btnPwdChangeCancel {
    border: 0 none;
    color: #FFFFFF;
    font-family: Verdana;
    font-size: 13px;
}

a {
    color: blue;
    cursor: pointer;
    text-decoration: underline;
}

.dialogLabel {
    color: #A90100;
    font-size: 18px;
    margin: 3px 0 20px;
    text-align: center;
}


.addgroupbody {
    background: #202322;
    font-family: Arial, verdana, sans-serif;
    color: #333;
    font-size: 12px;
}

.listbox {
    height: 380px;
    width: 250px;
    border: 1px solid #ccc;
    font-size: 12px;
    color: #333;
    text-align: left;
    font-family: Arial, Helvetica, sans-serif;
}

#dvLoading {
    background: #C0C0C0 url(../images/loading.gif) no-repeat center center;
    height: 50px;
    width: 200px;
    position: fixed;
    z-index: 1000000;
    left: 50%;
    top: 50%;
    margin: -25px 0 0 -25px;
}

.upcrossimage {
    background: transparent url('../images/up.png') no-repeat scroll right center;
    cursor: pointer;
    display: block;
}

.downcrossimage {
    background: transparent url('../images/down.png') no-repeat scroll right center;
    cursor: pointer;
    display: block;
}

.sortorder {
    width: 18px;
    cursor: pointer;
    float: left;
    cursor: pointer;
}