/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
html, body
{
    height: 100%;
}

body
{
    font-size: 16px;
}

body
{
    /*font-size: 16px !important; */
    font-family: Lato, Arial, Verdana, Helvetica !important;
    margin: 0;
    padding: 0;
    color: #000;
}

#page
{
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin-bottom: -27px;
    background-color: #aec6d7;
}

#contentContainer
{
    padding: 0 30px;
    max-width: 1170px;
    margin: auto; 
}

#contentContainer.homeContentContainer
{
    padding: 0;
    color: #FFF;
    max-width: inherit;
}

.centerContent {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 10px;
}

#main
{
    width: 100%;
    padding-bottom: 15px;
    float: left;
    background-color: #aec6d7;
}

#main li, #showHelp li {
    margin-bottom: 15px;
    padding-left: 15px;
}

#mainHome {
    width: 100%;
    float: left;
}

.ui-widget
{
    font-family: Lato, Arial, Verdana, Helvetica !important;
}

a, #showHelp a
{
    border: 0;
    text-decoration: underline;
    color: #069eff;
}

a:hover, a:focus
{
    color: #000;
}
a:active
{
    color: #000;
}

p, ul
{
    margin-bottom: 20px;
    line-height: 1.6em;
}

table td
{
    vertical-align: top;
}
table td a, .ui-widget-content table a {
    color: #069eff;
}
.altRow
{
    background-color: #e0e0e0;
}
.list
{
    margin-bottom: 10px;
}

/* Top Navigation */

.slicknav_menu
{
    display: none;
    background-color: #2c2d3a !important;
}

.slicknav_nav .slicknav_item:hover, .slicknav_nav a:hover {
    background: #1e77ff !important;
    color: #fff !important;
}

#navContainerHome {
    width: 100%;
}

#navContainerHome ul {
    list-style: none;
    padding: 2% 0 0 0;
    margin: 0;
}

#navContainerHome li {
    float: left;
    margin-right: 3%;
}

#navContainerHome li:last-child {
    background-color: #fb3f26;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    padding: 0% 2%;
    margin-right: 0;
}

#navContainerHome a:link, #navContainerHome a:visited {
    color: #fff;
    text-decoration: none;
    font-size: 1.5em;
}

@media screen and (max-width: 1220px)
{
    #navContainer, #navContainerHome
    {
        display: none;
    }

    .slicknav_menu
    {
        display: block;
    }
}

.gradient
{
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DAE5E1', endColorstr='#83928D'); /* for IE */
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DAE5E1', endColorstr='#83928D'); /* for IE8 */
    background: -webkit-gradient(linear, left top, left bottom, from(#DAE5E1), to(#83928D)); /* Webkit (Safari/Chrome 10) */
    background: -webkit-linear-gradient(top, #DAE5E1, #83928D); /* Webkit (Chrome 11+) */
    background: -moz-linear-gradient(top,  #DAE5E1,  #83928D); /* Mozilla Firefox */
    background: -ms-linear-gradient(top,  #DAE5E1,  #83928D); /* for IE10 */
    background: -o-linear-gradient(top,  #DAE5E1,  #83928D); /* Opera */
    background: linear-gradient(#DAE5E1, #83928D);
}

.solidBackground, #navContainer li ul
{
    background-color: #DAE5E1;
}

#navContainer
{
    float: left;
    width: 100%;
    z-index: 100;
    position: relative;
}

#nav
{
    list-style: none outside none;
    margin: 0;
    padding: 0;
    width: 100%;
    display: table;
    table-layout: fixed;
    text-transform: uppercase;
}
#nav li
{
    text-align: center;
    display: table-cell;
    padding-left: 0;
}

#nav a
{
    text-align: center;
    display: block;
    padding: 5px;
    text-decoration: none;
    white-space: nowrap;
}

#nav a:hover, #nav a:focus, #nav li:hover > a, #nav li:focus > a
{
    background: url("images/ui-bg_glass_75_79c9ec_1x400.png") repeat-x scroll 50% 50% #79C9EC;
    cursor: default;
}

#nav li ul li a
{
    cursor: pointer !important;
}

#nav li ul li a, #nav li ul li a:hover, #nav li ul li a:focus
{
    border-top: 0;
}

/*--- DROPDOWN ---*/
#nav li ul
{
    list-style: none outside none;
    position: absolute;
    visibility: hidden;
    padding: 0;
    margin: 0;
}
#nav ul li
{
    float: none;
    display: block;
    width: 100%;
    min-width: 100px;
    margin-bottom: 0;
}

#nav li:hover ul, #nav li:focus ul
{
    visibility: visible;
    display: block;
}

/* End Top Navigation */


/* css for timepicker */
select.ui-timepicker-select {
    border: none;
    background: white !important;
    color: #5f5f5f !important;
    border-color: #cdcdcd !important;
    width: 90px;
    margin-right: 10px;
    margin-left: 10px;
}

.ui-timepicker-div.ui-timepicker-oneLine dl {
    text-align: center!important;
}

/*.ui-timepicker-div .ui-widget-header*/
/*{*/
/*    margin-bottom: 8px;*/
/*}*/
/*.ui-timepicker-div dl*/
/*{*/
/*    text-align: left;*/
/*}*/
/*.ui-timepicker-div dl dt*/
/*{*/
/*    height: 25px;*/
/*}*/
/*.ui-timepicker-div dl dd*/
/*{*/
/*    margin: -25px 0 10px 65px;*/
/*    width: 66%;*/
/*}*/
/*.ui-timepicker-div td*/
/*{*/
/*    font-size: 90%;*/
/*}*/

.ui-datepicker .ui-tpicker-grid-label, .ui-datepicker .ui-tpicker-grid-label td {
    border: none !important;
}

.ui-datepicker {
    padding: 0 !important;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4
{
    font-size: 1.5em;
}

h1
{
    font-size: 2em;
    padding-bottom: 0;
    margin-bottom: 0;
}
h2
{
    margin-top: 17px;
    padding: 0;
}
h3
{
    font-size: 1.2em;
}
h4
{
    font-size: 1.1em;
}
h5
{
    margin: 0;
    padding: 0;
    font-size: 1em;
}
h6
{
    margin: 0;
    padding: 10px 0 0 0;
    font-size: 1em;
}

/* this rule styles <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
    margin-top: 0;
}

#pageTitle {
    width: 100%;
    font-size: 36px;
    color: #262734;
    margin-bottom: 0;
    display: inline-block;
}

#pageTitle h1 {
    margin-top: 17px;
    padding: 0;
    font-size: 36px;
    display: inline-block;
}

#pageTitle .helpButton {
    vertical-align: top;
    margin-top: 15px;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

#headerContainer {
    float: left;
    width: 100%;
    text-align: center;
}

#header
{
    max-width: 960px;
    margin: 0 auto;
}

#header h1, #header h2
{
    font-weight: bold;
    padding: 5px 0;
    margin: 0;
    color: #fff;
    border: none;
    font-size: 26px !important;
    display: inline;
}

#header h2
{
    font-size: 16px !important;
}

#header #title img
{
    height: 70px;
    margin-right: 20px;
    margin-top: 10px;
}

#footer
{
    margin: 0;
    text-align: right;
    font-size: .9em;
    float: right;
    width: 100%;
    color: #fff;
}

#footer a:link, #footer a:visited {
    color: #fff;
}

.ui-widget-overlay
{
    opacity: 0.9 !important;
    filter: Alpha(Opacity=90) !important;
}

/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/

fieldset
{
    margin: 0.5em 0; /*padding: 0.5em, 1em;*/
    padding: 0.5em 1em;
    border: 1px solid #CCC;
}

fieldset p
{
    margin: 2px 12px 10px 10px;
}

legend
{
    font-size: 1.1em;
    font-weight: 600;
    padding: 2px 4px 2px 4px;
}

.hidden
{
    display: none;
}

.invisible 
{
    visibility: hidden;
}

/* TABLE
----------------------------------------------------------*/

table
{
    border: solid 1px #e8eef4;
    border-collapse: collapse;
    width: 100%;
}

table td, table tbody td
{
    padding: 5px;
    border-right: solid 1px #d1cfcf;
}

table td:last-child, table tbody td:last-child {
    border-right: none;
}

table th, table thead th
{
    padding: 5px 6px;
    text-align: center;
    background: #999;
    border-right: 1px solid #d1cfcf;
    color: #FFFFFF;
    font-weight: normal;
    text-transform: uppercase;
    white-space: nowrap;
    font-size: 14px;
}

.redCell
{
    background-color: #990000;
    color: #FFFFFF;
}
.yellowCell
{
    background-color: #FFFF00;
    color: #000000;
}

#ItemList
{
    width: 100%;
    margin: 0 0 1% 0;
}

#ItemList button, #LabourList button {
    float: none;
    margin-right: 0 !important;
}

#LabourList
{
    margin: 0 2% 2% 0;
}

#LabourList .editor-field
{
    margin: 0;
}

#LabourList td {
    text-align: center;
}

/* MISC  
----------------------------------------------------------*/
.clear
{
    clear: both;
}

.error
{
    color: Red;
}

#menucontainer
{
    margin-top: 40px;
}

div#title
{
    display: block;
    float: left;
    text-align: left;
}

#logindisplay
{
    font-size: 1.1em;
    float: right;
    text-align: right;
    margin: 10px;
    color: White;
}

#logindisplay span
{
    width: 100%;
    float: left;
    margin: 4px 0;
}

#logindisplay a:link
{
    color: white;
    text-decoration: underline;
}

#logindisplay a:visited
{
    color: white;
    text-decoration: underline;
}

#logindisplay a:hover
{
    color: white;
    cursor: pointer;
}

#logindisplay .logonButton {
    float: none;
}

#logindisplay .logonButton span
{
    width: inherit;
    margin: 0;
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error
{
    color: #ff0000;
    display: block;
}

.field-validation-valid
{
    display: none;
}

.input-validation-error
{
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff0000;
}

#main .validation-summary-errors {
    background: #fff;
    padding: 15px;
}

.validation-summary-valid
{
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/

.editor-field
{
    margin: 0.5em 0 1.5em 0;
}

.editor-label
{
    margin: 0.5em 0;
    font-weight: bold;
}

.inline-editor-field, .inline-editor-label
{
    margin: 1em 0.5em 1em 0;
    display: inline;
}

select {
    padding: 7px 0 7px 10px;
    font-family: Lato, Arial, Verdana, Helvetica !important;
    width: 64%;
    font-size: 16px;
}

img
{
    vertical-align: bottom;
    border: 0;
}

.display-label, .display-field
{
    margin-top: 10px;
    padding: 0;
    font-weight: bold;
}

input, textarea {
    width: 60%;
    height: 35px;
    font-size: 16px;
    padding-left: 11px;
    padding-right: 11px;
    font-family: Lato, Arial, Verdana, Helvetica !important;
}

input[type="checkbox"] {
    height: 20px !important;
    width: auto;
}

input[type="radio"] 
{
    height: auto;
}

input[type="text"], textarea, select
{
    border: 1px solid #CCC;
}

input[type="password"]
{
    border: 1px solid #CCC;
}

input[type="text"].text-box-tiny
{
    width: 4em;
}

input[type="text"].text-box-small
{
    width: 10em;
}

input[type="text"].text-box-medium
{
    width: 15em;
}

input[type="text"].text-box-large
{
    width: 25em;
}

.label
{
}

textarea {
    /*height: auto;*/
    padding: 11px;
    resize: none;
}

textarea.itemDescription
{
    min-height: 36px;
    width: 95%;
    padding: 8px;
}

.text-box.multi-line
{
    height: 6.5em;
}

.tri-state
{
    width: 6em;
}

.module
{
    width: 100%;
    float: left;
    margin-top: 10px;
    background: #fff;
}

.moduleSmallLeft, .moduleSmallRight
{
    width: 49.5%;
}

.moduleSmallerLeft, .moduleSmallerRight
{
    width: 30.5%;
    margin-right: 10px;
}

.moduleBiggerLeft, .moduleBiggerRight
{
    width: 68.5%;
}

.moduleSmallLeft
{
    margin-right: 1%;
}

.moduleHeading
{
    font-weight: bold;
    font-size: 21px;
    margin: 15px;
}

.moduleDetails
{
    margin: 15px 15px 0 15px;
    overflow: auto;
    padding-bottom: 10px;
}

.moduleDetailsLeft
{
    float: left;
    width: 49%;
    padding: 0.5%;
}

.moduleDetailsRight
{
    float: left;
    width: 49%;
    padding: 0.5%;
}

.moduleQuarterContainer
{
    width: 100%;
}

.moduleQuarterLeft, .moduleQuarterLeftMid, .moduleQuarterRightMid, .moduleQuarterRight {
    width: 24.25% !important;
}

.moduleQuarterLeft, .moduleQuarterLeftMid, .moduleQuarterRightMid {
    margin-right: 1%;
}

.moduleQuarterLeft
{
    
}

.moduleQuarterLeftMid
{
}

.moduleQuarterRight
{
    
}

.moduleQuarterRightMid
{
    
}

#finance .moduleHeading {
    background: #999999;
    padding: 8px;
    color: #fff;
    font-weight: normal;
}

#finance.moduleQuarterContainer .moduleDetails
{
    padding-left: 4%;
}

#finance.moduleQuarterContainer .display-field
{
    margin-bottom: 25px;
}

#finance .editor-label {
    font-weight: bold;
    background: #ebf4fa;
    padding: 8px;
    margin-top: 0px;
    margin-bottom:0px;
}

#finance .editor-field {
    padding-left: 8px;
    color: #777;
}

#finance .moduleSmallLeft .moduleDetails, #finance .moduleSmallRight .moduleDetails {
    padding: 0;
    margin-bottom: 0;
}

button
{
    float: left;
    margin-right: 10px !important;
}

button, button.ui-button, .actionButton, a.actionButton, input[type="submit"], #actions a, .actionButton.selectedPage, #jobsContainer .ui-tabs-nav a, #jobsContainer a.actionButton
{
    /* float: left; */
    margin-right: 10px !important;
    color: #fff !important;
    background: #2c2d3a;
    border: none;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    text-decoration: none;
    cursor: pointer;
    padding: 6px 10px;
    width: auto;
    height: auto;
    font-size: 16px !important;
    text-transform: uppercase;
    white-space: nowrap;
    font-weight: normal;
}

.actionButton:hover, a.actionButton:hover, input[type="submit"]:hover, #actions a:hover, .actionButton.selectedPage, #jobsContainer .ui-tabs-nav a:hover, #jobsContainer .ui-tabs-selected a, #jobsContainer a.actionButton:hover
{
    background: #1E77FF !important;
}

.ui-button-text-only .ui-button-text {
    padding: 0 !important;
}

.ui-datepicker-trigger {
    margin: 8px;
}

.ui-datepicker-today {
    background: #e0e0e0 !important;
    color: #fff !important;
}

.ui-datepicker-current-day, .ui-datepicker td.ui-datepicker-current-day a {
    background: #1E77FF !important;
    color: #fff !important;
}

.labourDate input {
    width: 5.4em;
}

.labourHours input {
    width: 2.7em;
}

.labourEmployee select {
    width: 100%;
}

#actions
{
    padding: 10px 0 5px 0;
    float: left;
    width: 100%;
    min-height: 36px;
    text-transform: uppercase;
    background: #FFF;
}

#actions a, #actions input[type="submit"] {
    float: left;
    margin-bottom: 5px;
}

#actions div {
    margin-left: 15px;
}

#actions ul
{
    list-style: none;
    margin: 0;
    padding: 0;
    display: table;
    table-layout: auto;
    height: 35px;
    line-height: 35px;
}

#actions li
{
    display: table-cell;
}

.floatLeft
{
    float: left !important;
}

.floatLeftWithSpace
{
    float: left;
    margin: 0 20px 10px 0;
}

.floatLeftHalfWidth
{
    float: left;
    width: 50%;
}

.floatLeftFullWidth
{
    float: left !important;
    width: 100%;
}

.floatRight
{
    float: right;
}

#quickSearchContainer
{
    float: left;
    margin: 30px 0 0 120px;
}

#QuickSearch
{
    border-radius: 5px;
    -moz-border-radius: 5px;
    float: left;
    height: 18px;
    width: auto;
}

#quickSearchSubmitContainer {
    float: right;
    background: #6f7180;
    height: 42px;
}

#quickSearchSubmit
{
    height: 36px;
    width: 40px;
    margin: 3px 4px 0 5px !important;
    background: url('/images/search.gif') #000 no-repeat;
    background-position: 11px;
    background-size: 20px;
}

#quickSearchSubmit span
{
    padding: 0 4px;
}

#quickSearchOptionsContainer {
    float: left;
    width: 100%;
}

#quickSearchOptions
{
    position: absolute;
    height: 0;
    visibility: hidden;
    background-color: #efefef;
    border: 1px solid #000;
    padding: 5px 5px 135px 5px;
    z-index: 101;
    width: 245px;
    text-align: left;
}

#quickSearchContainer:hover #quickSearchOptions, #QuickSearch:hover ~ #quickSearchOptions, #QuickSearch:focus ~ #quickSearchOptions, #quickSearchOptions:hover, #quickSearchOptions:focus, #quickSearchSubmit:focus ~ #quickSearchOptions, #quickSearchSubmit:hover ~ #quickSearchOptions, #quickSearchContainer:hover #quickSearchOptions input, #QuickSearch:hover ~ #quickSearchOptions input, #QuickSearch:focus ~ #quickSearchOptions input, #quickSearchOptions:hover input, #quickSearchOptions:focus input, #quickSearchSubmit:focus ~ #quickSearchOptions input, #quickSearchSubmit:hover ~ #quickSearchOptions input
{
    visibility: visible;
}

#quickSearchOptions.showing
{
    visibility: visible;
}

#notesContainer
{
    /*margin-right: 10px;*/
}

#notesContainer textarea
{
    width: 94%;
}

#notesContainer .actionButton {
    float: right;
}

#notesContainer .editor-field {
    margin-bottom: 0.5em;
}

#noteSaved {
    background: url(images/ok-clear.gif) no-repeat 8px 7px rgb( 30, 119, 255 ) !important;
    color: #fff !important;
    padding: 5px 0 5px 28px;
    box-shadow: none;
    border-radius: 0;
    width: 60px;
    margin: 0 !important;
}

.ui-widget-header {
    background:linear-gradient(to right, #6ecbd9, #3d6daf) ! important;
    border: none ! important;
    padding: 6px 10px !important;
    color: #fff !important;
}

.ui-widget-content {
    border: none !important;
}

.ui-tabs-nav {
    background: none !important;
}

#dateContainer
{
    float: left;
    margin-right: 10px;
}

#jobsContainer 
{
    float: left;
    margin-top: 10px;
    width: 99%;
    border: none;
}

#jobsContainer .ui-tabs-panel {
    padding: 10px 0;
}

#jobsContainer .ui-tabs-nav li {
    border: none;
    padding: 0;
    background: none;
}

#jobsContainer a.actionButton {
    padding: 5px;
    margin-right: 5px !important;
}

#jobsContainer td {
    padding: 3px 5px 0px 5px;
}

#filter
{
    float: left;
    margin-right: 5px;
    width: 40%;
}

#filterContainter
{
    width: 100%;
    float: left;
}

#jobsContainer .ui-tabs-nav a {
    margin: 0 !important;
}

.jobStatus {
    text-align: left;
}

.quickSummary, .quickSummary .moduleDetails {
    margin-top: 5px;
}

.quickSummary .editor-field {
    margin-bottom: 0;
}

.jobCenterTotals {
    float: right;
    width: 40%;
}

.jobCenterTotals .actionButton {
    margin-bottom: 20px;
}

/*
#smsPickup textarea, #emailPickup textarea, #smsContact textarea, #emailContact textarea, #smsBooking textarea, #emailBooking textarea {
    width: 300px;
}
*/
.hideRow
{
    visibility: hidden;
    display: none;
}

.errorSpan
{
    margin-top: 5px;
    color: red;
    float: left;
}

#statuses
{
    visibility: hidden;
    display: none;
}
#invoice .container
{
    width: 100%;
    float: left;
    padding-bottom: 16px;
    background: #fff;
}
#invoice .container .left
{
    float: left;
}

#invoice .container .middle
{
    text-align: center;
    margin: 0 auto;
    white-space: nowrap;
}

#invoice .container .right
{
    float: right;
}

#invoice
{
    width: 1122px;
    margin: auto;
}

#invoice #actions {
    padding-top: 20px;
}

#invoice table
{
    width: 100%;
    text-align: left;
    font-size: 14px;
}

#invoice .titleContainer
{
    border: 2px solid #000;
    padding: 5px;
}

#invoice .titleContainer .racqLogo
{
    margin-left: 7px;
}

#invoice .invoiceTitle
{
    font-size: 18px;
    text-decoration: underline;
    margin-bottom: 10px;
}

#invoice .invoiceId
{
    margin-top: 6px !important;
}

#invoice .contactContainer
{
    margin-top: 8px;
}

#invoice .invoiceContactHeadings
{
    margin-right: 5px;
    text-align: right;
}

#invoice .boldText
{
    font-weight: bold;
}

#invoice .alignRight
{
    text-align: right;
}

#invoice .grandTotal
{
    border-top: 2px solid #000;
    padding-top: 2px;
}

#invoice .jobCard.right > div
{
    margin-bottom: 15px !important;
    width: 100%;
    float: left;
}

#invoice .invoice.right > div
{
    width: 100%;
    float: left;
}

#invoice .invoice.right .varLabel
{
    width: 130px;
    float: left;
}

#invoice .jobCard.right .varLabel
{
    width: 300px;
    float: left;
}

#invoice .nb-success {
    float: left;
}

.startHidden
{
    display: none;
}

.slideArrow
{
    width: 20px;
    height: 20px;
    padding-right: 5px;
    float: left;
    background-image: url(/images/slidearrow.gif);
    background-repeat: no-repeat;
    margin-top: 3px;
}

.slideArrowDown
{
    background-position: -31px 0;
}

.slideArrowText
{
    width: 1px;
    height: 1px;
    visibility: hidden;
    float: left;
}

.showPrint
{
    visibility: hidden;
    display: none;
}

.noLeftPadding {
    padding-left: 0px;
}

/* Notification styles
-----------------------------------------------------------*/
.notificationbox
{
    z-index: 1000;
    padding: 12px 0 10px 30px;
    margin: 10px 5px 20px 0 !important;
    box-shadow: 5px 5px 10px #000;
    border-radius: 5px;
    -moz-border-radius: 5px;
    display: none;
    width: 95%;
}

.nb-success
{
    color: #060;
    background: #cfc url(images/ok.gif) no-repeat 8px 12px;
}

.nb-error
{
    color: #c00;
    background: #fcc url(images/fail.gif) no-repeat 8px 12px;
}

.nb-warning
{
    color: #c60;
    background: #ffc url(images/warn.gif) no-repeat 8px 12px;
}

.tooltipText
{
    visibility: hidden;
    display: none;
}

/* END Notification styles
-----------------------------------------------------------*/

.labourSummaryRow
{
    margin-bottom: 20px;
    width: 100%;
    float: left;
}

.no-close .ui-dialog-titlebar-close
{
    display: none;
}

.warning
{
    background: url(images/dialog_warning.png) no-repeat;
    width: 70px;
    height: 70px;
    float: left;
}

.centeringContainer
{
    width: 100%;
    text-align: center;
}

.homeContainer {
    width: 100%;
    float: left;
    padding: 0px 0px 20px 0px;
}

.homeContainer .title {
    color: #FFF;
    font-size: 2.5em;
}

.homeContainer .text {
    color: #a1b1bc;
    font-size: 1.5em;
}

.homeContainer input[type="submit"], .homeContainer input[type="submit"]:hover, #emailButton {
    float: none;
    background: #fb3f26;
    border: none;
    color: #fff;
    text-decoration: none;
    padding: .4em 1em;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.homeContainerHeader {
    padding-top: 10px;
}

#emailButton:hover {
    cursor: pointer;
}

#resendButtonContainer 
{
    padding: 2em 0;
}

.homeContainer a:link, .homeContainer a:visited {
    color: #fff;
}

.homeContainerRegister
{
    background: url("images/ABM-Homepage-Mechanic.jpg") no-repeat center top;
    width: 100%;
    text-align: left;
    height: 550px;
    background-size: 100%;
}

.homeContainerRegister .contentContainer {
    padding-top: 5%;
}

.homeContainerRegister a:link, .homeContainerRegister a:visited {
    margin-top: 5px;
    float: left;
}

.homeContainerRegister .title {
    font-size: 36px;
    text-transform: uppercase;
    font-weight: bold;
    padding-top: 95px;
}
.homeContainerRegister .text {
    font-size: 26px;
    text-transform: uppercase;
    color: highlight;
    font-weight: 600;
}

.homeContainerRegister a.homeLightButton {
    font-weight: 600;
}

.homeLightButton, a.homeLightButton, .homeLightButtonSmall, a.homeLightButtonSmall {
    color: #FFF;
    background-color: #fb3f26;
    padding: 10px;
    text-decoration: none;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.homeLightButtonSmall, a.homeLightButtonSmall {
    padding: 5px 15px;
}

.homeContainerDarkBackground {
    background-color: #222533;
}

.homeContainerVeryDarkBackground {
    background-color: #1f212a;
}

.homeContainerLightBackground {
    background-color: #21c2f8;
}

.homeContainerPopout {
    margin: 20px 0;
    background-color: #34495e;
   
    float: left;
    padding-left: 0px!important;
}
.homeContainerPopout {
    border: 3px solid #172431;
    outline: 2px solid #2c3e50;
}
 
 .left-border {
    float: left;
    border-left: 10px solid #21c2f8;
    padding-left: 25px;

}
.homeContainerFeatures {
    background: url("images/ABM-Homepage-Features-Background.jpg") no-repeat center top;
    background-color: #32404b;
}

.homeContainerFeatures .left {
    float: left;
    width: 40%
}

.homeContainerFeatures .middle {
    float: left;
    width: 27%;
    margin-top: 63px;
}

.homeContainerFeatures .right {
    float: right;
    width: 33%;
}

.featureTitle {
    font-size: 1.3em;
}

.featureText {
    margin: 5px 0 10px 0;
}

.homeContainerFeatures .left {
    text-align: right;
}

.homeContainerFeatures .right {
    text-align: left;
}

.homeContainerPricing table {
    border: none;
    margin: 0 auto;
}

.homeContainerPricing tr:nth-child(even) {
    background-color: #2d303d;
}

.homeContainerPricing tr:nth-child(odd) {
    background-color: #40444f;
}

.homeContainerPricing table th {
    background: none;
    border: none;
    width: 50%;
}

.homeContainerPricing table td {
    border: none;
    width: 50%;
}

.homeContainerPurchase {
    background: url("images/ABM-Homepage-Stats-Background.jpg") no-repeat center top;
}

.homeContainerPurchase a:link, .homeContainerPurchase a:visited {
    margin: 10px auto;
}

.homeContainerForm .module {
    background: transparent;
    max-width: 700px;
    float: none;
    margin: auto;
}

.homeContainerForm input, .homeContainerForm textarea {
    background: #40434f;
    color: #fff !important;
    border: 1px solid #32353e;
    border-radius: 2px;
    text-align: center;
    max-width: 400px;
}

.homeContainer .g-recaptcha > div {
    margin: 0 auto;
}

.jobNotifiedColumn
{
    text-align: center;
}

#jobsContainer .jobNotifiedColumn a.actionButton
{
    margin-right: 0 !important;
    color: #fff !important;
    float: none;
}

.ui-autocomplete
{
    max-height: 200px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid #CCC !important;
}

.ui-dialog-content
{
    max-height: 600px;
}

#search-pager button
{
    width: 45px;
}

#logOffButton {
    margin-right: 0 !important;
}

#helpButton, #logOffButton
{
    margin-top: 5px;
    background: #000;
}

#helpButton span, #logOffButton span
{
    padding: 0 20px;
    width: auto;
    margin: 0;
}

#responsiveCheck
{
    display: none;
    visibility: visible;
}

#pagingContainer, #indexSearchContainer
{
    width: 100%;
    float: left;
    margin: 10px 0;
}

#indexSearchContainer input
{
    float: left;
    margin-right: 10px;
    width: 35%;
}

#companyLogo {
    max-width: 250px;
}

.companyHeadings {
    width: 100%;
}

.companyHeadings span {
    width: 40%;
    float: left;
}

.companyDetailRow {
    padding: 8px;
    margin-bottom: 10px;
    width: 95%;
    background: #efefef;
}

.companyDetailRow input {
    width: 35%;
}

.companyDetailRow button {
    margin-left: 15px;
}

.loadingContainer img {
    width: 20px;
    height: 20px;
}

.notificationRow {
    margin-bottom: 10px;
    padding: 5px;
    border: 1px solid #d1cfcf;
    width: 97%;
    float: left;
}

.notificationUnread {
    background-color: #e0e0e0;
    font-weight: bold;
}

.notificationRow .floatLeft {
    width: 55%;
}

.notificationRow .floatRight {
    width: 45%;
}

.notificationRow .floatRight {
    text-align: right;
    margin-top: 10px;
}

.passwordChangeModule {
    text-align: center;
}

.passwordChangeModule input {
    width:30%;
    padding-left: 0px;
    text-align: center;
}

.hintText {
    
}

.modelSearchButton .actionButton {
    margin-bottom: 10px;
}

.userSelectList tr td:nth-child(1) {
    text-align: center;
}

.userSelectList input[type="radio"] {
    width: auto;
    margin: auto;
}

.counter_div
{
    background:#21c2f8;
}

.counter_div h3 {
    font-size: 30px;
}

.counter_div li {
    list-style: none;
    display: inline-block;
    width: 24%;
    text-align: center;
}

.counter_div li img {
    width: 70px;
    margin-bottom: 27px;
}

.counter_div h6 {
    font-size: 50px;
    font-weight: normal;
        margin-top: 25px;
}

.counter_div hr {
    width: 34px;
    color: #222;
    border-color: #222;
    margin: 30px auto 0;
}

.counter_div p {
    font-size: 14px;
}

.counter_div  span {
    display: block;
    text-align: center;
}

.second_sec h3 {
    font-size: 30px;
    color: #fff;
    font-weight: 100;
}

.second_sec .left
{ 
    float:left;
    }
    
    .second_sec .right {
        float: right;
    }
    
    .second_sec .left {
        width: 39%;
    }
   
.second_sec .left img {
    width: 100%;
    padding-top: 30px
}

.second_sec .right
{
    width: 56%;
    text-align: left;
    color: #85959f;
    font-size: 14px;
}

.second_sec h5 {
    color: #fff; font-weight:normal;
}
.second_sec  h5 span img {
    width: 32px ;
    vertical-align: middle;
}

.second_sec  .right p {
    line-height: 24px;
    font-size: 14px;
}

.second_sec a.sec_link {
    color: #21c2f8;
    text-decoration: none;
}

.homeContainerPricing .text {
    width: 45%;
    text-align: left;
    float: left;
    margin-right: 40px;
}

.homeContainerPricing table {
    float: left;
    margin-top: 22px;
}

.homecontainerpopoutright {
    width: 22%;
    float: right;
}

.homeContainerPurchase { 
    padding: 120px 0 60px 0;
    line-height: 35px;
}

.financeBlackTopBorder {
    border-top: 4px solid #000;
}

.helpButton {
    background: #1e77ff;
    cursor: pointer;
    display: inline-block;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    font-size: 21px;
    font-weight: bold;
    margin-left: 10px;
}

.helpButton:hover, .helpButton:focus {
    background: #2c2d3a;
}

.helpButton a, .helpButton a:hover, .helpButton a:focus {
    color: #fff;
    text-decoration: none;
    padding: 0px 8px;
}

#actions .helpButton {
    background: #1e77ff;
    display: inline-block;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    margin-left: 10px;
}

#actions .helpButton:hover, #actions .helpButton:focus {
    background: #2c2d3a;
}

#actions .helpButton a, #actions .helpButton a:hover, #actions .helpButton a:focus {
    color: #fff;
    text-decoration: none;
    padding: 0px 8px;
    font-size: 21px !important;
    background: none !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    font-weight: bold !important;
    width: auto !important;
}

.firstRunContainer p {
    padding-right: 40px;
}

.videoContainerHome {
    overflow: hidden;
    padding-top: 56.25%;
    position: relative;
    margin: 40px 0 20px 0;
}

.videoContainerHome iframe {
    border: 0;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

#SMSReminder.notificationbox, #SMSTags.notificationbox, #EmailTags.notificationbox {
    width: 83%;
}

.serviceReminderTable .ItemRow {
    float: none;
}

/****** RESPONSIVE DESIGN START ******/

@media all and (max-width: 1220px)
{
    #contentContainer
    {
        /*
        overflow-x: scroll;
        */
    }

    #responsiveCheck
    {
        visibility: hidden;
    }

    #invoice
    {
        width: auto;
    }

    .responsiveFullWidth
    {
        width: 100%;
        border: none;
    }

    #navContainer
    {
        margin-bottom: 20px;
    }

    #nav li
    {
        width: 100%;
        float: left;
    }

    #navContainer li ul
    {
        background-color: #FFF;
    }

    #nav li ul
    {
        display: none;
        position: relative;
        float: left;
    }

    #logindisplay
    {
        color: #000;
        background-color: #fff;
        margin-top: 0;
    }

    #logindisplay a:link, #logindisplay a:visited, #logindisplay a:hover, #logindisplay a:focus
    {
        color: #000;
    }

    .ui-dialog-content
    {
        max-height: 300px;
    }

    .moduleSmallRight
    {
        border-left: none;
    }
    
    #actions {
        height: auto;
    }
    
    #jobsContainer {
        width: 100%;
    }
    
    .jobCenterTotals {
        width: auto;
    }
    
    .notificationDate {
        margin-bottom: 10px;
    }
    
    input.hasDatepicker {
        width: 70%;
    }
    
    input[type="text"].text-box-large {
        width: 90%;
    }
    
    .notificationRow {
        width: 96%;
    }
    
    #notesContainer {
        /*margin-right: 10px;*/
    }
    
    .floatLeftFullWidth {
        width: 99% !important;
    }
    
    .notificationbox {
        width: 88%;
    }
}

@media all and (max-width: 1220px)
{
    #contentContainer
    {
        padding: 0 15px;
    }

    #logindisplay
    {
        width: 100%;
        margin: 0;
        padding: 10px;
    }

    textarea
    {
        width: 90%;
    }
    
    #actions a, input[type="submit"]
    {
        float: left;
        margin-bottom: 5px;
    }
}

@media all and (max-width: 1220px) 
{
    table input, table textarea, table select {
        width: 90%;
    }
    
    .homeContainerPricing .text {
        margin-right: 0;
    }
    
    .companyDetailRow button 
    {
        margin-top: 10px;
    }
}

@media all and (max-width: 768px)
{
    #quickSearchContainer
    {
        float: left;
        margin: 5px 0 5px 30px;
    }
    
    .homeContainerRegister {
        height: auto;
    }

    #jobsContainer td, #jobsContainer th {
        font-size: 13px;
    }

    .moduleSmallerLeft, .moduleSmallerRight
    {
        width: 100%;
    }

    .moduleBiggerLeft, .moduleBiggerRight
    {
        width: 100%;
    }
}

@media all and (max-width: 640px)
{
    .hidden-mobile {
        display: none;
    }

    #header #title img
    {
        height: 40px;
    }
    
    div#title
    {
        margin: 0 0 5px 5px;
    }

    div#title img
    {
        height: auto;
    }

    #contentContainer
    {
        padding: 5px;
    }
    
    #footer span.floatLeft, #footer span.floatRight
    {
        width: 100%;
        margin: 0;
    }
    
    .moduleDetails {
        margin: 15px 10px 0 10px;
    }

    .moduleDetailsLeft, .moduleDetailsRight, .moduleSmallLeft, .moduleSmallRight, .floatLeftHalfWidth
    {
        width: 100%;
    }

    .moduleSmallerLeft, .moduleSmallerRight
    {
        width: 100%;
    }

    .moduleBiggerLeft, .moduleBiggerRight
    {
        width: 100%;
    }
    
    .moduleDetailsLeft, .moduleDetailsRight {
        padding: 0;
    }

    .moduleQuarterLeft, .moduleQuarterLeftMid, .moduleQuarterRight, .moduleQuarterRightMid
    {
        width: 50% !important;
        margin: 0;
    }

    h2
    {
        padding-left: 5px;
    }
    
    textarea {
        overflow-y: scroll !important;
    }

    .centeringContainer > div
    {
        margin-bottom: 10px;
    }
    
    #actions div {
        margin-right: 15px;
    }
    
    #actions a, input[type="submit"] {
        width: 100%;
        margin-right: 0 !important;
        text-align: center;
        padding: 8px 0;
        float: left;
    }
    
    #jobList, #jobListScheduled
    {
        overflow-x: scroll;
    }
    
    #jobsContainer .ui-tabs-nav li {
        float: left;
        width: 100%;
        margin-bottom: 5px;
    }
    
    #jobsContainer .ui-tabs-nav a {
        width: 100%;
        text-align: center;
    }
    
    #jobsContainer .ui-widget-header {
        padding-left: 0 !important;
    }
    
    #invoice .contactContainer div {
        width: auto !important;
    }
    
    .homeContainer {
        padding: 0;
    }
    
    .homeContainerRegister {
        height: auto;
        background-size: 130%;
        padding-bottom: 10px;
    }
    
    .homeContainerRegister .title {
        font-size: 26px;
        padding-top: 32px;
    }
    
    .homeContainerRegister .text {
        font-size: 20px;
    }
    
    .counter_div li {
        width: 100%;
    }
    
    #FeaturesImage, .second-sec .left {
        display: none;
        visibility: hidden;
    }
    
    .homeContainerFeatures .left, .homeContainerFeatures .right {
        width: 100%;
        text-align: left;
    }
    
    .homeContainerPricing .text {
        width: 100%;
        margin-right: 0;
    }
    
    .homecontainerpopoutright {
        width: 100%;
        float: left;
        margin-bottom: 15px;
    }
    
    .homeContainerPurchase {
        padding: 10px 0;
    }
    
    div#homePage, .homeContainerHeader {
        margin: 0;
        padding: 0;
    }
    
    div.slicknav_menu {
        margin-bottom: 0;
    }
    
    table th {
        white-space: normal;
    }
    
    .homeContainerPopout .try-it-free {
        width: auto !important;
    }
    
    .second_sec .left, .second_sec .right {
        width: 100%;
    }
}

/****** RESPONSIVE DESIGN END ******/

/*.............techno................*/

input#QuickSearch {
    height: 40px;
    border: 0px!important;
    border-radius: 0px;
    padding-left: 15px;
    background: #6f7180;
    color: #fff;
}

#header div#title {
    margin-bottom: 14px;
}

#logindisplay > span {
    font-size: 16px;
   }
   #logindisplay > span b {
    padding-left: 10px;
}

.homeContainerDarkBackground {
    background-color: #2c2d3a;
}

/*ul#nav {
  background

:#fff;
  height: 69px;
} */

ul#nav {
    background: #2c2d3a;
        width: 1170px;
    margin: 0 auto;
    /* height: 69px; */
}

/* ul#nav li {    position: relative;
    padding: 17px 0px 5px 0;
} */

ul#nav li a {color: #fff;
    font-size: 15px;
    font-weight: 600;
}
ul#nav li a:hover {
    background: none;
    color: #6ecbd9;
}

/*==========  Custon menu=======================   */

#nav li ul {
    left: 40px;
    background: #8a8a97;
    width: 250px;
    text-align: left;
    top: 69px;
   /* background: #fff; background-image:url(/images/menu.png);
    background-repeat:no-repeat; */
}

ul#nav li li a {
    text-align: left;
    color: #fff; font-size:14px;
    padding-left: 18px;
}

#nav li li a:hover, #nav li a {
    background: none;
    opacity:0.8; color:#222;
}
#nav li a:hover{ color: #fff;}

#nav li li a:hover{ opacity:05; color:#224; }

#nav a:hover, #nav a:focus, #nav li:hover > a, #nav li:focus > a
{
    background:none !important;
    }

/* 
#nav li::after {
    content: "\2192";
    width: 28px;
    height: 23px;
    color: #fff;
    position: absolute;
} 
*/

#nav li ul::before {
    background-image: url(/images/menu.png);
    background-repeat: no-repeat;
    background-position: 50px 0;
    content: ""; 
    width: 100%;
    height: 48px;
    color: #000;
    position: absolute;
    top: -25px;
    z-index: -99;
    margin: auto;
}
  
 #nav li { position:relative;}

#nav li a{ padding: 10px 0px;}

.editable-field .editor-field input {
    padding-left: 10px;
}



/*===========================*/

#footer {
    text-align: center;
    font-size: 14px;
    float: left;
    width: 100%;
    color: #fff;
    padding: 16px 0;
}

.moduleDetails table tbody td .text-box.single-line {
	width: 142px;
}

.moduleHeading.slide .slideArrow.slideArrowDown {
	margin-top: 7px;
}

.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-draggable.ui-resizable {
	padding: 0;
	border-radius: 0;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	-khtml-border-radius: 0;
	border-bottom-radius: 0;
	border-radius: 0 !important;
}

/*.ui-timepicker-div dt.ui_tpicker_hour_label {*/
/*    padding: 5px 0;*/
/*}*/
/*.ui-timepicker-div a.ui-slider-handle.ui-state-default.ui-corner-all {*/
/*    background: #069eff !important;*/
/*}*/

/*.ui-timepicker-div {*/
/*    height: 190px;*/
/*}*/
/*.ui-timepicker-div dl {*/
/*    padding-left: 10px;*/
/*}*/

.ui-datepicker-buttonpane.ui-widget-content button {
    background: #272735 !important;
    color: #fff;    opacity: 1;
        font-size: 14px !important;
    font-weight: normal; border:none;
}



.ui-datepicker td span, .ui-datepicker td a {
    display: block ! important;
    text-align: center ! important;
    padding: 7px ! important;
    border: 0 ! important;
    background: none ! important;
    color: #2c2d3a !important;    font-weight: bold !important;
    
}
.ui-datepicker td {
    border: 1px solid #dfdfdf !important;
}

td.ui-datepicker-current-day.ui-datepicker-today  a 
{
     color: #fff !important;
                                                     
       }
       
 .ui-datepicker td span:hover, .ui-datepicker td:hover  
 {
     background: rgb( 30, 119, 255 ) !important;
    color: #fff !important;
     }

.ui-datepicker .ui-datepicker-title {
    text-transform: uppercase !important;
}

.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only:hover,
.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only:active,
.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only:focus
 {
	background-color: #1e77ff !important;
	border-color: #1e77ff !important;
	color: #fff;
}

.ui-dialog .ui-resizable-se {
	display: none !important;
}
.ui-dialog-buttonset .ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only {
	font-size: 14px;
	text-transform: uppercase;
}

    .editable-field {
	float: left;
	width: 50%;
}
.editable-field .editor-field input {
	width: 85%;
	height: 35px;
}
.editable-field .editor-label label {
	font-size: 18px;
	font-weight: normal;
}
.editable-field:last-child {
	width: 100%;
}
.editable-field:last-child input {
	min-height: 90px;
	width: 93%;
}

/*======================== Calandar Style ======================== */

.ui-dialog-titlebar.ui-widget-header {
	background: linear-gradient(to right, #6dcbd8, #3967ac);
	border: medium none;
}

.ui-datepicker-calendar thead th {
	background-color: #2c2d3a !important;
	    background-image: unset !important;
    border: none !important;
}

.ui-datepicker td span, .ui-datepicker td a:hover {
    color: #fff !important;
}

.ui-slider-handle.ui-state-default.ui-corner-all {
	background-color: #069eff !important;
	border-radius: 100% !important;
	margin-top: -3px;
	border-color: transparent !important;
}

.ui_tpicker_hour_slider.ui-widget-content, .ui_tpicker_minute_slider.ui-widget-content {
	background-color: #bbb !important;
	background-image: unset;
	height: 3px;
	margin-bottom: 20px;
}
.ui_tpicker_minute .ui_tpicker_minute_slider.ui-slider.ui-slider-horizontal.ui-widget.ui-widget-content.ui-corner-all {
	height: 3px;
	background-color: #bbb;
	background-image: none;
	margin-top: 7px;
}
.ui-datepicker-buttonpane.ui-widget-content {
	margin-top: 40px;
}
/*.ui-timepicker-div .ui_tpicker_minute_label {*/
/*	margin-top: 25px;*/
/*}*/
.ui-datepicker-buttonpane.ui-widget-content {
	margin-top: 40px !important;
	border: medium none;
}
#ui-datepicker-div {
	padding-bottom: 20px;
	background-color: #fff;
}
 
.ui-datepicker .ui-datepicker-calendar span, .ui-datepicker td a {
	text-align: center;
}

body{ overflow-x:hidden;}

.editor-field img.ui-datepicker-trigger {
    height: 26px;
    top: 18px !important;
}

#footer{ margin-right:0;}

/*================= Not found page =-======= */

.notFound {
    max-width: 550px;
    margin: 20px auto;
    background: #fff;
    padding: 20px;
    text-align: center;
}

/*=============== END =============*/ 


/*======================== Services reminder page =========================== */

#contentContainer table tr.ItemRow td { 
    padding: 6px;
}

table tr.ItemRow td:last-child {
    text-align: center;
}

/*======================== End Reminder page  =============== */

/*====================== finance summary page ==================== */

.ui-dialog-buttonset button.ui-button.ui-widget {
    background: #262734;
    font-size: 16px !important;
    border: none;
}

/*================================ Home page without login*/

#header {
    max-width: 1170px !important;
}

#navContainerHome ul { 
    float: right;
    width: 50%;
}

.centerContent {
    max-width: 1170px;
}

.text p {
    font-size: 16px;
        line-height: 34px;
}

.top.title, #Pricing .title {
    margin: 30px 0 50px 0;
    
}

.featureText {
    line-height: 25px;
}
.featureTitle {
    margin-top: 15px;
}
.text li {
    font-size: 18px;
    line-height: 30px;
        list-style-position: inside; 
}
.homeContainerPopout {
    padding: 20px 0px;
    margin: 50px 0;
}
.homeContainerPopout {
    text-align: left;
    padding: 0 23px 0;
}
.homeContainerPopout .title {
    margin: 20px 0 0!important;
}

.homeContainerPopout .text {
    text-align: left !important;
    padding: 20px 0 !important;
}

#Contact {
    font-size: 14px;
}

#navContainerHome li:last-child {
    padding: 6px 10px;
    margin-top: -4px;
}

/*============== Counter section ==================== */
 
 #FeaturesImage img {
    width: 100%;
    height:100%;
}

.Testimonial_sec {
    padding: 45px 0;
}

.Testimonial_sec .title {
    margin: 11px 0 !important;
}

.Testimonial_sec .text {
    width: 52%;
    text-align: center;
    padding: 8px 0;
    margin-bottom: 50px;
    margin-left: auto;
    margin-right: auto;
    font-size: 16px;
    float: none;
}

.main_contentbox {
    max-width: 560px;
    margin: 0 auto;
    text-align: left;
     color: #ebeff1;
}

.left_tst {
    width: 100px;
    background: #fff;
    height: 100px;
    border-radius: 6px;
    margin-right: 20px;
    float: left;
}

.right_test h4 {
    color: #21c2f8;
    font-size: 18px;
    margin: 0;
}

.right_test small {
    font-size: 17px;
}


.right_test p {
    float: left;
    width: 73%;
    font-size: 16px;
    margin-top: 10px;
    color: #ebeff1;
}


ul.paging_home {
    text-align: center;
    float: left;
    width: 100%;
    padding:0;
}
.paging_home li {
    display: inline-block;
    border: 2px solid #f9f9f9;
    border-radius: 100%;
    width: 8px;
    height: 8px;
    color: transparent;
    font-size: 0px;
    cursor: pointer;
    margin: 0 3px;
}

.paging_home  li.active {
    background: #fff;
}

.homeContainerFeatures img {
    width: 42px;
    vertical-align: middle;
   }
   
   .homeContainerFeatures .left img {
    margin: 6px;
}

.homeContainerFeatures .right img {
    margin: 6px;
}

.homeContainerDarkBackground .top.title {
    padding-top: 15px;
}
.featureSubtext 
{
    font-size: 18px;
    padding: 0px;
    margin: 0px;
    margin-top: 8px;
}
.homeContainerDarkBackground .top.title {
    padding-top: 15px;
}
   
.homeContainer.homeContainerFeatures.homeContainerDarkBackground {
    padding-bottom: 0px;
}
.featureTitle:first-child {
    margin-top: 63px;
}
.homeContainerDarkBackground .featureTitle {
    font-size: 1.4em;
}

.homeContainerPopout .text {
    color: #a1b1bc;
    font-size: 1.3em;
    line-height: 24px!important;
}
.homeContainerPopout .try-it-free {
    width: 75%;
}

/*****************sale*********************/

td#AllItemTotal, td#TaxTotal, td#InvoiceTotal, td#PayingTotal, td#Remaining, td#PaidTotal {
    padding: 13px!important;
}

/**************acount*****************/

.validation-summary-account {
    text-align: center;
}

/*=========== Color pages ===================*/

#nav li:last-child ul {
    width: 184px;
}

.ItemRow div:not(.editor-label):not(.editor-field) {
    float: left;
    margin: 0 10px;
}

.ItemRow {
    float: left;
    width: 100%;
    padding-top: 10px;
}

.ItemRow a, .itemRow button {
    float: left;
}

.itemRowRemove {
    
}

#MessageOfTheDay{
    margin-top: 20px;
    text-align: center;
    font-size: 14px;
    line-height: 16px;
    font-weight: bold;
    background-color: white;
    padding: 4px;
    display: none;
}`

.ItemRow .floatLeftFullWidth {
    width: 97% !important;
}

.disabledList .ItemRow > div 
{
    min-width: 4em;
}

.ui_tpicker_unit_hide {
    display: none;
}

.btn-tick {
    height: 28px!important;
    background-color: #07af3b!important;
    border: none!important;
    color: white!important;
    line-height: 16px!important;;
}

.btn-tick .ui-button-text {
    line-height: inherit!important;
}

/*.btn-tick .ui-button-text{*/
/*    line-height: 1.5;*/
/*}*/

.btn-tick:hover, .btn-tick:active, .btn-tick.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only:hover {
    background-color: #1f8f42!important;
    color: white!important;
}

.btn-cancel {
    background-color: #a1a1a1!important;
}

.btn-left {
    float: left;
    margin-left: 12px!important;
}

.btn-right {
    float: right;
}

.ui-dialog-buttonset {
    width: 100%;
}
.btn-delete {
    margin-left: 12px!important;
    background-color: #931212 !important;
}

/* Ratio bars */

.ratio-label {
    z-index: 2;
    position: relative;
    padding-left: 0;
    line-height: 21px;
    text-align: center;
    color: black!important;
}

.ratio-bar {
    margin-left: 5px;
    margin-right: 5px;
    width: 100%;
    position: relative;
    height: 20px;
}

.ratio-value {
    z-index: 1;
    height: 25px;
    position: absolute;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    box-sizing: border-box;
    border-right: 2px solid white;
}

.ratio-bar-positive .ratio-value{
    background-color: #d1ffd2;
}

.ratio-bar-negative .ratio-value {
    background-color: #ffd4d4;
}

.ratio-bar-negative-mid .ratio-value {
    background-color: #ffd78c;
}

.ratio-bar-neutral .ratio-value {
    background-color: #ffffff;
}

/* compact ratio bar */
.ratio-bar.compact {
    margin-left: 0px;
    margin-right: 0px;
    height: auto;
    margin-bottom: 3px;
}
.ratio-bar.compact .ratio-label {
    padding-left: 0;
    text-align: center;
    line-height: 25px;
}
.ratio-bar.compact .ratio-value {
    width: 100%!important;
    border: 0;
    border-radius: 15px;
}

/* list container */
.list-container .list-item {
    width: 100%;
}
.list-container .list-item:not(:last-child) {
    margin-bottom: 2px;
    padding-bottom: 2px;
    border-bottom: 1px solid #7f7f7f;
}

.active-working-job {
    cursor: help;
}

.right-aligned-button {
    float: right;
    margin-right: 10px;
    margin-top: -5px;
}