@font-face { /* Helvetica Neue LT Std 65 Medium */
    font-family: 'HelveticaNeueLTStd-Md';
    src: url('Images/v2/fonts/HelveticaNeueLTStd-Md.eot');
    src: url('Images/v2/fonts/HelveticaNeueLTStd-Md.eot?#iefix') format('embedded-opentype'), url('Images/v2/fonts/HelveticaNeueLTStd-Md.woff') format('woff'), url('Images/v2/fonts/HelveticaNeueLTStd-Md.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueLTStd-MdCn'; /* 67 Medium condensed */
    src: url('Images/v2/fonts/HelveticaNeueLTStd-MdCn.eot');
    src: url('Images/v2/fonts/HelveticaNeueLTStd-MdCn.eot?#iefix') format('embedded-opentype'), url('Images/v2/fonts/HelveticaNeueLTStd-MdCn.woff2') format('woff2'), url('vv2/fonts/HelveticaNeueLTStd-MdCn.woff') format('woff'), url('Images/v2/fonts/HelveticaNeueLTStd-MdCn.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueLTStd-Lt'; /* 45 light */
    src: url('Images/v2/fonts/HelveticaNeueLTStd-Lt.eot');
    src: url('Images/v2/fonts/HelveticaNeueLTStd-Lt.eot?#iefix') format('embedded-opentype'), url('Images/v2/fonts/HelveticaNeueLTStd-Lt.woff2') format('woff2'), url('Images/v2/fonts/HelveticaNeueLTStd-Lt.woff') format('woff'), url('Images/v2/fonts/HelveticaNeueLTStd-Lt.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueLTStd-Bd'; /* Helvetica Neue LT Std 75 Bold */
    src: url('Images/v2/fonts/HelveticaNeueLTStd-Bd.eot');
    src: url('Images/v2/fonts/HelveticaNeueLTStd-Bd.eot?#iefix') format('embedded-opentype'), url('Images/v2/fonts/HelveticaNeueLTStd-Bd.woff') format('woff'), url('Images/v2/fonts/HelveticaNeueLTStd-Bd.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Extrabold';
    src: url('Images/v2/fonts/OpenSans-Extrabold.eot');
    src: url('Images/v2/fonts/OpenSans-Extrabold.eot?#iefix') format('embedded-opentype'), url('Images/v2/fonts/OpenSans-Extrabold.woff') format('woff'), url('Images/v2/fonts/OpenSans-Extrabold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Bold';
    src: url('Images/v2/fonts/OpenSans-Bold.eot');
    src: url('Images/v2/fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'), url('Images/v2/fonts/OpenSans-Bold.woff2') format('woff2'), url('Images/v2/fonts/OpenSans-Bold.woff') format('woff'), url('Images/v2/fonts/OpenSans-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html {
    margin: 0px;
    padding: 0px;
    height: 100%;
    width: 100%;
}

body {
    margin: 0px;
    padding: 0px;
    background: url(Images/v2/background.png) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width: 100%;
}

/* Target the iPad to ensure its buttons remain consistant
    One poster noticed that applying a gradient can remove the 
    neccessity for the below code; this was not tested.
*/
input[type="button"],
input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin-top: 0px;
}

input[type="checkbox"] {
    /*-webkit-appearance: none;*/
    /*display: block;*/
    /*background-image: url("Images/v2/date-picker.svg");
    background-repeat: no-repeat;*/
    width: 2em;
    height: 2em;
    /*appearance: none !important; /* Needed? */
    /*background-color: black !important;
    background-image: url("Images/logo.jpg") !important;
    background: none !important;
    color: #fff !important;
    padding: 0 !important;
    border: 0 !important;*/
}


/*.modal-dialog.RadWindow .dialog.rwCorner {*/
/*.rwCorner .rwFooterLeft, .rwCorner .rwFooterRight {
    width: 0px !important;
}

.RadWindow .rwCorner, RadWindow .rwBodyRight {
    width: 0px !important;
}*/
/* modal-dialog-confirmation is specifically for yes/no confirmation and similar
   modal-dialog is to be used for larger dialogues.
*/
.modal-dialog-confirmation td.rwTitlebar,
.modal-dialog-confirmation td.rwFooterLeft,
.modal-dialog-confirmation td.rwFooterRight,
.modal-dialog-confirmation td.rwCorner.rwBodyRight,
.modal-dialog-confirmation td.rwCorner.rwBodyLeft,
.modal-dialog-confirmation td.rwFooterCenter,
.modal-dialog-confirmation td.rwCorner.rwTopLeft,
.modal-dialog-confirmation td.rwCorner.rwTopRight,
.modal-dialog-confirmation tr.rwStatusbarRow,
.modal-dialog td.rwTitlebar,
.modal-dialog td.rwFooterLeft,
.modal-dialog td.rwFooterRight,
.modal-dialog td.rwCorner.rwBodyRight,
.modal-dialog td.rwCorner.rwBodyLeft,
.modal-dialog td.rwFooterCenter,
.modal-dialog td.rwCorner.rwTopLeft,
.modal-dialog td.rwCorner.rwTopRight,
.modal-dialog tr.rwStatusbarRow {
    visibility: hidden !important;
    position: center !important;
}

.modal-dialog-confirmation {
    width: 50% !important;
    height: 490px !important;
    overflow: hidden !important;
}

.modal-dialog {
    width: 80% !important;
    height: 820px !important;
}
/* RadWindow RadWindow_Default rwNormalWindow rwTransparentWindow modal-dialog rwNoTitleBar */
/*.modal-dialog div table tbody tr td div*/
.RadWindow.RadWindow_Default, .rwNormalWindow .rwTransparentWindow .modal-dialog rwNoTitleBar {
    /*width: 515px !important;
    position: center !important;*/
    /*height: 500px !important;*/
}

.rwWindowContent .frame {
    border: none;
    padding-top: 0px;
    padding-bottom: 0px;
}

    .rwWindowContent .frame h2 {
        padding-top: 0px;
    }

/* ****************************** */
* {
    font-size: 21px;
    font-family: 'HelveticaNeueLTStd-Md';
    color: #055A7D;
}

header {
    position: fixed;
    width: 100%;
    top: 0px;
    background-color: #055A7D;
    z-index: 1000;
}

#pcs-logo-bg {
    width: 140px;
    height: 50px;
    background-color: #fff;
    position: absolute;
    margin-top: 5px;
    margin-left: 5px;
    border-radius: 5px;
}

#pcs-logo {
    width: 130px;
    float: left;
    margin-left: 10px;
    margin-top: 8px;
    position: absolute;
}

#tersus-logo {
    width: 140px;
    margin-left: 180px;
    margin-top: 6px;
    position: absolute;
}

#client-header-logo {
    float: right;
    height: 50px;
    margin-top: 5px;margin-right: 15px;
    background: #fff;
    opacity: 0.9;
    border-radius: 5px;
}

h1 {
    font-size: 2.28em;
    text-align: center;
    color: #fff;
    margin: 0px;
    font-family: 'HelveticaNeueLTStd-MdCn';
    font-weight: normal;
}

h2 {
    margin: -30px;
    padding: 15px 30px 15px 30px;
    margin-bottom: 30px;
    color: #055A7D;
    font-size: 1.38em;
    font-family: 'HelveticaNeueLTStd-MdCn';
    font-weight: normal;
    border-bottom: 1px solid #085A7C;
    line-height: 1.38em;
}

    h2.centre,
    centre-text {
        text-align: center;
    }

/* Used with PropertyComplianceSettings.aspx */
.h2-header {
    margin: unset !important;
    margin-bottom: 0px !important;
}

/* for ClientUserPermissions */
h3 {
    margin: -10px -30px 0px -30px;
    padding: 15px 30px 5px 30px;
    /*margin-top: 10px;
    margin-bottom: 30px;*/
    color: #055A7D;
    font-size: 1.38em;
    font-family: 'HelveticaNeueLTStd-MdCn';
    font-weight: normal;
    /*border-bottom: 1px solid #085A7C;*/
    line-height: 1.38em;
}

h4 {
    text-align: center;
    margin: -10px -30px 0px -30px;
    padding: 15px 30px 5px 30px;
    /*margin-top: 10px;
    margin-bottom: 30px;*/
    color: #055A7D;
    font-size: 1.38em;
    font-family: 'HelveticaNeueLTStd-MdCn';
    font-weight: normal;
    /*border-bottom: 1px solid #085A7C;*/
    line-height: 1.38em;
}

.compliance-header {
    font-size: 180%;
    color: #047abb;
    text-align: center;
    display: block;
}

.login-icon {
    position: absolute;
    width: 32px;
    height: 33px;
    margin-top: 1px;
    margin-left: 1px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.username-icon {
    background-image: url("Images/v2/username-icon.svg");
}

.password-icon {
    margin-top: 55px;
    background-image: url("Images/v2/password-icon.svg");
}

_::-webkit-full-page-media, _:future, :root .password-icon { /* safari */
    margin-top: 58px;
}

_::-webkit-full-page-media, _:future, :root .login-icon { /* safari */
    margin-left: 2px;
}

@supports (-ms-ime-align: auto) { /*** Edge */
    .login-icon {
        margin-top: 1px;
        margin-left: 0px;
    }

    .password-icon {
        margin-top: 55px;
        height: 34px;
    }
}

.remember-icon {
    margin-top: 109px;
    z-index: 0;
    /*background-image: url("Images/v2/password-icon.svg");*/
}

.remember-text {
    width: 200px;
    font-weight: 800;
    color: #0175b9;
    margin-top: 116px;
    margin-left: 42px;
    font-family: "OpenSans-Extrabold";
}

_::-webkit-full-page-media, _:future, :root .remember-text { /* safari */
    margin-left: 42px;
    margin-top: 120px;
    width: 240px;
}

@supports (-ms-ime-align: auto) { /*** Edge */
    .remember-text {
        margin-top: 112px;
    }
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
}

#ctl00_ctl00_ContentPlaceHolder1_NestedContentPlaceHolder_LoginForm_Password,
#ctl00_ctl00_ContentPlaceHolder1_NestedContentPlaceHolder_LoginForm_UserName {
    padding-left: 36px !important;
}

#ctl00_ctl00_ContentPlaceHolder1_NestedContentPlaceHolder_LoginForm_RememberMe {
    width: 30px;
    height: 30px;
    margin-bottom: 20px;
    margin-left: 0px;
}

#ctl00_ctl00_ContentPlaceHolder1_NestedContentPlaceHolder_PasswordRecovery1_UserNameContainerID_UserName {
    margin-top: 12px;
}

.mission-statement {
    margin-bottom: 50px !important;
}

    .mission-statement h4 {
        box-sizing: border-box;
        text-align: center;
        margin-right: 0px;
        margin-left: 0px;
        color: #0f7dba;
        font-size: 180%;
    }

/* relates to LoginIn Screen floating, but 
    associated with the footer */
.footer-login {
    background-color: rgba(110,201,207,0.75);
    bottom: 40px;
    height: 30px;
    position: fixed;
    z-index: 100;
    border-bottom: 1px solid #055A7D;
    border-top: none;
    padding-top: 10px;
}

footer {
    bottom: 0px;
    position: fixed;
    color: #055A7D;
    font-size: .85em;
    background: #fff;
    width: 100%;
    text-align: center;
    border-top: 1px solid #047ABB;
    font-family: 'HelveticaNeueLTStd-Lt';
    z-index: 998;
}

    footer p,
    footer-login p {
        margin: 0px;
        padding: 0px;
        width: 100%;
        font-size: 0.9em;
    }

        footer a, footer a:link, footer a:visited, footer a:hover {
            font-size: 1em;
        }

/* left side menu */
.left-menu {
    border-top: 1px solid rgba(0, 113, 188, 0.25);
}

.left-menu, .left-menu-ipad-fix {
    background: #fff;
    position: fixed;
    height: 100%;
    width: 112px;
    border-right: 1px solid #047ABB;
    z-index: 1000;
}

.left-menu-ipad-fix {
    position: fixed;
    height: 120px;
    bottom: 0px;
    z-index: 999;
}

    .left-menu.expanded, .left-menu-ipad-fix.ipad-menu-expanded {
        width: 540px;
    }

.left-menu ul, .left-menu ul li {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .left-menu ul li {
        background-color: #fff;
        cursor: pointer;
        border-bottom: 1px solid #c9dbe2;
    }

.left-menu li a {
    background-repeat: no-repeat;
    background-position: center center;
    color: #085A7C !important;
    font-family: 'HelveticaNeueLTStd-Bd' !important;
    text-decoration: none;
    display: block;
    width: 100%;
    background-size: 54px auto;
    min-height: 112px;
    max-height: 112px;
    line-height: 112px;
    box-sizing: border-box;
}

    .left-menu li a.top-level-menu span {
        visibility: hidden;
    }

.left-menu.expanded li a.top-level-menu span {
    visibility: visible;
}

.left-menu.expanded li a {
    padding: 0px 80px 0px 114px;
    background-position: 29px center;
}

.left-menu li span {
    font-size: 1.2em;
}

.left-menu ul li ul li span {
    display: block;
}

.left-menu.expanded li a.top-level-menu {
    width: 540px;
}

.left-menu ul li:hover {
    position: relative;
}

.left-menu ul a:hover {
    opacity: 0.6;
}

.left-menu ul li ul {
    position: absolute;
    display: none;
    border-right: 1px solid #c9dbe2;
    border-left: 1px solid #c9dbe2;
    border-top: 1px solid #c9dbe2;
    left: 540px;
    top: -60px;
}

    .left-menu ul li ul.hidden-menu {
        display: none !important;
    }

.left-menu ul li:hover ul {
    display: block;
}

.left-menu ul li ul li a {
    display: block;
    width: 540px;
}

.home-menu {
    background-image: url("Images/v2/menu.svg") !important;
}

/* top level menu items */

.property-menu {
    background-image: url("Images/v2/property-portfolio.svg") !important;
}

.asbestos-reports-menu {
    background-image: url("Images/v2/asbestos-reports.svg") !important;
}

.compliance-reports-menu {
    background-image: url("Images/v2/compliance-management.svg") !important;
}

.control-panel-menu {
    background-image: url("Images/v2/control-panel.svg") !important;
}

.profile-menu {
    background-image: url("Images/v2/my-profile.svg") !important;
}

.logout-menu {
    background-image: url("Images/v2/logout.svg") !important;
}

.back-office-menu {
    background-image: url("Images/v2/back-office.svg") !important;
}

/* property menu items */
.map-search-menu {
    background-image: url("Images/v2/map-search.svg") !important;
}

.postcode-search-menu {
    background-image: url("Images/v2/postcode-search.svg") !important;
}

.group-search-menu {
    background-image: url("Images/v2/group-search.svg") !important;
}

.property-full-list-menu {
    background-image: url("Images/v2/full-list.svg") !important;
}

/* asbestos report menu items */

.compliance-dashboard-menu {
    background-image: url("Images/v2/compliance-dashboard.svg") !important;
}

.compliance-tracker-menu {
    background-image: url("Images/v2/compliance-tracker.svg") !important;
}

.compliance-actions-menu {
    background-image: url("Images/v2/Compliance%20Actions.svg") !important;
}

.priorities-menu {
    background-image: url("Images/v2/Priorities.svg") !important;
}

.property-audit-trail-menu {
    background-image: url("Images/v2/property-audit-trail.svg") !important;
}

.export-to-excel-menu {
    background-image: url("Images/v2/export-to-excel.svg") !important;
}

/** control panel menu */
.users-menu {
    background-image: url("Images/v2/user-permissions.svg") !important;
}

.user-audit-trail-menu {
    background-image: url("Images/v2/user-audit-trail.svg") !important;
}

.financial-report-menu {
    background-image: url("Images/v2/finance.svg") !important;
}

.project-management-menu {
    background-image: url("Images/v2/project-management.svg") !important;
}

.awareness-presentations-menu {
    background-image: url("Images/v2/awareness-presentation.svg") !important;
}

.supplier-allocation-menu {
    background-image: url("Images/v2/supplier-task-allocation.svg") !important;
}

.suppliers-menu {
    background-image: url("Images/v2/suppliers.svg") !important;
}

/* for ClientUserPermissions */
.client-code-display {
    color: #ff0000;
}

.google-map {
    width: 480px !important;
    height: 450px !important;
    max-width: 480px !important;
    max-height: 450px !important;
}

.gm-style-iw h2
{
    width: 100px;
    padding: 0px;
    margin: 0px;
}

/* This relates to UserAuditTrail - the Date-Picker, but may affect others */
/* Originally placed to correct the 600px breakpoint, but looks better if it scales 
    like the other associated objects do. The code still exists at the 600px breakpoint,
    but is commented out.
*/
.RadPicker.RadPicker_Default {
    /*width: unset !important;*/
}

/*Classes tried to remove the upper pixels on date picker UserAuditTrail */
/*.rdfd_ radPreventDecorate, .rcTable.rcSingle, .riSingle.RadInput.RadInput_Default {
    background: none !important;
    border-radius: 5px !important;
}*/

/* UserAuditTrail.aspx - styling the date picker, which includes a time component
    In addition removing the background colour
*/

.table-date-time-picker-adjust {
    position: relative !important;
    top: -1px !important;
}

    .table-date-time-picker-adjust .rcTimePopup {
        position: relative !important;
        background: unset !important;
        background-image: url("Images/v2/time-picker.svg") !important;
        background-repeat: no-repeat !important;
        width: 34px !important;
        height: 34px !important;
        padding: 0px !important;
        margin: 0px !important;
        left: -1px !important;
        top: 1px !important;
        border-radius: 0px;
        -moz-border-radius: 0px;
        -webkit-border-radius: 0px;
    }

    .table-date-time-picker-adjust .rcCalPopup {
        background-image: url("Images/v2/date-picker.svg") !important;
        background-color: #125a7a !important;
        height: 34px !important;
        width: 34px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        top: 1px !important;
        left: 0px !important;
        padding-left: 5px !important;
        padding-right: 5px !important;
        background-position: center center !important;
        border-radius: 0px;
        -moz-border-radius: 0px;
        -webkit-border-radius: 0px;
    }

/*.table-date-time-picker-adjust tbody tr td:nth-child(2) {
    /*padding: 0px !important;
    background-color: rgba(0,0,0,0) !important;
    background-image: none !important;
    background: none !important;
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}*/

.table-date-time-picker-adjust table.rcTable.rcSingle,
.table-date-time-picker-adjust table.rcTable.rcSingle tbody,
.table-date-time-picker-adjust table.rcTable.rcSingle tbody tr,
.table-date-time-picker-adjust table.rcTable.rcSingle tbody tr td.rcInput,
.table-date-time-picker-adjust table.rcTable.rcSingle tbody tr td:first-child {
    /*border-top-left-radius: 5px !important;
    border-bottom-left-radius: 5px !important;*/
    background-color: rgba(0,0,0,0) !important;
}

.table-date-picker-move table.rcTable.rcSingle tbody tr td:last-child {
    position: relative !important;
    z-index: 990 !important;
    background-color: #c9dbe2 !important;
    border-top-right-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
    height: 44px !important;
    right: 8px !important;
}


/* Internet Explorer */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    .left-menu li a {
        /*background-size: 27px 27px !important;*/
    }

        .table-date-time-picker-adjust .rcTimePopup {
            background-position: 0px !important;
        }
    }

/*** mobile menu ***/
#burger-menu {
    background-image: url("Images/v2/burger.svg");
    width: 38px;
    height: 28px;
    float: right;
    background-repeat: no-repeat;
    margin-top: 10px;
    margin-right: 15px;
    display: none;
}

    #burger-menu:hover {
        opacity: 0.7;
    }

.mobile-menu {
    position: fixed;
    z-index: 7000;
    height: 100%;
    width: 100%;
    background: #fff;
    margin: 0px;
    padding: 0px;
    overflow-y: auto;
    display: none;
}

    .mobile-menu li {
        list-style: none;
    }

    .mobile-menu ul {
        margin: 0px;
        padding: 0px;
    }

        .mobile-menu ul ul {
            display: none;
        }

    .mobile-menu li.drop-down-menu {
        background-image: url("Images/v2/moibile-non-expanded.svg");
        background-repeat: no-repeat;
        background-size: auto 10px;
        background-position: right 15px top 27px;
    }

        .mobile-menu li.drop-down-menu.expanded {
            background-image: url("Images/v2/mobile-expanded.svg");
        }



/* Internet Explorer */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    .mobile-menu li.drop-down-menu {
        background-position: right -44px top 27px !important;
    }

        .mobile-menu li.drop-down-menu.expanded {
            background-position: right 10px top 27px !important;
        }

    /*@media screen and (max-width: 700px) {

        }*/

    .RadGrid.RadGrid_Default {
        overflow: hidden !important;
    }
}

/* @media (min-width: 701px) and (max-width: 3000px) { */
@media (max-width: 850px) {
    _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu {
        background-position: right -40px top 27px !important;
    }

        _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu.expanded {
            background-position: right 10px top 27px !important;
        }
}

@media (max-width: 775px) {
    _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu {
        background-position: right -35px top 27px !important;
    }

        _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu.expanded {
            background-position: right 10px top 27px !important;
        }
}

@media (max-width: 700px) {
    _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu {
        background-position: right -30px top 27px !important;
    }

        _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu.expanded {
            background-position: right 10px top 27px !important;
        }
}

@media (max-width: 625px) {
    _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu {
        background-position: right -25px top 27px !important;
        /*background-size: auto 15px !important;*/
    }

        _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu.expanded {
            background-position: right 10px top 27px !important;
            /*background-size: auto 10px !important;*/
        }
}

@media (max-width: 550px) {
    _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu {
        background-position: right -20px top 27px !important;
    }

        _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu.expanded {
            background-position: right 10px top 27px !important;
        }
}

@media (max-width: 475px) {
    _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu {
        background-position: right -15px top 27px !important;
    }

        _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu.expanded {
            background-position: right 10px top 27px !important;
        }
}

@media (max-width: 400px) {
    _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu {
        background-position: right -10px top 27px !important;
    }

        _:-ms-input-placeholder, :root .mobile-menu li.drop-down-menu.expanded {
            background-position: right 10px top 27px !important;
        }
}

/* Example of Hiding columns specifically for Internet Explorer;
       first time use: SurveyResultsReport.aspx
        The following are an example - needs doing for each screen, in 
        addition to those that hide for other browsers.
        Also required is the above (.RadGrid.RadGrid_Default {
            overflow: hidden !important};) which prevents the text from overflowing.
    */
@media (max-width: 1250px) {
    _:-ms-input-placeholder, :root .hideIE-1250 {
        display: none !important;
    }
}

@media (max-width: 1150px) {
    _:-ms-input-placeholder, :root .hideIE-1150 {
        display: none !important;
    }
}

@media (max-width: 960px) {
    _:-ms-input-placeholder, :root .hideIE-960 {
        display: none !important;
    }
}

@media (max-width: 840px) {
    _:-ms-input-placeholder, :root .hideIE-840 {
        display: none !important;
    }
}

@media (max-width: 745px) {
    _:-ms-input-placeholder, :root .hideIE-745 {
        display: none !important;
    }
}

.mobile-menu a {
    display: block;
    width: 100%;
    min-height: 64px !important;
    max-height: 64px !important;
    line-height: 64px !important;
    background-repeat: no-repeat;
    background-size: 27px auto !important;
    text-decoration: none;
    color: #085A7C !important;
    font-family: 'HelveticaNeueLTStd-Bd' !important;
    padding-left: 60px;
    background-position: 20px center !important;
    border-bottom: 1px solid #c9dbe2;
    box-sizing: border-box;
}

_::-webkit-full-page-media, _:future, :root .mobile-menu a { /* safari */
    padding-top: 3px;
}

.mobile-menu a:hover {
    opacity: 0.7;
}

.mobile-menu a.awareness-presentations-menu { /* fix for odd SVG */
    background-size: 25px 25px !important;
}

/* Internet Explorer */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    .mobile-menu a {
        background-size: 27px 27px !important;
    }
}


/** form fields **/
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #CCCCCC;
}

::-moz-placeholder { /* Firefox 19+ */
    color: #CCCCCC;
}

:-ms-input-placeholder { /* IE 10+ */
    color: #CCCCCC;
}

:-moz-placeholder { /* Firefox 18- */
    color: #CCCCCC;
}

/*** telerik edit form fields in grids */
.rgEditForm h3 {
    text-decoration: underline;
}



/*tbody.command-item-add-refresh tr.command-item-add-refresh td.command-item-add-refresh input[type="submit"].command-item-add-refresh {
    background-color: aquamarine !important;
}*/

/* this access the 'refresh-image' in ComplianceFaultsEdit */
.RadGrid .rgAdd {
    width: 0px !important;
    height: 0px !important;
    background-image: none !important;
}

/* relates to 'ComplianceFaultsEdit' */
.RadGrid .rgCommandRow a {
    /*background-color: #085A7C !important;*/
    color: #fff !important;
    /*padding: 10px !important;
    border-radius: 5px 5px 5px 5px;*/
}

/* relates to 'ComplianceFaultsEdit' */
.RadGrid .rgRefresh {
    width: 0px !important;
    height: 0px !important;
    background-image: none !important;
}

/* relates to 'ComplianceFaultsEdit' */
.RadGrid .rgCommandRow {
    background: none !important;
}

/* Styles the upload fields (first done: ComplianceFaultsEdit */
.ruFileInput {
    height: 25px !important;
}

/* relates to 'ComplianceFaultsEdit' */
.command-item-row {
    padding: 30px 15px 0px 15px;
}

select {
    color: #055A7D;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid rgb(0, 113, 188);
    border: 1px solid rgba(0, 113, 188, 0.25);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
}

.multi-list {
    height: 100px;
    background-image: none;
}

textarea, input[type="text"], input[type="password"] {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid rgb(0, 113, 188);
    border: 1px solid rgba(0, 113, 188, 0.25);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
    box-sizing: border-box;
    width: 100%;
    padding-left: 23px;
    padding-right: 23px;
}

input[type="text"], input[type="password"] {
    height: 45px;
}

textarea {
    height: 100px;
    padding-top: 10px;
    padding-bottom: 10px;
}

select {
    background-image: url("Images/v2/dropdown.svg");
    background-repeat: no-repeat;
    background-position: right 17px center;
    background-size: 25px auto;
    height: 45px;
    padding-left: 23px;
    padding-right: 61px;
    width: 100%;
}

    /* Image not used in Internet Explorer */
    select::-ms-expand {
        /*background-image: url("Images/v2/dropdown.svg");
    background-repeat: no-repeat;*/
    }

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    /* This only seems to be required for Compliance Dashboard. 
        - .internet-explorer-col-50 was not used as IE is targetted with
        this code
    */
    .col-50 {
        flex-basis: 100% !important;
    }
}

.button, .button-col a {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    background-color: #055a7d;
    min-height: 80px;
    line-height: 80px;
    border: none;
    color: #fff !important;
    font-size: 1.1em;
    text-decoration: none;
    display: inline-block;
    padding: 0px 30px 0px 30px;
    box-sizing: border-box;
    text-align: center;
    font-family: "OpenSans-Extrabold";
    width: 100%;
}

    .button.report-button {
        font-size: 0.7em;
        line-height: 20px;
        min-height: 45px;
        font-family: "OpenSans-Bold";
        display: block;
        margin-top: 30px;
        padding: 5px;
    }

.remedial-works-button {
    margin-bottom: 20px;
}

.upload {
    position: relative;
    overflow: hidden;
    text-align: center;
    background-color: #055A7D;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
}

    .upload span {
        color: #fff !important;
        font-size: 1.1em;
        font-family: "OpenSans-Extrabold";
        padding: 0px 30px 0px 30px;
        min-height: 45px;
        line-height: 45px;
    }

.upload-button {
    position: absolute !important;
    top: 0px !important;
    right: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
    min-height: 50px;
    line-height: 50px;
    opacity: 0;
    /* Set the width to a large amount due to a bug (Task 4329),  where the 
        'choose file' button could be larger than the area that would respond 
        to the trigger; although it extends beyond the button's size, clicking
        seems to be constrained to the controlling button's area.
    */
    width: 1000px !important;
}

/* used with telerik:RadUpload (first used in ComplianceFaultsEdit) */
.ruFileInput, .ruFileWrap, .ruStyled {
    display: inherit !important;
    width: 100% !important;
}

/* used with telerik:RadUpload (first used in ComplianceFaultsEdit) */
.RadUpload .ruFileWrap {
    display: unset !important;
}

/* used with telerik:RadUpload (first used in ComplianceFaultsEdit) */
ul li span .ruFileInput {
    /*width: 200px !important;*/
}

.ruButton.ruBrowse {
    /*display: none !important;*/
    background-color: #055A7D !important;
    background-image: none !important;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    background-color: #055a7d;
    min-height: 45px;
    line-height: 45px;
    border: none;
    color: #fff !important;
    font-size: 1.1em;
    text-decoration: none;
    display: inline-block;
    padding: 0px 30px 0px 30px;
    box-sizing: border-box;
    text-align: center;
    font-family: "OpenSans-Extrabold";
    width: auto !important;
    position: relative;
}

.labelErrMsg {
    color: #ff0000;
    padding-bottom: 20px;
    display: block;
}

.upload {
    position: relative;
    overflow: hidden;
    text-align: center;
    background-color: #055A7D;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
}

    .upload span {
        color: #fff !important;
        font-size: 1.1em;
        font-family: "OpenSans-Extrabold";
        padding: 0px 30px 0px 30px;
        min-height: 45px;
        line-height: 45px;
    }

.upload-button {
    position: absolute !important;
    top: 0px !important;
    right: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
    min-height: 100px;
    line-height: 100px;
    opacity: 0;
}

.filename {
    margin-top: 10px;
}

/* used with telerik:RadDatePicker */
.date-picker {
    width: 100% !important;
}

.rcCalPopup {
    background-image: url("Images/v2/date-picker.svg") !important;
    background-color: #125a7a !important;
    height: 45px !important;
    width: 40px !important;
    margin-left: 0px !important;
    background-size: 55%;
    background-position: center center !important;
    border-radius: 0px 5px 5px 0px;
    -moz-border-radius: 0px 5px 5px 0px;
    -webkit-border-radius: 0px 5px 5px 0px;
}

/* used with: PropertyComplianceSettings.aspx */
.table-property-compliance .rcCalPopup {
    right: 13px !important;
}

.date-picker .RadInputMgr_Default, .date-picker .RadInput_Default .riTextBox {
    border-radius: 5px 0px 0px 5px;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;
    border-right: none !important;
}

html body .RadInput_Default .riTextBox, html body .RadInputMgr_Default {
    border: 1px solid rgb(0, 113, 188) !important;
    border: 1px solid rgba(0, 113, 188, 0.25) !important;
    -webkit-background-clip: padding-box !important; /* for Safari */
    background-clip: padding-box !important; /* for IE9+, Firefox 4+, Opera, Chrome */
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    color: #125a7a !important;
    font-family: 'HelveticaNeueLTStd-Md' !important;
    font-size: 21px !important;
    color: #055A7D;
    padding-left: 20px !important;
}

.RadWindow RadWindow_Default rwNormalWindow rwTransparentWindow {
    background-color: #085A7C !important;
    background-image: none !important;
}

.rcRow th, .rcViewSel {
    background-color: #c9dbe2 !important;
    border-radius: 0px !important;
}

.rcTitlebar {
    border-radius: 0px !important;
}

.rcSelected {
    background-color: #c9dbe2 !important;
}

.button.report-button.highlighted {
    background-color: #39b54a !important;
}

.report-button-row td:first-child {
    padding-right: 15px;
}

.report-button-row td:last-child {
    padding-left: 15px;
}

.report-button-row.full-width-row td:first-child {
    padding-right: 0px;
}

.report-button-row.full-width-row td:last-child {
    padding-left: 0px;
}

.button.inline-form-button {
    min-height: 45px;
    line-height: 45px;
}

/* ignore-client-options-row */
.client-options-row .button {
    min-height: 45px;
    line-height: 45px;
}

.client-options-row {
    margin-left: -30px;
}

    .client-options-row .col-75 {
        padding-left: 0px;
    }

        .client-options-row .col-75 .col-75, .client-options-row .col-75 .col-50 {
            padding-left: 30px;
        }

    .client-options-row .col-25, .client-options-row .col-33, .client-options-row .col-50 {
        padding-right: 0px;
    }

    .client-options-row label, .client-options-row span, .client-options-row col-75 span {
        color: #fff;
        line-height: 45px;
    }

.button {
    color: #fff !important;
}

    /* for colouring button red
    note that '.btnRedDelete a' is a ButtonField within a Grid
*/
    .button.red-button, .button-col.red-button-col a, .btnRedDelete a {
        background-color: #ff0000;
        color: #fff !important;
    }

    .button.white-button {
        background-color: #fff;
        color: #055a7d !important;
        border: 1px solid rgb(0, 113, 188);
        border: 1px solid rgba(0, 113, 188, 0.25);
        -webkit-background-clip: padding-box; /* for Safari */
        background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
    }

    .button.margin-top-small.red-button.report-archived-buttons a {
        color: #fff !important;
        text-decoration: none !important;
        width: 50% !important;
    }

    .button:hover, .button-col a:hover {
        opacity: 0.7;
    }

/* Error Message Label - first use EditClientPropertyGroupProperties */
.labelErrMsg {
    width: 100%;
    padding-left: 30px;
    padding-right: 30px;
    text-align: center;
}

    .labelErrMsg span {
        color: #ff0000 !important;
    }

/*** responsive ****/
.row {
    display: flex;
    flex-direction: row;
    margin-bottom: 30px;
}

    .row.no-margin-bottom {
        margin-bottom: 0px;
    }

    .row.no-margin-top {
        margin-top: 0px;
    }

.margin-top {
    margin-top: 30px;
}

.margin-top-small {
    margin-top: 5px;
}

.col-5, .col-10, .col-15, .col-25, .col-33, .col-50, .col-75, .col-85, .col-90, .col-100 {
    webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    padding-top: 0px;
    padding-bottom: 0px;
}

    .col-75.property-screen {
        padding-right: 0px;
        margin-right: 0px;
    }

        .col-75.property-screen .col-100 {
            padding-right: 0px;
        }

    .col-25.button-col, .col-33.button-col {
        padding-right: 0px;
    }

.client-options-row {
    flex-direction: row-reverse;
}

.col-5, .col-10, .col-15, .col-25, .col-33, .col-50, .col-75, .col-85, .col-90, .col-100 {
    padding-left: 30px;
    padding-right: 30px;
}

#content {
    margin-left: -30px;
}

.no-padding {
    padding: 0px !important;
}

.col-5 {
    flex-basis: 5%;
}

.col-10 {
    flex-basis: 10%;
}

.col-15 {
    flex-basis: 15%;
}

.col-25 {
    flex-basis: 25%;
}

.col-33 {
    flex-basis: 33.333333333%;
}

.col-50 {
    flex-basis: 50%;
}

.col-75 {
    flex-basis: 75%;
}

.col-85 {
    flex-basis: 85%;
}

.col-90 {
    flex-basis: 90%;
}

.col-100 {
    flex-basis: 100%;
}

.frame {
    background-color: rgba(255,255,255,0.75);
    padding: 30px;
    border: 1px solid #0071BC;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid rgb(0, 113, 188);
    border: 1px solid rgba(0, 113, 188, 0.25);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
    margin-bottom: 30px;
    box-sizing: border-box;
    width: 100%;
}

.frame-small-width {
    width: 450px;
}

.frame .row div.col-10:first-child,
.frame .row div.col-25:first-child,
.frame .row div.col-50:first-child,
.frame .row div.col-75:first-child,
.frame .row div.col-100:first-child {
    padding-left: 0px !important;
}

.frame .row div.col-10:first-child,
.frame .row div.col-25:last-child,
.frame .row div.col-50:last-child,
.frame .row div.col-75:last-child,
.frame .row div.col-100:last-child {
    padding-right: 0px !important;
}

.property-frame {
    min-height: 620px;
}
.property-frame.remediation-visible {
    min-height: 497px;
}
.remediation-frame.property-frame {
    min-height: 1px;
}

header {
    height: 70px;
}

h1 {
    line-height: 70px;
}

footer {
    height: 50px;
    margin-left: 112px;
}

    footer p, footer a, footer a:link, footer a:visited, footer a:hover {
        line-height: 50px;
    }

#body {
    margin-top: 70px;
    margin-bottom: 60px;
}

#window {
    margin-left: 112px;
    padding: 0px 0px 30px 30px;
}

.RadMenu li a.awareness-presentations-menu { /* fix for odd SVG */
    background-size: 54px 54px !important;
}

.RadMenu li ul li a, .RadMenu.expanded li a { /** sub menus and expanded menu version */
    background-position: 40px center !important;
}

.RadMenu li ul li .rmText, .RadMenu.expanded li .rmText {
    padding: 0px 80px 0px 114px !important;
}

/* login screen Logo */
#client-logo-load {
    background-image: url("Images/v2/png-800.png");
    width: 350px;
    height: 200px;
    background-repeat: no-repeat;
    margin: 0px auto -35px auto;
    background-size: 100% auto;
    background-position: center center;
    background-size: 90%;
}

.client-logo {
    margin-top: 20px;
    width: 540px;
    text-align: center;
    display: none;
}

.mobile-menu .client-logo {
    position: relative;
    display: block;
    margin: 0 auto;
    margin-top: 30px;
}

.client-logo img {
    max-width: 480px;
}

#client-drop-down {
    margin-right: 30px;
}

/** property summary box ***/
#propertyInfo img {
    background-color: #FFF;
}

.remediation-watermark-visible {
    background-color: #e57573 !important;
}

    .remediation-watermark-visible #propertyInfo img {
        background-color: #FFF !important;
    }

    .remediation-watermark-visible h2 {
        color: #fff;
    }

    .remediation-watermark-visible #propertyInfo td, .remediation-watermark-visible #propertyInfo th, .remediation-watermark-visible #propertyInfo span, .remediation-watermark-visible .report-button-row td {
        background-color: #e57573 !important;
        color: #fff !important;
    }

.remedial-watermark {
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 1.4em;
    height: 20px;
    padding-top: 9px;
    padding-bottom: 16px;
    /*height: 177px;*/
    font-variant-caps: all-small-caps;
    opacity: 0.6;
    background-color: #000000;
    margin: 0 auto;
    margin-top: -63px;
    width: 100%;
    position: relative;
    margin-bottom: 10px;
    max-width: 280px;
    letter-spacing: 1.5px;
}

#propertyInfo tr th:first-child {
    width: 50px;
} 

#propertyInfo, .propertyInfo {
    width: 100%;
    margin-bottom: 30px;
    border-spacing: 0px;
}

    #propertyInfo img, .propertyInfo img {
        width: 100%;
        margin-bottom: 30px;
        max-width: 280px;
    }

    #propertyInfo th, .propertyInfo th {
        text-align: left;
        font-weight: normal;
        color: #085A7C;
        border: none;
        width: 33%;
    }

    #propertyInfo td, .propertyInfo td {
        text-align: right;
        font-weight: normal;
        color: #085A7C;
    }

td.propertyInfoAddress {
    text-align: left !important;
}

.property-frame .button {
    width: 100%;
}

/*** grids ****/

/* for Property compliance settings */
.table-property-compliance {
    border-collapse: collapse !important;
    /*text-align: center;*/
}

.RadGrid, .grid {
    width: 100% !important;
    border: none !important;
    border-radius: 5px 5px 5px 5px !important;
    -moz-border-radius: 5px 5px 5px 5px !important;
    -webkit-border-radius: 5px 5px 5px 5px !important;
}

table tr:last-child td:first-child {
    border-bottom-left-radius: 5px;
}

table tr:last-child td:last-child {
    border-bottom-right-radius: 5px;
}

table tr th:first-child {
    border-top-left-radius: 5px;
}

table tr th:last-child {
    border-top-right-radius: 5px;
}



.rgMasterTable, .grid {
    width: 100% !important;
    border-radius: 5px 5px 5px 5px !important;
    -moz-border-radius: 5px 5px 5px 5px !important;
    -webkit-border-radius: 5px 5px 5px 5px !important;
    border: 1px solid rgb(8, 90, 124);
    border: 1px solid rgba(8, 90, 124, 0.25);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
}

    .rgMasterTable thead, .grid thead {
        border-radius: 5px 5px 5px 5px !important;
        -moz-border-radius: 5px 5px 5px 5px !important;
        -webkit-border-radius: 5px 5px 5px 5px !important;
    }

    .rgMasterTable th, .grid th {
        background: none !important;
        background-color: #055a7d !important;
        height: 70px;
        border: none !important;
        padding-left: 7px;
        padding-right: 7px;        
    }

        /* TEXT WHITE IS OVER-RIDING HERE */
        .rgMasterTable th, .grid th, .rgMasterTable th a, .grid th a, .grid th span {
            color: #fff !important;
            font-family: 'OpenSans-Extrabold' !important;
            text-decoration: none;
            font-size: 1em;
            line-height: 1em;
            text-align: left;
        }

    .rgMasterTable td, .grid td {
        font-family: 'HelveticaNeueLTStd-Md';
        border: none !important;
        height: 70px;
        line-height: 1em;
        padding-left: 7px;
        padding-right: 7px;
    }

.rgRow, tr {
    background-color: rgba(255,255,255,0.75) !important;
    border: none !important;
}

/* Used to completely hide the background in tables on login page 
    - may be needed elsewhere.
    This overrides the 'background-color' option in'.rgRow, tr' above.
*/
.login-form-login tr {
    background-color: rgba(255,255,255,0) !important;
}

/* The large resolutions don't appear to cause issues. */
.login-form-login tbody tr,
.login-form-login tbody tr td:last-child {
    width: 2000px !important;
    font-weight: 800;
    color: #0175b9;
}

.login-form-login table {
    border-spacing: 0px;
}

.login-form-login td, .login-form-login tbody {
    padding: 0px;
    font-family: "OpenSans-Extrabold";
}

.login-form-login tr {
    padding: 0px;
}

.login-form-login tbody tr td table {
    width: 100% !important;
}

#id-login-form-password {
    display: none;
    margin-bottom: 80px;
}

.rgAltRow, tr.alt {
    background-color: rgba(228,249,249,0.75) !important;
    border: none !important;
}

.rgSelectedRow {
    background: #6ec9cf !important;
}

.rgPager td {
    background-color: rgba(255,255,255,0.75) !important;
}

.rgPager .rgInfoPart, .rgPager .rgInfoPart strong {
    color: #055A7D !important;
    font-family: 'OpenSans-Extrabold' !important;
}

.rgPager.rgAdvPart, .rgPager .rgAdvPart span, .rgPager .rgAdvPart select {
    color: #055A7D !important;
    font-family: 'OpenSans-Extrabold' !important;
}

.rgPager .rcbInput.radPreventDecorate {
    color: #055A7D !important;
    font-family: 'OpenSans-Extrabold' !important;
}

.rgPager .rcbInput.radPreventDecorate {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-color: #fff !important;
    border-radius: 5px 5px 5px 5px !important;
    -moz-border-radius: 5px 5px 5px 5px !important;
    -webkit-border-radius: 5px 5px 5px 5px !important;
    border: 1px solid rgb(0, 113, 188) !important;
    border: 1px solid rgba(0, 113, 188, 0.25) !important;
    -webkit-background-clip: padding-box !important; /* for Safari */
    background-clip: padding-box !important; /* for IE9+, Firefox 4+, Opera, Chrome */
    background-image: url("Images/v2/dropdown.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 17px center !important;
    background-size: 20px auto !important;
    padding-left: 23px !important;
    padding-right: 23px !important;
    height: 27px !important;
    margin-top: -12px;
}

.rgPager .rcbInputCell.rcbInputCellLeft {
    background-image: none !important;
}
.rgPager .rcbArrowCell.rcbArrowCellRight {
    background-image: none !important;
}

.rgPager .rcbInputCell.rcbInputCellLeft input {
    width: 70px;
}

.rgPager .rgStatus {
    display: none;
}

.rgWrap.rgNumPart span, .gridPager a, .gridPager span {
    font-family: 'OpenSans-Bold' !important;
    color: #0071BC;
    text-decoration: none;
}

.rgCurrentPage {
    border: none !important;
    background: none !important;
    border-bottom: 1px solid #055A7D !important;
}

.rgNumPart a.rgCurrentPage span {
    background: none !important;
}

.rgPageFirst {
    background: url("Images/v2/pager-start.svg") !important;
}

.rgPageLast {
    background: url("Images/v2/pager-end.svg") !important;
}

.rgPageNext {
    background: url("Images/v2/pager-next.svg") !important;
}

.rgPagePrev {
    background: url("Images/v2/pager-prev.svg") !important;
}

    .rgPageFirst:hover, .rgPageLast:hover, .rgPageNext:hover, .rgPagePrev:hover {
        opacity: 0.7;
    }

.gridPager span {
    text-decoration: underline !important;
}

.removed {
    color: #54994e !important;
}

/*** reports & documents ***/
.reports-expander a, .reports-expander a:link, .reports-expander a:visited, .reports-expander a:hover {
    color: #fff;
    font-size: 1.4em;
    text-decoration: none;
    background-color: #125a7a;
    display: block;
    float: left;
    margin-right: 10px;
    padding-bottom: 5px;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    width: 46px;
    text-align: center;
}

    .reports-expander a:hover {
        opacity: 0.7;
    }

.reports-frame h3 {
    margin-top: 20px;
}

.reports-expander {
    margin-top: 20px;
}

.reports-frame .reports-expander:first-child {
    margin-top: 0px;
}

/**** asbestos register grids ****/
.risk-score {
    font-size: 4em !important;
    color: #115a7a !important;
}

.table-form h3 {
    padding-left: 45px;
}

/** profile table ***/
.passwordTable, .passwordTable tr, .passwordTable td {
    background: none !important;
}

    .passwordTable, .passwordTable table {
        width: 100% !important;
    }

        .passwordTable table td:first-child {
            text-align: left;
            vertical-align: top;
        }


        .passwordTable table a {
            display: none;
        }

        .passwordTable table label {
        }

        .passwordTable input[type="password"] {
            width: 100% !important;
        }

.footer-button {
    font-family: "OpenSans-Extrabold";
    text-decoration: none;
}

.footer-pop-up {
    background: rgba(255,255,255, 1);
    border-radius: 5px;
    padding: 10px 10px 20px 10px;
    display: none;
    -webkit-animation: login-fadeIn 1s;
    animation: login-fadeIn 1s;
    text-align: left;
    font-size: 0.8em;
    word-wrap: break-word;
}

    .footer-pop-up ul {
        padding: 0px;
        margin: 0px;
        margin-top: 10px;
        margin-left: 10px;
    }

    .footer-pop-up * {
        font-size: 1em;
    }

    .footer-pop-up h4 {
        font-size: 1.2em;
        text-align: left;
    }

    .footer-pop-up#access_probs {
        height: 120px;
        margin-top: -178px;
    }

    .footer-pop-up#browser {
        height: 190px;
        margin-top: -249px;
    }

    .footer-pop-up#user_info {
        height: 245px;
        margin-top: -304px;
    }

.popup-arrow {
    margin-left: -5px;
    border-width: 5px;
    border-color: #fff transparent transparent transparent;
    margin-top: 210px;
    position: absolute;
    content: "";
    border-style: solid;
    margin-left: 125px;
}

/* Add animation (fade in the popup) */
@-webkit-keyframes login-fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes login-fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* End of Login Screen Footer-Floating */

/** interactive site sketch tabs */
#sketch-tabs {
    margin-right: 50px;
}

    #sketch-tabs a, #sketch-tabs a:link, #sketch-tabs a:visited, #sketch-tabs a:hover {
        display: block;
        float: left;
        background-color: #6ec9cf;
        color: #fff;
        margin-right: 10px;
        padding: 5px 20px 0px 20px;
        text-decoration: none;
        border-radius: 5px 5px 0px 0px;
        box-sizing: border-box;
        height: 26px;
    }

_::-webkit-full-page-media, _:future, :root #sketch-tabs a { /* safari */
    padding-top: 7px;
}

        #sketch-tabs a:hover, #sketch-tabs a.selected:hover {
            opacity: 0.7 !important;
        }

        #sketch-tabs a.selected {
            background-color: #055a7d;
        }


/* site sketch */
#site-sketch {
    clear: left;
}

.sketch-drawing-background {
    background-color: #fff;
    border: 1px solid #bcdaee;
}

/* site sketch controls */
.sketch-controls {
    float: right;
    width: 38px;
    padding-top: 20px;
    text-align: center;
}

#sketch-slider {
    float: left;
    width: 10px;
}

.sketch-slider {
    height: 300px;
    margin: 0 auto;
}

.ui-slider-range {
    background: rgba(0, 113, 188, 0.25) !important;
}

a.site-sketch-reset, a.site-sketch-reset:link, a.site-sketch-reset:visited, a.site-sketch-reset:hover {
    color: #fff;
    text-decoration: none;
    color: #000;
    font-size: 0.7em;
}

    a.site-sketch-reset:hover {
        text-decoration: underline;
    }

a.ui-slider-handle, a.ui-slider-handle:link, a.ui-slider-handle:visited, a.ui-slider-handle:hover {
    background: #055A7D;
    border: 1px solid #055A7D;
}

/*** site sketch pop up dialog ***/
#sketch-pop-up {
    position: absolute;
    z-index: 1000;
    background-color: #fff;
    display: none;
    max-width: 300px;
    padding: 10px;
    background-color: rgba(255,255,255,0.85);
    border: 1px solid #0071BC;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid rgb(0, 113, 188);
    border: 1px solid rgba(0, 113, 188, 0.15);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
}

/** interactive site sketch key button */
a.site-sketch-button, a.site-sketch-button:link, a.site-sketch-button:visited, a.site-sketch-button:hover {
    display: block;
    border-radius: 5px;
    font-weight: normal;
    text-decoration: none;
    color: #fff;
    background-color: #055a7d;
}

    a.site-sketch-button:hover {
        opacity: 0.3 !important;
    }

/***interactive site sketch key **/
#site-sketch-key {
    /* display: none; */
}

#site-sketch-context-menu a:hover {
    opacity: 0.6;
}

.key {
    width: 32px;
    height: 32px;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
}

    .key.insulating {
        background-color: #dc9d9b;
    }

    .key.textured {
        background-color: #b57c4d;
    }

    .key.vinyl {
        background-color: #addd89;
    }

    .key.coatings {
        background-color: #49c5f3;
    }

    .key.bitumen {
        background-color: #fbc497;
    }

    .key.cement {
        background-color: #83a7d1;
    }

    .key.ropes {
        background-color: #b7a8cb;
    }

    .key.thermal {
        background-color: #ffff6e;
    }

.lollipop-row table, .lollipop-row tr, .lollipop-row td {
    background: none !important;
}

    .lollipop-row td:first-child {
        width: 50px;
    }

    .lollipop-row td:last-child {
        width: 5%;
    }

.lollipop {
    width: 35px;
    height: 35px;
    color: #000;
    border: 1px solid #000;
    text-align: center;
    font-size: 16px;
    line-height: 35px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

    .lollipop.no-asbestos {
        background-color: #5fbd35;
    }

    .lollipop.removed-asbestos {
        background-color: #25532b;
        color: #fff;
    }

    .lollipop.asbestos {
        background-color: #fe464a;
    }

    .lollipop.no-suspect-material {
        background-color: #fff;
        color: #000;
    }

    .lollipop.no-access {
        background-color: #ffa64f;
    }

    .lollipop.remedial-works {
        -webkit-border-radius: 0%;
        -moz-border-radius: 0%;
        border-radius: 0%;
        border: none;
        background-image: url("Images/warning.png");
        background-repeat: no-repeat;
        background-position: center center;
    }

.grid-arrow-up {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #fff;
    margin-top: 5px;
}

.grid-arrow-down {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #fff;
    margin-top: 5px;
}

#sketch-asbestos-photos {
    position: absolute;
    min-width: 300px;
    min-height: 410px;
    height: auto;
    display: none;
    left: 50%;
    margin-left: -225px;
    top: 50%;
    margin-top: -225px;
    z-index: 4000;
    padding: 5px;
    background-color: rgba(255,255,255,0.85);
    border: 1px solid #0071BC;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid rgb(0, 113, 188);
    border: 1px solid rgba(0, 113, 188, 0.15);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
}

    #sketch-asbestos-photos div.photo-slide {
        margin: 0 auto;
        width: auto;
        position: absolute;
        margin-left: 5px;
        margin-right: 0px;
        margin-top: 10px;
    }

.sketch-photo-buttons {
    margin: 0 auto;
    width: 290px;
    position: relative !important;
    margin-top: 320px;
}

    .sketch-photo-buttons a, .sketch-photo-buttons a:link, .sketch-photo-buttons a:visited, .sketch-photo-buttons a:hover {
        float: left;
        width: 125px;
        display: block;
        clear: none;
        margin-right: 10px;
        margin-left: 10px;
        margin-top: 10px;
        margin-bottom: 10px;
    }

        .sketch-photo-buttons a:last-child {
            margin-right: 0px !important;
        }

#sketch-north-arrow {
    width: 50px;
    height: 50px;
    background-size: auto 50px;
    background-repeat: no-repeat;
    background-position: top center;
    margin-top: -18px;
}

.sketch-scale-headers div {
    font-size: 1.4em;
}

#site-sketch-area {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

#showKeyButton {
    float: right;
    margin-top: -20px;
    margin-bottom: 20px;
}

    #showKeyButton a {
        padding: 5px 10px 0px 10px;
        box-sizing: border-box;
        height: 26px;
    }

_::-webkit-full-page-media, _:future, :root #showKeyButton a { /* safari */
    padding-top: 7px;
}

#north-point-icon {
    width: 50px;
    height: 50px;
    background-size: auto 50px;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    margin-top: -60px;
    margin-left: 10px;
    display: none;
}

#sketch-hazard-warning {
    background-image: url('Images/warning.png');
    width: 18px;
    height: 18px;
    float: right;
    background-size: 100%;
}

#sketch-remedial-action {
    color: #FF0000;
}

a.close-sketch-pop-up, a.close-sketch-pop-up:link, a.close-sketch-pop-up:visited, a.close-sketch-pop-up:hover {
    font-weight: bold;
    padding: 5px;
    font-size: 12px;
}

.small-images {
    min-height: 40px;
}

/** responsive */
@media screen and (max-width: 3000px) { /* was 1850 px*/
    .button.report-button {
        font-size: 0.9em;
        line-height: 20px;
        min-height: 45px;
    }

    .report-button-row td:first-child {
        padding-right: 10px;
    }

    .report-button-row td:last-child {
        padding-left: 10px;
    }

    .modal-dialog-confirmation {
        width: 40% !important;
        height: 480px !important;
    }

    .modal-dialog {
        width: 80% !important;
        height: 920px !important;
    }
}

/* Used with User Permissions Screen */
.permissions-warning {
    font-weight: 800;
    color: #f00;
}

/* Used with ClientUserPermissions.aspx; the ID is internally 
    generated but does not seem to be generated for each itteration */
#ctl00_ctl00_ctl00_ContentPlaceHolder1_NestedContentPlaceHolder_NestedContentPlaceHolder_ClientListUpdatePanel {
    width: 100% !important;
}

/* The following CSS is used with Modals for images, so as not to hide
    the Title Bar; it contains a couple of buttons, other than the 
    close, that may possibly be required by Users.
*/
#ImageViewer_status {
    visibility: hidden !important;
}

#RadWindowWrapper_ImageViewer .rwStatusbar, #RadWindowWrapper_ImageViewer .rwStatusbarRow {
    /*visibility: hidden !important;*/
    background-color: #fff !important;
    background: #fff !important;
}

#RadWindowWrapper_ImageViewer .rwCorner.rwBodyRight,
#RadWindowWrapper_ImageViewer .rwCorner.rwFooterRight,
#RadWindowWrapper_ImageViewer .rwCorner.rwBodyLeft,
#RadWindowWrapper_ImageViewer .rwCorner.rwFooterLeft,
#RadWindowWrapper_ImageViewer .rwFooterCenter,
#RadWindowWrapper_ImageViewer .rwCorner.rwTopRight,
#RadWindowWrapper_ImageViewer .rwCorner.rwTopLeft {
    display: none !important;
}

#RadWindowWrapper_ImageViewer .rwStatusbar div {
    background-position: 0 -95px !important;
}

#RadWindowWrapper_ImageViewer a.rwIcon {
    background-image: none !important;
    width: 4px !important;
}

.loading {
    position: fixed;
    width: 100%;
    height: 100%;
    height: 100vh;
    z-index: 99999;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #ccc;
    opacity: 0.8;
    background-color: #000;
    top: 0;
    bottom: 0;
}

    .loading img {
        display: block;
        margin: 0 auto;
        position: relative;
        top: 45%;
    }

/*** graph keys *****/

.graph-key {
    margin: 0 auto;
    border-radius: 5px;
}

.graph-key, .graph-key td, .graph-key tr {
    background-position: 0% 0%;
    background-color: none !important;
    background-image: none !important;
    background-repeat: repeat !important;
    background-attachment: scroll !important;
}

.graph-key {
    background-color: #055a7d;
}

    .graph-key th {
        padding: 3px;
        background-color: none;
        background: #055a7d;
    }

    .graph-key td {
        padding: 3px;
        background-color: #055a7d;
        vertical-align: middle;
        color: #fff;
    }

.non-asbestos-graph-key {
    background-color: #90ee90;
    width: 15px;
    height: 15px;
    border-radius: 10px !important;
}
.plan-up-to-date-graph-key {
    background-color: #008000;
    width: 15px;
    height: 15px;
    border-radius: 10px !important;
}
.plan-overdue-graph-key {
    background-color: #ffff00;
    width: 15px;
    height: 15px;
    border-radius: 10px !important;
}
.remediation-required-graph-key {
    background-color: #ffa500;
    width: 15px;
    height: 15px;
    border-radius: 10px !important;
}
.survey-required-graph-key {
    background-color: #e30707;
    width: 15px;
    height: 15px;
    border-radius: 10px !important;
}

.priorities-graph-key {
    width: 100%;
    margin-top: 10px;
}

.priorities-graph-key th {
    width: 2%;
}
.priorities-graph-key th div {
    margin-left: 10px;
}

.priorities-graph-key td {
    width: 23%;
    text-align: center;
}

@media screen and (max-width: 3000px) { /* was 1800 px ***/
    * {
        font-size: 14px;
    }

    .button, .button-col a, .red-button-col a {
        padding-left: 10px;
        padding-right: 10px;
        font-size: 1em;
        min-height: 60px;
        line-height: 60px;
    }

        .button.inline-form-button {
            min-height: 45px;
            line-height: 45px;
        }

        .button.report-button {
            font-size: 0.6em;
            line-height: 20px;
            min-height: 45px;
        }

    .report-button-row td:first-child {
        padding-right: 5px;
    }

    .report-button-row td:last-child {
        padding-left: 5px;
    }

    html body .RadInput_Default .riTextBox, html body .RadInputMgr_Default {
        font-size: 14px !important;
    }

    .reports-expander a, .reports-expander a:link, .reports-expander a:visited, .reports-expander a:hover {
        width: 30px;
    }

    .modal-dialog-confirmation {
        width: 40% !important;
        height: 400px !important;
    }

    .modal-dialog {
        width: 80% !important;
        height: 920px !important;
    }

    .risk-score {
        font-size: 3em !important;
    }
}

@media screen and (max-width: 3000px) { /* was 1600 px */
    header {
        height: 60px;
    }

    h1 {
        line-height: 60px;
    }

    h2 {
        margin: -15px;
        padding: 10px 15px 10px 15px;
        margin-bottom: 15px;
        border-bottom: 1px solid rgb(8, 90, 124);
        border-bottom: 1px solid rgba(8, 90, 124, 0.25);
        -webkit-background-clip: padding-box; /* for Safari */
        background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
    }

    footer {
        height: 40px;
        margin-left: 64px;
    }

        footer p, footer a, footer a:link, footer a:visited, footer a:hover {
            line-height: 40px;
        }

    #body {
        margin-top: 60px;
        margin-bottom: 50px;
    }

    #window {
        margin-left: 64px;
        padding: 15px 0px 15px 0px;
    }

    .left-menu, .left-menu-ipad-fix {
        width: 64px;
    }

        .left-menu.expanded, .left-menu-ipad-fix.ipad-menu-expanded {
            width: 360px;
        }

        .left-menu li a.top-level-menu {
            width: 64px;
        }

        .left-menu.expanded li a.top-level-menu {
            width: 290px;
        }

        .left-menu.expanded li {
            width: 360px;
        }

        .left-menu li {
            min-height: 64px;
            max-height: 64px;
        }

            .left-menu li a {
                background-size: 27px auto;
                min-height: 64px;
                max-height: 64px;
                line-height: 64px;
            }

            .left-menu li span {
                font-size: 1em;
            }

    _::-webkit-full-page-media, _:future, :root .left-menu.expanded ul li a { /* safari */
        padding-top: 3px;
    }

    .left-menu li a.awareness-presentations-menu { /* fix for odd SVG */
        background-size: 27px 27px;
        background-position: 20px center;
    }

    .left-menu li ul li a, .left-menu.expanded li a { /** sub menus and expanded menu version */
        background-position: 19px center;
    }

    .left-menu.expanded li a {
        padding: 0px 10px 0px 57px;
    }

    .left-menu ul li ul {
        left: 360px;
        width: 360px;
    }

        .left-menu ul li ul li a {
            width: 293px;
        }

        .left-menu ul li ul li {
            width: 360px;
        }

    .client-logo {
        width: 360px;
        text-align: center;
    }

        .client-logo img {
            max-width: 320px;
            max-height: 100px;
        }

    select {
        background-position: right 11px center;
        background-size: 15px auto;
        height: 35px;
        padding-left: 11px;
        padding-right: 0px;
    }

        /* Internet Explorer */
        select::-ms-expand {
            /*position: relative;*/
            /*background-position: 100% center;
            background-clip: border-box;
            background-attachment: scroll;
            background-origin: padding-box;*/
            background-image: none;
            padding-right: 7px;
            background-position-x: 4px;
            background-position-y: 8px;
            border: none;
            width: 20px; /* Does not appear to affect the size */
            color: #6ec9cf !important;
            background-color: #fff !important;
        }

    .client-options-row label, .client-options-row span {
        line-height: 35px;
    }

    input[type="text"], input[type="password"], textarea {
        padding-left: 11px;
        padding-right: 11px;
    }

    input[type="text"], input[type="password"] {
        height: 35px;
        line-height: 1;
    }

    _::-webkit-full-page-media, _:future, :root input[type="text"] { /* safari */
        padding-top: 10px;
    }

    _::-webkit-full-page-media, _:future, :root input[type="password"] { /* safari */
        padding-top: 10px;
    }

    _::-webkit-full-page-media, _:future, :root select { /* safari */
        padding-top: 5px;
    }

    _::-webkit-full-page-media, _:future, :root ::-webkit-input-placeholder { /* safari */
        padding-top: 2px;
    }

    .rgPager .rcbInput.radPreventDecorate {
        background-position: right 11px center !important;
        background-size: 15px auto !important;
        height: 20px !important;
        padding-left: 11px !important;
        padding-right: 27px !important;
    }

    .button, .button-col a, .red-button-col a {
        text-decoration: none;
        display: inline-block;
        padding: 0px 10px 0px 10px;
        min-height: 60px;
        line-height: 60px;
        font-size: 1em;
    }

        .button.inline-form-button {
            min-height: 35px;
            line-height: 35px;
        }

    .grid .button, .grid .button-col a {
        min-height: 0px;
        height: 30px;
        line-height: 30px;
    }

    .button.report-button {
        font-size: 0.9em;
        line-height: 15px;
        min-height: 40px;
    }

    .client-options-row {
        margin-left: 0px;
    }

        .client-options-row .button {
            min-height: 35px;
            line-height: 35px;
            width: 100%;
            box-sizing: border-box;
            padding-left: 3px;
            padding-right: 3px;
        }

    .upload span, .ruButton.ruBrowse {
        font-size: 1em;
        min-height: 35px;
        line-height: 35px;
    }

    .upload-button {
        min-height: 40px;
        line-height: 40px;
    }

    .row {
        margin-bottom: 15px;
    }

    .frame {
        padding: 15px;
    }

    .col-5, .col-10, .col-15, .col-25, .col-33, .col-50, .col-75, .col-85, .col-90, .col-100 {
        padding-left: 15px;
        padding-right: 15px;
    }

    .client-options-row .col-75 .col-75, .client-options-row .col-75 .col-50 {
        padding-left: 15px;
    }

    /* This was incorrect so changed from 5px to 15px. */
    #client-drop-down {
        margin-right: 15px;
    }

    #propertyInfo, .propertyInfo {
        margin-bottom: 15px;
    }

        #propertyInfo img, .propertyInfo img {
            width: auto;
            max-height: 250px;
            margin-bottom: 15px;
            text-align: center;
        }

    .rgMasterTable th, .grid th {
        height: 35px;
        border: none !important;
    }

    .rgMasterTable td, .grid td {
        height: 35px;
    }

    .rgMasterTable th, .grid th, .grid td, .rgMasterTable td {
        font-size: 0.85em !important;
    }

        .rgMasterTable th *, .grid th *, .grid td *, .rgMasterTable td * {
            font-size: 1em !important;
        }

    /*** telerik edit form fields in grids */
    .rgEditForm h3, .rgEditForm {
        font-size: 1.5em !important;
    }

    html body .RadInput_Default .riTextBox, html body .RadInputMgr_Default {
        padding-left: 10px !important;
    }

    .rcCalPopup {
        height: 35px !important;
    }

    #content {
        margin-left: -0px;
    }

    .modal-dialog-confirmation {
        width: 35% !important;
        height: 340px !important;
        overflow: hidden !important;
    }

    .rgMasterTable td .risk-score {
        font-size: 3em !important;
    }
}


/* For Date-Picker only */
@media screen and (max-width: 1240px) {
    /* if this is needed somewhere, it needs to be excluded from
        the date picker in UserAuditTrail.aspx
    */
    .RadPicker.RadPicker_Default {
        /*width: 200px !important;*/
    }

    .date-picker.date-picker-upload-report {
        width: unset !important;
    }
}

@media screen and (max-width: 1260px) {
    .hide-1260 {
        display: none !important;
    }
}

@media screen and (max-width: 1200px) {
    header {
        height: 50px;
    }

    #pcs-logo-bg {
        width: 110px;
        height: 40px;
        background-color: #fff;
        position: absolute;
        margin-top: 5px;
    }

    #pcs-logo {
        width: 105px;
        margin-left: 7px;
    }

    #tersus-logo {
        margin-left: 150px;
        width: 110px;
    }

    #client-header-logo {
        height: 40px;
    }

    h1 {
        line-height: 50px;
    }

    #body {
        margin-top: 50px;
    }

    /*.rgMasterTable th, .grid th, .grid td, .grid td span, .rgMasterTable td span, .grid td div, .rgMasterTable td div {
        font-size: 0.78em !important;
    }*/

    .modal-dialog {
        width: 85% !important;
        height: 920px !important;
    }

    .rgMasterTable td .risk-score {
        font-size: 3em !important;
    }

    .hide-1200 {
        display: none !important;
    }


    /* Login Screen */
    .body-login-width.col-50 {
        flex-basis: 70% !important;
    }

    /* Login Screen */
    .body-login-width.col-25 {
        flex-basis: 15% !important;
    }

    /* Login Screen */
    .footer-login-width.col-25 {
        flex-basis: 0% !important;
    }

    /* Login Screen */
    .footer-login-width.col-15 {
        flex-basis: 33% !important;
    }

    /* Login Screen */
    .footer-login-width.col-5 {
        flex-basis: 0% !important;
    }
}

@media screen and (max-width: 1100px) {
    body, html, #propertyInfo th, #propertyInfo span, .propertyInfo th, .propertyInfo span {
        font-size: 12px;
    }

    #body {
        margin-top: 50px; /* was 36px */
    }

    .col-5, .col-10, .col-15, .col-25, .col-33, .col-50, .col-75, .col-85, .col-90, .col-100 {
        padding-left: 5px;
        padding-right: 5px;
    }

    /*.modal-dialog .col-10, .modal-dialog .col-15, .modal-dialog .col-25,
    .modal-dialog .col-33, .modal-dialog .col-50, .modal-dialog.col-75, .modal-dialog .col-85,
    .modal-dialog .col-90, .modal-dialog .col-100 {
        padding-left: 15px;
        padding-right: 15px;
    }*/

    .property-frame {
        padding: 3px;
    }

        .property-frame h2 {
            padding: 8px 5px 9px 5px;
            margin: 0px -3px 10px -3px;
        }

    .col-75.property-screen {
        padding-left: 5px;
    }

    .client-options-row .col-75 .col-75, .client-options-row .col-75 .col-50 {
        padding-left: 5px;
    }

    /* This was added as changed @1600 breakpoint from 5px to 15px. */
    #client-drop-down {
        margin-right: 5px;
    }

    .modal-dialog-confirmation {
        width: 40% !important;
        height: 330px !important;
        overflow: hidden !important;
        /*padding-left: 15px !important;
        padding-right: 15px !important;*/
    }

    /*.modal-dialog {
        width: 85% !important;
        height: 860px !important;
    }*/

    .risk-score {
        font-size: 3em !important;
    }

    .table-form h3 {
        padding-left: 35px;
    }
}

/* Use for hiding only */
@media screen and (max-width: 1035px) {
    .hide-1035 {
        display: none !important;
    }

    .button, .button-col a, .red-button-col a {
        line-height: 40px;
        min-height: 40px;
        font-size: 0.85em;
        padding-left: 5px;
        padding-right: 5px;
    }

    .rgMasterTable th, .grid th, .rgMasterTable td, .grid td {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    /* relates to 'ComplianceFaultsEdit' */
    .command-item-row {
        padding: 30px 10px 0px 10px !important;
    }

    .risk-score {
        font-size: 3em !important;
    }
}

@media screen and (max-width: 1000px) {
    .col-10 {
        flex-basis: 14%;
    }

    .col-25 {
        flex-basis: 33.333333%;
    }

        .col-25.col-width-not-change {
            flex-basis: 25% !important;
        }

    .col-75, .col-50.col-wider {
        flex-basis: 66.6666666%;
    }

        .col-75.col-width-not-change {
            flex-basis: 75% !important;
        }

    .rgWrap.rgInfoPart {
        display: none;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .ruFakeInput {
        width: 364px !important;
        margin-left: 29px !important;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .ruInputs, .ruButton.ruBrowse {
        width: 374px !important;
        margin-left: 29px !important;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .ruButton.ruBrowse {
        margin-top: 10px !important;
        display: block !important;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .label-upload {
        line-height: 17px !important;
    }

    .modal-dialog-confirmation {
        width: 50% !important;
        height: 310px !important;
        overflow: hidden !important;
        /*padding-left: 15px !important;
        padding-right: 15px !important;*/
    }

    .risk-score {
        font-size: 3em !important;
    }

    .hide-1000 {
        display: none !important;
    }

    /* Login Screen */
    .body-login-width.col-50 {
        flex-basis: 70% !important;
    }

    /* Login Screen */
    .body-login-width.col-25 {
        flex-basis: 15% !important;
    }

    /* Login Screen */
    .footer-login-width.col-25 {
        flex-basis: 0% !important;
    }

    /* Login Screen */
    .footer-login-width.col-15 {
        flex-basis: 33% !important;
    }

    /* Login Screen */
    .footer-login-width.col-5 {
        flex-basis: 0% !important;
    }
}

/* Use for hiding menu only */
@media screen and (max-width: 980px) {
    #burger-menu {
        display: block;
    }

    .left-menu, .left-menu-ipad-fix {
        display: none;
    }

    #window {
        margin-left: 0px;
    }

    footer {
        margin-left: 0px;
    }

    #tersus-logo {
        display: none;
    }
}

/* Use for hiding only */
@media screen and (max-width: 910px) {
    .hide-910 {
        display: none !important;
    }

    
}

/* Use for hiding only */
@media screen and (max-width: 870px) {
    .hide-870 {
        display: none !important;
    }
}

/* Use for hiding only */
@media screen and (max-width: 830px) {
    .hide-830 {
        display: none !important;
    }

    .rgPager .rcbInputCell.rcbInputCellLeft, .rgPagerLabel {
        display: none;
    }
}

@media screen and (max-width: 800px) {
    #client-header-logo {
        display: none;
    }

    .col-10 {
        flex-basis: 16%;
    }

    /* col-width-not-change This prevents the overrides at breakpoints 1000px and 800px when the percentage is altered from
       indicated; for example col-25 is 25%, but changes to 33% at 1000px */
    .col-25:not(.col-width-not-change) {
        flex-basis: 40%;
    }

    .col-75 {
        flex-basis: 60%;
    }

    .col-50.col-wider {
        flex-basis: 100%;
    }

    .hide-800 {
        display: none !important;
    }

    .rgWrap.rgAdvPart {
        display: none;
    }

    .upload span, .ruButton.ruBrowse {
        padding: 0px 15px 0px 15px;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .ruFakeInput {
        width: 317px !important;
        margin-left: 51px !important;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .ruInputs, .ruButton.ruBrowse {
        width: 327px !important;
        margin-left: 51px !important;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .ruButton.ruBrowse {
        margin-top: 10px !important;
        display: block !important;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .label-upload {
        /*max-height: 64px !important;*/
        line-height: 16px !important;
    }

    .modal-dialog {
        width: 85% !important;
        height: 900px !important;
    }

    .modal-dialog-confirmation {
        width: 60% !important;
        height: 340px !important;
    }

    .risk-score {
        font-size: 3em !important;
    }

    /* Login Screen */
    .body-login-width.col-50 {
        flex-basis: 70% !important;
    }

    /* Login Screen */
    .body-login-width.col-25 {
        flex-basis: 15% !important;
    }

    /* Login Screen */
    .footer-login-width.col-25 {
        flex-basis: 0% !important;
    }

    /* Login Screen */
    .footer-login-width.col-15 {
        flex-basis: 33% !important;
    }

    /* Login Screen */
    .footer-login-width.col-5 {
        flex-basis: 0% !important;
    }
}

/* Use for hiding only */
@media screen and (max-width: 780px) {
    .hide-780 {
        display: none !important;
    }

    .row.graph-row {
        display: block;
    }

        .row.graph-row .col-50 {
            width: 100%;
        }
}

/* Use for hiding only */
@media screen and (max-width: 725px) {
    .hide-725 {
        display: none !important;
    }
}

/* used to main consistent button size on Email Asbestos Registry 
    and NoSurveysYet.aspx */
@media screen and (max-width: 700px) {
    #pcs-logo-bg, #pcs-logo {
        display: none;
    }

    .button.email-asbestos-register {
        line-height: 30px;
        min-height: 30px;
        font-size: 0.75em;
    }
}


/* Use for hiding only */
@media screen and (max-width: 650px) {
    .hide-650 {
        display: none !important;
    }

    .rgPageLast {
        display: none;
    }

    .rgPageFirst {
        display: none;
    }
}

@media screen and (max-width: 600px) {
    .row {
        display: block;
    }
        /* Note: the .needs-margin-bottom only exists to allow the margin to be removed when 
            it is otherwise required and the no-margin-botton is not a requirment */
        .row.no-margin-bottom .col-25, .row.no-margin-bottom .col-75, .row.needs-margin-bottom .col-25 {
            margin-right: 0px;
        }

    /* Use this code in ComplianceFaultsEdit.aspx to ensure the buttons
            maintain the same width; this method would require altering 
            repeatedly - about every 50px below 600px.
            The class "" has been left in the specific rows.
        */
    /*.row.row-block-inline{
            display: inline-block;
            width: 94%;
            margin-left: 16px;
        }
        
        .row.command-item-row.row-block-inline {
            display: inline-block;
            width: 94%;
            margin-left: 6px;
        }*/

    /* Used with EditClientSupplier (initially) to allow the frame to scale correctly either
        side of the breakpoint 600px
    */

    .frame-small-width {
        width: auto;
    }

    .frame:not(.frame2) {
        margin-right: 0px;
    }

    .frame .row div.col-25:first-child,
    .frame .row div.col-50:first-child,
    .frame .row div.col-75:first-child,
    .frame .row div.col-100:first-child {
        padding-right: 0px !important;
    }

    .frame .row div.col-25:last-child,
    .frame .row div.col-50:last-child,
    .frame .row div.col-75:last-child,
    .frame .row div.col-100:last-child {
        padding-left: 0px !important;
    }

    /* Used with Login Screen Footer */
    .margin-top-small {
        margin-bottom: -5px !important;
    }

    .col-5, .col-10, .col-25, .col-75, .col-50, .col-33, .col-85, .col-90, .col-100 {
        margin-bottom: 15px;
    }

    /**/
    .frame .col-25, .frame .col-50, .frame .col-75, .frame .col-85, .frame .col-90, .frame .col-100 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .col-5, .col-10, .col-15, .col-25, .col-75, .col-85, .col-90, .col-50, .col-33 {
        flex-basis: 100%;
    }

    .client-options-row .col-75 .col-75, .client-options-row .col-75 .col-50, .client-options-row .col-75 .col-25 {
        padding-right: 0px;
    }

    /** cchanged for postcode lookup on users & perms - may have to come out*/
    .frame .row .row .col-50 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .hide-600 {
        display: none !important;
    }

    /* DOUBLE/TRIPLE etc HEIGHT ALTERED HERE*/
    .button, .button-col a, .red-button-col a, .button.inline-form-button {
        line-height: 50px;
        min-height: 50px;
        font-size: 1.2em;
    }

        /* Returns buttons Email Asbestos Registry to consistent size */
        .button.email-asbestos-register {
            line-height: 50px;
            min-height: 50px;
            font-size: 1.2em;
        }

    .upload span, .ruButton.ruBrowse {
        font-size: 1.2em !important;
        min-height: 50px !important;
        line-height: 50px !important;
    }

    .upload-button {
        min-height: 55px;
        line-height: 55px;
        width: 100%;
    }

    .property-frame {
        padding: 15px;
        min-height: 1px;
    }

        .property-frame h2 {
            padding: 0px 15px 10px 15px;
            margin: 0px -15px 10px -15px;
        }

    .property-screen {
        margin-left: 1px !important;
        margin-right: 5px !important;
    }

    #propertyInfo img, .propertyInfo img {
        width: auto;
        max-height: 200px;
        margin-bottom: 30px;
        margin: 0 auto;
        margin-bottom: 15px;
    }

    #propertyInfo th, #propertyInfo td, .propertyInfo th, .propertyInfo td {
        padding-left: 15px;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .ruFakeInput {
        width: 517px !important;
        margin-left: 4px !important;
    }

    /* Styles the upload fields (first done: ComplianceFaultsEdit */
    .ruInputs, .ruButton.ruBrowse {
        width: 527px !important;
        margin-left: 4px !important;
    }



    .ruButton.ruBrowse {
        margin-top: 10px !important;
        display: block !important;
    }

    /* .ruFakeInput */
    .ruFileInput, td div div div div div input {
        height: 25px !important;
    }

    /* For Date-Picker only - first used with: UserAuditTrail*/
    .RadPicker.RadPicker_Default {
        /*width: unset !important;*/
    }

    .modal-dialog-confirmation {
        width: 90% !important;
        height: 390px !important;
        /*overflow: hidden !important;*/
        /*padding-left: 15px !important;
        padding-right: 15px !important;*/
    }

    .modal-dialog {
        width: 90% !important;
        height: 920px !important;
    }

    .risk-score {
        font-size: 3em !important;
    }

    .passwordTable td {
        display: block;
    }

    .footer-login .row {
        display: flex;
    }

    .footer-login .col-33 {
        flex-basis: 33% !important;
        width: 33% !important;
    }

    .footer-login .col-25 {
        display: none;
    }

    .footer-login .col-50 {
        flex-basis: 100% !important;
    }

    .table-date-time-picker-adjust {
        position: relative !important;
        top: 0px !important;
    }

    div.RadCalendarPopup.RadCalendarPopupShadows {
        left: unset !important;
        right: 0px !important;
    }

    .table-date-time-picker-adjust .rcTimePopup {
        left: 2px !important;
    }

    .table-date-time-picker-adjust .rcCalPopup {
        left: 3px !important;
    }

    .rgEditForm input[type="submit"] {
        height: 45px;
        font-size: 1.2em !important;
    }

    .rgEditForm .row-block-inline {
        padding-left: 15px;
        padding-right: 15px;
    }

    .command-item-row a.button {
        height: 45px;
        font-size: 1.2em !important;
        line-height: 45px
    }

    _:-ms-input-placeholder, :root .RadCalendarPopup.RadCalendarPopupShadows {
        left: auto !important;
        right: 0px !important;
    }

}

/* Use for hiding only */
@media screen and (max-width: 550px) {
    .hide-550 {
        display: none !important;
    }

    .row.row-block-inline {
        /*width: 93%;
            }

            .row.command-item-row.row-block-inline {
                width: 93%;
            }*/
    }
}

/* Use for hiding only */
@media screen and (max-width: 530px) {
    .hide-530 {
        display: none !important;
    }
}

/* Use for hiding only */
@media screen and (max-width: 500px) {
    .hide-500 {
        display: none !important;
    }

    footer p, footer a, footer a:link, footer a:visited, footer a:hover {
        line-height: 18px;
    }

    .row.row-block-inline {
        width: 92.5%;
    }


    .row.command-item-row.row-block-inline {
        width: 92.5%;
    }
}

/* Use for hiding only */
@media screen and (max-width: 475px) {
    .hide-475 {
        display: none !important;
    }
}

/* Use for hiding only */
@media screen and (max-width: 450px) {
    .hide-450 {
        display: none !important;
    }

    /*.row.row-block-inline {
                width: 91.5%;
            }

            .row.command-item-row.row-block-inline {
                width: 91.5%;
            }*/
}

@media screen and (max-width: 420px) {
    footer {
        display: none;
    }

    .footer-button {
        font-size: 0.7em;
    }

    .row.row-block-inline {
        /*display: inline-block;*/
        width: 94%;
        /*margin-left: 16px;*/
    }


    .row.command-item-row.row-block-inline {
        /*display: inline-block;*/
        width: 94%;
        /*margin-left: 6px;*/
    }

    .hide-420 {
        display: none !important;
    }

    .rgMasterTable th, .grid th, .rgMasterTable td, .grid td {
        font-size: 0.85em !important;
    }

    h1 {
        font-size: 1.8em;
    }

    #client-logo-load {
        width: 200px;
        height: 120px;
        margin-bottom: -15px;
    }

    .footer-pop-up {
        font-size: 0.7em;
    }

    .rgPager a {
        font-size: 1.3em !important;
    }

    /*.row.row-block-inline {
        width: 91%;
            }

        .row.command-item-row.row-block-inline {
        width: 91%;
        }*/
}

@media screen and (max-width: 350px) {
    .rgPager a {
        font-size: 1em !important;
    }
}

/* Use for hiding only */
@media screen and (max-width: 345px) {
    .hide-345 {
        display: none !important;
    }

    .rgPageNext {
        display: none;
    }

    .rgPagePrev {
        display: none;
    }
}

@media screen and (max-width: 320px) {
    .button, .button-col a, .red-button-col a {
        font-size: 0.9em;
        min-height: 40px;
        line-height: 40px;
    }

    .hide-320 {
        display: none !important;
    }

    h1 {
        font-size: 1.6em;
    }
}

@media print {
    body {
        background-image: none;
        padding-top: 20px;
    }

    .grid, .rgMasterTable {
        border-top: 1px solid #000 !important;
        border-left: 1px solid #000 !important;
    }

        .grid th, .grid td, .rgMasterTable th, .rgMasterTable td, .rgMasterTable th a, .rgMasterTable th.rgHeader a {
            color: #000 !important;
            font-size: 12px;
            border-bottom: 1px solid #000 !important;
            border-right: 1px solid #000 !important;
            text-decoration: none !important;
        }

    .RadGrid .rgHeader a {
        text-decoration: none !important;
    }

    .grid div, .rgMasterTable div, .grid span, .rgMasterTable span {
        font-size: 12px !important;
    }
}