﻿/* Styles for the renderpage portion*/

/******* tr line style **********/

tr a:hover, tr a:hover {
    color: #ff0000;
    text-decoration: underline;
}

tr.bold {
    font-weight: bold;
}

tr.selrec {
    background: #ffffbb;
}

div.statusmsg {
    font-size: 80%;
    line-height: 0.9;
    color: #c11b17;
    margin-top: 6px;
    text-align: center;
    font-weight: 600;
    padding: 2px 10px 10px 2px;
}

.errmsg {
    font-size: 100%;
    line-height: 1.1;
    color: #c11b17;
    font-weight: bold;
}

.okmsg {
    font-size: 100%;
    color: green;
}

/********** default table and default header styles *********/
.defTable, .lsctrlbar table {
}

table.defTable {
    border-spacing: 1px;
    width: 100%;
}

.lsctrlbar div, .lsctrlbar2 div {
    font-size: 10px;
    border-spacing: 0px;
    margin-left: 4px;
}

.lsctrlbar td, .lsctrlbar th {
    white-space: nowrap;
}

.lsctrlbar, .lsctrlbar2 {
    font-size: 90%;
}

.button {
    text-decoration: none;
    cursor: pointer;
    vertical-align: middle;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    color: #333;
}

.lsctrlbar select, .lsctrlbar2 select, .dtlctrlbar select {
    background: #fff;
    cursor: pointer;
    vertical-align: middle;
    margin-right: 4px;
    padding: 3px 6px;
}


    .lsctrlbar select > option, .lsctrlbar2 select > option {
        padding: 0px 2px 0px 2px;
    }

#toplsctrlbar, #toplsctrlbar2 {
    background-color: #ddd;
    border-bottom: none;
    padding: 4px 0px 6px 0px;
    margin: 0px;
    display: flex;
    background: #ecf0f1;
    background: linear-gradient(rgba(238, 238, 238, 0.9), rgba(238, 238, 238, 0.5));
}

    #toplsctrlbar th {
        font-weight: normal;
        border: none;
    }

        #toplsctrlbar th:first-child {
            border-right: none;
        }

    /* Dropdown Select box class */
    #toplsctrlbar select, #toplsctrlbar2 select {
        vertical-align: middle;
    }

    #toplsctrlbar option, #toplsctrlbar2 option {
        background: #fff;
    }

div.dtlctrlrow, div.lsctrlrow {
    display: table-row;
    width: 100%;
}

div.dtlctrlright, div.lsctrlright {
    margin-right: 6px;
    float: right;
}

div.dtlctrlleft, div.dtlctrlright, div.dtlctrlright, div.lsctrlright {
    padding: 0px;
    clear: both;
}


/******* END: List Control Bar style **********/

/* START: Side Bar navigation styles */
table.sbarpage {
    padding: 0;
    border: 0;
    width: 100%;
}

/*.sbarfill{ width: 4px; }*/

td.pagewithsbcell {
    vertical-align: top;
}

td.sidebarcell {
    min-width: 190px;
    width: 200px;
    max-width: 210px;
    vertical-align: top;
}

.sidebarnav {
    padding: 0px;
    border: 0;
    border-spacing: 0px;
    margin-left: 10px;
}

    .sidebarnav table {
        font-size: 12px;
        width: 100%;
        background: #fff;
    }

#sidebar1 caption {
    font-size: 13px;
    caption-side: top;
    width: auto;
    color: #0082c4;
    vertical-align: middle;
}

#sidebar1 td {
    padding-left: 6px;
    height: 18px;
    text-align: left;
}

#sidebar1 th {
    padding-left: 6px;
    height: 18px;
    background-color: #eee;
    color: #003399;
    font-weight: bold;
    text-align: left;
    text-decoration: none;
}

.sidebarnav caption a:link, .sidebarnav caption a:visited {
    color: #0082c4;
    text-decoration: none;
}

.sidebarnav th a:link, .sidebarnav th a:visited,
.sidebarnav td a:link, .sidebarnav td a:visited {
    color: #0887b6;
    text-decoration: none;
}

#sidebarcontainer {
    margin: 2px 20px 0 2px;
    border: 1px solid #ccc;
    width: auto;
    padding: 0;
    /*margin-bottom: 1em;*/
    color: #333;
    overflow-x: hidden;
    border-radius: 4px;
}

#sidebardiv1 {
    /*margin: 2px 20px 0 2px;*/
    margin: 0px;
    /*border: 1px solid #ccc;*/
    border: 0px;
    width: auto;
    /*padding: 0 0 0.4em 0;*/
    /*margin-bottom: 1em;*/
    color: #333;
    overflow-x: hidden;
    border-top: 1px solid #ddd;
}

#sidebardiv1 {
    overflow-y: hidden;
    max-height: 480px;
}

    #sidebardiv1:hover {
        overflow-y: auto;
    }

    #sidebardiv1 ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        border: none;
    }

    #sidebardiv1 li {
        margin: 0;
    }

        #sidebardiv1 li a {
            display: block;
            padding: 0px 6px 0px 6px;
            color: #444;
            text-decoration: none;
            width: 100%;
            white-space: nowrap;
        }

        html > body #sidebardiv1 li a {
            width: auto;
        }

            #sidebardiv1 li a:hover {
                text-decoration: underline;
                background-color: #ffff99;
                color: red;
            }

div.sidebartitle {
    font-size: 115%;
    background: #eee;
    font-weight: 500;
    text-align: center;
    padding: 6px 4px;
    background: -webkit-linear-gradient(rgba(238, 238, 238, 0.9), rgba(238, 238, 238, 0.5));
    background: -o-linear-gradient(rgba(238, 238, 238, 0.9), rgba(238, 238, 238, 0.5));
    background: -moz-linear-gradient(rgba(238, 238, 238, 0.9), rgba(238, 238, 238, 0.5));
    background: linear-gradient(rgba(238, 238, 238, 0.9), rgba(238, 238, 238, 0.5));
}

.sidebartitle a {
    color: #7f8c8d;
    color: #555;
    text-decoration: none;
}

    .sidebartitle a:hover {
        text-decoration: underline;
        color: red;
    }

#sidebardiv1 li.sbselected {
    background-color: #eee;
    font-weight: bold;
}

#sidebardiv1 li.sbhighlighted a {
    color: #f33;
}

#sidebardiv1 li.sbsep {
    padding: 6px 6px 1px;
    color: #999;
    font-weight: bold;
    white-space: nowrap;
}

/* END: Side Bar navigation styles */

/* (main page content: record listng) margin: 0 1px 0 0; is (Top, right, bottom, left) */
.pagecontent, .pageWithSideBar {
    padding: 0px;
    border: 1px solid #ccc;
    box-shadow: rgba(0,0,0,0.2) 0 0 4px;
    border-radius: 4px;
}

.pagecontent {
    margin: 4px 20px 6px;
}

.pageWithSideBar {
    margin: 2px 4px 2px 19px;
}

.pagecontent a:link, .pagecontent a:visited, .pagecontent a:active, .vwtab a:link, .vwtab a:visited, .lnk2 a:link, .lnk2 a:visited, .lsthdr a:link, .lsthdr a:active, .lsthdr a:visited, .hdrbig a:link, .hdrbig a:visited,
.lnk1 a:link, .lnk1 a:visited, .lnk12 a:link, .lnk12 a:visited, .lnk3 a:link, .lnk3 a:visited, tr.odl a:link, tr.odl a:visited, tr.evl a:link, tr.evl a:visited, .bbs a:link, .bbs a:active, .bbs a:visited {
    color: #333;
    text-decoration: none;
}


.pagecontent a:hover {
    color: #ff0000;
    text-decoration: underline;
}

.pagecontent tr.selrec {
    background: #ffffbb;
}

.pagecontent table {
    width: 100%;
    clear: both;
}

/* row border works with Mozilla, but not IE reclisttbl is the id of the table in HTML page */
#reclisttbl TR {
    border-bottom: 1px solid #eee;
    height: 24px;
}

    #reclisttbl tr:last-child {
        border-bottom: none;
    }

/* we need to put border-bottom for IE */
#reclisttbl td {
    border-bottom: 1px solid #eee;
    /*border-right: 1px solid #eee;*/
    height: 24px;
    color: #333;
}

#reclisttbl th {
    border-left: none;
    color: #0887B6;
    font-size: 0.8rem;
}

#reclisttbl td:last-child {
    border-bottom: 1px solid #eee;
    border-right: none;
}

#ruledreclistbl table, #dirconttblicons table {
    border: outset 0pt;
    border-spacing: 0;
}

#ruledreclistbl table, #reclisttbl table, .pagecontent table, #dirconttbldtls table {
    color: #333;
}

/* row border works with Mozilla, but not IE */
/* reclisttbl is the id of the table in HTML page */
#ruledreclistbl tr {
    border-bottom: 1px solid #eee;
}

    #ruledreclistbl tr:last-child {
        border-bottom: none;
    }

/* we need to put border-bottom for IE */
#ruledreclistbl td {
    border-bottom: 1px solid #eee;
    color: #333;
}

    #ruledreclistbl td:last-child {
        /*border-bottom: 1px solid #eee;*/
        border-right: none;
    }

#ruledreclistbl th {
    /*border-bottom: 1px solid #eee;*/
}


.dtlSecTitle {
    padding-left: 4px;
    padding-bottom: 6px;
    font-size: 1.25rem;
    font-weight: 500;
    color: #cce5ff;
    color: #99B4D1;
    color: #9a6f90;
    color: #788b91;
    text-decoration: none;
}

    .dtlSecTitle a:hover {
        text-decoration: none;
        background-color: #daa520;
    }

.SummarySecTitle {
    font-size: 1.40rem;
    font-weight: 500;
    color: cornflowerblue;
    text-decoration: none;
    margin-bottom: 6px;
}


/******* Generic LINK with Underline style **********/
.lnkul {
    font-size: 1.0rem;
    text-decoration: underline !important;
    color: #0366d6 !important;
    color: #51a384 !important;
}

    .lnkul a:link, .lnkul a:visited, .lnkul a:active {
        text-decoration: underline;
    }

    .lnkul a:hover {
        color: #ff0000;
        text-decoration: none;
    }

.EmphasisHighlight {
    background-color: #FF6666;
    font-weight: bold;
    color: #FFFFFF;
}

.withme {
    color: #6f42c1 !important;
}

.locked {
    color: #FF6666 !important;
}

#spacer40 {
    margin-top: 40px;
}
#spacer100 {
    margin-top: 100px;
}

#clientswithme {
    width: 70%;
    width: 70%;
    margin: 0 auto;
    margin-top: 40px;
}

    #clientswithme th {
        border-left: none;
        color: #0887B6;
        font-size: 0.8rem;
    }

#opracctdrivershome {
    width: 70%;
    width: 70%;
    margin: 0 auto;
    margin-top: 40px;
}

    #opracctdrivershome th {
        border-left: none;
        color: #0887B6;
        font-size: 0.8rem;
    }

#opracctvehicleshome {
    width: 70%;
    width: 70%;
    margin: 0 auto;
    margin-top: 40px;
}

    #opracctvehicleshome th {
        border-left: none;
        color: #0887B6;
        font-size: 0.8rem;
    }

.unlocked {
    color: green !important;
}

.activecolor {
    color: green !important;
}

.deletecolor {
    color: red !important;
}
.del-color-row {
    background-color: #ffe7ea;
}
.calc-color-row {
    background-color: #e3e7b1;
}

#maincnttblefixed, #maincnttblefixed2 {
    display: table !important;
}