.navbar-inverse {
    background-color: #003059;
    border-color: #080808;
}

.loginlogo {
    max-width: 100px;
    margin-top: 20px;
}

html, body, h1, h2, h3, h4, h5, h6 {
    font-family: 'Barlow Semi Condensed', sans-serif;
    font-weight: 300;
}

html {
    overflow-y: scroll;
}

.chatthumb {
    max-width: 100px;
    max-height: 100px;
}

.createpdfbutton {
    color: #003059
}

#next, #send {
    outline: 0;
}

.ratingiconsmall {
    width: 15px;
}

.ratingsdiv {
    float: right;
    position: relative;
    top: -24px;
    right: 20px;
}

.numberofratings {
    font-size: 10px;
    color: #003059;
}

h1 {
    color: #707070;
    font-size: 18px;
    text-align: center;
    border: 1px solid #707070;
    padding: 6px 0 6px 0;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
    border-radius: 5px;
}

.rateclient {
    color: red
}

.formlabeltop {
    color: #597E96;
    padding-left: 0;
    float: none
}

.formblockdiv {
    max-width: 320px;
    margin: 0 auto;
}

.summarywhitediv {
    max-width: 320px;
    margin: 0 auto;
    margin-top: 10px;
    border-radius: 20px;
    background-color: white;
    padding: 10px;
    padding-left: 0;
    padding-right: 0;
}

.summarybluediv {
    max-width: 320px;
    margin: 0 auto;
    margin-top: 15px;
    border-radius: 5px;
    background-color: white;
    padding: 10px;
    color: white;
    border: 1px solid #707070;
    font-size: 17px;
    color: #707070;
}

.sanddiv {
    max-width: 320px;
    margin: 0 auto;
    margin-top: 10px;
    border-radius: 20px;
    background-color: #F0F0E7;
    padding: 10px;
    padding-left: 0;
    padding-right: 0;
}

.topspace40 {
    margin-top: 40px
}

.topspace20 {
    margin-top: 11px
}

#MainContent_RememberMe, #RememberMe {
    margin-left: 0
}

.signinbut {
    min-width: 280px;
    padding: 10px 0 10px 0;
    color: #003059;
}

.nopaddingleft {
    padding-left: 0
}

.jumbotron {
    background-image: linear-gradient(to right, #12476B, #00ADEE);
    color: white;
}

.navbar-inverse .navbar-nav > li > a {
    color: white;
}

.navlogo {
    margin-top: -7px;
    height: 35px;
    width: 130px;
    background-image: url('/images/ipromiselogotagline.svg');
    background-color: transparent;
    border: none
}

h3, h4 {
    color: #003059;
}

h2 {
    color: #707070
}

.btn-default {
    color: #333;
    background-color: #fff;
    border-color: #003059;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
    border-color: #F0F0E7;
    box-shadow: 0 1px 1px #F0F0E7 inset, 0 0 8px #F0F0E7;
    outline: 0 none;
}

footer {
    margin-top: 40px;
}

.formentry {
    color: #707070;
    font-size: 11px;
    font-family: Barlow;
    font-weight: 400;
}
/*when logged in*/
.navbar-inverseloggedin {
    background-color: white;
    border: none
}

    .navbar-inverseloggedin .navbar-nav > li > a {
        color: black;
    }

.navbar-toggleloggedin, .navbar-toggle {
    border: unset
}

.navbar-inverseloggedin .navbar-toggle .icon-bar {
    background-color: #707070;
}
/*.navbar-inverseloggedin .navbar-collapse{
   background-color: #14486A;
   color: white
}*/
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="select"] {
    max-width: 320px;
    color: #003059;
}

.commentsfield {
    border: 1px solid #707070;
    width: 320px;
    color: #003059;
    border-radius: 5px;
    height: 80px;
    margin-top: 5px;
    padding: 3px;
}

.standardtextfield {
    border-top: 0;
    border-bottom: 1px solid #707070;
    border-right: 0;
    border-left: 0;
    width: 320px;
    margin-top: 0px;
    margin-bottom: 6px;
    color: #003059;
    font-size: 17px;
    font-weight: 400;
    padding-bottom: 3px;
    color: #003059;
    border-radius: 0;
}

.fullwidthtextfield {
    border-top: 0;
    border-bottom: 0;
    border-right: 0;
    border-left: 0;
    width: 100%;
    margin-top: 0px;
    color: #003059;
    font-size: 12px;
    font-weight: 400;
    padding-bottom: 3px;
    color: #003059;
    border-radius: 0;
    resize: none;
    overflow: hidden;
}

.fullwidthtextfieldunit {
    border-top: 0;
    border-bottom: 0;
    border-right: 0;
    border-left: 0;
    width: 100%;
    margin-top: 0px;
    color: #003059;
    font-size: 12px;
    font-weight: 400;
    padding-bottom: 3px;
    color: #003059;
    border-radius: 0;
    resize: none;
    overflow: hidden;
    text-align: right
}

.fullwidthtextfieldquantity {
    border-top: 0;
    border-bottom: 0;
    border-right: 0;
    border-left: 0;
    width: 100%;
    margin-top: 0px;
    color: #003059;
    font-size: 12px;
    font-weight: 400;
    padding-bottom: 3px;
    color: #003059;
    border-radius: 0;
    resize: none;
    overflow: hidden;
    text-align: center
}

.smalltextfield {
    border-top: 0;
    border-bottom: 1px solid #707070;
    border-right: 0;
    border-left: 0;
    width: 130px;
    margin-top: 0px;
    margin-bottom: 6px;
    color: #003059;
    font-size: 17px;
    font-weight: 400;
    padding-bottom: 3px;
    border-radius: 0;
}

.standardtextfield2 {
    border: 1px solid #707070;
    border-radius: 3px;
    margin-top: 0px;
    margin-bottom: 6px;
    color: #003059;
    font-size: 17px;
    font-weight: 400;
    padding-bottom: 3px;
    border-radius: 0;
}

.standardtextfield3 {
    border: 1px solid #707070;
    padding-top: 5px;
    padding-bottom: 5px;
    margin: 0;
    font-size: 13px;
    border-radius: 10px;
    background-color: #689A89;
    text-align: center;
    color: white;
    font-weight: 700;
    border-radius: 0;
}

.standardtextfield4 {
    border: 1px solid #707070;
    border-radius: 3px;
    margin-top: 6px;
    margin-bottom: 6px;
    color: #003059;
    font-size: 17px;
    font-weight: 400;
    padding-bottom: 3px;
    width: 106px;
    border-radius: 0;
}

.standardtextarea {
    border: 1px solid #707070;
    width: 320px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 13px;
    height: 310px;
    border-radius: 10px;
    margin-top: 10px;
    margin-bottom: 2px;
    font-size: 17px;
    font-weight: 400;
    border-radius: 0;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    color: #003059;
}

.standardtextarea2 {
    border: 1px solid #707070;
    width: 275px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 13px;
    height: 110px;
    border-radius: 10px;
    margin-top: 10px;
    resize: none;
    margin-bottom: 2px;
    border-radius: 0;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}

.nextbutton {
    background-color: #129043;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 50px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
}

.nextbuttonlightgreen {
    background-color: #73C324;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    margin-top: 5px;
    padding-bottom: 8px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
}

.nextbuttonmustard {
    background-color: #C1C53F;
    color: white;
    border-radius: 4px;
    width: 300px;
    margin-top: 5px;
    padding-top: 8px;
    padding-bottom: 8px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
}

.nextbuttonred {
    background-color: red;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 50px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
}

.newnextbutton {
    color: white;
    border-radius: 4px;
    padding-top: 8px;
    padding-bottom: 8px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
    float: left;
}

.newnextbutton2 {
    color: white;
    border-radius: 4px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 10px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
    float: left;
}

.nextbuttonblue2 {
    background-color: #003059;
    color: white;
    border-radius: 4px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 50px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
    float: left;
    width: 100px;
}

.nextbuttonblue3 {
    background-color: #003059;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 50px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
}

.nextbuttongreen {
    background-color: #003059;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 50px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
}

.nextbuttonred {
    background-color: #A12F26;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 5px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
    white-space: normal;
}

.nextbuttonsand {
    background-color: #DDA046;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 5px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
}

.nextbuttonlightblue {
    background-color: #00AEEF;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 5px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
}

.nextbuttonblue {
    background-color: #003059;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 5px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
}

.nextbutton2 {
    background-color: #003059;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 5px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
}

.nextbutton3 {
    background-color: #73C324;
    color: white;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 5px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
}

.nextbuttonseeattachments {
    background-color: #707070;
    color: #F0F0E7;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 50px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
}

.nextbuttonaddstage {
    background-color: #00AEEF;
    color: #E5E5DC;
    border-radius: 4px;
    width: 300px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 5px;
    font-weight: 600;
    font-size: 13px;
    border-style: unset;
}

.navbar-header {
    background-color: #F8F8F8
}

.searchwrapper {
    margin-top: 10px;
}

@media (max-width:780px) {
    .searchwrapper {
        margin-top: 78px;
    }
}

@media (max-width:700px) {
    .searchwrapper {
        margin-top: 98px
    }
}

@media (max-width:1199px) {
    .navbar-nav {
        background: #003059;
    }

    .nav > li {
        border-bottom: 2px solid #3C6681;
    }

    .navbar-toggle {
        right: 10px !important;
    }
}

.navbar-inverseloggedin .navbar-nav > li > a {
    color: white
}

.searchicon {
    max-width: 20px;
    float: right;
    margin-top: 2px;
}

.searchwrapper {
    width: 200px;
}

.centerhead {
    text-align: center;
    font-size: 18px;
    margin-bottom: 0;
    font-weight: 400;
    margin-top: 16px;
    font-family: Barlow;
}

.centerheadred {
    text-align: center;
    color: #A12F26;
    font-size: 18px;
}

.ratecustomer {
    border-radius: 10px;
    padding: 10px;
    color: #003059;
    background-color: #F7F7F3;
}

.centerheadwhite {
    text-align: center;
    color: white;
    font-size: 18px;
}

.centerheadwhite2 {
    text-align: center;
    color: white;
    max-width: 320px;
    margin: 0 auto;
    margin-top: 5px;
    font-size: 18px;
}

.centerheadnormal2 {
    text-align: center;
    max-width: 320px;
    margin: 0 auto;
    margin-top: 5px;
}

.secondarynav {
    background-color: unset;
    border: none;
}

.secondarynavul {
    background-color: #003059;
}

.primarynavbutton {
    width: 38px;
    position: relative;
    left: -6px;
    top: -7px;
}

.foldericon {
    width: 25px;
    position: relative;
    top: 7px;
}

.secondnavbutton {
    width: 25px;
    position: relative;
}

.navbar-inverseloggedin .secondarynavul > li > a {
    color: white;
}


.navbar-inverseloggedin .secondnav > ul {
    float: none;
    position: relative;
    top: 14px;
    z-index: 2;
    width: 246px;
    left: 35px;
}

.dashboardbutton {
    width: 320px;
    color: white;
    border-radius: 5px;
    margin-top: 5px;
    animation-duration: 3s;
    animation-name: fadeIn;
    min-height: 50px;
}

    .dashboardbutton:Hover {
        text-decoration: none;
        color: white;
        filter: brightness(80%);
    }

.dashboardbuttonchat {
    width: 370px;
    color: white;
    border-radius: 0px;
    margin-top: 5px;
    animation-duration: 3s;
    animation-name: fadeIn;
    min-height: 50px;
}

    .dashboardbuttonchat:Hover {
        text-decoration: none;
        color: white;
        filter: brightness(80%);
    }


@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translateY(startYposition);
    }

    100% {
        opacity: 1;
        transform: translateY(endYposition);
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
        transform: translateY(startYposition);
    }

    100% {
        opacity: 0;
        transform: translateY(endYposition);
    }
}

.mouseover {
    cursor: pointer;
}

.newpromise {
    background-color: white;
    color: #707070;
    border: 1px solid #707070;
    text-align: center;
    cursor: pointer;
    font-size: 19px;
    padding-top: 11px;
    padding-bottom: 11px;
    font-family: Barlow;
    font-weight: 400;
}

.accounttopamlbox {
    background-color: white;
    border: 1px solid #707070;
    text-align: left;
    padding: 5px;
    color: #707070;
    font-size: 11px;
    font-family: Barlow;
    font-weight: 400;
}

.codebox {
    margin-right: 5px;
    text-align: center
}

.myaccounttextbox {
    color: #707070;
    border-bottom: none
}

.accounttopamlbox:Hover {
    text-decoration: unset;
    color: unset;
    filter: unset;
}


.newpromise:hover {
    text-decoration: underline;
}


.logoutnav {
    color: white;
    line-height: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 15px;
    cursor: pointer;
}

.quotetypeonbutton {
    float: right;
    font-weight: 400;
    padding-right: 20px;
    font-size: 10px;
}

.permanentburger {
    display: block;
    background-color: unset;
    -webkit-appearance: none;
    padding: 0;
}
/*end when logged in*/
/*change nav menu break point*/
@media (max-width: 1199px) {
    .navbar-header {
        float: none;
    }

    .navbar-left, .navbar-right {
        float: none !important;
    }

    .navbar-toggle {
        display: block;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }

    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }

    .navbar-collapse.collapse {
        display: none !important;
    }

    .navbar-nav {
        float: none !important;
        margin-top: 7.5px;
    }

        .navbar-nav > li {
            float: none;
        }

            .navbar-nav > li > a {
                padding-top: 10px;
                padding-bottom: 10px;
            }

    .collapse.in {
        display: block !important;
    }
}

.mainbluenav {
    background-color: #003059
}

.bluetext {
    color: #003059;
    /* changed this from #003059*/
}
/*end change nav menu break point*/
#wrapper {
    width: 500px;
    border: 1px solid black;
    overflow: hidden; /* will contain if #first is longer than #second */
}

#first {
    width: 250px;
    float: left; /* add this */
    border: 1px solid red;
}

#second {
    border: 1px solid green;
    overflow: hidden; /* if you don't want #second to wrap below #first */
}

label[for="includegst"] {
    margin-bottom: 5px;
    margin-left: 10px;
    font-weight: 400;
    position: relative;
    top: -2px;
}

label[for="stageorvariation_0"], label[for="stageorvariation_1"] {
    margin-left: 25px;
    position: relative;
    top: 4px;
    left: -5px;
}

label[for="stageorvariation_0"] {
    max-width: 10px
}

#stageorvariation {
    margin-bottom: 5px;
}

.quoteamount {
    padding-right: 20px
}

hr {
    color: #9D9D92;
    border: none;
    height: 1px;
    color: #9D9D92;
    background-color: #9D9D92;
    width: 320px;
}

.formtitle2 {
    width: 300px;
    margin: 0 auto;
    position: relative;
    right: 83px;
}

.formtitle3 {
    max-width: 350px;
    margin: 0 auto;
    position: relative;
    right: 20px;
}
/*devices under 380px*/
@media (max-width: 381px) {
    .standardtextfield2, .standardtextfield3 {
        width: 120px;
    }

    hr {
        width: 290px;
    }

    .formtitle2 {
        right: 86px;
    }
}

#completiondate, #paymenttype {
    margin-top: 8px;
    color: #003059;
}

.completedate input[type="radio"] {
    margin-right: 5px;
    margin-left: 6px;
}

.paymentradios input[type="radio"] {
    margin-right: 5px;
    margin-left: 6px;
}

#paymenttype_0 {
    margin-left: 0
}

#paymenttype {
    margin-left: 0
}

label {
    font-weight: normal;
}

#agreeterms {
    margin-right: 5px;
}

#uploadadditional {
    border-radius: 30px;
    background-color: #3385A6;
    color: white;
    font-size: 20px;
    padding: 8px 20px 8px 20px;
    border-style: unset;
    margin-top: 10px;
    margin-bottom: 10px;
}

#uploadadditional2 {
    border-radius: 10px;
    background-color: #3385A6;
    color: white;
    font-size: 14px;
    padding: 4px 10px 4px 10px;
    border-style: unset;
    position: relative;
    top: 2px;
    margin-right: 20px;
}

.summary {
    background-color: #3385A6
}

#daysafterdiv {
    color: #689A89
}

#numdaysaftercomplete {
    margin-top: 10px;
    font-size: 14px;
    color: #333333;
    border: 1px solid #707070;
    padding: 4px;
    outline: 0px none #fff !important;
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 5px;
    border-radius: 3px;
    margin-bottom: 2px;
}

#daysafterrow, #calendarrow {
    display: none
}

.summaryblue {
    color: #003059;
    font-size: 17px;
    font-weight: 400;
}

.summaryblue2 {
    color: #003059;
    font-size: 12px;
    font-weight: 400;
    padding: 2px;
}

.summaryblue2unit {
    color: #003059;
    font-size: 12px;
    font-weight: 400;
    padding: 2px;
    text-align: center;
}

.summaryblue2unitcost {
    color: #003059;
    font-size: 12px;
    font-weight: 400;
    padding: 2px;
    text-align: right;
}



.hr2 {
    max-width: 320px;
    margin-top: 3px;
    margin-bottom: 8px;
}

.hr3 {
    max-width: 320px;
    margin-top: 3px;
    margin-bottom: 6px;
}

#excludegst {
    margin-left: 65px;
    margin-right: 5px;
}

label[for="excludegst"] {
    font-weight: unset;
}

.chat {
    z-index: 2;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    top: 2px;
    cursor: pointer;
    height: 44px;
}



.search {
    z-index: 2000;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 147px;
    right: 0;
    top: 3px;
    cursor: pointer;
    height: 43px;
}

.chart {
    z-index: -1;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    right: 0;
    top: 14px;
    cursor: pointer;
    height: 25px;
}

.navbar {
    margin-bottom: 0px;
}

.modal-header {
    background-color: #003059;
    border-radius: 6px 6px 0px 0px;
}

.modal-content {
    background-color: unset
}

.modal-body {
    background-color: white
}

.modal-title {
    color: white
}

.close {
    font-size: 30px;
    font-weight: 400;
    color: white;
    opacity: 1;
}

#chatfield {
    height: 36px;
    width: 272px;
    resize: none;
    margin-top: 20px;
    border-radius: 10px;
    overflow: hidden;
    float: left;
    padding-left: 8px;
    padding-right: 8px;
    margin-left: 11px;
    padding-top: 7px;
    padding-bottom: 10px;
    font-family: 'Barlow Semi Condensed', sans-serif;
    font-size: 14px;
}

.chatdate {
    font-size: 12px;
    color: #003059;
    text-align: center;
    font-weight: 400;
    margin-top: 5px
}

.chattime {
    font-size: 12px;
    color: #003059;
    font-weight: 400;
}

.chatperson {
    font-weight: 500;
    left: 9px;
}

.chatrow {
    margin-top: 5px;
}


.chatinitials {
    width: 20px;
    height: 20px;
    line-height: 19px;
    border-radius: 50%;
    font-size: 13px;
    color: white;
    text-align: center;
    background: #10476b;
    position: relative;
    top: 18px;
}

.chatinitials2 {
    width: 20px;
    height: 20px;
    line-height: 19px;
    border-radius: 50%;
    font-size: 13px;
    color: white;
    text-align: center;
    background: #2b6b10;
    position: relative;
    top: 18px;
}

.chatinitials3 {
    width: 20px;
    height: 20px;
    line-height: 20px;
    border-radius: 50%;
    font-size: 13px;
    color: #fff;
    text-align: center;
    background: #003059;
    position: relative;
    top: 18px;
}



#phone {
    max-width: 30px;
}

.leftarrow {
    max-width: 30px;
    position: absolute;
    top: 60px;
    left: 10px;
    cursor: pointer
}

.centersmalltext {
    text-align: center;
    font-size: 12px;
}

.queriesreasons {
    border: 1px solid #707070;
    border-radius: 10px;
    padding: 10px;
    color: #707070;
    margin-bottom: 20px;
}

.comments {
    border: 1px solid #707070;
    border-radius: 10px;
    padding: 10px;
    color: #707070;
    margin-top: 10px;
    margin-bottom: 0
}

.paymentmade {
    border-radius: 10px;
    padding: 10px;
    color: #003059;
    background-color: #F7F7F3;
}

.projectcompleted {
    border-radius: 10px;
    padding: 10px;
    color: white;
    background-color: #129043;
    font-size: 1.3em;
    text-align: center
}

.ratingicon {
    margin-right: 2px;
    margin-top: 5px;
    margin-bottom: 5px;
    cursor: pointer
}

    .ratingicon:hover {
        filter: brightness(80%);
    }


.paymentmade2 {
    border-radius: 10px;
    padding: 10px;
    color: #F0F0E7;
    background-color: #129043;
    text-align: center;
    font-size: 18px;
    font-weight: 500
}

.onoffswitch {
    margin: 0 auto;
    position: relative;
    width: 100px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    left: 36px;
    margin-bottom: 15px;
}

.onoffswitch-checkbox {
    display: none;
}

.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid #999999;
    border-radius: 20px;
}

.onoffswitch-inner {
    display: block;
    width: 200%;
    margin-left: -100%;
    -moz-transition: margin 0.3s ease-in 0s;
    -webkit-transition: margin 0.3s ease-in 0s;
    -o-transition: margin 0.3s ease-in 0s;
    transition: margin 0.3s ease-in 0s;
}

    .onoffswitch-inner:before, .onoffswitch-inner:after {
        display: block;
        float: left;
        width: 50%;
        height: 30px;
        padding: 0;
        line-height: 30px;
        font-size: 12px;
        color: white;
        font-weight: bold;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .onoffswitch-inner:before {
        content: "SUPPLIER";
        padding-left: 10px;
        background-color: #003059;
        color: #FFFFFF;
    }

    .onoffswitch-inner:after {
        content: "CLIENT";
        padding-right: 10px;
        background-color: #EEEEEE;
        color: #999999;
        text-align: right;
    }

.onoffswitch2-inner:before {
    content: "CLIENT";
    padding-left: 10px;
    background-color: #003059;
    color: #FFFFFF;
}

.onoffswitch2-inner:after {
    content: "SUPPLIER";
    padding-right: 10px;
    background-color: #EEEEEE;
    color: #999999;
    text-align: right;
}

.onoffswitch-switch {
    display: block;
    width: 18px;
    margin: 6px;
    background: #FFFFFF;
    border: 2px solid #999999;
    border-radius: 20px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 70px;
    -moz-transition: all 0.3s ease-in 0s;
    -webkit-transition: all 0.3s ease-in 0s;
    -o-transition: all 0.3s ease-in 0s;
    transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px;
}

.chatlogo {
    width: 17px;
    position: relative;
    top: 18px;
}

.navbar-nav {
    margin: 0;
}

/*permanently collapse navbar*/
@media (max-width: 5000px) {
    .navbar-header {
        float: none;
    }

    .navbar-left, .navbar-right {
        float: none !important;
    }

    .navbar-toggle {
        display: block;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }

    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }

    .navbar-collapse.collapse {
        display: none !important;
    }

    .navbar-nav {
        float: none !important;
        margin-top: 7.5px;
    }

        .navbar-nav > li {
            float: none;
        }

            .navbar-nav > li > a {
                padding-top: 2px;
                padding-bottom: 2px;
            }

    .collapse.in {
        display: block !important;
    }
}
/*end permanently collapse navbar*/
.navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
    max-height: unset;
}

.navdashboard {
    z-index: 2000;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: -146px;
    right: 0;
    cursor: pointer;
    top: 4px;
    height: 39px;
}

.dashboardlogo {
    height: 34px;
    width: 34px;
    z-index: 2000;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: -280px;
    right: 0;
    cursor: pointer;
    top: 7px;
    background-image: url('/images/ipromiselogonotext.svg');
    background-color: transparent;
    border: none
}

.requiredfield {
    color: red;
    font-weight: bold;
}

.buttontop {
    width: 24px;
    z-index: 2000;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    right: 0;
    top: 12px;
    cursor: pointer;
    -webkit-appearance: none;
    padding: 0;
    left: 293px;
}

.helptext {
    color: #00AEEF;
    margin-left: 3px;
}

.required {
    color: red
}

#tooltipx {
    text-align: center;
    color: #fff;
    background: #111;
    position: absolute;
    z-index: 5000;
    padding: 15px;
}

    #tooltipx:after /* triangle decoration */ {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #111;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }

    #tooltipx.top:after {
        border-top-color: transparent;
        border-bottom: 10px solid #111;
        top: -20px;
        bottom: auto;
    }

    #tooltipx.left:after {
        left: 10px;
        margin: 0;
    }

    #tooltipx.right:after {
        right: 10px;
        left: auto;
        margin: 0;
    }

.modal-footer {
    text-align: center;
}

.modal {
    max-width: 300px;
    max-height: 150px;
    margin: 0 auto;
    background-color: #003059;
    border-radius: 10px;
    margin-top: 10px;
}

.quotetypeonbutton2 {
    float: right;
    padding-right: 5px;
    font-size: 12px;
    text-align: right;
    width: 134px;
    position: relative;
    top: 6px;
    font-weight: 500
}

.quotetypeonbutton3 {
    float: right;
    padding-right: 10px;
    font-size: 12px;
    text-align: right;
    width: 95px;
    position: relative;
    top: 15px;
    font-weight: 500
}

.expanded-text {
    width: 217px;
    position: relative;
    top: 9px;
}

.expanded-textchat {
    width: 232px;
    position: relative;
    top: 0;
}

.expanded-textmetric {
    width: 232px;
    position: relative;
    font-size: 17px;
    top: 9px
}

span.longer-name {
    display: none;
    margin-bottom: 20px;
}

span.longer-name2 {
    display: none;
}

.expanded-text:hover span.short-name {
    display: none;
}

.expanded-text:hover span.longer-name {
    display: block;
}

.expanded-textchat:hover span.short-name {
    display: none;
}

.expanded-textchat:hover span.longer-name2 {
    display: block;
}


.ednotsent, .completedawaitingapprovalstatus, .quotedactionrequiredstatus {
    position: relative;
    top: -1px;
    max-height: 17px;
    line-height: 1.3em;
}

.dob {
    margin-top: 10px;
    font-size: 14px;
    color: #333333;
    border: 1px solid #707070;
    padding: 4px;
    outline: 0px none #fff !important;
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 5px;
    border-radius: 3px;
}

#reasonfordecline label {
    margin-left: 10px;
    font-weight: 400;
}

input[type="radio"] {
    margin-right: 5px;
}

.paperclip {
    width: 34px;
    height: 34px;
    background-image: url('/images/paperclip.svg');
    background-color: transparent;
    border: none
}

.chatpaperclip {
    width: 17px;
    margin-right: 4px;
}

.paperclip:hover {
    background-image: url('/images/paperclipover.svg');
}

.paperclipchat {
    width: 34px;
    height: 34px;
    background-image: url('/images/paperclipchat.svg');
    background-color: transparent;
    border: none;
    position: relative;
    top: -2px;
}

    .paperclipchat:hover {
        background-image: url('/images/paperclipoverchat.svg');
    }

.attachmentcount {
    color: red;
    position: relative;
    top: -30px;
    left: 35px;
}

.attachmentcountchat {
    color: red;
    position: relative;
    top: -30px;
    left: -10px;
}

input[type=radio] {
    float: left;
}

label {
    margin-left: 20px;
    display: block;
}

#MainContent_clientorsupplier td {
    height: 45px;
    vertical-align: middle;
}

label[for="MainContent_agreeterms"] {
    position: relative;
    top: -20px;
}

input:focus::placeholder {
    color: transparent;
}

#MainContent_gstregistered {
    margin-top: 5px;
    margin-bottom: 5px;
}

.banktextfield {
    border: 1px solid #707070;
    width: 15px;
    padding-top: 2px;
    padding-bottom: 2px;
    font-size: 13px;
    text-align: center;
    padding-left: 0;
    padding-right: 0;
}

.register {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/register.svg');
    float: none;
    background-color: transparent;
}

    .register:hover {
        background-image: url('/images/buttons/saveandsendover.svg');
    }

.acceptcompletion {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/acceptcompletion.svg');
    float: none;
    background-color: transparent;
    margin-top: 14px;
}

    .acceptcompletion:hover {
        background-image: url('/images/buttons/completedover.svg');
    }

.acceptcompletionbuyer {
    width: 180px;
    height: 36px;
    background-image: url('/images/buttons/accepttrans.svg');
    float: none;
    background-color: transparent;
    margin-top: 14px;
}

    .acceptcompletionbuyer:hover {
        background-image: url('/images/buttons/bigtickhover.svg');
    }

.confirmpaymentbutton {
    margin-top:20px;
    width: 170px;
    height: 36px;
    background-image: url('/images/confirmpaymentbutton.svg');
    float: none;
    background-color: transparent;
    margin-bottom:5px;
}

    .confirmpaymentbutton:hover {
        background-image: url('/images/bankinghover.svg');
    }

.businesbankingbutton {
    width: 170px;
    height: 36px;
    background-image: url('/images/businessbanking.svg');
    float: none;
    background-color: transparent;
}

    .businesbankingbutton:hover {
        background-image: url('/images/bankinghover.svg');
    }

.personalbankingbutton {
    width: 170px;
    height: 36px;
    background-image: url('/images/personalbanking.svg');
    float: none;
    background-color: transparent;
}

    .personalbankingbutton:hover {
        background-image: url('/images/bankinghover.svg');
    }

.creditbutton {
    width: 170px;
    height: 36px;
    background-image: url('/images/creditcard.svg');
    float: none;
    background-color: transparent;
}

    .creditbutton:hover {
        background-image: url('/images/bankinghover.svg');
    }

.applyfilter {
    width: 75px;
    height: 36px;
    background-image: url('/images/apply.svg');
    float: none;
    background-color: transparent;
    margin-top: 17px;
    position: relative;
    left: 35px
}

    .applyfilter:hover {
        background-image: url('/images/applyover.svg');
    }

.edit {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/edit.svg');
    float: left;
    background-color: transparent;
    margin-top: 14px;
}

    .edit:hover {
        background-image: url('/images/buttons/editover.svg');
    }

.submitaccount {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/submitaccount.svg');
    background-color: transparent;
    margin-top: 30px;
    margin-left: 30px
}

    .submitaccount:hover {
        background-image: url('/images/buttons/submitaccountHOVER.svg');
    }

.contact {
    position: relative;
    top: 7px;
    left: 5px;
    width: 80px;
    height: 24px;
    background-image: url('/images/contact.svg');
    background-color: transparent;
}

    .contact:hover {
        background-image: url('/images/contactover.svg');
    }

.helpicon {
    width: 14px;
    height: 14px;
    position: relative;
    top: -3px;
}

.helpiconlist {
    top: -4px;
}


.login {
    position: relative;
    left: 0;
    top: 0;
    float: left;
    margin-right: 10px;
    width: 80px;
    height: 24px;
    background-image: url('/images/login.svg');
    background-color: transparent;
}

    .login:hover {
        background-image: url('/images/loginover.svg');
    }

.editaccount {
    background-image: url('/images/editaccount.svg');
    background-color: transparent;
    width: 64px;
    height: 33px;
    border-style: unset;
}

    .editaccount:hover {
        background-image: url('/images/editaccountHOVER.svg');
    }


.edit3 {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/edit3.svg');
    background-color: transparent;
    margin-top: 14px;
}

    .edit3:hover {
        background-image: url('/images/buttons/editover.svg');
    }

.resendreminder {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/resend.svg');
    background-color: transparent;
    margin-top: 14px;
}

    .resendreminder:hover {
        background-image: url('/images/buttons/resendover.svg');
    }

.editsubscription {
    width: 140px;
    height: 37px;
    background-image: url('/images/buttons/editsubscription2.svg');
    background-color: transparent;
    margin-top: 14px;
}

    .editsubscription:hover {
        background-image: url('/images/buttons/editsubscription2hover.svg');
    }

.buynow {
    width: 100px;
    height: 25px;
    background-image: url('/images/buttons/buynow.svg');
    background-color: transparent;
    border-style: unset;
}

    .buynow:hover {
        background-image: url('/images/buttons/buynowhover.svg');
    }

.edit2 {
    width: 150px;
    height: 36px;
    background-image: url('/images/editround.svg');
    background-color: transparent;
    margin-top: 14px;
    float: right;
}

    .edit2:hover {
        background-image: url('/images/editroundover.svg');
    }

.continuebutton {
    width: 100px;
    height: 36px;
    background-image: url('/images/buttons/continuebutton.svg');
    background-color: transparent;
    margin-top: 14px;
}

    .continuebutton:hover {
        background-image: url('/images/buttons/continuebuttonhover.svg');
    }

.delete {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/delete.svg');
    float: left;
    background-color: transparent;
}

    .delete:hover {
        background-image: url('/images/buttons/deleteover.svg');
    }

.saveandsend {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/saveandsend.svg');
    float: left;
    margin-right: 20px;
    margin-bottom: 15px;
    background-color: transparent;
}

    .saveandsend:hover {
        background-image: url('/images/buttons/saveandsendover.svg');
    }

.saveandsendbuyer {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/savesendtobuyer.svg');
    float: left;
    margin-right: 20px;
    margin-bottom: 15px;
    background-color: transparent;
}

    .saveandsendbuyer:hover {
        background-image: url('/images/buttons/saveandsendover.svg');
    }

.acceptbutton {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/acceptquote.svg');
    float: left;
    margin-top: 14px;
    margin-right: 20px;
    background-color: transparent;
}

    .acceptbutton:hover {
        background-image: url('/images/buttons/completedover.svg');
    }

.declinebutton {
    width: 150px;
    height: 36px;
    margin-top: 14px;
    background-image: url('/images/buttons/declinebutton.svg');
    float: left;
    margin-bottom: 15px;
    background-color: transparent;
}

    .declinebutton:hover {
        background-image: url('/images/buttons/declineover.svg');
    }

.chatwhite {
    height: 36px;
    background-image: url('/images/buttons/chatwhite.svg');
    margin-bottom: 13px;
    background-color: transparent;
    top: 0;
    left: 47px
}

.save {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/save.svg');
    float: left;
    margin-bottom: 20px;
    margin-right: 20px;
    background-color: transparent;
    margin-top: 14px;
}

    .save:hover {
        background-image: url('/images/buttons/saveover.svg');
    }

.savemyaccount {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/save.svg');
    margin-bottom: 5px;
    background-color: transparent;
    margin-top: 5px;
    border: none;
    position: relative;
    left: 75px;
    display: none;
}

    .savemyaccount:hover {
        background-image: url('/images/buttons/saveover.svg');
    }

.submit {
    width: 150px;
    height: 36px;
    background-image: url('/images/submit.svg');
    margin-bottom: 5px;
    background-color: transparent;
    margin-top: 14px;
    float: none;
}

    .submit:hover {
        background-image: url('/images/submitover.svg');
        float: none;
    }

.createaccount {
    width: 170px;
    height: 32px;
    background-image: url('/images/buttons/createaccount.svg');
    margin-bottom: 20px;
    background-color: transparent;
    margin-top: 14px;
    float: none;
}

    .createaccount:hover {
        opacity: .5
    }

.startnow {
    width: 130px;
    height: 36px;
    background-image: url('/images/buttons/startnow.svg');
    margin-bottom: 20px;
    background-color: transparent;
    margin-top: 14px;
    float: none;
}

    .startnow:hover {
        opacity: .5
    }

.gotoyouraccount {
    width: 170px;
    height: 36px;
    background-image: url('/images/buttons/gotoyouraccount.svg');
    margin-bottom: 20px;
    background-color: transparent;
    margin-top: 14px;
    float: none;
}

    .gotoyouraccount:hover {
        opacity: .5
    }

.verifybutton {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/verify.svg');
    margin-bottom: 20px;
    background-color: transparent;
    margin-top: 14px;
    float: none;
}

    .verifybutton:hover {
        opacity: .5
    }

.verifyaccount {
    width: 160px;
    height: 32px;
    background-image: url('/images/buttons/verifyaccount.svg');
    margin-bottom: 20px;
    background-color: transparent;
    margin-top: 14px;
    float: none;
}

    .verifyaccount:hover {
        opacity: .5
    }

.export {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/export.svg');
    margin-bottom: 20px;
    background-color: transparent;
    margin-top: 18px;
    float: none;
}

    .export:hover {
        background-image: url('/images/buttons/exportover.svg');
        float: none;
    }

.gosubscriptionagain {
    width: 101px;
    height: 36px;
    background-image: url('/images/TryAgainbutton.svg');
    float: left;
    margin-bottom: 20px;
    margin-right: 20px;
    background-color: transparent;
    margin-top: 14px;
}

    .gosubscriptionagain:hover {
        background-image: url('/images/TryAgainhover.svg');
    }

.godash {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/gotodashboard.svg');
    float: left;
    margin-bottom: 20px;
    margin-right: 20px;
    background-color: transparent;
    margin-top: 14px;
}

    .godash:hover {
        background-image: url('/images/buttons/gotodashboardhover.svg');
    }

.goaccess {
    width: 170px;
    height: 36px;
    background-image: url('/images/goaccess.svg');
    float: left;
    margin-bottom: 20px;
    margin-right: 20px;
    background-color: transparent;
    margin-top: 14px;
}

    .goaccess:hover {
        background-image: url('/images/goaccessover.svg');
    }

.sendratings {
    width: 150px;
    height: 36px;
    background-image: url('/images/buttons/sendratings.svg');
    float: left;
    margin-bottom: 20px;
    margin-right: 20px;
    background-color: transparent;
    margin-top: 14px;
}

    .sendratings:hover {
        background-image: url('/images/buttons/sendratingshover.svg');
    }

.back {
    background-image: url('/images/back.svg');
    float: left;
    margin-right: 20px;
    margin-bottom: 5px !important;
    background-color: transparent;
    width: 91px;
    height: 36px;
}

    .back:hover {
        background-image: url('/images/backover.svg');
    }

.financenow {
    background-image: url('/images/FinanceNowbutton.svg');
    margin: 0 auto;
    margin-bottom: 10px;
    margin-top: 5px;
    background-color: transparent;
    width: 150px;
    height: 36px;
    float: unset;
}

    .financenow:hover {
        background-image: url('/images/FinanceNowbuttonhover.svg');
    }

.nextsvg {
    background-image: url('/images/next.svg');
    float: left;
    margin-bottom: 10px;
    background-color: transparent;
    width: 91px;
    height: 36px;
}

    .nextsvg:hover {
        background-image: url('/images/nextover.svg');
    }

.phone {
    background-image: url('/images/phone.svg');
    background-color: transparent;
    width: 34px;
    height: 34px;
    border: none;
    margin-top: 35px
}

    .phone:hover {
        background-image: url('/images/phoneover.svg');
    }

.phonechat {
    background-image: url('/images/phonechat.svg');
    background-color: transparent;
    width: 34px;
    height: 34px;
    border: none;
    position: relative;
    top: -2px;
}

    .phonechat:hover {
        background-image: url('/images/phoneoverchat2.svg');
    }

.sendchat {
    background-image: url('/images/buttons/sendchat.svg');
    background-color: transparent;
    width: 36px;
    height: 36px;
    border: none;
    position: relative;
    top: 15px;
    float: right;
    right: 21px
}

    .sendchat:hover {
        background-image: url('/images/buttons/sendoverchat.svg');
    }

.completedbutton {
    background-image: url('/images/buttons/completed.svg');
    background-color: transparent;
    width: 150px;
    height: 36px;
    border: none;
    margin-top: 14px;
}

    .completedbutton:hover {
        background-image: url('/images/buttons/completedover.svg');
    }

.itembutton {
    background-image: url('/images/buttons/itemquotebutton.svg');
    background-color: transparent;
    width: 155px;
    height: 36px;
    border: none;
}

    .itembutton:hover {
        background-image: url('/images/buttons/itemquotebuttonhover.svg');
    }

.servicebutton {
    background-image: url('/images/buttons/servicequotebutton.svg');
    background-color: transparent;
    width: 155px;
    height: 36px;
    border: none;
}

    .servicebutton:hover {
        background-image: url('/images/buttons/servicequotebuttonhover.svg');
    }

.addstage {
    background-image: url('/images/buttons/addstage.svg');
    background-color: transparent;
    width: 150px;
    height: 36px;
    border: none;
    margin-top: 14px;
    float: right
}

    .addstage:hover {
        background-image: url('/images/buttons/addstageover.svg');
    }

::-webkit-input-placeholder {
    text-align: left;
    font-style: italic;
    font-size: 14px;
    color: #CCCCCC
}

:-moz-placeholder { /* Firefox 18- */
    text-align: left;
    font-style: italic;
    font-size: 14px;
    color: #CCCCCC
}

::-moz-placeholder { /* Firefox 19+ */
    text-align: left;
    font-style: italic;
    font-size: 14px;
    color: #CCCCCC
}

:-ms-input-placeholder {
    text-align: left;
    font-style: italic;
    font-size: 14px;
    color: #CCCCCC
}

.onoffswitch-label {
    margin-left: initial;
}

/*#completiondate input[type="radio"] {
    float: initial;
    margin-left: 0;
}*/



label[for="excludegst"], label[for="MainContent_RememberMe"], label[for="RememberMe"] {
    margin-left: unset;
    display: inline-block;
}


#completiondate label {
    margin-top: 2px;
    width: 300px
}

*/

.pageheader {
    text-align: center;
    width: 320px;
    margin: 0 auto;
    margin-top: 25px;
    font-weight: 400;
    padding-top: 12px;
    padding-bottom: 12px;
    font-size: 18px;
}

#AjaxFileUpload1_FileStatusContainer {
    margin-top: 28px;
}

#AjaxFileUpload1_ctl00 {
    overflow: unset;
}

#AjaxFileUpload1_QueueContainer {
    margin-top: 58px !important;
}

.navbar {
    min-height: 16px;
}

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border: none;
}

.navbar-nav {
    margin: auto;
    background: white;
    width: 247px;
    position: relative;
    left: 36px;
    font-size: 16px;
    font-family: Barlow;
    font-weight: 300;
    background-color: #A0A0A0
}

    .navbar-nav > li {
        padding-top: 11px;
        padding-bottom: 11px;
    }

.navcontainer {
    width: 100%;
    padding: 0
}

#navbackground {
    position: fixed;
    padding: 0;
    margin: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,1);
}

.newpromise:Hover {
    filter: unset;
    text-decoration: none;
    background-color: #EEEEEE;
    color: black
}

.quotetotal {
    font-weight: 300
}

.quotetotalmetrics {
    font-weight: 500;
    font-size: 15px;
    position: relative;
    top: 12px;
}

.draft {
    background-color: #DDA046;
    color: white;
    border: 2px solid #DDA046;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.inprogress {
    background-color: #689A89;
    color: white;
    border: 2px solid #689A89;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.editednotsent {
    background-color: #86C2DB;
    color: white;
    border: 2px solid #86C2DB;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.quoted {
    background-color: #3385A6;
    color: white;
    border: 1px solid #3385A6;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.folderneutral {
    background-color: #2B2D42;
    color: white;
    border: 2px solid #2B2D42;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.addstageheader {
    color: #003059;
    border: 1px solid #707070;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
    margin-top: 13px;
}

.supersededquote {
    background-color: #7F5FA2;
    color: white;
    border: 2px solid #7F5FA2;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.expiredquote {
    background-color: #FF8900;
    color: white;
    border: 2px solid #FF8900;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.paidclosed {
    background-color: #A8A8A8;
    color: white;
    border: 2px solid #A8A8A8;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.completedawaitingapproval {
    background-color: #D56630;
    color: white;
    border: 2px solid #D56630;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.completed {
    background-color: #D56630;
    color: white;
    border: 2px solid #D56630;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
    padding-bottom: 0;
}

.completionnotified {
    background-color: #D56630;
    color: white;
    border: 2px solid #D56630;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
    width: 280px;
    position: relative;
    left: 10px;
}

.declined {
    background-color: #A12F26;
    color: white;
    border: 2px solid #A12F26;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.completedawaitingapproval {
    background-color: #D56630;
    color: white;
    border: 2px solid #D56630;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.approved {
    background-color: #689A89;
    color: white;
    border: 2px solid #689A89;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.variationapproved {
    background-color: #689A89;
    color: white;
    border: 2px solid #689A89;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
    width: 250px;
    position: relative;
    left: 25px;
}

.variationquoted {
    background-color: #3385A6;
    color: white;
    border: 2px solid #3385A6;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
    width: 250px;
    position: relative;
    left: 25px;
}

.stagedraft {
    background-color: #DDA046;
    color: white;
    border: 2px solid #DDA046;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
    width: 280px;
    position: relative;
    left: 10px;
}

.paid {
    background-color: #707070;
    color: white;
    border: 2px solid #707070;
    text-align: left;
    padding-left: 5px;
    font-size: 17px;
}

.buttonadvice {
    font-family: Barlow;
    font-weight: 400;
    color: #707070;
    margin-top: 15px;
    font-size: 11px;
}

.newpromise2 {
    margin-top: 20px;
    padding-top: 13px;
}

    .newpromise2:Hover {
        filter: unset;
        text-decoration: none;
        background-color: white;
        color: #707070;
    }

.edittitle {
    margin-bottom: 12px;
}

.hrquote {
    margin-top: 2px;
    margin-bottom: 6px;
}

#needtoverifymodal, #needbankaccount {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -90px;
    margin-left: -150px;
    width: 300px;
    height: 180px;
    max-height: 180px;
    font-family: 'Barlow';
    font-size: 17px;
    background-color: white;
    padding-right: 0 !important;
}

#confirm, #confirm2, #subscriptionmodal, #cancelmodal, #xerounlinkmodal, #needbankaccountetc {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -68px;
    margin-left: -150px;
    width: 300px;
    height: 136px;
    font-family: 'Barlow';
    font-size: 17px;
    background-color: white;
    padding-right: 0 !important;
}

#notverified {
    margin: 0 auto;
    margin-top: 19px;
    top: 50%;
    width: 300px;
    height: 136px;
    font-family: 'Barlow';
    font-size: 17px;
    background-color: white;
    padding-right: 0 !important;
}

.homenotverified{
    width:320px !important;
}

#confirmcompletemodal, #deleteConfirmationModal, #confirmresendmodal {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -80px;
    margin-left: -150px;
    width: 300px;
    height: 160px;
    max-height: 160px;
    font-family: 'Barlow';
    font-size: 17px;
    background-color: white;
    padding-right: 0 !important;
}

#noquotedetails {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -93px;
    margin-left: -150px;
    width: 300px;
    height: 186px;
    max-height: 186px;
    font-family: 'Barlow';
    font-size: 17px;
    background-color: white;
    padding-right: 0 !important;
}

#baddatemodal {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -83px;
    margin-left: -150px;
    width: 300px;
    height: 170px;
    max-height: 166px;
    font-family: 'Barlow';
    font-size: 17px;
    background-color: white;
    padding-right: 0 !important;
}


#confirmawaitingcomplete {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -140px;
    margin-left: -150px;
    width: 300px;
    height: 280px;
    max-height: 280px;
    font-family: 'Barlow';
    font-size: 17px;
    background-color: white;
    padding-right: 0 !important;
}

.editlink {
    font-weight: 600;
    text-decoration: underline
}

.modal-footer {
    border-top: none
}

.modalbutton1 {
    width: 100px;
    background-color: #EFF4F2;
    border: 1px solid #5D8F7E;
    color: #5D8F7E;
}

    .modalbutton1:hover {
        width: 100px;
        background-color: #5D8F7E;
        border: 1px solid #5D8F7E;
        color: white;
    }

.modalbutton2 {
    width: 100px;
    background-color: #F4E9E8;
    border: 1px solid #91251C;
    color: #91251C;
}

    .modalbutton2:hover {
        width: 100px;
        background-color: #91251C;
        border: 1px solid #91251C;
        color: white;
    }

.modal-body {
    padding-bottom: 0;
}

.loggedas {
    width: 320px;
    margin: 0 auto;
    text-align: center;
    margin-top: 15px;
    margin-bottom: 15px;
}

.level1nav, .level1nava {
    background-color: white;
    border: 1px solid #707070;
    border-radius: 5px;
    margin-bottom: 4px;
}

.level2nav {
    background-color: #003059;
    border: 1px solid #003059;
    border-radius: 5px;
    margin-bottom: 4px;
}

.navicon {
    float: left;
}

.nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
    background-color: unset;
}

.level1nav:Hover, .level2nav:Hover {
    filter: brightness(80%);
}

.level2navfilter:Hover {
    filter: brightness(100%);
}

.dashboardbuttonmetric {
    width: 320px;
    color: white;
    border-radius: 5px;
    margin-top: 5px;
    animation-duration: 3s;
    animation-name: fadeIn;
    min-height: 50px;
    pointer-events: none;
    padding-left: 5px;
}

#PieChart2 {
    width: 200px !important;
    height: 200px !important;
}

#metrichover {
    display: none;
    text-decoration: none;
    z-index: 2001;
    top: 39px;
    cursor: pointer;
    color: #707070;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    padding-right: 293px;
    font-size: 13px
}

#metricdiv {
    z-index: 1;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: -370px;
    right: 0;
    height: 55px;
    width: 100px;
}

    #metricdiv:hover + #metrichover {
        display: block;
    }

#dashboardover {
    display: none;
    text-decoration: none;
    z-index: 2001;
    top: 34px;
    cursor: pointer;
    color: #707070;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    padding-right: 148px;
    font-size: 13px
}

#dashboardicon:hover + #dashboardover {
    display: block;
}

#chatover {
    display: none;
    text-decoration: none;
    z-index: 2001;
    top: 34px;
    cursor: pointer;
    color: #707070;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    font-size: 13px
}

#chaticon:hover + #chatover {
    display: block;
}

.chat:hover + #chatover {
    display: block;
}

#searchover {
    display: none;
    text-decoration: none;
    z-index: 2001;
    top: 34px;
    cursor: pointer;
    color: #707070;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    font-size: 13px;
    padding-left: 148px
}

#searchicon:hover + #searchover {
    display: block;
}

#logoover {
    display: none;
    text-decoration: none;
    z-index: 2001;
    top: 34px;
    cursor: pointer;
    color: #707070;
    position: absolute;
    left: -422px;
    right: 0;
    margin: auto;
    text-align: center;
    font-size: 13px;
    padding-left: 148px
}

#logo:hover + #logoover {
    display: block;
}

#menuover {
    display: none;
    text-decoration: none;
    z-index: 2001;
    top: 34px;
    cursor: pointer;
    color: #707070;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    font-size: 13px;
    padding-left: 296px
}

#mainmenu:hover + #menuover {
    display: block;
}

#sortover {
    display: none;
    text-decoration: none;
    z-index: 2001;
    top: 25px;
    cursor: pointer;
    color: #707070;
    position: absolute;
    margin: auto;
    text-align: center;
    font-size: 13px;
    left: -1px;
}

#sortmenu:hover + #sortover {
    display: block;
}

#mainquotediv2 {
    padding-right: 0;
    padding-left: 0;
}

#introbubble1a {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 0px;
    top: 211px;
    height: 38px;
}

#introbubble1b {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 0px;
    top: 211px;
    height: 38px;
}




#introbubble2 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 0px;
    top: 215px;
    height: 41px;
}

#introbubble3 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 0px;
    top: 215px;
    height: 41px;
}

#introbubble3a {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 0px;
    top: 165px;
    height: 41px;
}

#introbubble4 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 113px;
    top: 65px;
    height: 34px;
}

#introbubble5 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 76px;
    top: 8px;
    height: 34px;
}

#introbubble6 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 149px;
    top: 38px;
    height: 40px;
}

#introbubble7 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 0px;
    top: 38px;
    height: 40px;
}

#introbubble8 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: -144px;
    top: 38px;
    height: 40px;
}

#introbubble9 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: -75px;
    top: 7px;
    height: 53px;
}

#introbubble10 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 0px;
    top: 227px;
    height: 91px;
}

#introbubble11 {
    display: none;
    z-index: 2001;
    position: absolute;
    left: -8px;
    top: 67px;
    height: 34px;
}

#dummyquote {
    display: none;
    z-index: 2001;
    position: absolute;
    left: 0px;
    top: 227px;
    height: 50px;
}

#chatModal, #chatDashboardModal {
    width: 370px;
    max-width: 370px;
    max-height: 100%;
    padding-right: 0 !important;
    margin-top: 0;
    background-color: rgb(0 0 0 / 0%);
}

.chatdialog {
    width: 370px;
    margin: 0 auto;
}

.chatbody {
    padding: 5px;
    padding-right: 9px;
    overflow-x: hidden;
}

.chatheader {
    padding: 10px;
    background-color: #3385A6;
    border-bottom: 0;
    padding-left: 12px;
    padding-right: 28px;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.chatheaderinprogress {
    padding: 10px;
    background-color: #689A89;
    border-bottom: 0;
    padding-left: 12px;
    padding-right: 28px;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.chatheadercompleted {
    padding: 10px;
    background-color: #D56630;
    border-bottom: 0;
    padding-left: 12px;
    padding-right: 28px;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.chatheaderpaid {
    padding: 10px;
    background-color: #A8A8A8;
    border-bottom: 0;
    padding-left: 12px;
    padding-right: 28px;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.chatheaderdeclined {
    padding: 10px;
    background-color: #A12F26;
    border-bottom: 0;
    padding-left: 12px;
    padding-right: 28px;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.chatheaderexpired {
    padding: 10px;
    background-color: #FF8900;
    border-bottom: 0;
    padding-left: 12px;
    padding-right: 28px;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.chatheaderexpired {
    padding: 10px;
    background-color: #7F5FA2;
    border-bottom: 0;
    padding-left: 12px;
    padding-right: 28px;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.chatheaderdashboard {
    background-color: #F8F8F8
}

.chatclose {
    color: white;
    font-size: 50px;
    font-family: 'Barlow Semi Condensed', sans-serif;
    font-weight: 100;
    margin-top: -14px !important;
    margin-left: 8px;
    text-shadow: none;
}

.contentchat {
    border: none
}

.expandedchat {
    width: 202px;
    color: white;
    position: initial;
    font-size: 17px;
}

.quotetypeonbuttonchat {
    font-weight: 400;
    font-size: 10px;
    color: white;
}

.chatfooter {
    background-color: white
}

.chatcontent {
    left: 5px;
    padding-right: 23px;
    width: 86.66666667%;
}

.hiddenrow {
    display: none
}

#addrow {
    cursor: pointer
}

    #addrow:hover {
        text-decoration: underline
    }

.messagecount {
    display: block;
    height: 12px;
    width: 12px;
    line-height: 12px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    background-color: #E31111;
    color: white;
    text-align: center;
    font-size: 10px;
    position: relative;
    left: 74px;
    top: 7px;
    z-index: 5;
}

#messcount {
    z-index: 2;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 18px;
    right: 0;
    top: 2px;
    cursor: pointer;
    display: block;
    height: 12px;
    width: 12px;
    line-height: 12px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    background-color: #E31111;
    color: white;
    text-align: center;
    font-size: 10px;
    z-index: 5;
    top: 12px;
    font-weight: 500;
}

.modalbuttonconfirmcomplete {
    width: 120px;
    height: 40px;
    line-height: 1em;
}

    .modalbuttonconfirmcomplete:hover {
        width: 120px;
    }

.dashlink, .dashlink:hover {
    color: white;
    padding: 10px 15px;
    text-decoration: none
}

.regocheckbox {
    margin-left: unset
}

.regoformfield, .smallregoformfield, .smallregoformfieldmobile {
    padding-top: 0;
    padding-bottom: 0;
    border-width: 1px;
    border-color: #747474;
    border-radius: 6px;
    border: 1px solid #d2d2d2;
    font-size: 13px !important;
    color: #747474 !important;
    font-weight: 300 !important;
    padding: 8px 15px;
    float: none;
    width: 100%;
    margin-right: 0;
    box-sizing: border-box;
    margin-top: 5px
}

.smallregoformfield {
    width: 85px;
    padding-left: 3px;
    padding-right: 3px;
    margin-right: 5px;
}

.smallregoformfieldmobile {
    width: 128px;
    padding-left: 3px;
    padding-right: 3px;
}

#attachments, #createpdfbutton, .createpdfbutton {
    text-decoration: underline;
}

label[for="MainContent_gstregistered_0"] {
    margin-left: unset;
    display: inline-block;
    position: relative;
    top: 2px;
}

label[for="MainContent_gstregistered_1"] {
    margin-left: unset;
    display: inline-block;
    position: relative;
    top: 2px;
}

label[for="MainContent_soleorlimited_0"] {
    margin-left: unset;
    display: inline-block;
    position: relative;
    top: 2px;
}

label[for="MainContent_soleorlimited_1"] {
    margin-left: unset;
    display: inline-block;
    position: relative;
    top: 2px;
}

label[for="MainContent_soleorlimited_2"] {
    margin-left: unset;
    display: inline-block;
    position: relative;
    top: 2px;
}

label[for="MainContent_businessorindiv_0"] {
    margin-left: unset;
    display: inline-block;
    position: relative;
    top: 2px;
}

label[for="MainContent_businessorindiv_1"] {
    margin-left: unset;
    display: inline-block;
    position: relative;
    top: 2px;
}

.accountcontainer {
    width: 320px;
    padding-left: 0;
    padding-right: 0;
}

.rateperson {
    position: absolute;
    left: -30px;
    top: 6px;
    color: red;
    font-size: 12px;
    font-weight: 500
}

@media (max-width:991px) {
    .rateperson {
        position: absolute;
        left: -30px;
        top: 2px;
        color: red;
        font-size: 12px;
        font-weight: 500
    }
}

#clientphone, #supplierphone {
    color: #003059 !important;
}

#maindiv {
    overflow-x: hidden
}

.blink_me {
    animation: blinker 1s linear infinite;
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}

.navbar-fixed-top {
    border-bottom: none
}

.Shortprojname {
    height: 30px;
    overflow: hidden;
}


#loader {
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 5000;
    top: 0;
    left: 0;
    float: left;
    text-align: center;
    padding-top: 25%;
    opacity: 0.7;
    background: url('../images/loading.gif') 50% 50% no-repeat rgb(0,0,0);
}


@supports (-webkit-touch-callout: none) {
    .loadingtext::before {
        font-size: 30px;
        font-weight: 500;
        color: #4D7190;
        content: "Loading";
        top: 50%;
        left: 50%;
        transform: translateY(-50%);
        transform: translateX(-50%);
        position: absolute;
    }
}

.removeattachbutton {
    color: #00AEEF;
    font-weight: 500;
    float: right;
    font-size: 11px;
    clear: both;
    text-decoration: underline;
    line-height: 24px;
}

.removeallattachbutton {
    margin: 0 auto;
    color: #00AEEF;
    font-weight: 500;
    font-size: 11px;
    clear: both;
    text-decoration: underline;
    line-height: 24px;
    margin-top: 5px;
}

#closec {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: white;
    font-family: 'Barlow Semi Condensed', sans-serif;
    font-weight: 100;
    margin-left: 8px;
    text-shadow: none;
    position: relative;
    top: -10px;
    height: 18px;
    width: 18px;
}

.filterbutton {
    color: white;
    padding: 0 15px;
}

.filtercheckbox {
    accent-color: #003059;
}

.stripe {
    width: 200px;
    margin-top: 20px;
    margin-bottom: 5px;
}


.searchwrap {
    line-height: 22px;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: -147px;
    right: 0;
    width: 43px
}

    .searchwrap #searchinputbox {
        position: absolute;
        width: 0px;
        float: Left;
        margin-left: 132px;
        -webkit-transition: all 0.7s ease-in-out;
        -moz-transition: all 0.7s ease-in-out;
        -o-transition: all 0.7s ease-in-out;
        transition: all 0.7s ease-in-out;
        height: 40px;
        line-height: 18px;
        padding: 0 2px 0 2px;
        border-radius: 1px;
        z-index: 2050;
        visibility: hidden;
        top: 5px;
    }



.searchinternal {
    z-index: 2051;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 147px;
    right: 0;
    top: 3px;
    cursor: pointer;
    height: 43px;
    display: none
}

.variationprojectfolder {
    position: relative;
    width: 300px;
    left: 10px;
}

.datepicker-orient-bottom {
    z-index: 2000 !important;
}

.folderneutral:hover {
    background-color: #2B2D42;
    color: white;
    border: 2px solid #2B2D42;
}

#clienttabsup:hover, #clienttabsup:active {
    filter: opacity(1);
    z-index: 3;
}
#chatModal .modal-dialog, #chatDashboardModal .modal-dialog {
    transform: translate(0, 0) !important;
}
.stephead {
    margin-bottom: 16px;
    margin-top: 13px
}
.draftstephead{
    margin-top:9px
}
.heading-bar {
    text-align: center;
    position: relative;
}

/* The wrapper is sized to the H2 only and stays centered */
.title-wrap {
    display: inline-block;
    position: relative;
}

/* Button sits just to the right of the title, without affecting layout */
.title-action {
    position: absolute;
    left: 100%; /* anchor to the right edge of the title */
    top: 50%;
    transform: translateY(-50%);
    margin-left: 18px; /* tweak this spacing as you like */
    padding: 0;
    border: 0;
    background: none;
}