﻿/*.................................................................
* COPYRIGHT OBS LOGISTICS LIMITED 2015
* SOUTHERN GATEWAY
* SPEKE BOULEVARD
* LIVERPOOL
* L24 9HZ
*.................................................................
* System           : EPOD
*.................................................................
* Module           : Browser Screens 
 *.................................................................
* Program          : ePODStandard.css
*.................................................................
* Author/          : Unknown
* Date             : Unknown
*.................................................................
* Used By          : Master Page
*.................................................................
* Functionality    :
*   Styling for web application
*.................................................................
*                  : History of Amendments :
*
*  Date       Name        Brief description                
*  --------   ----------  ---------------------------------------- 
*  28/10/2015 JG          331033 - Styling for overlay loading screen
*  10/06/2016 JG          333125/020 - New class to align text to the right
*  23/06/2016 JG          336220 - Fix to allow resizing controlbox with new menu
*  27/06/2016 JG          336220 - New styles for buttons
*  06/07/2016 JG          336220 - New button styles (Approve, Print and Waiver Print)
*  06/07/2016 RE          336542 - Show Complete with Amendments with blue background.
*  20/07/2016 JG          336220 - New download button style
*  25/07/2016 JG          336803 - Standardise Fonts, new styles for UDF preview buttons and new import button style
*  11/01/2017 PEJ         339485 - Add style for discard and hold buttons
*  23/01/2017 RE          340071 - Added map marker.
*  30/10/2017 ANW         346835 - Added Help Icon
*  17/11/2017 RE          346835 - Removed text decoration from help icon
*  16/11/2017 ANW         346835 - Added Column Selector
*  22/11/2017 ANW         347480 - Added button classes to make Upload options easier to style
*  10/10/2018 ANW         353518 - Added UDF and OBS Tab styles.
*  27/11/2018 MA          353947 - Font styling changes
*  06/12/2018 MA          353947 - Login Image Added
*  11/12/2018 MA          353947 - changed help icon image
*  11/12/2018 MA          340547 - added icons/styling for jobAssignBtn and sequenceBtn classes
*  18/12/2018 ANW         353518 - Fix UDF title and button styles.
*  15/01/2019 ANW         340547 - Fix line height of standard results pager
*  05/02/2019 RE          355304 - Added Bulk Job Entry and increased checkbox sizing.
*  26/02/2019 ANW         355735 - Conformity with new EPOD style
*  27/03/2019 ANW         356284 - Added format to align drop-down lists next to buttons.
*  26/04/2019 RE          356473 - Added job charges button.
*  16/05/2019 ANW         356892 - Added classes for odd/even coloured row displays in Import/Export Audit screen
*  11/05/2020 RE          372250 - Added Copy Job button.

/* Layout */
body {
    font-family: "Segoe UI", "Source Sans Pro", Calibri, Candara, Arial, sans-serif;
    font-size: 14px;
    margin: 0px;
}

h1, h2, h3, h4, h5 {
    font-family: "Segoe UI", "Source Sans Pro", Calibri, Candara, Arial, sans-serif;
}

h2 
{
    font-size: 1.3em;
}

input, textarea, keygen, select, button 
{
    font-family: "Segoe UI", "Source Sans Pro", Calibri, Candara, Arial, sans-serif;
    font-size: 14px;
}

p
{
    font: 15px arial,sans-serif;
}

div .controlbox, #controlbox
{
    min-height: 25px;
    padding: 10px 10px 10px 10px;
    overflow: hidden;
}

div .contentbox, #contentbox 
{
    overflow: auto;
    margin-top: 10px;
    border: solid 2px #B5C7DE;
    padding: 10px 10px 10px 10px;
    border: 1px solid #dee2e6 !important
}

div.contentbox h4, div.contentbox h2 {
    font-size: 1.40625rem;
    margin-bottom: 0.5rem;
    margin-top: 0;
    font-family: inherit;
    font-weight: 300;
    line-height: 1.2;
    color: inherit;
}

div .contentNoBorder, #contentNoBorder
{
    margin: 15px 1% 0px 1%;
    padding: 10px 10px 10px 10px;
}

div .searchbox {
    overflow: hidden;
    top: 0px;
    margin: 0 auto;
    padding: 10px 10px 10px 10px;
    display: none;
    border: 1px solid #dee2e6 !important;
}

div .searchbox table
{
    margin: 0 auto;
}

div #searchbox 
{
    top: 0px;
    margin: 0 auto;
    padding: 10px 10px 10px 10px;
    display: none;
    border: 1px solid #dee2e6 !important;
}

div #searchbox table
{
    margin: 0 auto;
}

/* Controls */

input[type="password"]
{
    /* min-width: 10em;*/
}

input[type="password"], input[type="text"]  {
    outline:none;
    transition: all 0.25s ease-in-out;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    border-radius:3px;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border:1px solid rgba(0,0,0, 0.2);
}

input[type="password"]:focus, input[type="text"]:focus, textarea:focus {
    box-shadow: 0 0 5px rgba(0, 0, 255, 1);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 255, 1);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 255, 1);
    border:1px solid rgba(0,0,255, 0.8);
}

input[type="text"]
{
    /*min-width: 200px;*/
}

/* These need to be commented out - START */
    input[type="button"][value="Obtain Upload Template"], input[type="button"][value="Upload"], input[type="submit"][value="Obtain Upload Template"], input[type="submit"][value="Upload"] { background-image: url(../Images/upload.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[value="Choose File"]{ background-image: url(../Images/chooseFile.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="submit"][value="Upload Excel Spreadsheet"], input[type="submit"][value="Create Excel Spreadsheet"], input[type="submit"][value="Export to CSV"], input[type="button"][value="Upload Excel Spreadsheet"], input[type="button"][value="Create Excel Spreadsheet"], input[type="button"][value="Export to CSV"] { background-image: url(../Images/excel.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }

    input[type="button"][value="Download"], input[type="button"][value="Download Results Spreadsheet"], input[type="submit"][value="Download"], input[type="submit"][value="Download Results Spreadsheet"] { background-image: url(../Images/download.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }

    input[type="button"][value="Find"], input[type="button"][value="Search"], input[type="submit"][value="Find"], input[type="submit"][value="Search"]{ background-image: url(../Images/find.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="New"], input[type="button"][value="New Loose Product"], input[type="button"][value="New Container"], input[type="button"][value="New Product"], input[type="button"][value="New Activity"], input[type="button"][value="New Field"], input[type="button"][value="Add"], input[type="submit"][value="New"], input[type="submit"][value="New Loose Product"], input[type="submit"][value="New Container"], input[type="submit"][value="New Product"], input[type="submit"][value="New Activity"], input[type="submit"][value="New Field"], input[type="submit"][value="Add"] { background-image: url(../Images/new.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Clear"], input[type="submit"][value="Clear"]{ background-image: url(../Images/clear.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Select"], input[type="button"][value="Approve"], input[type="submit"][value="Select"], input[type="submit"][value="Approve"]{ background-image: url(../Images/select.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Details"], input[type="button"][value="Jobs"], input[type="button"][value="Products"], input[type="submit"][value="Details"], input[type="submit"][value="Jobs"], input[type="submit"][value="Products"] { background-image: url(../Images/details.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Save"], input[type="button"][value="Update"], input[type="button"][value="Update Button"], input[type="button"][value="Create"], input[type="button"][value="Update Field"], input[type="submit"][value="Save"], input[type="submit"][value="Update"], input[type="submit"][value="Update Button"], input[type="submit"][value="Create"], input[type="submit"][value="Update Field"] { background-image: url(../Images/save.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Cancel"], input[type="submit"][value="Cancel"]{ background-image: url(../Images/close.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Photos"], input[type="button"][value="Images"], input[type="submit"][value="Photos"], input[type="submit"][value="Images"]{ background-image: url(../Images/photos.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="UDF"], input[type="submit"][value="UDF"]{ background-image: url(../Images/UDF.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Back"], input[type="button"][value="Close"], input[type="submit"][value="Back"], input[type="submit"][value="Close"] { background-image: url(../Images/back.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }

    input[type="button"][value="Print"], input[type="button"][value="Waiver Print"], input[type="submit"][value="Print"], input[type="submit"][value="Waiver Print"]{ background-image: url(../Images/print.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Report"], input[type="submit"][value="Report"]{ background-image: url(../Images/report.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Delete"], input[type="button"][value="Delete Field"], input[type="button"][value="Delete Button"], input[type="submit"][value="Delete"], input[type="submit"][value="Delete Field"], input[type="submit"][value="Delete Button"] { background-image: url(../Images/delete.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Email"], input[type="submit"][value="Email"]{ background-image: url(../Images/mail.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Log In"], input[type="submit"][value="Log In"]{ background-image: url(../Images/logout.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Edit"], input[type="submit"][value="Edit"]{ background-image: url(../Images/edit.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Assign"], input[type="submit"][value="Assign"]{ background-image: url(../Images/assign.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Unassign Loads"], input[type="submit"][value="Unassign Loads"]{ background-image: url(../Images/unassign.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Link"], input[type="submit"][value="Link"]{ background-image: url(../Images/link.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }

    input[type="button"][value="Import"], input[type="button"][value="Import from Webfleet"], input[type="submit"][value="Import"], input[type="submit"][value="Import from Webfleet"]{ background-image: url(../Images/import.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }

    input[type="button"][value="Access"], input[type="submit"][value="Access"]{ background-image: url(../Images/access.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Reprocess"], input[type="submit"][value="Reprocess"]{ background-image: url(../Images/reprocess.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Vehicle Checks"], input[type="submit"][value="Vehicle Checks"]{ background-image: url(../Images/vehicleCheck.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Loads"], input[type="submit"][value="Loads"]{ background-image: url(../Images/loads.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
    input[type="button"][value="Reprocess"], input[type="submit"][value="Reprocess"], input[type="button"][value="Restore to Default"], input[type="submit"][value="Restore to Default"]{ background-image: url(../Images/reprocess.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }

    input[type="button"][value="Map"], input[type="submit"][value="Map"]{ background-image: url(../Images/map-marker.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
/* These need to be commented out - END */
.btnWidth20 { display:inline; width:20%; }
input[type="button"][class*="accessBtn"], input[type="submit"][class*="accessBtn"] { background-image: url(../Images/access.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="approveSelectBtn"], input[type="submit"][class*="approveSelectBtn"] { background-image: url(../Images/select.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="assignBtn"], input[type="submit"][class*="assignBtn"] { background-image: url(../Images/assign.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="jobAssignBtn"], input[type="submit"][class*="jobAssignBtn"] {background-image: url(../Images/job-assign.png); background-repeat: no-repeat; background-position: left; padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor: pointer; overflow: hidden; }
input[type="button"][class*="sequenceBtn"], input[type="submit"][class*="sequenceBtn"] { background-image: url(../Images/sequence.png); background-repeat: no-repeat; background-position: left; padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor: pointer; overflow: hidden; }
input[type="button"][class*="backCloseBtn"], input[type="submit"][class*="backCloseBtn"] { background-image: url(../Images/back.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                   /* Back, Close */
input[type="button"][class*="cancelBtn"], input[type="submit"][class*="cancelBtn"] { background-image: url(../Images/close.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[class*="chooseFileBtn"] { background-image: url(../Images/chooseFile.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="clearBtn"], input[type="submit"][class*="clearBtn"] { background-image: url(../Images/clear.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="deleteBtn"], input[type="submit"][class*="deleteBtn"] { background-image: url(../Images/delete.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="detailsBtn"], input[type="submit"][class*="detailsBtn"] { background-image: url(../Images/details.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="discardBtn"], input[type="submit"][class*="discardBtn"]  { background-image: url(../Images/discard.png); background-repeat: no-repeat; background-position: left; padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="downloadBtn"], input[type="submit"][class*="downloadBtn"] { background-image: url(../Images/download.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                 /* Download, Download Results Spreadsheet */
input[type="button"][class*="editBtn"], input[type="submit"][class*="editBtn"] { background-image: url(../Images/edit.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="emailBtn"], input[type="submit"][class*="emailBtn"] { background-image: url(../Images/mail.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="excelBtn"], input[type="submit"][class*="excelBtn"] { background-image: url(../Images/excel.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                          /* Upload Excel Spreadsheet, Create Excel Spreadsheet, Export to CSV */
input[type="button"][class*="findBtn"], input[type="submit"][class*="findBtn"] { background-image: url(../Images/find.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                             /* Find, Search */
input[type="button"][class*="importBtn"], input[type="submit"][class*="importBtn"] { background-image: url(../Images/import.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                       /* Import, Import from Webfleet */
input[type="button"][class*="holdBtn"], input[type="submit"][class*="holdBtn"] { background-image: url(../Images/hold.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="linkBtn"], input[type="submit"][class*="linkBtn"] { background-image: url(../Images/link.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="loadsBtn"], input[type="submit"][class*="loadsBtn"] { background-image: url(../Images/loads.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="loginBtn"], input[type="submit"][class*="loginBtn"] { background-image: url(../Images/login.png); background-repeat: no-repeat; background-position: left; padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor: pointer; overflow: hidden; }
input[type="button"][class*="newBtn"], input[type="submit"][class*="newBtn"], input[type="button"][class*="bulkBtn"], input[type="submit"][class*="bulkBtn"] {
    background-image: url(../Images/new.png);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 25px;
    height: 30px;
    background-size: 20px;
    border: none;
    background-color: Transparent;
    cursor: pointer;
    overflow: hidden;
}
/* New, New Loose Product, New Container, New Product, New Activity, New Field, Add */
input[type="button"][class*="openDialogBtn"], input[type="submit"][class*="openDialogBtn"] { background-image: url(../Images/opendialog.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                                /* New, New Loose Product, New Container, New Product, New Activity, New Field, Add */
input[type="button"][class*="mapBtn"], input[type="submit"][class*="mapBtn"] { background-image: url(../Images/map-marker.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="photosBtn"], input[type="submit"][class*="photosBtn"] { background-image: url(../Images/photos.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                       /* Photos, Images */
input[type="button"][class*="printBtn"], input[type="submit"][class*="printBtn"] { background-image: url(../Images/print.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                          /* Print, Waiver Print */
input[type="button"][class*="releaseBtn"], input[type="submit"][class*="releaseBtn"] { background-image: url(../Images/play.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="reportBtn"], input[type="submit"][class*="reportBtn"] { background-image: url(../Images/report.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="reprocessBtn"], input[type="submit"][class*="reprocessBtn"] { background-image: url(../Images/reprocess.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }              /* Reprocess, Restore to Default */
input[type="button"][class*="saveBtn"], input[type="submit"][class*="saveBtn"] { background-image: url(../Images/save.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                             /* Create, Create Field, Save, Update, Update Field */ 
input[type="button"][class*="unassignLoadsBtn"], input[type="submit"][class*="unassignLoadsBtn"] { background-image: url(../Images/unassign.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="udfBtn"], input[type="submit"][class*="udfBtn"]{ background-image: url(../Images/UDF.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="uploadBtn"], input[type="submit"][class*="uploadBtn"] { background-image: url(../Images/upload.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                       /* Obtain Upload Template, Upload */
input[type="button"][class*="vehicleChecksBtn"], input[type="submit"][class*="vehicleChecksBtn"] { background-image: url(../Images/vehicleCheck.png); background-repeat: no-repeat; background-position: left;padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
input[type="button"][class*="unknownBtn"], input[type="submit"][class*="unknownBtn"] { background-image: url(../Images/redquestion.png); background-repeat: no-repeat; background-position: left; color:#fe0000; padding-left: 25px; height: 30px; background-size: 20px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }                       /* Obtain Upload Template, Upload */
input[type="button"][class*="chargesBtn"], input[type="submit"][class*="chargesBtn"] {
    background-image: url(../Images/charges.png);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 25px;
    height: 30px;
    background-size: 20px;
    border: none;
    background-color: Transparent;
    cursor: pointer;
    overflow: hidden;
}
input[type="button"][class*="copyBtn"], input[type="submit"][class*="copyBtn"] {
    background-image: url(../Images/copy.png);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 25px;
    height: 30px;
    background-size: 20px;
    border: none;
    background-color: Transparent;
    cursor: pointer;
    overflow: hidden;
}
/* Obtain Upload Template, Upload */


h2 input.colSelector { float: right; }

input[type="button"]:hover, input[type="submit"]:hover {text-decoration: underline;}
a#ctl00_LinkButton2 { color: #ffffff; text-decoration: none; background-image: url(../Images/logout.png); background-repeat: no-repeat; background-position: right;padding: 30px; padding-right: 40px; height: 30px; background-size: 30px; border: none; background-color: Transparent; cursor:pointer; overflow: hidden; }
a#ctl00_LinkButton2:hover {text-decoration: underline;}

a.helpicon {
    color: black;
    background-image: url(../Images/helpwhite.png);
    margin-left: 20px;
    background-repeat: no-repeat;
    background-position: left;
    padding: 30px 5px 30px 30px;
    height: 35px;
    background-size: 20px;
    border: none;
    background-color: Transparent;
    cursor: pointer;
    overflow: hidden;
    text-decoration: none;
}

input.hide {
    background-image: url(../Images/close.png);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 25px;
    height: 30px;
    background-size: 20px;
    border: none;
    background-color: Transparent;
    cursor: pointer;
    overflow: hidden;
}
input.uploadXLS {
    background-image: url(../Images/excel.png);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 25px;
    height: 30px;
    background-size: 20px;
    border: none;
    background-color: Transparent;
    cursor: pointer;
    overflow: hidden;
}

input[type="checkbox"] {
    width: 1.4em;
    height: 1.4em;
    margin: 0px;
    vertical-align: top;
}

input[type="checkbox"]:hover
{
    cursor: pointer;
}

/* Style rule for buttons in the UDF preview form */
/* These buttons should not pick up the new button styles */
input.deviceButton 
{
    font-size: 12px;
    cursor: pointer;
    min-width: 65px;
    border: 1px solid white !important;
    background-color: Blue !important;
    color: White;
    padding: 2px 2px 2px 2px !important;
    margin: 2px 2px 2px 2px;
    background-image: none !important;
    height: 30px;
}    

.UDFPreview {
    width: 230px;
    height: 384px;
    overflow: none;
    padding-top: 20px;
    padding-left: 10px;
}

.UDFPreview .UDFFields {
    height: 90%;
    width: 99%;
    overflow: auto;
}

.UDFPreview .UDFButtons {
    position: absolute;
    bottom: 0;
}

.UDFPreview .UDFTitle {
    width: 95%;
    background-color: blue;
    padding: 5px;
    color: white;
    display: block;
    font-size: 1em;
}

.UDFPreview .UDFText {
    width: 50%;
    float: right
}

.UDFPreview .UDFSubLabel {
    font-size: 0.8em;
    float: left;
    width: 70%;
    display: block;
}

.UDFPreview .UDFPostLabel {
    font-size: 0.8em;
    float: right;
    width: 30%;
    text-align: right;
    display: block;
}

.UDFPreview .UDFLabel {
    width: auto;
}

.UDFPreview .UDFLabelField {
    width: auto;
}

.UDFPreview .UDFDDL {
    width: 50%;
    float: right
}

.UDFPreview .UDFButton {
    font-size: 12px;
    cursor: pointer;
    min-width: 65px;
    border: 1px solid white !important;
    background-color: Blue !important;
    color: White;
    padding: 2px 2px 2px 2px !important;
    margin: 2px 2px 2px 2px;
    background-image: none !important;
    height: 30px;
}

.UDFPreview .UDFButtonField, .UDFButtons input {
    font-size: 12px;
    cursor: pointer;
    min-width: 65px;
    border: 1px solid white !important;
    background-color: Blue !important;
    color: White;
    padding: 7px 2px 7px 2px !important;
    margin: 2px 2px 2px 2px;
    background-image: none !important;
}

.UDFTitle {
    width: auto;
    background-color: transparent;
    padding: 0px;
    padding-bottom: 1em;
    color: black;
    display: block;
    font-size: 1.5em;
}

.UDFText {
    width: auto;
}

.UDFSubLabel {
    display: none;
}

.UDFPostLabel {
    display: none;
}

.UDFLabel {
    display: inline-block;
    width: 15em;
}

.UDFLabelField {
    display: inline-block;
    width: 30em;
}

.UDFDDL {
    width: auto;
}

.UDFButton {
    font-size: 12px;
    cursor: pointer;
    min-width: 65px;
    border: 1px solid white !important;
    background-color: Blue !important;
    color: White;
    padding: 2px 2px 2px 2px !important;
    margin: 2px 2px 2px 2px;
    background-image: none !important;
    height: 30px;
}


.ajax__tab_obs .ajax__tab_header {
    font-family: Calibri, "Helvetica Neue", Arial, Sans-Serif;
    font-size: 16px;
    font-weight: normal;
    display: block;
}

.ajax__tab_obs .ajax__tab_header .ajax__tab_outer {
    border-color: #222;
    color: #222;
    padding-left: 10px;
    margin-right: 3px;
    border: solid 1px #d7d7d7;
    background-color: lightgray;
}

.ajax__tab_obs .ajax__tab_header .ajax__tab_inner {
    border-color: #666;
    color: #666;
    padding: 3px 10px 2px 0px;
}

.ajax__tab_obs .ajax__tab_hover .ajax__tab_outer {
    background-color: #f0f0f0;
}

.ajax__tab_obs .ajax__tab_hover .ajax__tab_inner {
    color: #fff;
}

.ajax__tab_obs .ajax__tab_active .ajax__tab_outer {
    border-bottom-color: #ffffff;
    background-color: white;
    border-top: solid #42fe04 3px;
    border-radius: 3px;
}

.ajax__tab_obs .ajax__tab_active .ajax__tab_inner {
    color: #000;
    border-color: #333;
}

.ajax__tab_obs .ajax__tab_body {
    font-family: verdana,tahoma,helvetica;
    font-size: 10pt;
    background-color: #fff;
    border: solid 1px #d7d7d7;
    padding: 8px;
    border-top: 0;
}
.ajax__subtab_obs .ajax__tab_body {
    border-top: solid 1px #d7d7d7;
}
.ajax__tab_obs .ajax__tab_tab {
    outline: none;
}

.ajax__tab_obs .ajax__tab_disabled {
    color: grey;
    font-style:italic;
    cursor:default;
}

select
{
    min-width: 106px;
    outline:none;
    transition: all 0.25s ease-in-out;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    border-radius:3px;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border:1px solid rgba(0,0,0, 0.2);
}

select:focus
{
        box-shadow: 0 0 5px rgba(0, 0, 255, 1);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 255, 1);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 255, 1);
    border:1px solid rgba(0,0,255, 0.8);
    }

.hangRight
{
    float: right;
}

.modalPopUp2 {
    border: solid 1px #c0c0c0;
    background: #f0f0f0;
    padding: 10px 10px 10px 10px;
    -moz-border-radius: 10px;
    -khtml-border-radius: 10px; /* for old Konqueror browsers */
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.modalPopUp2 .header, #header {
    width: 100%;
    padding: 5px 5px 5px 5px;
    height: 20px;
    margin-bottom: 5px;
    z-index: 9000;
}

.modalPopUp, #modalPopUp
{
    border: solid 1px #c0c0c0;
    background: #f0f0f0;
    padding: 10px 10px 10px 10px;
    -moz-border-radius: 10px;
    -khtml-border-radius: 10px; /* for old Konqueror browsers */
    -webkit-border-radius: 10px;
    border-radius: 10px;
    height: 100%;
}

.modalPopUp .header, #header
{
    width: 100%;
    padding: 5px 5px 5px 5px;
    height: 20px;
    margin-bottom: 5px;
}

#modalPopUp .header, #header
{
    width: 100%;
    padding: 5px 5px 5px 5px;
    height: 20px;
    margin-bottom: 5px;
}

/* GRIDVIEW*/

.gridview
{
    width: 100%;
    -moz-border-radius: 5px !important;
   /border-collapse: collapse !important;
    border: none !important;
}

.header_Bar 
{
    border: 1px solid white;
    width: 100%;
    border-collapse: collapse !important;
    border: none !important;
    text-align:right;
    vertical-align:middle;
    min-height: 25px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -khtml-border-top-left-radius: 10px;
    -khtml-border-top-right-radius: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.header_Bar select {
    margin-right: 10px;
}

.gridview tr:last-child  {
  -moz-border-radius: 5px !important;
}

.gridview_row
{
    border: 2px solid white;
}

.gridview_row td
{
    border: dotted white 1px;
}

.gridview_row:hover td /*> .complete .pending .inprogress .assigned .cancelled*/
{
    background-color:#0099CC;
    color: White;
}

.gridview_selected_row
{
    border: 2px solid white;
}

.gridview_selected_row td
{
    border: dotted white 1px;
}

.gridview_row td
{
    border: dotted white 1px;
}

.gridview_row_alt
{
    border: 2px solid white;
    background-color: rgb(0,0,0,0.05);
}

.gridview_row_alt td
{
    border: dotted white 1px;
}

.gridview_row_alt:hover td /*> .complete .pending .inprogress .assigned .cancelled*/
{
    background-color:#0099CC;
    color: White;
}

.gridview_selected_row_alt
{
    border: 2px solid white;
    background-color:#E0E0E0;
}

.gridview_selected_row_alt td
{
    border: dotted white 1px;
}

.gridview_pager {
    border: 1px solid white;
    line-height: 2em; 
}

.gridview_pager table
{
    float:right;
}

.gridview_pager a 
{
    font-weight: bold;
}

.gridview_pager a:hover
{
    font-weight: bold;
}

input.colSelector 
{
    float: left;
    margin-left: 10px;
}

input.colSelector {
    font-weight: normal;
    color: white;
    margin: 5px;
    padding: 10px;
    border-radius: 0px;
    background: #444;
    border: none;
}

input.colSelector:hover {
    color: white;
    background-color:#252728;
    border-color:#1f2021;
    text-decoration: none;
    cursor:pointer;
}

.gridview_pager table td
{
    text-align: center;
    color: #fff;
    background-color: #2780E3;
    border-color: #2780E3;
}

.gridview_pager table
{
    border-collapse: collapse;
    margin: 0;
}

.gridview_pager table td span {
    padding-left: 10px;
    padding-right: 10px;
    color: #fff;
    background-color: #2780E3;
    border-color: #2780E3;
    padding: 0.35rem 0.5rem;
}

.gridview_pager table td a
{
    position: relative;
    display: block;
    padding: 0.35rem 0.5rem;
    margin: -2px;
    line-height: 1.1;
    color: #2780E3;
    background-color: #fff;
    border: 1px solid #dee2e6;
    text-decoration: none;
    font-weight: normal;
}

.gridview_pager table td a:hover
{
    font-weight: normal;
    background-color: #f0f0f0;
}

.gridview_header
{
    margin-bottom: 4px;
}

.dataTable.dataTable 
{
    border-collapse: collapse;
}

.gridview_header th, .dataTable thead th
{
    font-weight: bold;
    color: black;
    border-top: 1px solid #dee2e6;
    padding: 3px 18px 3px 10px;
    border-bottom: 1px solid black;
    background: #fbfbfb;
}

.gridview_header th a
{   margin: 0 auto;
    text-align:center;
    vertical-align:middle;
    color: black;
    text-decoration: none;
}

.gridview_header th a:hover

{
    cursor: pointer;
    color:grey;
}

.gridview_footer
{
    line-height: 2em;
}

/* Status Related Coloring */

.complete
{
    background-color:#C6EFCE;
    color: Black;
}

.complete.odd {
    background-color: rgba(198,239,206,0.75);
    color: Black;
}

.completeAmended
{
    background-color:#BAE5F3;
    color: Black;
}
.completeAmended.odd {
    background-color: rgba(186,229,243,0.75);
    color: Black;
}

.pending
{
    background-color:White;
}

.inprogress
{
    background-color: #FFEB9C;
}
.inprogress.odd {
    background-color: rgba(255,235,156,0.75);
}

.cancelled
{
    background-color: #FFC7CE;
    color: Black;
}
.cancelled.odd {
    background-color: rgba(255,199,206,0.75);
    color: Black;
}

.assigned
{
    background-color: #CCCCFF;
    color: Black;
}

.complete a, .inprogress a, .cancelled a
{
    color:black;
    }

.CalloutValidator div, .CalloutValidator td
{
    border: solid 1px #F5B800;
    background-color: #FFCC33;
    color: Red;
}

/* Helpers */

.internalPadding
{
    padding: 10px 10px 10px 10px;
}
.externalMargin
{
    margin: 10px 10px 10px 10px;
}

.dataAreaLarge
{
    width: 100%;
}

.hidden
{
    display: none;
}
.loadingDiv
{
    width: 100%;
}
.loadingDiv img
{
    margin: 0 auto;
    width: 100px;
}

.dataAreaMedium
{
    width: 75%;
}

.dataAreaSmall
{
    width: 50%;
}

.scrollable
{
    overflow: scroll;
}

.centerContent
{
    text-align: center;
}

.rightAlign
{
    text-align: right;
}

div.UpdateProgressStyle 
{
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    min-height: 100%;
    margin: 0;
    background-color: #000;
    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
    z-index: 99999999999;
    visibility: hidden;
}
        
div.UpdateProgressStyle > img
{
    position:absolute;
    margin:auto;
    top:0;
    left:0;
    right:0;
    bottom:0; 
    height:80px; 
    width: 80px;
}
.ddlButton {
    padding: 0.3em 1.5em 0.3em 1.5em;
}
