{
    box-sizing: border-box;
}


body, textarea, input, select {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 0.9em;
}

h2, h3, h4, h5 {
    font-weight: bold;
    line-height: 1.5;
    margin-top: .7em;
}

h2 {
    font-size: 1.5em;
}

h3 {
    font-size: 1.17em;
}

h4 {
    font-size: 1.05em;
}

fieldset {
    display: block;
    margin-inline-start: 2px;
    margin-inline-end: 2px;
    padding-block-start: 0.35em;
    padding-inline-start: 0.75em;
    padding-inline-end: 0.75em;
    padding-block-end: 0.625em;
    min-inline-size: min-content;
    border-width: 2px;
    border-style: groove;
    border-color: threedface;
    border-image: initial;
}

legend {
    display: block;
    width: auto;
    max-width: auto;
    padding: 5px;
    margin-bottom: .5rem;
    font-size: 1.2rem;
    line-height: inherit;
    color: inherit;
    white-space: normal;
}

select {
    /*margin:4px;*/
    /* border: 1px solid gray;*/
}


/* clear telerik*/
ul.reToolBar li a.reTool {
    box-sizing: border-box;
    display: inline-block;
    width: 1.71429em;
    height: 1.57143em;
    vertical-align: middle;
    border-radius: .14286em;
    border-style: solid;
    border-width: 1px;
    border-color: transparent;
    text-decoration: none;
    min-width: initial;
    padding: initial;
    text-align: initial;
    line-height: initial;
    font-family: initial;
    font-size: initial;
    color: initial;
    background: initial;
}

ul reToolBar li a.reDropdown {
    min-width: initial;
    text-align: initial;
    line-height: initial;
    font-family: initial;
    font-size: 0.9em;
    background: #3B5A89;
}

header {
    padding-top: 5px;
}

header ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    /*position:absolute;*/
}

header ul li {
    float: left;
    margin-right: 10px;
    display: inline-block;
    margin-bottom: 3px;
}

header ul li a .menuBadge {
    position: absolute;
    right: -5px;
    top: -5px;
    font-size: 0.9em;
}


header ul#menu li ul li a {
    min-width: 145px;
}

header ul#menu li.bluemenu a {
    background-color: #A4C2F4;
}
/*Hover state for dropdown links*/


header ul#menu li.greenmenu a {
    background-color: #B6D7A8;
}

header ul#menu li.yellowmenu a {
    background-color: #FFFF00;
}



/*Style for menu links*/
li a, #logoutButton {
    display: block;
    min-width: 130px;
    padding: 3px 5px;
    text-align: center;
    line-height: 30px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 0.9em;
    color: #fff;
    background: #3B5A89;
    text-decoration: none;
}

#logoutButton {
    float: right;
    margin: 0 14px 0 0px;
    background: #468454;
}

/*Hover state for top level links*/
li:hover a {
    background: #B5D8D7;
    color: #000;
}

/*Style for dropdown links*/
li:hover ul a {
    background: #f3f3f3;
    color: #2f3036;
    height: 40px;
    line-height: 40px;
}

/*Hover state for dropdown links*/
header ul#menu li:hover a:hover {
    background: #19c589;
    color: #fff;
}
header ul#menu li.yellowmenu:hover a:hover { 
    color: #000;
}

header ul li ul {
    position: absolute;
}


/*Hide dropdown links until they are needed*/
header ul li ul {
    display: none;
    z-index: 9999;
}

/*Make dropdown links vertical*/
header ul li ul li {
    display: block;
    float: none;
}

/*Prevent text wrapping*/
header ul li ul li a {
    width: auto;
    min-width: 130px;
    padding: 0 0px;
}

/*Display the dropdown on hover*/
header ul li a:hover + .hiddenul, .hiddenul:hover {
    display: block;
}

header ul li ul.hiddenul {
    background-color: #E5EBF5;
}

header ul li ul.hiddenul li {
    margin-right: 0;
}

header ul li ul.hiddenul li a {
    padding-left: 5px;
    padding-right: 5px;
}

footer {
    position: absolute;
    width: 100%;
    bottom: 0; /* stick to bottom */
    background: #E5EBF5;
    height: 50px;
    text-align: center;
    clear: both
}

div#wrapper {
    position: relative; /* needed for footer positioning*/
    height: auto !important; /* real browsers */
    min-height: 100%; /* real browsers */
    padding: 0;
}

div#content {
    padding: 0px 5px 50px 5px;
}

#form1, html, body {
    height: 100%;
    padding: 0;
    margin: 0;
}

body {
    padding: 0px 5px 0 5px;
}


/* login section*/
.loginLabel {
    width: 80px;
    display: block;
    float: left;
    clear: both;
}

.loginTextbox {
    float: right;
    clear: right;
    width: 175px;
}

#cph1_loginBtn {
    float: right;
}

#loginWrapper {
    width: 260px;
    padding: 5px;
    margin: auto;
    height: 110px;
    margin-top: 150px;
}



/* end login*/

/*label and input */

.detailsPanel {
    width: 400px;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #3B5A89;
    background: #fff;
}


.standardLabelText {
    width: 465px; /*368*/
}



.standardLabelText.overrideWidth {
    width: auto;
}

.standardLabelText .checkbox input /*resize the input*/ {
    width: 15px;
}

fieldset {
    padding: 10px;
}

.standardLabelText label {
    display: block;
    float: left;
    width: 160px; /*120*/
    clear: left;
    margin: 4px;
}

.createInvoiceLabelText label {
    width: 200px;
}

.createInvoiceLabelText input.numericTb {
    width: 70px;
}

.standardLabelText input, .standardLabelText select, .standardLabelText span, .standardLabelText textarea {
    width: 200px;
    display: block;
    float: left;
    clear: right;
    margin-top: 4px;
    margin-bottom: 4px;
}

.stdLabel {
    display: block;
    float: left;
    width: 160px; /*120*/
    clear: left;
    margin-top: 4px;
    margin-bottom: 4px;
}



.stdLabelSmall {
    display: block;
    float: left;
    width: 100px; /*120*/
    clear: left;
    margin: 4px;
}

input.stdText, select.stdSelect, span.stdLabel, textarea.stdTextarea, .stdFakeInput {
    width: 200px;
    display: block;
    float: left;
    clear: right;
    margin: 4px;
    line-height: 1.5em;
}

.popup input.stdText, .popup input.stdBtn, .popup select.stdSelect {
    width: 100%;
    float: none;
    clear: none;
    display: inline-block;
    margin: 4px 0px;
}

input.stdChk {
}

input.stdText.wideText, select.stdSelect.wideSeLect, span.stdLabel.wideLabel, textarea.stdTextarea.wideTextarea {
    width: 320px;
}

input.stdText.smallText, select.stdSelect.smallSelect, span.stdLabel.smallLabel, textarea.stdTextarea.smallTextarea {
    width: 100px;
}

select, select.stdSelect {
    min-height: 2em;
}

input.stdBtn {
    width: 200px;
    display: block;
    float: left;
    clear: right;
    margin: 4px;
}


input.stdBtn.noSides {
    margin-left: 0;
    margin-right: 0;
}

.smallerBtn {
    width: 200px;
}


.stdLabel.stdClear, input.stdText.stdClear {
    float: none;
    clear: none;
    display: inline;
}

input.stdCalender {
    float: left;
    margin: 4px;
    display: block;
    width: auto;
    clear: none;
}

input.stdText.calendarAdjustment {
    width: 176px;
}


.standardLabelText .overrideWidth, .standardLabelText .overrideWidth input {
    width: auto;
}

.standardLabelText .overrideClear {
    clear: none;
}

.standardLabelText input.ignoreFormatting, .standardLabelText .ignoreFormatting input, .standardLabelText .ignoreFormatting label, .standardLabelText .ignoreFormatting textarea, .standardLabelText span.ignoreFormatting {
    width: auto;
    float: none;
    clear: none;
    display: inline;
}


.smallerLabelText label {
    width: 100px;
}

.smallerLabel label {
    width: 100px;
}

.smallerLabelText input {
    width: 100px;
}

.editCompositeLabelText label {
    width: 200px;
}

.editCompositeLabelText input {
    width: 230px;
}

.editCompositeLabelText select.stdSelect {
    width: 230px;
}

.editCompositeLabelText input.smallerButtons {
    width: 100px;
}

.standardLabel label {
    display: inline-block;
    width: 130px;
}

span.screenreader {
    visibility: hidden;
}

fieldset .screenreader {
    padding: 0;
    border: none;
}

fieldset.screenreader legend {
    visibility: hidden;
    position: absolute;
    left: -9999px;
}

.calendarExtender {
    background-color: #eee;
    border-radius: 5px;
    border: 1px solid #111;
}

.searchDate {
    width: 180px;
}

/* master details*/

div#master {
    width: 250px;
    float: left;
    height: 840px;
}

div#details {
    /*width: 400px;*/
    float: left;
}

.masterListBox {
    padding: 5px;
    margin: 0;
    width: 95%;
    height: 685px;
}


.groupTogetherContainer {
    border: 2px solid #3B5A89;
    border-radius: 7px;
    width: fit-content;
    padding: 5px;
}

.textDetailsLabel {
    width: 100px;
    display: block;
    float: left;
    clear: left;
}

ul#permissions, ul#permissions li {
    list-style-type: none;
    margin-left: 0px;
    padding-left: 0;
    padding-top: 5px;
}

table.bordered {
    border-collapse: collapse;
    border-spacing: 0;
    border: 1px solid #bbb;
}

table.elasticInput, table.elasticInput input {
    width: 100%;
}

table.bordered tr td, table.bordered tr th {
    border: 1px solid #bbb;
    border-top: 1px solid #ddd;
    padding: 2px 4px;
    overflow-wrap: break-word;
}

table.bordered tr td {
    overflow-wrap: anywhere;
}

.edited {
    background-color: #FF8C8C;
    transition: background-color 1s ease-in-out;
    -moz-transition: background-color 1s ease-in-out; /* FF 4 */
    -webkit-transition: background-color 1s ease-in-out; /* Safari & Chrome */
    -o-transition: background-color 1s ease-in-out; /* Opera */
}

.saved {
    background-color: #93C993 !important;
    transition: background-color 1s ease-in-out;
    -moz-transition: background-color 1s ease-in-out; /* FF 4 */
    -webkit-transition: background-color 1s ease-in-out; /* Safari & Chrome */
    -o-transition: background-color 1s ease-in-out; /* Opera */
}

.failedToSave {
    background-color: #DE6A6A !important;
    transition: background-color 1s ease-in-out;
    -moz-transition: background-color 1s ease-in-out; /* FF 4 */
    -webkit-transition: background-color 1s ease-in-out; /* Safari & Chrome */
    -o-transition: background-color 1s ease-in-out; /* Opera */
}

.reset {
    transition: background-color 1s ease-in-out;
    -moz-transition: background-color 1s ease-in-out; /* FF 4 */
    -webkit-transition: background-color 1s ease-in-out; /* Safari & Chrome */
    -o-transition: background-color 1s ease-in-out; /* Opera */
}

.highlight {
    background-color: #FFDF00 !important;
    transition: background-color 1s ease-in-out;
    -moz-transition: background-color 1s ease-in-out; /* FF 4 */
    -webkit-transition: background-color 1s ease-in-out; /* Safari & Chrome */
    -o-transition: background-color 1s ease-in-out; /* Opera */
}

.block {
    display: block;
}

table.filter td {
    padding: 5px 50px 5px 0;
}

table tr.clickablerow:hover {
    cursor: pointer;
}

table.bordered th {
    background-color: #F1F2F4;
}

.errormessage {
    color: red;
}

.successmessage {
    color: green;
}



.greenBgForBlackText {
    background-color: #4cd074;
}

input[type="text"].greenBgForBlackText {
    background-color: #4cd074;
}

input[type="text"].greenBgForBlackText.ignoreReadonlyStyle {
    background-color: #4cd074 !important;
}

.depositBgForBlackText {
    background-color: #FFA594;
}

input[type="text"].depositBgForBlackText {
    background-color: #FFA594;
}

input[type="text"].depositBgForBlackText.ignoreReadonlyStyle {
    background-color: #FFA594 !important;
}


.hidden {
    visibility: hidden;
    height: 0;
    width: 0;
}

.standardMaxWidth {
    max-width: 900px;
}

/* email or documents*/

h2.withSubNoteAfter, h3.withSubNoteAfter, h4.withSubNoteAfter {
    display: inline;
}

.headerSubNote {
    font-size: 0.9em;
    margin-left: 15px;
}

div.communicationArea {
    border: 0px solid transparent;
    border-radius: 5px;
    padding: 3px;
    margin-bottom: 4px;
}

#communicationDocuments {
    background: #F4F6EF;
}

#communicationContact {
    background: #F1F4EB;
}

#communicationComposeEmail {
    background: #F4F6EF;
}

#communicationSearchEmails {
    background: #F1F4EB;
}


div.documentsEmailForm input {
    max-width: 600px;
}

#emailSearchResultsWrapper.flex-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start;
}

#emailSearchResultsWrapper .flex-item:nth-child(1) {
    order: 0;
    flex: 0 1 auto;
    align-self: auto;
}

#emailSearchResultsWrapper .flex-item:nth-child(2) {
    order: 0;
    flex: 1 0 auto;
    align-self: auto;
}

#emailLabelSide span:hover {
    background-color: #468454;
    color: #fff;
}

#emailLabelSide ul li span {
    padding: 3px 5px;
}

#emailLabelSide ul li {
    margin-top: 2px;
}

#emailLabelSide ul {
    list-style-type: none;
    padding: 3px 15px
}



.emailListWrapper {
    padding: 5px;
    border-radius: 10px;
}

table#jobEmailTable.alternatingrows th {
}

table#jobEmailTable.alternatingrows tr:nth-child(even) {
    background-color: #FFF;
}

table#jobEmailTable.alternatingrows tr:nth-child(odd) {
    background-color: #FFF;
}

table#jobEmailTable.alternatingrows tr {
    background-color: #F5F5F6;
}

    table#jobEmailTable.alternatingrows tr.alternateEmailRow {
        background-color: #E6E7D7;
    }

table#usersEmailTabl.alternatingrows th {
}

table#usersEmailTable.alternatingrows tr:nth-child(even) {
    background-color: #FFF;
}

table#usersEmailTable.alternatingrows tr:nth-child(odd) {
    background-color: #FFF;
}

table#usersEmailTable.alternatingrows tr {
    background-color: #F5F5F3;
}

table#usersEmailTable.alternatingrows tr.alternateEmailRow {
    background-color: #E5F3FF;
}


label.draft {
    color: #DC5059;
}



/* end email document */

div.standardScrollingDiv {
    max-height: 300px;
    overflow-y: scroll;
    padding: 5px;
    border: 2px solid #C0C0C0;
    margin: 5px 2px;
    -webkit-overflow-scrolling: touch;
}


div.bigPopup {
    text-align: center;
    border: 1px solid #6F0000;
    border-radius: 5px;
    height: 450px;
    width: 90%;
    text-align: center;
}

.bigPopup textarea {
    width: 100%;
    height: 240px;
    margin: 0;
    max-height: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.popup-border {
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
}


/*contacts*/

#cph1_tabContainer_documentsAssinedTabPanel_documentsShowContactsPanel {
    height: 500px;
}

#cph1_tabContainer_documentsAssinedTabPanel_documentsContactsListBox {
    height: 300px;
    min-width: 500px;
}


.manageContactsOuterPanel {
    /* width:493px;*/
    width: 550px;
}

.tkSelectedValueheader {
    background-color: #F5F6F9;
    color: #000;
    display: block;
    width: 100%;
    margin-bottom: 3px;
    padding: 3px;
}

/*table styling*/
table.alternatingrows tr:nth-child(even) {
    background-color: #F5F6F9;
}

table.alternatingrows tr:nth-child(odd) {
    background-color: #FFF;
}

.highlighted, table tr.highlighted {
    background-color: yellow !IMPORTANT;
}

.highlighted, table tr.highlighted {
    background-color: yellow !IMPORTANT;
}

.highlighted, table tr.highlighted {
    background-color: yellow !IMPORTANT;
}

table tr.highlighted.highlightedYellow {
    background-color: yellow !IMPORTANT;
}

table tr.highlighted.highlightedGreen {
    background-color: #6BB56B !IMPORTANT;
}

table tr.highlighted.highlightedOrange {
    background-color: orange !IMPORTANT;
}

table.timeLog {
    width: 100%;
}

table.timeLog th.inputColumn, table.timeLog input {
    width: 50px;
}


table.potentialWork th.jobName, table.potentialWork td.jobName {
    width: 30%;
    padding-right: 8px;
}

table.potentialWork td.jobName input {
    width: 100%;
}

.potentialEnquiryPopup label{
    font-weight:900;
}

table.jobProgress th.jpEdit, table.jobProgress th.jpEdit input, table.jobProgress td.jpEdit input {
    background-color: #FFFF63;
}

table tr td div.jpDescriptionContainer {
    position: relative;
    /* color: white;
    overflow: hidden;
    border: 1px solid #000;
    border-radius: 3px;*/
}

table tr td .jpItemDesc {
    width: 100%;
}

table tr td .jpNoteCornerIcon {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 13px;
    height: 13px;
    background: linear-gradient(-135deg,#ff0000 8px,#fff 0);
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    border-top-right-radius: 3px;
}


.hoverOverBubble {
    width: 300px;
    border: 1px solid green;
    border-radius: 5px;
    background-color: #F7FCF9;
    position: absolute;
    min-height: 40px;
    padding: 10px;
    text-align: center;
    display: none;
    z-index: 999999999
}

.hoverOverNote {
    border: 1px solid #F3E086;
    background-color: #FFFFD6;
}

div.tlHead, div.lockedTlCol, div.tlLockRow {
    background-color: #F1F2F4;
    border: 1px solid #000;
    white-space: nowrap;
}

table#timelineTable th label, table#timelineTable td.tlHead label {
    background-color: #F1F2F4;
    width: 80px;
    display: block;
    padding: 0px;
    margin: 0;
}

table#timelineTable td.employees {
    background-color: #F1F2F4;
}

table#timelineTable td div.overUnderRunDaysDivvy {
    width: 100px;
    position: absolute;
    top: 0;
    color: #000;
    height: 15px;
}

table#timelineTable th {
    padding: 0;
}

table#timelineTable tr th.weekend {
    background-color: #6A6A6A;
}

table#timelineTable tr th.holiday {
    background-color: #F6FF8E;
}


table#timelineTable td {
    padding: 3px 0;
}

table#timelineTable tr.headerrow {
    /*position:absolute;
    top:0;
    left:0;
    display:block;*/
}

table#timelineTable td.sideHead {
    white-space: nowrap;
    width: auto;
}

#timelineTable ul {
    list-style-type: none;
    margin: 0;
}

.sbEmployeePopup {
    width: 200px;
    border: 1px solid green;
    border-radius: 5px;
    background-color: #F7FCF9;
    position: absolute;
    min-height: 40px;
    padding: 10px;
    text-align: center;
    display: none;
}

table tr.negativePo {
    color: red;
}

table tr.verifiedPo {
    color: green;
}

tr.attention, tr.attention td textarea, tr.attention td input, .manageCCMain tr.attentionSubInput, .manageCCMain tr.attentionSubInput td input, .manageCCMain tr.attentionSubInput td textarea {
    background-color: #FFA4A1 !IMPORTANT;
}

.manageCCMain tr.attentionSubInput td, .manageCCMain tr.attentionSubInput td input, .manageCCMain tr.attentionSubInput td textarea {
    border-color: #FFA4A1 !IMPORTANT;
}




tr.labourAverageAmberAlert, input.labourAverageAmberAlert, select.labourAverageAmberAlert, span.labourAverageAmberAlert, textarea.labourAverageAmberAlert, tr.labourAverageAmberAlertRow, tr.itemChangeAmberAlert, input.itemChangeAmberAlert, select.itemChangeAmberAlert, span.itemChangeAmberAlert, textarea.itemChangeAmberAlert, tr.itemChangeAmberAlertRow, tr.itemOutOfDate, input.itemOutOfDateAmber, select.itemOutOfDateAmber, span.itemOutOfDateAmber, textarea.itemOutOfDateAmber, tr.itemOutOfDateRow {
    /* color: #F7BC00 !IMPORTANT;*/
    color: #c1970e !important;
}

select.labourAverageAmberAlert, span.labourAverageAmberAlert, textarea.labourAverageAmberAlert, input.itemChangeAmberAlert, select.itemChangeAmberAlert, span.itemChangeAmberAlert, textarea.itemChangeAmberAlert {
    /*background-color: gray;*/
}


tr.compositeToBeVerified, .compositeToBeVerified {
    background-color: #F7BC00 !important;
    color: #000 !important;
}

tr.labourAverageAlert, input.labourAverageAlert, select.labourAverageAlert, span.labourAverageAlert, textarea.labourAverageAlert, tr.labourAverageAlertRow, tr.itemChangeAlert, input.itemChangeAlert, select.itemChangeAlert, span.itemChangeAlert, textarea.itemChangeAlert, tr.itemChangeAlertRow, tr.itemOutOfDate, input.itemOutOfDate, select.itemOutOfDate, span.itemOutOfDate, textarea.itemOutOfDate, tr.itemOutOfDateRow {
    color: red !IMPORTANT;
}

td input.recentlySwapped, td textarea.recentlyAdded {
    background: yellow !important;
}

.buttonGroup {
    text-align: center;
}

.buttonGroup input {
    margin: 5px 30px;
    padding: 3px 5px;
}


.flagged {
    color: red;
}


/* modal */

.modalBackground {
    background-color: #000;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

input.smallButton {
    width: 60px;
}

div.smallpopup {
    width: 400px;
    padding: 10px;
}

div.largepopup {
    width: 800px;
    padding: 10px;
}



/*invoices*/
#invoicesPaneOne {
    width: 200px;
    float: left;
}

#invoicesItemsPane {
    width: 400px;
    float: left;
}

#invoicesJobSheetPane {
    width: 400px;
    float: left;
}


.estimateBox {
    float: left;
    width: 270px;
    width: 24%;
    min-height: 200px;
    min-width: 260px;
    /*border:1px solid #bdd;*/
    margin-right: 5px;
}

.estimateTotalsBox {
    min-height: 30px;
}

#estimateButtonContainer {
    min-height: 40px;
    clear: both;
}


.estimateBox boxFour {
    clear: right;
}

.estimateBox.boxOne {
    clear: left;
}

div.workItemTravelTotals {
}

div.workItemTravelTotals label {
    display: inline-block;
}

div.workItemTravelTotals input {
    width: 100px;
}

div.workItemTravelTotals table tr th:first-child, div.workItemTravelTotals table tr td:first-child {
    text-align: left;
    width: 130px;
}

div#estimateTravelBox {
    border: 1px solid green;
    position: absolute;
    width: 412px;
    height: 340px;
    padding: 10px;
    top: -330px;
    left: 10px;
    background: #fff;
    border-radius: 5px;
    color: #000;
}

div#estimateTravelBox input {
    width: 100px;
}

div#estimateTravelBox label {
    display: inline-block;
    width: 220px;
}

table.estimateDetails {
    min-width: 200px;
}

table.estimateDetails input {
    width: 100%;
    height: 100%;
    font-size: 11px;
    margin: 0;
    box-sizing: border-box;
    min-width: 40px;
}

table.estimateDetails tr td textarea {
    width: 100%;
    box-sizing: border-box;
    vertical-align: bottom;
}


table.estimateDetails tr td {
    padding: 0;
    margin: 0;
}

input.deleteButtonIcon, input.editNoteButtonIcon, input.replaceButtonIcon {
    width: 25px !IMPORTANT;
    height: 25px !IMPORTANT;
    margin: auto !IMPORTANT;
    display: block;
}


table.estimateDetails.compositePart input {
    width: 95%;
}

div.estimateBox input.estimateReadOnlyTotal {
    width: 65px;
}

div.estimateBox input.workItemClientTotal {
    width: 100px;
}

table.estimateDetails input.deleteButton {
}

div.estimatesColumnTots {
    margin: 10px 0;
}

div.estimatesColumnTots input.showAdvancedBtn {
    width: 115px;
}

div.estimatesColumnTots input {
    width: 45px;
    margin: 5px;
}

div.estimateWorkItemRow div.estimateBox.showAdvanced {
    width: 310px;
}

div div.estimateWorkItemRow {
    padding: 5px 2px;
}

#estimateWorksContainer .itemNoteNoteWrapper, #estimateWorksContainer .itemNote {
    display: none;
}

#estimateWorksContainer .itemNoteNoteWrapper.hasItemNote, #estimateWorksContainer .itemNote.hasItemNote {
    display: inline-block;
    margin-bottom: 3px;
}

.itemNoteNoteWrapper label {
    margin-top: 0px;
    margin-top: 3px;
}

.itemNoteNoteWrapper {
    margin: 2px 2px 0 2px;
    padding: 2px;
    width: 98%;
    background-color: #FFFFD6;
    border-radius: 3px;
}

.itemNoteNoteWrapper textarea {
    background-color: #FFFFD6;
}

div#cph1_tabContainer_estimateTabPanel_estimateUpdatePanel div.estimateWorkItemRow:nth-of-type(odd) {
    background-color: #EEF4FD;
    padding: 12px 2px;
}

div#cph1_tabContainer_estimateTabPanel_estimateUpdatePanel div.estimateWorkItemRow:nth-of-type(even) {
    background-color: #E5EBF5;
}


div.searchInEstimatesModalPanel {
    width: 800px;
    height: 645px;
}

.searchWithTable {
    width: 100%;
}

.searchWithTable table tr th :first-child, .searchWithTable table tr td:first-child {
    width: 640px;
}

div#savedWorkItem {
    width: 1000px;
    text-align: left;
    padding: 5px;
}



div#savedWorkItem fieldset#selectWorkItem, div#savedWorkItem fieldset#saveForLaterWorkName {
    width: 700px;
    float: left;
}

div#savedWorkItem input {
    margin-left: 20px;
}

fieldset#mainWorkItemDescription {
    width: 965px;
    clear: both;
    height: 500px;
}

fieldset#mainWorkItemDescription textarea#cph1_tabContainer_estimateTabPanel_savedWorkItemSummaryTb {
    width: 960px;
    height: 200px;
}

fieldset#mainWorkItemDescription fieldset, #selectWorkItem {
    float: left;
    margin: 5px;
}

fieldset.workItemSubSummary {
    height: 230px;
    width: 297px;
    padding: 5px;
}

fieldset.workItemSubSummary input {
    width: 55px;
}

fieldset.workItemSubSummary textarea.workItemsSubSummaryTb {
    width: 278px;
    height: 145px;
    margin-top: 5px;
}

.saveWorkItemSummaryRow {
    display: inline-block;
}

.savedWorkItemSummaryBox {
    width: 278px;
    height: 145px;
    margin-top: 5px;
    overflow-wrap: normal;
    overflow-y: scroll
}

div.estimateAddNew {
    width: 700px;
    height: 200px;
}

div input[type="text"].estimateReadOnlyTotal {
    background-color: #00FFFF;
}

div input[type="text"].estimateReadOnlyTravelTotal {
    background-color: #D4DDFF;
}

div input.estimateCellOverride {
    color: #000;
    background-color: yellow;
}

div input.validationPotentialErrorCell {
    color: red;
    background-color: #fff;
}

input.error {
    background-color: #FD7070;
}

tr.missingRef, label.missingRef {
    background-color: #FFD0A4
}

tr.deletedRef, label.deletedRef {
    background-color: #FFD0A4;
}

label.bg-textwarning, span.bg-textwarning {
    background-color: #FFD0A4;
    padding: 7px;
    font-weight: 600;
}


tr.ignoreInSync, label.ignoreInSync {
}

#estimateWorksContainer {
    height: 400px;
    margin-top: 5px;
}

div#cph1_tabContainer_estimateTabPanel_estimateTotals {
    min-height: 60px;
    padding: 2px 5px 10px 5px;
    margin: 0 auto;
    background-color: #3B5A89;
    color: #fff;
    bottom: 0px;
    margin-right: auto;
    margin-left: auto;
}

.ghostbar {
    height: 3px;
    width: 100%;
    background-color: #000;
    opacity: 0.5;
    position: absolute;
    cursor: row-resize;
    z-index: 999
}

.workItemsSubSummary {
    width: 300px;
    height: 250px;
}

table.jobProgress th.numeric {
    width: 10%;
    min-width: 90px;
}

table.jobProgress th.description {
    width: 60%;
    min-width: 200px;
}

#cph1_tabContainer_jpTP_jpSumProjectedContractSumTb {
    background-color: #FFFF63 !important;
}

table tr th.hide, table tr td.hide {
    display: none;
}

.modalPanel {
    padding: 20px;
    background-color: #fff;
    border: 1px solid #111;
    border-radius: 5px;
}

.modalPanel h2, .modalPanel h3, .modalPanel h4, h5 {
    margin-top: 0;
    margin-bottom: 5px;
}

.largeWidthModelPanel {
    width: 90%;
}

.closePanelBtnImg {
    float: right;
    padding: 3px;
}

.closePanelBtnImgOutish {
    position: absolute;
    top: -10px;
    right: -10px;
    border-radius: 50%;
    background-color: #fff;
}

div.messageBox {
    min-height: 200px;
    width: 600px;
    padding: 30px 10px;
}

div.buttonRow {
    margin: 5px;
}

    div.buttonRow input {
        margin: 5px 20px;
    }

input.seperateFromLeft {
    margin-left: 30px;
}

.manageCCMain {
    min-width: 1000px;
    width: 100%;
    max-width: 1900px;
    /*height:600px;*/
    border: 1px solid #234;
    border-radius: 5px;
    background-color: #F5F6F9;
    margin-top: 10px;
    padding: 5px;
}


.manageCCMain.manageCCMainComposite {
    /*height:800px;*/
}

.manageCCMain.manageCCMainComposite #compositeBuilder {
    clear: left;
    padding-top: 20px;
}

.manageCCMain .manageLefty {
    float: left;
    /*width:490px*/
    width: 45%;
}

.manageCCMain .manageRighty {
    float: right;
    /*width:490px*/
    width: 54%;
}

.compositePart {
    width: 100%;
}

table.compositePart tr th.itemDesc {
    width: 25%;
}

table.compositePart tr th.itemQty {
    width: 70px;
}

.tableFixedHead tr th {
    position: sticky;
    top: 0;
}

.containerForScrollForFakeTopBorder {
    position: relative;
}

.fakeTopBorderForScroll {
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: #BBBBBB;
    width: 100%;
    height: 1px;
    z-index: 11;
}

@media screen and (min-width: 1440px) {
    table.compositePart tr th.itemDesc {
        width: 40%;
    }
}

.manageCCMain .manageScrollRepeater {
    height: 310px;
    overflow-y: scroll;
}

.manageCCMain .manageNameTb {
    width: 330px;
}


input.readonly {
    background-color: #C9C9C9;
}


input.selectedPage, a.selectedPage {
    color: red;
}

table tr.selected {
    background-color: #B5D8D7 !important;
}

.valignmiddle * {
    vertical-align: top;
}

div#syncPopup {
    border: 1px solid green;
    position: absolute;
    width: 412px;
    height: 280px;
    padding: 10px;
    top: -290px;
    left: 10px;
    background: #fff;
    border-radius: 5px;
    color: #000;
}

.syncResultLib {
    color: #007bff;
}

.syncResultValue {
    background-color: #00FFFF;
    min-width: 90px;
    display: inline-block;
    padding: 2px 6px;
    border: 1px solid #000;
    border-radius: 2px;
}

.sync-result-comp-total .row {
    padding-bottom: 3px;
}

.syncResultBreakdownValue {
    background-color: #C8FFFF;
}

    .syncResultBreakdownValue.tolleranceExceeded {
        background-color: #E40000;
        color: #fff;
    }


.syncResultDescription {
    display: inline-block;
    width: 70%;
}

.syncResultDescription.allowQty {
    width: 55%;
}

#syncResultContainer div.sync-result-item-differingvalue-container {
    margin-top: 10px;
}

#syncCompositeContainer div.sync-result-item-differingvalue-container.libraryBlock {
    padding: 1px 1px 6px 20px;
}

#syncResultContainer label.sync-result-item-differingvalue-label {
    min-height: 25px;
    margin-top: 5px;
    width: 100%;
}

.syncResultCol {
}

.syncResultContainer {
    padding: 4px;
    background: #FFF4CB;
}

#syncLabourContainer {
    /*background: #E9FFE5;*/
}

#syncMaterialContainer {
    /*background: #FFFAEA;*/
}

#syncCompositeContainer {
    /* background: #FFF4CB;*/
}

#syncCompositeContainer .itemsToUpdateButNotDraw {
    background: #FFFAEA;
}

#syncResultContainer .sync-result-item-differingvalue-container.libraryBlock {
    background: #C8FFFF;
}

#syncCompositeContainer .compRadioInput {
    margin-top: 10px;
}

.driveAttachmentLevel1 {
    margin-left: 10px;
}

.driveAttachmentLevel2 {
    margin-left: 20px;
}

.driveAttachmentLevel3 {
    margin-left: 30px;
}

.driveAttachmentLevel4 {
    margin-left: 40px;
}

@media screen and (max-width: 760px) {
    div #master {
        height: 155px;
        clear: both;
    }


    #cph1_masterListBox {
        height: 150px;
        width: 400px;
    }

    div#details {
        clear: both;
        margin-top: 10px;
    }
}

.detailsTabContainerTabs .ajax__tab_header .ajax__tab {
    height: 41px;
}

.detailsTabContainerTabs .ajax__tab_header .ajax__tab_outer .ajax__tab_inner .ajax__tab_tab, .detailsTabContainerTabs .ajax__tab_header .ajax__tab_outer .ajax__tab_inner, .detailsTabContainerTabs .ajax__tab_header .ajax__tab_outer {
    background-image: none !important;
    background: none !important;
    background-color: #E5EBF5;
    padding: 0 !important;
}

.detailsTabContainerTabs.ajax__tab_xp .ajax__tab_header .ajax__tab_outer .ajax__tab_inner .ajax__tab_tab {
    padding: 10px 0 !important;
    color: #000 !important;
    font-size: 1.4em;
}

.detailsTabContainerTabs.ajax__tab_xp .ajax__tab_header {
    /* height:40px;*/
}

.detailsTabContainerTabs.ajax__tab_xp .ajax__tab_body {
    border: 0;
}

.detailsTabContainerTabs .ajax__tab_header {
    /*A container element that wraps all of the tabs at the top of the TabContainer. Child CSS classes:.ajax__tab_outer.*/
    background-image: none !important;
}

.detailsTabContainerTabs .ajax__tab_outer {
    /* An outer element of a tab, often used to set the left-side background image of the tab.Child CSS classes: .ajax__tab_inner. */
    background-image: none !important;
}

.detailsTabContainerTabs .ajax__tab_inner {
    /*A  An inner element of a tab, often used to set the right-side image of the tab. Child CSS classes:.ajax__tab_tab*/
    background-image: none !important;
}



.detailsTabContainerTabs .ajax__tab_tab, .detailsTabContainerTabs .ajax__tab_tab span {
    /*A   An element of the tab that contains the text content. Child CSS classes:none.*/
    background-color: #E5EBF5;
    padding: 10px 10px;
    border-top: 1px solid #E5EBF5;
    border-bottom: 2px solid #fff;
}


.detailsTabContainerTabs .ajax__tab_body {
    /*A   A container element that wraps the area where a TabPanel is displayed. Child CSS classes: none.*/
}

.detailsTabContainerTabs .ajax__tab_hover {
    /*A  This is applied to a tab when the mouse is hovering over. Child CSS classes:.ajax__tab_outer.*/
    cursor: pointer;
}

    .detailsTabContainerTabs .ajax__tab_hover .ajax__tab_inner {
        /*A  This is applied to a tab when the mouse is hovering over. Child CSS classes:.ajax__tab_outer.*/
    }

    .detailsTabContainerTabs .ajax__tab_hover .ajax__tab_tab {
        /*A  This is applied to a tab when the mouse is hovering over. Child CSS classes:.ajax__tab_outer.*/
        background-color: #EEF3FA;
        border-bottom-color: #000;
    }

.detailsTabContainerTabs .ajax__tab_active {
    /*A This is applied to a tab when it is the currently selected tab. Child CSS classes:.ajax__tab_outer.*/
}

    .detailsTabContainerTabs .ajax__tab_active .ajax__tab_tab, .detailsTabContainerTabs .ajax__tab_active .ajax__tab_tab span {
        /*A This is applied to a tab when it is the currently selected tab. Child CSS classes:.ajax__tab_outer.*/
        background-color: #fff;
        border-top-color: #D9DFE8;
        border-bottom-color: #fff;
    }

div.ui-dialog-buttonset button.ui-button.ui-corner-all.ui-widget {
    padding: 5px 10px;
    margin: 0 5px;
}

div.ui-dialog-titlebar.ui-widget-header {
    background: none;
    background-color: #3B5A89;
    color:#FFF;
}

ul#WorkItemSortOrderList li.ui-state-default {
    color: #3B5A89;
}

ul#WorkItemSortOrderList li.ui-state-default:hover {
    cursor: move;
}

ul#WorkItemSortOrderList li.ui-state-default img:hover {
    cursor: default;
}


.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

* html .clearfix {
    zoom: 1;
}
/* IE6 */
*:first-child + html .clearfix {
    zoom: 1;
}
/* IE7 */

.basicDataGrid {
    width: 100%;
    margin: 2px;
}

.basicDataGrid td {
    padding: 2px 4px;
}

div#RadWindowWrapper_ctl00_cph1_manageEmployeesCCtrl_employeesTabContainer_employeeUserTab_manageUserDetailsCCtrl_emailSignatureRadEditor_dialogOpenerInsertLink {
    z-index: 113016 !important;
}


/* overriding some bootstap styles*/

.btn {
    padding: .175rem .75rem;
    font-size: 0.8rem;
    border-color: #111;
}

.btn.btn-primary {
    background-color: #3B5A89;
    color: #eee;
}

.btn.btn-secondary {
}

.btn.btn-warning {
}

.infoIcon {
    background-image: url(/images/info.png);
    background-repeat: no-repeat;
    background-position: top;
    height: 15px;
    width: 15px;
    display: inline-block;
    background-size: contain;
}

input[type="text"]:read-only, select:read-only .stdSelect, textarea:read-only {
    background-color: #ddd !IMPORTANT;
}


select.overrideAspNetDisabled, input.overrideAspNetDisabled {
    color: rgb(0, 0, 0) !important;
    opacity: 1.0 !important;
    border-color: rgba(0, 0, 0, 1) !important;
}

input:read-only[type="text"].overrideAspNetDisabled {
    background-color: #fff;
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { /* STYLES GO HERE */
}

@media screen and (max-width:640px) {
    div#cph1_tabContainer_estimateTabPanel_estimateTotals {
        min-height: 60px;
        padding: 10px 5px;
        width: 97%;
        background-color: #3B5A89;
        color: #fff;
        position: static;
        bottom: 0px;
        margin-right: auto;
        margin-left: auto;
    }
}

@media screen and (max-width:615px) {
    header a#logoutButton {
        float: left;
    }
}

@media screen and (max-width: 340px) {

    .ajax__tab_xp .ajax__tab_header .ajax__tab_tab {
        height: 34px !important;
        font-size: 1.8em !important;
    }

    .ajax__tab_xp .ajax__tab_header .ajax__tab_outer {
        margin-bottom: 20px !important;
    }
}

@media screen and (max-width: 320px) {
    .searchDate {
        width: 120px !IMPORTANT;
    }

    .ajax__tab_tab {
        height: 20px !IMPORTANT;
        background-color: #123;
        padding: 12px !IMPORTANT;
    }
}

@media screen and (max-width: 640px) {
    table {
        overflow-x: auto;
        display: block;
    }
}

/*
@media screen and (max-width:946px)
{
    #jobsTable tr .addLn4
    {
        display:none;
        width:0;
        height:0;
        opacity:0;
        visibility: collapse; 
    }
}

@media screen and (max-width:878px)
{
    #jobsTable tr .addLn3
    {
        display:none;
        width:0;
        height:0;
        opacity:0;
        visibility: collapse; 
    }
}

@media screen and (max-width:798px)
{
    #jobsTable tr .addLn2
    {
        display:none;
        width:0;
        height:0;
        opacity:0;
        visibility: collapse; 
    }
}
    */