/****************************FONTS START************************************/
@font-face {
    font-family: Lato;
    src: url('fonts/lato-regular-webfont.eot');
    src: url('fonts/lato-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/lato-regular-webfont.woff') format('woff'), url('fonts/lato-regular-webfont.ttf') format('truetype'), url('fonts/lato-regular-webfont.svg#latoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: LatoBold;
    src: url('fonts/lato-bold-webfont.eot');
    src: url('fonts/lato-bold-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/lato-bold-webfont.woff') format('woff'), url('fonts/lato-bold-webfont.ttf') format('truetype'), url('fonts/lato-bold-webfont.svg#latobold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: LatoItalic;
    src: url('fonts/lato-italic-webfont.eot');
    src: url('fonts/lato-italic-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/lato-italic-webfont.woff') format('woff'), url('fonts/lato-italic-webfont.ttf') format('truetype'), url('fonts/lato-italic-webfont.svg#latoitalic') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: LatoBoldItalic;
    src: url('fonts/lato-bolditalic-webfont.eot');
    src: url('fonts/lato-bolditalic-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/lato-bolditalic-webfont.woff') format('woff'), url('fonts/lato-bolditalic-webfont.ttf') format('truetype'), url('fonts/lato-bolditalic-webfont.svg#latobold_italic') format('svg');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: LatoLight;
    src: url('fonts/lato-light-webfont.eot');
    src: url('fonts/lato-light-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/lato-light-webfont.woff') format('woff'), url('fonts/lato-light-webfont.ttf') format('truetype'), url('fonts/lato-light-webfont.svg#latolight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: LatoLightItalic;
    src: url('fonts/lato-lightitalic-webfont.eot');
    src: url('fonts/lato-lightitalic-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/lato-lightitalic-webfont.woff') format('woff'), url('fonts/lato-lightitalic-webfont.ttf') format('truetype'), url('fonts/lato-lightitalic-webfont.svg#latolight_italic') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: LatoBlack;
    src: url('fonts/lato-black-webfont.eot');
    src: url('fonts/lato-black-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/lato-black-webfont.woff') format('woff'), url('fonts/lato-black-webfont.ttf') format('truetype'), url('fonts/lato-black-webfont.svg#latoblack') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: LatoBlackItalic;
    src: url('fonts/lato-blackitalic-webfont.eot');
    src: url('fonts/lato-blackitalic-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/lato-blackitalic-webfont.woff') format('woff'), url('fonts/lato-blackitalic-webfont.ttf') format('truetype'), url('fonts/lato-blackitalic-webfont.svg#latoblack_italic') format('svg');
    font-weight: normal;
    font-style: italic;
}
/****************************FONTS END************************************/
/****************************GLOBAL START************************************/
html, * {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

body {
    font-family: Lato, Arial, sans-serif;
}

input[type="text"],
input[type="password"],
input[type="search"],
input[type="number"] {
    min-width: 184px;
    height: 26px;
    border: 1px solid #b8c3c9;
    padding: 0px 8px 0px 8px;
    font-size: 13px;
    /*line-height:26px;*/
    line-height: unset;
    font-family: sans-serif, Arial;
    color: #454c50;
}

input[type="search"] {
    display: inline-block;
    margin: 0px 0px 0px 3px;
}

input[type="text"][disabled],
input[type="password"][disabled],
input[type="text"][readonly],
input[type="password"][readonly] {
    background-color: #F0F0F0;
}

input[type="text"]:focus,
input[type="password"]:focus {
    -webkit-box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.1);
    -o-box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.1);
}

input[type="text"].success,
input[type="password"].success {
    border: 1px solid #90b05e;
    background-color: #fafff2;
    color: #7b9c48;
}

input[type="text"].error,
input[type="password"].error {
    border: 1px solid #824040;
    background-color: #fff2f2;
    color: #824040;
}

input[type="text"].datepicker {
    min-width: 172px;
    padding: 0px 20px 0px 8px;
    background: url('../images/textboxCalender.png') no-repeat center right 5px;
}

input[type="text"].datepickerWithDay {
    min-width: 172px;
    padding: 0px 26px 0px 8px;
    background: url('../images/textboxCalender.png') no-repeat center right 5px;
}

input[type="text"].datepickerWithDay1 {
    min-width: 172px;
    padding: 0px 20px 0px 8px;
    background: url('../images/textboxCalender.png') no-repeat center right 5px;
}

input[type="text"].datepickerDisablePastDates {
    min-width: 172px;
    padding: 0px 20px 0px 8px;
    background: url('../images/textboxCalender.png') no-repeat center right 5px;
}

input[type="text"].timepicker {
    min-width: 172px;
    padding: 0px 20px 0px 8px;
}

input[type="text"].timepickerWithAMPM {
    min-width: 172px;
    padding: 0px 20px 0px 8px;
    background: url('../images/textboxWatch.png') no-repeat center right 5px;
}

input[type="text"].currency {
    min-width: 172px;
    padding: 0px 8px 0px 20px;
    background: url('../images/textboxCurrency.png') no-repeat center left 5px;
}

.filetype1 {
    padding: 0px 0px 0px 20px;
    background: url('../images/folder.png') no-repeat center left;
}

.filetype2 {
    padding: 0px 0px 0px 20px;
    background: url('../images/file.png') no-repeat center left;
}

textarea {
    min-width: 184px;
    height: 70px;
    border: 1px solid #b8c3c9;
    padding: 0px 8px 0px 8px;
    font-size: 13px;
    /*line-height:26px;*/
    line-height: unset;
    font-family: sans-serif, Arial;
    color: #454c50;
    resize: vertical !important;
}

select {
    min-width: 208px;
    height: 30px;
    padding: 0px 8px 0px 8px;
    max-width: 208px;
    font-family: sans-serif, Arial;
}

.selectDiv {
    border: 1px solid #dbdbdb;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    background: #f2f4f5 url('../images/selectBackgroundGrey.png') repeat-x;
    font-size: 13px;
    line-height: 30px;
    color: #7f7f7f;
}

    .selectDiv.active {
        border: 1px solid #b8c3c9;
        background-image: none;
        background-color: #f3f5f6;
        -webkit-box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.1);
        -moz-box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.1);
        -o-box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.1);
        box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.1);
    }

.selectDivInner {
    padding: 0px 28px 0px 8px;
    background: url('../images/selectArrow.png') no-repeat center right 8px;
    cursor: default;
}

.selectDivDropdown {
    max-height: 200px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    -webkit-box-shadow: 0px 2px 5px 2px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 2px 5px 2px rgba(0,0,0,0.1);
    -o-box-shadow: 0px 2px 5px 2px rgba(0,0,0,0.1);
    box-shadow: 0px 2px 5px 2px rgba(0,0,0,0.1);
    background-color: #ffffff;
    overflow: auto;
    cursor: default;
    z-index: 1000;
}

    .selectDivDropdown div {
        padding: 0px 8px 0px 8px;
        font-family: Lato, Arial, sans-serif;
        font-size: 12px;
        color: #b8b8b8;
    }

        .selectDivDropdown div:hover {
            background-color: #f2f2f2;
            color: #333333;
        }

#foo:checked::before,
input[type="radio"],
input[type="checkbox"] {
    position: absolute;
    clip: rect(0,0,0,0);
    clip: rect(0 0 0 0);
}

    #foo::before,
    input[type="radio"] + label,
    input[type="checkbox"] + label {
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        cursor: pointer !important;
    }

        #foo:checked,
        input[type="radio"] + label::before {
            content: url('../images/radiobuttonBackground.png');
        }

    #foo:checked,
    input[type="radio"]:checked + label::before {
        content: url('../images/radiobuttonBackgroundChecked.png');
    }

    #foo:checked,
    input[type="checkbox"] + label::before {
        content: url('../images/checkboxBackground.png');
    }

    #foo:checked,
    input[type="checkbox"]:checked + label::before {
        display: block;
        margin: -2px 3px 0px 0px;
        content: url('../images/checkboxBackgroundChecked.png');
    }

label {
    margin: 0px 2px 0px 5px;
    float: right;
    font-size: 13px;
}

input[type="button"].smallButtonBlue,
input[type="submit"].smallButtonBlue,
.smallButtonBlue {
    display: inline-block;
    min-width: 96px;
    padding: 0px 5px 0px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border-style: none;
    background: #1087e4 url('../images/smallButtonBackgroundBlue.png') repeat-x;
    font-size: 13px;
    line-height: 28px;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

    input[type="button"].smallButtonBlue:hover,
    input[type="submit"].smallButtonBlue:hover,
    .smallButtonBlue:hover {
        background: #1087e4 url('../images/smallButtonBackgroundBlueHover.png') repeat-x;
    }

    input[type="button"].smallButtonBlue:active,
    input[type="submit"].smallButtonBlue:active,
    .smallButtonBlue:active {
        background: #1087e4 url('../images/smallButtonBackgroundBlueActive.png') repeat-x;
    }

input[type="button"].largeButtonBlue,
input[type="submit"].largeButtonBlue,
.largeButtonBlue {
    display: inline-block;
    min-width: 206px;
    height: 38px;
    padding: 0px 10px 0px 10px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border-style: none;
    background: #1087e4 url('../images/largeButtonBackgroundBlue.png') repeat-x;
    font-size: 13px;
    line-height: 38px;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

    input[type="button"].largeButtonBlue:hover,
    input[type="submit"].largeButtonBlue:hover,
    .largeButtonBlue:hover {
        background: #1087e4 url('../images/largeButtonBackgroundBlueHover.png') repeat-x;
    }

    input[type="button"].largeButtonBlue:active,
    input[type="submit"].largeButtonBlue:active,
    .largeButtonBlue:active {
        background: #1087e4 url('../images/largeButtonBackgroundBlueActive.png') repeat-x;
    }

input[type="button"].smallButtonGrey,
input[type="submit"].smallButtonGrey,
.smallButtonGrey {
    display: inline-block;
    min-width: 96px;
    height: 28px;
    padding: 0px 5px 0px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid #b8c3c9;
    background: #f4f6f7 url('../images/smallButtonBackgroundGrey.png') repeat-x;
    font-size: 13px;
    line-height: 26px;
    color: #798186;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

a.smallButtonGrey {
    min-width: 94px;
    height: 26px;
}

input[type="button"].smallButtonGrey:hover,
input[type="submit"].smallButtonGrey:hover,
.smallButtonGrey:hover {
    background: #f4f6f7 url('../images/smallButtonBackgroundGreyHover.png') repeat-x;
}

input[type="button"].smallButtonGrey:active,
input[type="submit"].smallButtonGrey:active,
.smallButtonGrey:active {
    background: #f4f6f7 url('../images/smallButtonBackgroundGreyActive.png') repeat-x;
}

input[type="button"].largeButtonGrey,
input[type="submit"].largeButtonGrey,
.largeButtonGrey {
    display: inline-block;
    min-width: 206px;
    height: 38px;
    padding: 0px 10px 0px 10px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid #b8c3c9;
    background: #f4f6f7 url('../images/largeButtonBackgroundGrey.png') repeat-x;
    font-size: 13px;
    line-height: 36px;
    color: #798186;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

a.largeButtonGrey {
    min-width: 204px;
    height: 36px;
}

input[type="button"].largeButtonGrey:hover,
input[type="submit"].largeButtonGrey:hover,
.largeButtonGrey:hover {
    background: #f4f6f7 url('../images/largeButtonBackgroundGreyHover.png') repeat-x;
}

input[type="button"].largeButtonGrey:active,
input[type="submit"].largeButtonGrey:active,
.largeButtonGrey:active {
    background: #f4f6f7 url('../images/largeButtonBackgroundGreyActive.png') repeat-x;
}

.commandRibbonButton {
    display: inline-block;
    height: 20px;
    margin: 5px 0px 10px 0px;
    padding: 0px 10px 0px 10px;
    -moz-border-radius: 15px 15px 15px 15px;
    -webkit-border-radius: 15px 15px 15px 15px;
    border-radius: 15px 15px 15px 15px;
    background-color: rgba(188, 200, 209, 0.2);
    font-family: LatoBold, Arial, Sans-Serif;
    font-size: 13px;
    line-height: 20px;
    font-weight: bold;
    text-decoration: none;
    color: #627b8d;
}

    .commandRibbonButton:hover {
        -webkit-box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.1);
        -moz-box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.1);
        -o-box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.1);
        box-shadow: inset 0px 0px 3px 1px rgba(0,0,0,0.1);
        background-color: #bcc8d1;
        text-shadow: 0px 1px 1px rgba(0,0,0,0.4);
        color: #ffffff;
    }

    .commandRibbonButton img {
        margin: 0px 0px 0px 0px;
        vertical-align: middle;
    }

    .commandRibbonButton:before {
        float: left;
        width: 16px;
        height: 20px;
        margin: 0px 5px 0px 0px;
        content: '';
    }

    .commandRibbonButton.add:before {
        background: url("../images/buttonAddIcon.png") no-repeat center left;
    }

    .commandRibbonButton.serviceHistory:before {
        background: url("../images/buttonServiceRequests.png") no-repeat center left;
    }

    .commandRibbonButton.documents:before {
        background: url("../images/buttonClientDocs.png") no-repeat center left;
    }

    .commandRibbonButton.statements:before {
        background: url("../images/buttonPayslip.png") no-repeat center left;
    }

.toggle-password {
    position: absolute;
    top: 3px;
    right: -25px;
}

a {
    color: #000000;
}

    a img {
        border-style: none;
    }

h1, h2, h3, h4, h5, h6, h7 {
    font-family: LatoBold, Arial, Sans-Serif;
    font-weight: bold;
}

h1 {
    margin: 0px 0px 15px 0px;
    font-size: 30px;
    clear: both;
}

h2 {
    margin: 0px 0px 15px 0px;
    font-size: 25px;
    clear: both;
}

h3 {
    margin: 0px 0px 15px 0px;
    font-size: 20px;
    clear: both;
}

h4 {
    margin: 0px 0px 15px 0px;
    font-size: 15px;
    clear: both;
}

h5 {
    margin: 0px 0px 15px 0px;
    font-size: 10px;
    clear: both;
}

h6 {
    margin: 0px 0px 15px 0px;
    font-size: 5px;
    clear: both;
}

.formSectionHeading {
    margin: 0px 0px 15px 0px;
    border-bottom: 1px solid #85acca;
    color: #85acca;
}

p {
    margin: 0px 0px 15px 0px;
    font-family: Lato, Arial, Sans-Serif;
    font-size: 13px;
}

    p.info:before {
        display: inline-block;
        width: 20px;
        height: 20px;
        margin: -2px 5px 0px 0px;
        -moz-border-radius: 20px 20px 20px 20px;
        -webkit-border-radius: 20px 20px 20px 20px;
        border-radius: 20px 20px 20px 20px;
        background-color: #85acca;
        font-family: Cambria, Georgia, serif;
        font-size: 18px;
        line-height: 18px;
        font-weight: bold;
        text-align: center;
        vertical-align: middle;
        color: #ffffff;
        content: "i";
    }

.dashboard {
    list-style-type: none;
}

    .dashboard li {
        display: block;
        float: left;
        width: 170px;
        height: 170px;
        margin: 0px 25px 0px 0px;
        padding-top: 10px;
        border: 1px solid #F2F2F2;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        overflow: hidden;
    }

        .dashboard li:hover {
            border: 1px solid #EAEAEA;
        }

            .dashboard li:hover a {
                text-shadow: 0px 0px 1px rgba(0,0,0,0.1);
            }

                .dashboard li:hover a img {
                    max-width: 150px;
                    max-height: 100px;
                    text-align: center;
                }

                .dashboard li:hover a span {
                    background: rgb(242,246,248); /* Old browsers */
                    background: -moz-linear-gradient(top, rgba(242,246,248,1) 0%, rgba(216,225,231,1) 50%, rgba(181,198,208,1) 51%, rgba(224,239,249,1) 100%); /* FF3.6+ */
                    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(242,246,248,1)), color-stop(50%,rgba(216,225,231,1)), color-stop(51%,rgba(181,198,208,1)), color-stop(100%,rgba(224,239,249,1))); /* Chrome,Safari4+ */
                    background: -webkit-linear-gradient(top, rgba(242,246,248,1) 0%,rgba(216,225,231,1) 50%,rgba(181,198,208,1) 51%,rgba(224,239,249,1) 100%); /* Chrome10+,Safari5.1+ */
                    background: -o-linear-gradient(top, rgba(242,246,248,1) 0%,rgba(216,225,231,1) 50%,rgba(181,198,208,1) 51%,rgba(224,239,249,1) 100%); /* Opera 11.10+ */
                    background: -ms-linear-gradient(top, rgba(242,246,248,1) 0%,rgba(216,225,231,1) 50%,rgba(181,198,208,1) 51%,rgba(224,239,249,1) 100%); /* IE10+ */
                    background: linear-gradient(to bottom, rgba(242,246,248,1) 0%,rgba(216,225,231,1) 50%,rgba(181,198,208,1) 51%,rgba(224,239,249,1) 100%); /* W3C */
                    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f6f8', endColorstr='#e0eff9',GradientType=0 ); /* IE6-9 */
                }

        .dashboard li:last-child {
            margin: 0px 0px 0px 0px;
        }

        .dashboard li a {
            display: block;
            position: relative;
            width: 100%;
            height: 100%;
            font-size: 13px;
            text-align: center;
            text-decoration: none;
        }

            .dashboard li a .titleWrapper {
                position: absolute;
                left: 0px;
                bottom: 0px;
                width: 90%;
                height: 45px;
                padding: 5px 5% 0px 5%;
                background: rgb(246,248,249); /* Old browsers */
                background: -moz-linear-gradient(top, rgba(246,248,249,1) 0%, rgba(229,235,238,1) 50%, rgba(215,222,227,1) 51%, rgba(245,247,249,1) 100%); /* FF3.6+ */
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(246,248,249,1)), color-stop(50%,rgba(229,235,238,1)), color-stop(51%,rgba(215,222,227,1)), color-stop(100%,rgba(245,247,249,1))); /* Chrome,Safari4+ */
                background: -webkit-linear-gradient(top, rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* Chrome10+,Safari5.1+ */
                background: -o-linear-gradient(top, rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* Opera 11.10+ */
                background: -ms-linear-gradient(top, rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* IE10+ */
                background: linear-gradient(to bottom, rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* W3C */
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
            }

                .dashboard li a .titleWrapper .count {
                    background: none;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 20px;
                    font-weight: normal;
                }

.languageListDropDown ul li {
    font-size: 13px;
    line-height: 13px;
    color: #b8b8b8;
}

    .languageListDropDown ul li:hover {
        background-color: #f2f2f2;
        color: #333333;
    }

.languageListContainer ul li {
    font-size: 13px;
    line-height: 13px;
    color: #454c50;
}

    .languageListContainer ul li:hover {
        background-color: #f2f2f2;
        color: #333333;
    }

.brokerageNumberListDropDown ul li {
    font-size: 13px;
    line-height: 13px;
    color: #b8b8b8;
}

    .brokerageNumberListDropDown ul li:hover {
        background-color: #f2f2f2;
        color: #333333;
    }

.legendServiceRequest {
    float: left;
    width: 100%;
    margin: 0px 0px 10px 0px;
    clear: both;
}

    .legendServiceRequest .wrapper {
        float: right;
    }

    .legendServiceRequest .label {
        float: right;
        margin: 0px 10px 0px 5px;
        font-size: 13px;
        line-height: 10px;
        vertical-align: middle;
    }

    .legendServiceRequest .wrapper .cancelled {
        float: right;
        width: 8px;
        height: 8px;
        border: 1px solid #000000;
        background-color: #d3d2d4;
    }

    .legendServiceRequest .wrapper .confirmed {
        float: right;
        width: 8px;
        height: 8px;
        border: 1px solid #000000;
        background-color: #ffffff;
    }

    .legendServiceRequest .wrapper .unconfirmed {
        float: right;
        width: 10px;
        height: 10px;
        background-color: #ffdada;
    }

    .legendServiceRequest .wrapper .completed {
        float: right;
        width: 10px;
        height: 10px;
        background-color: #e4f2ca;
    }

.sliderRangeGrey {
    position: relative;
    float: left;
    width: 90%;
    height: 6px;
    margin: 25px 0px 15px 40px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid #b8c3c9;
    background: #f1f3f5 url("../images/sliderBackground.png") repeat-x;
    text-align: center;
    clear: both;
}

    .sliderRangeGrey .ui-rangeSlider-container .ui-rangeSlider-bar {
        height: 6px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        background: #484848 url("../images/sliderRangeBackgroundGrey.png") repeat-x;
        cursor: move;
    }

    .sliderRangeGrey .ui-rangeSlider-container .ui-rangeSlider-handle {
        width: 14px;
        height: 19px;
        margin: -5px 0px 0px 0px;
        background: url("../images/sliderHandleBackgroundGrey.png") no-repeat bottom;
        cursor: pointer;
        z-index: 1;
    }

    .sliderRangeGrey .ui-rangeSlider-label {
        top: -15px;
        margin: -10px 0px 0px 0px;
        padding: 3px 3px 3px 3px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        border: 1px solid #A5A5A5;
        background-color: #ffffff;
        font-size: 13px;
        cursor: pointer;
    }

.sliderRangeBlue {
    position: relative;
    float: left;
    width: 90%;
    height: 6px;
    margin: 25px 0px 15px 40px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid #A5A5A5;
    background: #f1f3f5 url("../images/sliderBackground.png") repeat-x;
    text-align: center;
    clear: both;
}

    .sliderRangeBlue .ui-rangeSlider-container .ui-rangeSlider-bar {
        height: 6px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        background: #484848 url("../images/sliderRangeBackgroundBlue.png") repeat-x;
        cursor: move;
    }

    .sliderRangeBlue .ui-rangeSlider-container .ui-rangeSlider-handle {
        width: 16px;
        height: 17px;
        margin: -5px 0px 0px 0px;
        background: url("../images/sliderHandleBackgroundBlue.png") no-repeat;
        cursor: pointer;
        z-index: 1;
    }

    .sliderRangeBlue .ui-rangeSlider-label {
        top: -15px;
        margin: -10px 0px 0px 0px;
        padding: 3px 3px 3px 3px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        border: 1px solid #53BEFF;
        background-color: #ffffff;
        font-size: 13px;
        cursor: pointer;
    }

.dataTables_wrapper {
    width: 100%;
}

    .dataTables_wrapper .top {
        clear: both;
    }

    .dataTables_wrapper .topLeft {
        float: left;
    }

    .dataTables_wrapper .topRight {
        float: right;
        margin: 0px 0px 5px 0px;
    }

        .dataTables_wrapper .topRight select {
            min-width: 65px;
        }

    .dataTables_wrapper .bottomCenter {
        text-align: center;
        margin: -15px 0px 15px 0px;
    }

        .dataTables_wrapper .bottomCenter div {
            font-size: 13px;
        }

        .dataTables_wrapper .bottomCenter .dataTables_info {
            margin: 10px 0px 15px 0px;
        }

        .dataTables_wrapper .bottomCenter .dataTables_paginate a {
            cursor: pointer;
        }

        .dataTables_wrapper .bottomCenter .dataTables_paginate a {
            margin: 0px 10px 0px 0px;
        }

            .dataTables_wrapper .bottomCenter .dataTables_paginate a:last-child {
                margin: 0px 0px 0px 0px;
            }

            .dataTables_wrapper .bottomCenter .dataTables_paginate a.paginate_button_disabled,
            .dataTables_wrapper .bottomCenter .dataTables_paginate a.paginate_button_disabled,
            .dataTables_wrapper .bottomCenter .dataTables_paginate span a.paginate_active {
                cursor: default;
                color: #cccccc;
            }

            .dataTables_wrapper .bottomCenter .dataTables_paginate a.first:before {
                width: 5px;
                height: 5px;
                content: "<< ";
            }

            .dataTables_wrapper .bottomCenter .dataTables_paginate a.previous:before {
                width: 5px;
                height: 5px;
                content: "< ";
            }

            .dataTables_wrapper .bottomCenter .dataTables_paginate a.next:after {
                width: 5px;
                height: 5px;
                content: " >";
            }

            .dataTables_wrapper .bottomCenter .dataTables_paginate a.last:after {
                width: 5px;
                height: 5px;
                content: " >>";
            }

        .dataTables_wrapper .bottomCenter .dataTables_paginate span {
            margin: 0px 10px 0px 0px;
        }

table.List,
table.ListDateRange {
    margin: 0px 0px 25px 0px;
}

.filter_date_range input[type=button] {
    display: inline-block;
    width: 29px;
    height: 29px;
    padding: 0px 7px;
    margin-left: 5px;
    border: 1px solid #cccccc;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    line-height: 27px;
}

table.List thead tr:last-child,
table.ListDateRange thead tr:last-child {
    border: 1px solid #dbdbdb;
    background: #e0e6eb; /* Old browsers */
    background: -moz-linear-gradient(top, #e0e6eb 0%, #d5dde3 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e0e6eb), color-stop(100%,#d5dde3)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* IE10+ */
    background: linear-gradient(to bottom, #e0e6eb 0%,#d5dde3 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e6eb', endColorstr='#d5dde3',GradientType=0 ); /* IE6-9 */
}

    table.List thead tr:last-child td,
    table.ListDateRange thead tr:last-child td {
        border-top: 1px solid #edf1f3;
        border-bottom: 1px solid #b1b7bc;
    }

table.List tr td,
table.ListDateRange tr td {
    position: relative;
    height: 25px;
    padding: 3px 3px 3px 3px;
    font-size: 12px;
}

table.List thead tr th,
table.ListDateRange thead tr th {
    height: 23px;
    padding: 3px 3px 3px 3px;
    font-family: LatoBold, Arial, Sans-Serif;
    font-size: 13px;
    font-weight: bold;
    text-align: left;
}

    table.List thead tr th .filter_column.filter_date_range,
    table.ListDateRange thead tr th .filter_column.filter_date_range {
        height: 23px;
        padding: 3px 3px 3px 3px;
        font-family: Lato, Arial, Sans-Serif;
        font-size: 13px;
        font-weight: normal;
        text-align: left;
    }

        table.List thead tr th .filter_column.filter_date_range input[type=text],
        table.ListDateRange thead tr th .filter_column.filter_date_range input[type=text] {
            margin: 0px 3px 0px 3px;
        }

table.List,
table.ListDateRange {
    margin: 0px 0px 25px 0px;
}

.filter_date_range input[type=button] {
    display: inline-block;
    width: 29px;
    height: 29px;
    padding: 0px 7px;
    margin-left: 5px;
    border: 1px solid #cccccc;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    line-height: 27px;
}

table.List thead tr:last-child,
table.ListDateRange thead tr:last-child {
    border: 1px solid #dbdbdb;
    background: #e0e6eb; /* Old browsers */
    background: -moz-linear-gradient(top, #e0e6eb 0%, #d5dde3 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e0e6eb), color-stop(100%,#d5dde3)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* IE10+ */
    background: linear-gradient(to bottom, #e0e6eb 0%,#d5dde3 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e6eb', endColorstr='#d5dde3',GradientType=0 ); /* IE6-9 */
}

    table.List thead tr:last-child td,
    table.ListNoDateRange thead tr:last-child td {
        border-top: 1px solid #edf1f3;
        border-bottom: 1px solid #b1b7bc;
    }

table.List tr td,
table.ListNoDateRange tr td {
    position: relative;
    height: 25px;
    padding: 3px 3px 3px 3px;
    font-size: 12px;
}

table.List thead tr th,
table.ListNoDateRange thead tr th {
    height: 23px;
    padding: 3px 3px 3px 3px;
    font-family: LatoBold, Arial, Sans-Serif;
    font-size: 13px;
    font-weight: bold;
    text-align: left;
}

    table.List thead tr th .filter_column.filter_date_range,
    table.ListNoDateRange thead tr th .filter_column.filter_date_range {
        height: 23px;
        padding: 3px 3px 3px 3px;
        font-family: Lato, Arial, Sans-Serif;
        font-size: 13px;
        font-weight: normal;
        text-align: left;
    }

        table.List thead tr th .filter_column.filter_date_range input[type=text],
        table.ListNoDateRange thead tr th .filter_column.filter_date_range input[type=text] {
            margin: 0px 3px 0px 3px;
        }

table.List,
table.ListNoDateRange {
    margin: 0px 0px 25px 0px;
}

table.List thead tr:last-child,
table.ListNoDateRange thead tr:last-child {
    border: 1px solid #dbdbdb;
    background: #e0e6eb; /* Old browsers */
    background: -moz-linear-gradient(top, #e0e6eb 0%, #d5dde3 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e0e6eb), color-stop(100%,#d5dde3)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #e0e6eb 0%,#d5dde3 100%); /* IE10+ */
    background: linear-gradient(to bottom, #e0e6eb 0%,#d5dde3 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e6eb', endColorstr='#d5dde3',GradientType=0 ); /* IE6-9 */
}

.DisplayNone {
display:none;
}

#clientDetailsWrapper {
    position: relative;
    z-index: 1000;
}

    #clientDetailsWrapper .clientDetails {
        position: absolute;
        top: -50px;
        right: -278px;
        width: 270px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        border: 1px solid #000000;
        background: #eaefb5; /* Old browsers */
        background: -moz-linear-gradient(top, #eaefb5 0%, #e1e9a0 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaefb5), color-stop(100%,#e1e9a0)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #eaefb5 0%,#e1e9a0 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #eaefb5 0%,#e1e9a0 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #eaefb5 0%,#e1e9a0 100%); /* IE10+ */
        background: linear-gradient(to bottom, #eaefb5 0%,#e1e9a0 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaefb5', endColorstr='#e1e9a0',GradientType=0 ); /* IE6-9 */
    }

        #clientDetailsWrapper .clientDetails:before {
            position: absolute;
            top: 40px;
            left: -8px;
            width: 8px;
            height: 10px;
            content: url('../images/popupDialogArrowClientAddress.png');
        }

        #clientDetailsWrapper .clientDetails .row {
            width: 100%;
            min-height: 0px;
            margin: 0px 0px 0px 0px;
            padding: 0px 0px 0px 0px;
        }

            #clientDetailsWrapper .clientDetails .row .label {
                float: left;
                width: 85px;
                margin: 5px 0px 5px 5px;
                font-family: LatoBold, Arial, Sans-Serif;
                font-size: 12px;
                line-height: 14px;
                font-weight: bold;
            }

            #clientDetailsWrapper .clientDetails .row .value {
                float: left;
                width: 175px;
                margin: 5px 5px 5px 0px;
                font-family: Lato, Arial, Sans-Serif;
                font-size: 12px;
                line-height: 14px;
                white-space: pre-wrap;
            }

table.informationTableVertical {
    margin: 0px 0px 15px 0px;
}

    table.informationTableVertical tr td {
        height: 16px;
        padding: 0px 3px 0px 0px;
        font-family: Lato, Arial, Sans-Serif;
        font-size: 15px;
        vertical-align: top;
    }

        table.informationTableVertical tr td:first-child {
            font-family: LatoBold, Arial, Sans-Serif;
            font-size: 13px;
            font-weight: bold;
        }

        table.informationTableVertical tr td:last-child {
            font-family: Lato, Arial, Sans-Serif;
            font-size: 13px;
        }

.popupDialog {
    display: table;
    display: inline-block;
    position: relative;
    min-width: 156px;
    height: 26px;
    padding: 13px 16px 13px 16px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid #e5d5a4;
    background: #fff2ce url('../images/popupDialogBackground.png') repeat-x;
}

    .popupDialog:before {
        position: absolute;
        bottom: -7px;
        left: 35%;
        width: 10px;
        height: 8px;
        content: '';
        background: url('../images/popupDialogArrow.png') no-repeat;
    }

    .popupDialog .close {
        position: absolute;
        top: 3px;
        right: 4px;
        width: 11px;
        height: 9px;
        background: url('../images/popupDialogClose.png') no-repeat;
        cursor: pointer;
    }

    .popupDialog .title {
        margin: 0px 0px 4px 0px;
        font-family: LatoBold, Arial, Sans-Serif;
        font-size: 13px;
        font-weight: bold;
        color: #a4752b;
    }

    .popupDialog .message {
        font-family: Lato, Arial, Sans-Serif;
        font-size: 11px;
        line-height: 12px;
        color: #a4752b;
    }

.formSectionSeparator {
    display: block;
    width: 100%;
    height: 10px;
    margin: 30px 0px 0px 0px;
    border-top: 1px solid #f6f6f6;
    clear: both;
}

.formSectionContainer {
    display: block;
    width: 100%;
    clear: both;
}

.row {
    position: relative;
    float: left;
    width: 44%;
    min-height: 35px;
    margin: 0px 5% 4px 0px;
    padding: 0px 1% 0px 0px;
}

    .row.twoColumn {
        position: relative;
        float: left;
        width: 94%;
        min-height: 35px;
        margin: 0px 5% 4px 0px;
        padding: 0px 1% 10px 0px;
    }

    .row.clearLeft {
        clear: left;
    }

    .row p {
        float: left;
        max-width: 168px;
        font-family: Lato, Arial, Sans-Serif;
        font-size: 13px;
    }

    .row.bold p {
        float: left;
        max-width: 168px;
        font-family: LatoBold, Arial, Sans-Serif;
        font-size: 12px;
        font-weight: bold;
    }

    .row input,
    .row textarea,
    .row select,
    .row label,
    .row > div {
        float: right;
    }

    .row span.asterix {
        position: absolute;
        top: 3px;
        right: 0px;
        color: #ff0000;
    }

        .row span.asterix span {
            position: absolute;
            top: -17px;
            right: 100%;
            font-size: 13px;
            line-height: 14px;
            white-space: nowrap;
            z-index: 1000;
        }

    .row.twoColumnRight {
        position: relative;
        float: left;
        width: 94%;
        min-height: 35px;
        margin: 0px 5% 5px 0px;
        padding: 0px 1% 10px 0px;
    }

        .row.twoColumnRight p {
            float: left;
            width: 168px;
            max-width: 168px;
            font-family: Lato, Arial, Sans-Serif;
            font-size: 13px;
        }

        .row.twoColumnRight.bold p {
            float: left;
            width: 168px;
            max-width: 168px;
            font-family: LatoBold, Arial, Sans-Serif;
            font-size: 12px;
            font-weight: bold;
        }

        .row.twoColumnRight input,
        .row.twoColumnRight textarea,
        .row.twoColumnRight select,
        .row.twoColumnRight label,
        .row.twoColumnRight > div {
            float: left;
        }

        .row.twoColumnRight span.asterix {
            position: relative;
            float: left;
            margin: 0px 0px 0px 3px;
            color: #ff0000;
        }

            .row.twoColumnRight span.asterix span {
                float: left !important;
                font-size: 13px;
                line-height: 14px;
                white-space: nowrap;
                z-index: 1000;
            }

.hide {
    display: none;
}

.ui-autocomplete .ui-menu-item .ui-corner-all {
    font-size: 12px;
}
/****************************GLOBAL END************************************/
/****************************PAGE START************************************/
#pageWrapper {
    position: relative;
    width: 100%;
    margin: 0px auto 0px auto;
    background: #fcfcfc url('../images/skinsBackground.png') repeat;
}
/****************************PAGE END************************************/
/****************************MENU START************************************/
#menuWrapper {
    position: relative;
    width: 100%;
    height: 49px;
    margin: 0px auto 0px auto;
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.4);
    -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.4);
    background: #414141 url('../images/menuBackground.png') repeat-x;
}

    #menuWrapper .menu {
        display: block;
        list-style-type: none;
        margin-left: -10px;
        width: 1059px;
    }

        #menuWrapper .menu .separator {
            display: block;
            position: relative;
            float: left;
            height: 49px;
            margin: 0px 0px 0px 0px;
            padding: 0px 0px 0px 0px;
            background: url('../images/menuSeparator.png') no-repeat center right;
        }

            #menuWrapper .menu .separator a {
                float: left;
                height: 39px;
                margin: 5px 5px 5px 5px;
                padding: 0px 10px 0px 36px;
                font-family: Lato, Arial, Sans-Serif;
                font-size: 13px;
                line-height: 39px;
                color: #ffffff;
                text-decoration: none;
            }

                #menuWrapper .menu .separator a:hover {
                    color: #000000;
                }

            #menuWrapper .menu .separator.dropdownMenu > a {
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
            }

            #menuWrapper .menu .separator a img {
                margin: 0px 12px 0px 0px;
            }

            #menuWrapper .menu .separator.menuLogo > a {
                background: url('../images/menuLogo.png') no-repeat center center;
            }

            #menuWrapper .menu .separator.menuButtonInbox > a {
                background: url('../images/menuButtonInbox.png') no-repeat center left 10px;
            }

                #menuWrapper .menu .separator.menuButtonInbox > a:hover {
                    background: #ffffff url('../images/menuButtonInboxHover.png') no-repeat center left 10px;
                }

                #menuWrapper .menu .separator.menuButtonInbox > a span {
                    display: inline-block;
                    min-width: 18px;
                    height: 16px;
                    margin: 0px 0px 0px 5px;
                    -moz-border-radius: 2px 2px 2px 2px;
                    -webkit-border-radius: 2px 2px 2px 2px;
                    border-radius: 2px 2px 2px 2px;
                    -webkit-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
                    -moz-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
                    -o-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
                    box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
                    background-color: #ec2e40;
                    line-height: 18px;
                    text-align: center;
                }

            #menuWrapper .menu .separator.menuButtonTasks > a {
                height: 49px;
                background: url('../images/menuButtonTasks.png') no-repeat 10px 10px;
            }

                #menuWrapper .menu .separator.menuButtonTasks > a:hover {
                    background: #ffffff url('../images/menuButtonTasksHover.png') no-repeat center 10px 10px;
                }

        #menuWrapper .menu .menuButtonTasks.dropdownMenu:hover > a {
            background: #ffffff url('../images/menuButtonTasksHover.png') no-repeat 10px 10px;
        }

        #menuWrapper .menu .right {
            display: block;
            position: relative;
            float: right;
            height: 49px;
            margin: 0px 0px 0px 0px;
            padding: 0px 0px 0px 0px;
        }

            #menuWrapper .menu .right.welcome {
                height: 49px;
                margin: 0px 11px 0px 0px;
                font-size: 13px;
                line-height: 49px;
                color: #ffffff;
            }

            #menuWrapper .menu .right.profile {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.profile a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/menuButtonProfile.png') no-repeat center left 10px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.clients {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.clients a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/menuButtonClients.png') no-repeat center left 10px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.payslip {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.payslip a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/menuButtonPayslip.png') no-repeat center left 10px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.clientdocs {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.clientdocs a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/menuClientDocs.png') no-repeat center left 10px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.assessment {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.assessment a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/assessment1.png') no-repeat center left 10px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.incidents {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.incidents a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/incident.png') no-repeat center left 10px;
                    background-size: 19px 19px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.servicerequests {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.servicerequests a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/menuServiceRequests.png') no-repeat center left 10px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.servicerequestadd {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.servicerequestadd a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/menuServiceRequestAdd.png') no-repeat center left 10px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.signOut {
                display: inline;
                height: 30px;
                margin: 9px 11px 0px 0px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
                background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
            }

                #menuWrapper .menu .right.signOut a {
                    float: left;
                    height: 30px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 10px 0px 36px;
                    background: url('../images/menuButtonSignOut.png') no-repeat center left 10px;
                    font-family: Lato, Arial, Sans-Serif;
                    font-size: 13px;
                    line-height: 30px;
                    color: #ffffff;
                    text-decoration: none;
                }

            #menuWrapper .menu .right.search {
                position: relative;
                height: 30px;
                margin: 9px 8px 0px 0px;
            }

                #menuWrapper .menu .right.search input[type="text"] {
                    min-width: 113px;
                    height: 30px;
                    padding: 0px 5px 0px 82px;
                    -moz-border-radius: 5px 5px 5px 5px;
                    -webkit-border-radius: 5px 5px 5px 5px;
                    border-radius: 5px 5px 5px 5px;
                    -webkit-box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.2);
                    -moz-box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.2);
                    -o-box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.2);
                    box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.2);
                    border-style: none;
                    background-color: #292929;
                    color: #555555;
                }

                #menuWrapper .menu .right.search input[type="button"] {
                    display: inline;
                    position: absolute;
                    top: 5px;
                    left: 0px;
                    height: 20px;
                    padding: 0px 1px 0px 32px;
                    border: 1px solid #cccccc;
                    border-style: none solid none none;
                    background: #292929 url('../images/menuButtonSearch.png') no-repeat center left 12px;
                    color: #cccccc;
                    cursor: pointer;
                }

        #menuWrapper .menu .dropdownMenu {
            position: relative;
            z-index: 1000;
        }

            #menuWrapper .menu .dropdownMenu:hover > a {
                color: #333333;
            }

            #menuWrapper .menu .dropdownMenu ul {
                display: none;
                position: absolute;
                top: 45px;
                left: 5px;
                -moz-border-radius: 5px 5px 5px 5px;
                -webkit-border-radius: 5px 5px 5px 5px;
                border-radius: 5px 5px 5px 5px;
                -webkit-box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.2);
                -moz-box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.2);
                -o-box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.2);
                box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.2);
                background-color: #ffffff;
                list-style-type: none;
            }

            #menuWrapper .menu .dropdownMenu:hover > ul {
                display: block;
            }

            #menuWrapper .menu .dropdownMenu ul li {
                display: block;
                float: left;
                width: 170px;
                padding: 0px 10px 0px 10px;
                list-style-type: none;
            }

                #menuWrapper .menu .dropdownMenu ul li:hover {
                    background-color: #f2f2f2;
                }

                #menuWrapper .menu .dropdownMenu ul li:first-child {
                    -moz-border-radius: 5px 5px 0px 0px;
                    -webkit-border-radius: 5px 5px 0px 0px;
                    border-radius: 5px 5px 0px 0px;
                }

                #menuWrapper .menu .dropdownMenu ul li:last-child {
                    -moz-border-radius: 0px 0px 5px 5px;
                    -webkit-border-radius: 0px 0px 5px 5px;
                    border-radius: 0px 0px 5px 5px;
                }

                #menuWrapper .menu .dropdownMenu ul li a {
                    display: block;
                    min-width: 150px;
                    margin: 0px 0px 0px 0px;
                    padding: 0px 0px 0px 0px;
                    border-bottom: 1px dashed #e1e1e1;
                    color: #7d7d7d;
                }

                #menuWrapper .menu .dropdownMenu ul li a {
                    height: 100%;
                    font-family: LatoBold, Arial, Sans-Serif;
                    color: #cccccc;
                }

                #menuWrapper .menu .dropdownMenu ul li.hasChild > a {
                    background: url('../images/menuDropdownArrow.png') no-repeat right;
                }

                #menuWrapper .menu .dropdownMenu ul li.hasChild:hover > a {
                    background: url('../images/menuDropdownArrowHover.png') no-repeat right;
                }

                #menuWrapper .menu .dropdownMenu ul li:last-child > a {
                    border-style: none;
                }

                #menuWrapper .menu .dropdownMenu ul li a:hover {
                    font-family: Lato, Arial, Sans-Serif;
                    color: #333333;
                }

                #menuWrapper .menu .dropdownMenu ul li ul {
                    display: none;
                    position: absolute;
                    top: -5px;
                    left: 170px;
                }

                #menuWrapper .menu .dropdownMenu ul li:hover > ul {
                    display: block;
                }

        /*Added Menu for employee service info by RK*/

        #menuWrapper .menu .right.serviceinfo {
            display: inline;
            height: 30px;
            margin: 9px 11px 0px 0px;
            -moz-border-radius: 5px 5px 5px 5px;
            -webkit-border-radius: 5px 5px 5px 5px;
            border-radius: 5px 5px 5px 5px;
            -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
            -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
            -o-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
            box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
            background: #4d4d4d url('../images/menuButtonRightBackground.png') repeat-x;
        }

            #menuWrapper .menu .right.serviceinfo a {
                float: left;
                height: 30px;
                margin: 0px 0px 0px 0px;
                padding: 0px 10px 0px 36px;
                background: url('../images/menuButtonPayslip.png') no-repeat center left 10px;
                font-family: Lato, Arial, Sans-Serif;
                font-size: 13px;
                line-height: 30px;
                color: #ffffff;
                text-decoration: none;
            }

/****************************MENU END************************************/
/****************************MESSAGE START************************************/
#messageWrapper {
    position: relative;
    width: 860px;
    height: 41px;
    margin: 10px auto 10px auto;
}

    #messageWrapper .message {
        display: none;
        position: relative;
        float: left;
        min-width: 418px;
        max-width: 858px;
        height: 38px;
        margin: 0px auto 0px auto;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
    }

        #messageWrapper .message .icon {
            position: relative;
            float: left;
            width: 18px;
            height: 18px;
            margin: 0px auto 0px auto;
        }

        #messageWrapper .message .type {
            position: relative;
            float: left;
            float: left;
            height: 38px;
            margin: 0px 0px 0px 10px;
            font-family: LatoBold, Arial, Sans-Serif;
            font-weight: bold;
            line-height: 38px;
        }

        #messageWrapper .message .hyphen {
            float: left;
            height: 38px;
            margin: 0px 5px 0px 5px;
            line-height: 38px;
        }

        #messageWrapper .message .text {
            position: relative;
            float: left;
            height: 38px;
            max-width: 714px;
            margin: 0px 0px 0px 0px;
            line-height: 38px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        #messageWrapper .message.general {
            border: 1px solid #b8cada;
            background: #d0eaff url('../images/messageBackgroundGeneral.png') repeat-x;
            font-size: 13px;
            color: #346b96;
        }

            #messageWrapper .message.general .icon {
                float: left;
                width: 20px;
                height: 38px;
                margin: 0px 0px 0px 10px;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/messageIconGeneral.png');
            }

            #messageWrapper .message.general .close {
                float: right;
                width: 16px;
                height: 38px;
                margin: 0px 15px 0px 10px;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/messageCloseGeneral.png');
                cursor: pointer;
            }

        #messageWrapper .message.success {
            border: 1px solid #a7cb6c;
            background: #c9e698 url('../images/messageBackgroundSuccess.png') repeat-x;
            font-size: 13px;
            color: #4e6e1b;
        }

            #messageWrapper .message.success .icon {
                float: left;
                width: 20px;
                height: 38px;
                margin: 0px 0px 0px 10px;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/messageIconSuccess.png');
            }

            #messageWrapper .message.success .close {
                float: right;
                width: 16px;
                height: 38px;
                margin: 0px 15px 0px 10px;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/messageCloseSuccess.png');
                cursor: pointer;
            }

        #messageWrapper .message.warning {
            border: 1px solid #fff2d0;
            background: #e5d5a4 url('../images/messageBackgroundWarning.png') repeat-x;
            font-size: 13px;
            color: #a4752b;
        }

            #messageWrapper .message.warning .icon {
                float: left;
                width: 20px;
                height: 38px;
                margin: 0px 0px 0px 10px;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/messageIconWarning.png');
            }

            #messageWrapper .message.warning .close {
                float: right;
                width: 16px;
                height: 38px;
                margin: 0px 15px 0px 10px;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/messageCloseWarning.png');
                cursor: pointer;
            }

        #messageWrapper .message.error {
            border: 1px solid #f16565;
            background: #ff9292 url('../images/messageBackgroundError.png') repeat-x;
            font-size: 13px;
            color: #81333c;
        }

            #messageWrapper .message.error .icon {
                float: left;
                width: 20px;
                height: 38px;
                margin: 0px 0px 0px 10px;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/messageIconError.png');
            }

            #messageWrapper .message.error .close {
                float: right;
                width: 16px;
                height: 38px;
                margin: 0px 15px 0px 10px;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/messageCloseError.png');
                cursor: pointer;
            }
/****************************MESSAGE END************************************/ rows
/****************************BACKGROUND START************************************/
#backgroundWrapper {
    position: relative;
    width: 100%;
    margin: 0px auto 0px auto;
    margin-top: -40px !important;
}
/****************************BACKGROUND END************************************/
/****************************CONTENT START************************************/
#contentWrapper {
    position: relative;
    width: 900px;
    margin: 0px auto 0px auto;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.1);
    -o-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.1);
    background-color: #ffffff;
    overflow: auto;
}

    #contentWrapper .pageTitle {
        position: relative;
        float: left;
        width: 900px;
        height: 40px;
        margin: 0px auto 0px auto;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        background: #f0f3f4 url('../images/pageTitleBackground.png') repeat-x;
        font-family: LatoBold, Arial, sans-serif;
        font-size: 17px;
        font-weight: bold;
        line-height: 40px;
        text-align: center;
        color: #576a78;
    }

    #contentWrapper .taskBar {
        position: relative;
        float: left;
        width: 860px;
        height: 29px;
        margin: 0px auto 0px auto;
        padding: 0px 20px 0px 20px;
        border-top: 1px solid #dbdbdb;
        border-bottom: 1px solid #b1b7bc;
        background: #f0f3f4 url('../images/taskBarBackground.png') repeat-x;
    }

    #contentWrapper .content {
        position: relative;
        float: left;
        width: 844px;
        min-height: 400px;
        margin: 0px auto 0px auto;
        padding: 28px 17px 28px 17px;
    }
/****************************CONTENT END************************************/
/****************************FOOTER START************************************/
#footerWrapper {
    position: relative;
    width: 900;
    height: 40px;
    margin: 20px auto 0px auto;
    font-family: LatoBold, Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    color: #ababab;
}
/****************************FOOTER END************************************/

/****************************New Css added by designer************************************/
#menuWrapper .menu {
    /*margin-left: 0;*/
    width: auto;
    display: inline-block;
}

    #menuWrapper .menu .separator.menuLogo > a {
        padding: 0px 10px 0px 25px;
        line-height: 44px;
        color: #fff;
        background-position: left center;
    }

        #menuWrapper .menu .separator.menuLogo > a:hover {
            color: #fff;
        }

    #menuWrapper .menu .separator {
        height: 39px;
    }

#contentWrapper .content {
    width: 100%;
    box-sizing: border-box;
}

@media (max-width:1199px) {
    #menuWrapper {
        height: 95px;
        background-size: cover;
    }

        #menuWrapper .menu a {
            font-size: 12px !important;
        }
}

.titleList {
    width: 164px !important;
}

.redBackground {
    background: RGB(255,138,138) !important;
}

.greenBackground {
    background: RGB(179,255,179) !important;
}

.orangeBackground {
    background: RGB(255,197,138) !important;
}

.darkRedBackground {
    background: RGB(255,66,66) !important;
}