﻿/* DEFAULTS
----------------------------------------------------------*/

td {
    /*color: #706f6f;
    vertical-align: text-top;*/
    font-weight: 400;
}

fieldset {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin: 5px 0px;
}


img {
    border-style: none;
    border-color: inherit;
    border-width: 0px;
    margin: 0px;
    padding: 0px;
}


li {
    padding-bottom: 3px;
}

ul {
    margin: 8px 0px 0px 22px;
}

hr {
    height: 1px;
    color: #cccccc;
    padding: 0px;
    margin: 0px;
}

a {
    cursor: pointer;
    color: #056ac5;
    text-decoration: none;
}

    a:hover {
        color: #023664;
        text-decoration: underline;
    }

    a:visited {
        color: #7da3c5;
    }

.pageTitle {
    margin: 0px;
    padding: 0px;
    max-width: 50%;
    overflow: hidden;
    text-overflow: ellipsis;
}

h1 {
    width: 100%;
    background-color: #ee3158;
    color: #ffffff;
    font-size: 18px;
    font-weight: normal;
    margin: 0px 0px 6px 0px;
    padding: 0px 0px 10px 0px;
}

h2 {
    color: #ee3158;
    font-size: 18px;
    font-weight: normal;
}

h3, h4 {
    font-family: verdana;
    font-size: 18px;
    color: #ee3158;
    font-weight: normal;
    margin-bottom: 10px;
}

h4 {
    margin: 3px 0px;
}




#menuStyle {
    width: 100%;
    display: block;
    height: 26px;
    background-image: url(/images/menu_background.png);
    background-position: top left;
    background-repeat: repeat-x;
    background-color: #000;
}


.topBackground {
    height: 35px;
    background-image: url('/images/top_background.gif');
    background-repeat: repeat-x;
    background-position: bottom;
}

.imageButton {
    color: #ffffff;
    background: #25A0DA url('../images/search_glyph.png') no-repeat center;
    border: #25A0DA 1px solid;
    cursor: pointer;
    float: right;
    /*padding: 6px 2px 0px 2px;*/
    text-align: center;
    /*font-size: 11px;*/
    height: 22px;
    width: 22px;
    line-height: 20px;
}

.imageButton02 {
    color: #ffffff;
    background: #25A0DA url('../images/search_glyph.png') no-repeat center;
    border: #25A0DA 1px solid;
    cursor: pointer;
    /*padding: 6px 2px 0px 2px;*/
    text-align: center;
    /*font-size: 11px;*/
    height: 22px;
    width: 22px;
    line-height: 20px;
    position: relative;
    top: -1px;
}

.imageButton03 {
    height: 16px !important;
    width: 16px !important;
}

.button, .button02, .tablebutton {
    font-family: Arial, verdana;
    color: #ffffff;
    background-color: #25A0DA;
    border: #25A0DA 1px solid;
    cursor: pointer;
    padding: 1px 6px 2px 6px;
    text-align: center;
    font-size: 11px;
    position: relative;
    top: -1px;
}

    .button[disabled="disabled"], .overrideButton[disabled="disabled"] {
        color: red;
        background-color: #c6c9cb;
        border: gray 1px solid;
        cursor: url(/images/Clearallrequests_8816.cur), auto;
    }

.overrideButton {
    font-family: Arial, verdana;
    border: #000 1px solid;
    cursor: pointer;
    padding: 1px 6px 2px 6px;
    text-align: center;
    font-size: 11px;
    position: relative;
    top: -1px;
}

.button02 {
    position: relative;
    top: -1px;
}

.button-danger {
    color: #ffffff;
    background-color: #ee3158;
    border: gray 1px solid;
}

.linkButton {
    color: #FFF !important;
    border-radius: 2px 2px 2px 2px;
    padding: 3px 6px 2px 6px;
    padding-top: 2px\9; /* ie8 ie9 */
    padding-bottom: 2px\9; /* ie8 ie9 */
    font-size: 1em;
    height: 22px;
    outline: 0 none;
    vertical-align: middle;
    text-decoration: none;
}

    .linkButton:hover {
        color: #FFF;
        text-decoration: none;
    }

.optionButton {
    padding-right: 12px;
    padding-right: 16px\9; /* ie8 ie9 */
    background-image: url(/images/downarrow.png);
    background-repeat: no-repeat;
    background-position: right 50%;
}

.tablebutton {
    margin-top: 3px;
}

.Loginbutton {
    color: #ffffff;
    background-repeat: no-repeat;
    background-color: #f0f1f1;
    border: #f0f1f1 1px solid;
    cursor: pointer;
    padding: 0px 6px 2px 6px;
    text-align: center;
    font-size: 11px;
    height: 19px;
    background-image: url('../images/button.gif');
}

.buttonholder div {
    min-width: 10px;
    max-width: 300px;
    margin: 2px;
    float: left;
}

.mapbutton {
    background-color: #f1f7f7;
    border: #ffffff 1px solid;
    cursor: pointer;
    text-align: center;
    font-size: 11px;
    width: 69px;
    height: 21px;
    margin-top: 4px;
}

    .mapbutton:hover {
        background-color: #e9e9e9;
        border: #ffffff 1px solid;
        cursor: pointer;
        padding: 2px 6px 2px 6px;
        text-align: center;
        font-size: 11px;
    }

.companyGrid {
    background-color: #92B4E0;
    border-top: 3px black solid;
    border-left: 3px black solid;
    border-right: 3px black solid;
    border-bottom: 1px black solid;
    cursor: pointer;
}

.contactGrid {
    background-color: White;
    cursor: pointer;
}




.dutyDetails td {
    font-size: 11px;
    font-family: Arial;
}

.buttonAreaTop {
    margin: 5px 0px 10px 10px;
}

.buttonArea {
    margin: 5px 0px 10px 0px;
}

.ggg {
    z-index: 2000;
}

.clr {
    clear: both;
}

/******* AutoComplete List sytles *******/
.autocomplete_completionListElement {
    visibility: hidden;
    margin: 0px !important;
    background-color: inherit;
    color: windowtext;
    border: buttonshadow;
    border-width: 1px;
    border-style: solid;
    cursor: default;
    overflow: auto;
    max-width: 600px;
    text-align: left;
    list-style-type: none;
    font-family: courier new;
    font-size: 8pt;
    padding: 0px;
}

/* AutoComplete highlighted item */

.autocomplete_highlightedListItem {
    background-color: #ffff99;
    color: black;
    padding: 1px;
}

/* AutoComplete item */
.autocomplete_listItem {
    background-color: window;
    color: windowtext;
    padding: 1px;
}

.bob {
    position: fixed;
}

.line {
    background-color: black;
    height: 1px;
}

.columns {
    float: left;
    position: relative;
    width: 266px;
    z-index: 1;
}

.columnsl {
    float: left;
    position: relative;
    width: 266px;
    margin-right: 1px;
    z-index: 1;
}

.columnsr {
    float: left;
    position: relative;
    width: 266px;
    margin-left: 1px;
    z-index: 1;
}

.printcolumns {
    float: left;
    width: 223px;
}

.printcolumnsl {
    float: left;
    width: 223px;
    margin-right: 1px;
    margin-left: 1px;
}

.printcolumnsr {
    float: left;
    width: 223px;
    margin-left: 1px;
}

.columnpanel {
    margin-top: 1px;
}

    .columnpanel td {
        margin-top: 1px;
        font-size: 11px;
        FONT-FAMILY: Arial;
    }

.dutyItemCellTitle {
    width: 120px;
}

.dutyItemCellMain {
    min-width: 150px;
}

.dutyItemCellValidation {
    width: 120px;
}

.supportButton {
    margin-left: 430px;
}

.altHeader {
    height: 31px;
    background-image: url('../images/grid_header.gif');
    background-repeat: repeat-x;
    color: white;
    border: Solid Black 1px;
}

    .allocationGrid, .altHeader td {
        vertical-align: top;
    }

.allocationGrid {
    border-top: 1px solid #000;
    border-left: 1px solid #000;
}

    .allocationGrid td {
        border-right: 1px solid #000;
        border-bottom: 1px solid #000;
    }

.gridBorderOverride {
    border-width: 0px !important;
}

    .gridBorderOverride td {
        border-width: 0px !important;
    }

.panelHeader {
    padding: 5px;
}

.rowHeaderPageSplit {
    background: #FF6600;
    height: 25px;
    color: white;
    padding: 9px;
    font-size: 14px;
}

.rowSubHeaderPageSplit {
    background: #8c8b8b;
    height: 15px;
    color: white;
    padding: 5px;
    font-size: 12px;
}

.panelPageSplit {
    padding: 5px;
    border: 2px solid #f9bf80;
    background-color: #ECECEC;
    position: relative;
}

.findStopSection {
    padding: 5px;
    background-color: #ECECEC;
    position: relative;
    width: 670px;
}

.pageView {
    padding: 10px;
}

/*.loading
		{
			background-color: rgba(204, 204, 204, 0.2);
			height:100%;
			width:100%;
		}*/

div.ajax_loader {
    background: #fff url(images/loading4.gif) no-repeat center center;
}

.loadingWpr, .wndDiv .RadAjaxPanel {
    position: relative;
    min-height: 100%;
    height: 100%;
}

/* Payroll, driver payroll */
.PEW {
    width: 360px;
    float: right;
}

.PY_spacer {
    margin: 2px 2px;
}



/* rollover i */
a.info {
    position: relative;
    text-decoration: none;
    z-index: 24;
}

    a.info img {
        border: 0 none;
        margin-top: -2px;
        padding: 0 2px 0;
        position: relative;
        top: 2px;
    }

    a.info span {
        display: none;
        text-decoration: none;
    }

    a.info:hover {
        color: #000000;
        z-index: 25;
    }

        a.info:hover span.tooltip {
            color: #000000;
            display: block;
            font-weight: normal;
            left: 20px;
            padding: 12px 0 0;
            position: absolute;
            top: -10px;
            width: 300px;
        }

        a.info:hover span.top {
            display: block;
            background-color: #fff;
            border-left: solid 1px #000;
            border-right: solid 1px #000;
            border-top: solid 1px #000;
        }

        a.info:hover span.middle {
            background-color: #fff;
            display: block;
            padding: 10px;
            text-decoration: none;
            border: solid 1px #000;
            font-size: 11px;
        }

        a.info:hover span.bottom {
            background-color: #fff;
            display: block;
            border-left: solid 1px #000;
            border-right: solid 1px #000;
            border-bottom: solid 1px #000;
        }

/*test stuff start*/
/* set background images for corners */
.rbroundbox {
    background: url(simple_background.gif) repeat;
}

.rbtop div {
    background: url(images/top-left.png) no-repeat top left;
}

.rbtop {
    background: url(images/top-right.png) no-repeat top right;
}

.rbbot div {
    background: url(images/bottom-png.gif) no-repeat bottom left;
}

.rbbot {
    background: url(images/bottom-right.png) no-repeat bottom right;
}

    /* height and width details */
    .rbtop div, .rbtop, .rbbot div, .rbbot {
        width: 100%;
        height: 14px;
        font-size: 1px;
    }

.rbcontent {
    margin: 0 14px;
}

.rbroundbox {
    width: 20em;
    margin: auto;
}
/*test stuff end*/





/* Warning Classes
----------------------------------------------------------*/
.alignRotaWarning {
    position: absolute;
    top: 5px;
    margin-left: 590px;
}

.dutyWarning {
    margin: 5px 0px;
    padding-left: 20px;
}

/* Invoice Page
----------------------------------------------------------*/
.InvoiceDetails {
    border: 1px solid #000;
    width: 300px;
}

.InvoiceDetailsTitle {
    background-color: #CCC;
    font-weight: bold;
    border-right: 1px solid #000;
}

.InvoiceTotals {
    width: 80px;
    font-weight: bold;
}

.InvoiceTotalsValues {
    width: 100px;
    text-align: right;
}

.IptSubTotal {
    text-align: right;
}

/***** Duty Sheet Page *****/
.DutySheetCellAlignment {
    text-align: right;
}


/***** FORM ELEMENTS *****/

.formItem {
    margin-bottom: 10px;
}

    .formItem label {
        float: left;
        display: block;
        /*margin-top: 3px;   */
        width: 155px;
    }

.cbxItem label {
    float: none;
    width: auto;
    display: inline;
    margin-right: 10px;
}

.errorSummary {
    border: 1px dashed #ff0000;
    background-color: #eee;
    margin: 5px;
    padding-top: 6px;
    padding-right: 5px;
    padding-bottom: 6px;
}

    .errorSummary ul {
        margin-left: 0px;
    }

.validation, .editor, .cbxHolder, .gridItem {
    margin-left: 155px;
    display: block;
}

.required {
    color: #FF0000;
}

.requiredBlock {
    display: block;
}

.checksSummary {
    border: 1px dashed #ff0000;
    background-color: #eee;
    margin: 5px 5px;
    padding: 5px 0px 5px 40px;
    color: #FF0000;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.txtValidationWarning {
    border-color: #ff0000 !important;
    background-color: #eee !important;
}

.checksSummary ul {
    margin: 0px;
    padding: 0px;
}

.capsWarning {
    background-color: #ffff99;
    border: 1px solid #515151;
    padding: 0px 3px;
}

.rsApt {
    cursor: pointer;
}

.subTabSelected {
    color: #ee5e21;
}

.radToolTip {
    margin: 8px;
}

/* Table's, Grid's
----------------------------------------------------------*/

.spr10 {
    width: 10px;
}

.spr20 {
    width: 20px;
}


.mgnCtr {
    margin: 0 auto;
}

.mgnTop5 {
    margin-top: 5px;
}

.mgnTop10 {
    margin-top: 10px;
}

.mgnBtm2 {
    margin-bottom: 2px;
}

.mgnBtm3 {
    margin-bottom: 3px;
}

.mgnBtm5 {
    margin-bottom: 5px;
}

.mgnBtm6 {
    margin-bottom: 6px;
}

.mgnBtm10 {
    margin-bottom: 10px;
}

.mgn03 {
    margin: 3px;
}

.mgn05 {
    margin: 5px;
}

.mgnRgt04 {
    margin-right: 4px;
}

.mgnRgt05 {
    margin-right: 5px;
}

.mgnRgt06 {
    margin-right: 6px;
}

.mgnLft05 {
    margin-left: 5px;
}

.mgnLft20 {
    margin-left: 20px;
}

.inlBlk {
    display: inline-block;
}

.dlyInl {
    display: inline;
}

.pdg0 {
    padding: 0px;
}

.pdg1 {
    padding: 1px;
}


.pdg2 {
    padding: 2px;
}

.pdg3 {
    padding: 3px;
}

.pdg5 {
    padding: 5px;
}

.stkText {
    text-decoration: line-through;
}

.preformatted {
    white-space: pre-line;
}

.InfSpin {
    animation: infinite-spinning 1s infinite;
}

.RefreshButton {
    height: 22px;
    width: 32px;
    vertical-align: middle;
    color: white;
}

    .RefreshButton:after {
        content: '';
        display: block;
        height: 16px;
        width: 16px;
        color: white;
        background-image: url('../images/refresh.svg')
    }

    .RefreshButton.Loading {
        background-color:lightskyblue;
        cursor: not-allowed;
    }

    .RefreshButton.Loading:after {
        animation: infinite-spinning 1s infinite;
    }


@keyframes infinite-spinning {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
