html, body {
    margin: 0;
    padding: 0;
    color: #333;
    font-size: 8pt;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    height: 100%;
}

table {
    -webkit-border-horizontal-spacing: 0px;
    -webkit-border-vertical-spacing: 0px;
}

#template, #frmLogin, #frmRegistration, #frmRecover, #frmReset {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: 100%;
}

#tblMain {
    width: 1200px;
}

input.aligntopleft {
    height: 16px;
}

.smallblue > input {
    padding: 2px;
    height: 14px;
}

.smallblue > select {
    padding: 2px;
}

select.aligntopleft {
    padding: 2px;
}

textarea {
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

.logo {
    font-size: 35px;
    font-weight: 600;
    font-family: Roboto, Arial, Helvetica, sans-serif;
    color: #555;
}

    .logo .year {
        color: #0071BC;
    }

.login-logo {
    text-align: center;
    font-size: 55px;
    font-weight: 600;
    font-family: Roboto, Arial, Helvetica, sans-serif;
    color: #555;
}

    .login-logo .year {
        color: #0071BC;
    }

#page-content {
    padding: 5px;
    display: flex;
    flex-grow: 1;
    font-size: 8pt;
    flex-wrap: wrap;
    align-content: start;
}

.flex-center {
    justify-content: center;
}

.login-container {
    width: 100%;
    display: flex;
    align-items: stretch;
    align-content: stretch;
    justify-content: center;
    flex-wrap: wrap;
    flex-grow: 1;
}

.pagetitle {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-decoration: none;
    height: 30px;
}


.linkbutton {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #6699ff;
    text-decoration: none;
    text-align: center;
}

.sectiontitle {
    padding-left: 3px;
    font-weight: bold;
    background-color: #FFFFFF;
    text-decoration: none;
    border: 0px solid;
    height: 15px;
    text-transform: capitalize;
    vertical-align: bottom;
}

.titlebar {
    font-size: 8pt;
    padding-left: 3px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #FFFFFF;
    background-color: cornflowerblue;
    text-decoration: none;
    background-image: none;
    border: cornflowerblue 1px solid;
    text-align: left;
}

    .titlebar a {
        color: #333;
        font-family: Arial, Helvetica, sans-serif;
        text-decoration: underline;
    }

        .titlebar a:Hover {
            font-family: Arial, Helvetica, sans-serif;
            color: Black;
            text-decoration: underline;
        }

.no {
    text-align: right;
}

.ImageWithBorder {
    border-width: 1;
    border-color: #333333;
    text-decoration: none;
    padding: 5px;
    width: 150px;
    height: 22px;
}



td {
    height: 20px;
}

.aligntopright {
    text-decoration: none;
    text-align: right;
    vertical-align: top;
}

.aligntopleft {
    text-decoration: none;
    text-align: left;
    vertical-align: top;
    padding-left: 3px;
    padding-right: 3px;
}

.gray {
    color: #999999;
    text-decoration: none;
    vertical-align: bottom;
}


.error {
    font-weight: bold;
    color: #FF0000 !important;
}

.hidden {
    visibility: hidden !important;
}


.cal {
    background-color: #EEEEEE;
    border: 1px solid #000000;
}


.table {
    background-color: #ffffff;
    border: 1px solid #BBBDB7;
}

.tableblue {
    background-color: #F0F8FF;
    border: 1px solid #D9D7C3;
    padding-right: 0px;
    padding-left: 0px;
    padding-bottom: 0px;
    margin: 0px;
    width: 1200px;
    padding-top: 0px;
}

.controls {
    padding: 0px 7px;
    width: 100%;
    font-size: 8pt;
}

    .controls > tbody > tr {
        height: 45px;
    }

        .controls > tbody > tr.row-spacer {
            height: 25px;
        }

.action-bar a {
    margin-right: 20px;
}
    .action-bar a:last-of-type {
        margin-right: 0px;
    }

.Assigned {
    padding-left: 3px;
    background-color: #d3d3d3;
    border-top: 1px solid #FFFFFF;
    border-right: none;
    border-bottom: 1px solid #999999;
    border-left: none;
}

.Approved {
    padding-left: 3px;
    background-color: #EEEEEE;
    border-top: 1px solid #FFFFFF;
    border-right: none;
    border-bottom: 1px solid #999999;
    border-left: none;
}

.tableRow {
    padding-left: 3px;
    background-color: #F0F8FF;
    font-weight: normal;
    border-top: 1px solid #FFFFFF;
    border-right: none;
    border-bottom: 1px solid #999999;
    border-left: none;
}

.tableAltRow {
    padding-left: 3px;
    background-color: White;
    font-weight: normal;
    border-top: 1px solid #FFFFFF;
    border-right: none;
    border-bottom: 1px solid #999999;
    border-left: none;
}

.tableRateMatrixRow {
    padding-left: 3px;
    background-color: #F0F8FF;
    font-weight: normal;
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
}

.tableRateMatrixAltRow {
    padding-left: 3px;
    background-color: White;
    font-weight: normal;
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
}

.tableSelectedRow {
    padding-left: 3px;
    background-color: Gray;
    color: Fuchsia;
    border-top: 1px solid #FFFFFF;
    border-right: none;
    border-bottom: 1px solid #999999;
    border-left: none;
}

.tableEditRow {
    padding-left: 3px;
    border-top: 1px solid #FFFFFF;
    border-right: none;
    border-bottom: 1px solid #999999;
    border-left: none;
}


.link {
    padding: 0px;
    font-weight: bold;
    color: #6699ff;
    font-family: "MS Sans Serif", Arial, Helvetica, Tahoma, sans-serif;
    text-align: center;
    letter-spacing: 1px;
}

a.link:Hover {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    padding: 0px;
    font-weight: bold;
    color: #6699ff;
    font-family: "MS Sans Serif", Arial, Helvetica, Tahoma, sans-serif;
    text-align: center;
    letter-spacing: 1px;
}

.Item {
    border-bottom: solid 1px #555555;
    padding-right: 5px;
    font-weight: normal;
    font-size: 9px;
    color: #FFFFFF;
    font-style: normal;
    font-family: "MS Sans Serif", Arial, Helvetica, Tahoma, sans-serif;
    background-color: #6D6F71;
    text-decoration: none;
}


.Disabled {
    color: #d4d0c8;
}

.list {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
}

.smallblue {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: blue;
    font-weight: bold;
    text-align: left;
    height: 17px;
    vertical-align: top;
    padding: 5px;
}

.smallblueright {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: blue;
    font-weight: bold;
    text-align: right;
    height: 17px;
    vertical-align: top;
}

.footer {
    color: white;
    padding: 10px 15px;
    background-color: #0071BC;
    text-align: left;
    margin-top: 30px;
    flex-shrink: 0;
}

#header {
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

#login-status {
    text-align: right;
}

.login-header {
    padding: 70px 45px 20px 45px;
}

.ui-datepicker-trigger {
    height: 20px;
}