/* eResources Orchestrate OAMS Template - new ro234x Sheet: main.css - ro1 - edit test1234 Web Development Firm: www.eResources.com - edited by qc robr CSS Coder: Matt Harris (www.focusontheclouds.com) Date: September 11, 2013 Purpose: Main Template -------------------------------------------------------------------------------*/
 
/* ========================================================================== HTML5 Boilerplate styles - h5bp.com (generated via initializr.com) ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.5;
}

input::-ms-clear {
    display: none;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

/* ========================================================================== Site Stylesheet ========================================================================== */

/* ------------------------------------- Positioning ------------------------------------- */

/* apply a natural box layout model to all elements */

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

img {
    max-width: 100%;
}

body {
    margin: 0;
}

.wrapper {
    position: relative;
    margin: 0 auto;
}

.logo,
.wrap-page,
.wrap-footer-marketing,
.wrap-footer-links,
.wrap-footer-copyright {
    width: 100%;
    min-width: 320px;
    margin: 0 auto;
    overflow: visible !important;
}

.logo,
.wrap-content,
.wrap-form,
.wrap-list,
.wrap-review,
.wrap-app-steps,
.wrap-view,
.wrap-nav,
.wrap-progress-bar,
.wrap-list-review,
.footer-marketing,
.footer-links,
.footer-copyright {
    max-width: 1200px;
    margin: 0 auto;
}

.lt-ie9 .logo,
.lt-ie9 .wrap-page {
    min-width: 900px;
}

/* set min-width in less than IE 9 */

.lt-ie8 .logo,
.lt-ie8 .wrap-page {
    width: 1200px;
}

/* set width in less than IE 8 */

/* Content Column Widths */

.pri,
.sec,
.ter {
    float: left;
}

.three-col .pri {
    width: 33.34%;
}

.three-col .sec,
.three-col .ter {
    width: 33.33%;
}

.two-col .pri {
    width: 66.67%;
}

.two-col .sec,
.two-col .ter {
    width: 33.33%;
}

.wrap-view-revised.two-col .pri {
    width: 75%;
}

.wrap-view-revised.two-col .sec,
.wrap-view-revised.two-col .ter {
    width: 25%;
}

.ter table {
    width: 100% !important;
}

/* Content Column Length Fix */

.pri,
.sec,
.ter {
    padding-bottom: 100000px;
    margin-bottom: -100000px;
}

/* Footer Widths */

.footer-feature,
.footer-secondary {
    float: left;
    overflow: hidden;
}

.footer-links {
    clear: both;
}

.footer-feature {
    width: 66.67%;
}

.footer-secondary {
    width: 33.33%;
}

.footer-links {
    width: 100%;
}

/* Footer Column Length Fix */

footer {
    overflow: hidden;
}

.footer-feature,
.footer-secondary {
    padding-bottom: 1000px;
    margin-bottom: -1000px;
}

/* Help Messages */

.help-message {
    display: none;
}

.help-message {
    position: relative;
    padding: 1px 15px;
}

.help-message p {
    margin: 10px 0;
}

.help-message {
    background: #F0F8FC;
    color: #22547D;
    margin-bottom: 10px;
    border: 1px solid #E4EFF5;
}

.help-message p a {
    text-decoration: underline;
}

/* Misc */

.wrap-logo,
header,
.wrap-content,
.header-content,
.wrap-progress-bar,
.wrap-list,
.wrap-app-steps,
.wrap-form,
.footer-marketing,
.footer-links,
.footer-copyright {
    overflow: hidden;
}

.content {
    padding: 0 30px;
    clear: both;
}

.more-records {
    padding: 15px 30px 50px;
    text-align: right;
}

.progress-bar li p:after,
.usernav li {
    z-index: 10;
}

.prinav li,
.progress-bar li:after {
    z-index: 100;
}

/* ------------------------------------- Fonts ------------------------------------- */

/*1 OPEN SANS font-family: 'Open Sans', sans-serif; Light -- font-weight: 300; Normal - font-weight: 400; Bold --- font-weight: 700; */

html,
body,
button,
input,
select,
textarea {
    font-family: 'Questrial', 'Open Sans', Calibri, Arial, sans-serif;
}

body {
    font-weight: 400;
    font-size: 14px;
    font-size-adjust: initial;
    color: #333;
}

p {
    margin: 21px 0;
}

em,
i {
    font-style: italic;
}

strong,
b {
    font-weight: 700;
}

.small {
    font-size: 12px;
}

/* 12 px */

.default,
.button a {
    font-size: 14px;
    line-height: 1.5;
}

/* 14 px */

.medium {
    font-size: 20px;
    line-height: 1.5;
}

/* 20 px */

.message {
    width: 240px;
}

.large {
    font-size: 24px;
}

/* 24 px */

.larger {
    font-size: 36px;
    line-height: 1.333;
    font-weight: 300;
}

/* 36 px */

.xlarge {
    font-size: 72px;
    line-height: 1.111;
}

/* 72 px */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 300;
    margin: 24px 0;
}

h1 {
    font-size: 36px;
    line-height: 1.111;
}

/* 36 px */

h2,
h3 {
    font-size: 30px;
    line-height: 1.333;
}

/* 30 px */

h4 {
    font-size: 24px;
}

/* 24 px */

h5 {
    font-size: 20px;
}

/* 20 px */

h6 {
    font-size: 16px;
    font-weight: 300;
}

/* 16 px */

a:link,
a:visited {
    color: #BA769B;
    text-decoration: none;
}

.custom-validation a:link,
.custom-validation a:visited {
    color: #0264AF;
    text-decoration: none;
}


a:hover,
a:active {
    color: #3f3f3f;
    text-decoration: underline;
}

header a:link,
.button a:link,
header a:visited,
.button a:visited {
    color: #fff;
}

header a:hover,
.button a:hover,
.button a:focus,
header a:active,
.button a:active {
    color: #fff;
    text-decoration: none;
}

a img {
    border: none;
    margin: 0;
}

/* ------------------------------------- Forms ------------------------------------- */

/* --- Form Content Area --- */

.wrap-form {
    background: #fff;
    padding-bottom: 60px;
}

/* --- General Form Styles --- */

input,
textarea,
input.file {
    width: 100%;
    padding: 9px 8px 7px 8px;
    font-size: 14px;
    -webkit-border-radius: 0;
    -webkit-appearance: none;
}

input,
textarea,
input.file {
    border: 1px solid #CDCDCD;
    background-color: #fff;
}

input:hover,
textarea:hover,
input.file:hover {
    background: #fff;
    border: 1px solid #A9A9A9;
}

input:focus,
input:active,
textarea:focus,
textarea:active,
input.file:focus,
input.file:active {
    border: 1px solid #BA769B;
}

.checkbox input,
.radio input {
    outline: none !important;
    display: none;
}

.ie input[type="checkbox"] {
    border: none;
    background: none;
}

input[type="checkbox"],
input[type="radio"] {
    display: none !important;
}

/* Dropdown / Combo Box Styles */

.styled-dropdown,
.dropdown {
    position: relative;
}

.dropdown .dropdown-input {
    display: block;
    margin-right: 34px;
    cursor: default;
}

.dropdown .dropdown-input:hover {
    border: 1px solid #BA769B;
}

.dropdown .dropdown-button {
    display: block;
    position: absolute;
    right: 0;
    cursor: default;
}

.dropdown .dropdown-button {
    width: 34px;
    height: 100%;
    padding-top: 5px;
    background: #BA769B;
    color: #fff;
    text-align: center;
}

.dropdown+.dropdown-options {
    width: 100%;
    position: relative;
    list-style-type: none;
    padding: 0;
    margin: 0;
    border: 1px solid #BA769B;
    border-top: none;
    z-index: 5;
    display: none;
}

.dropdown+.dropdown-options li {
    padding: 6px 8px;
    border-bottom: 1px solid #A9A9A9;
    background: #fff;
}

.dropdown+.dropdown-options li:last-child {
    border-bottom: none;
}

.dropdown+.dropdown-options li:hover {
    background: #BA769B;
    color: #fff;
}

.dropdown+.dropdown-options li.selected {
    background: #BA769B;
    color: #fff;
}

.dropdown+.dropdown-options {
    max-height: 400px;
    overflow-y: auto;
}

/* Checkbox & Radio Styles */

@font-face {
    font-family: 'Flat-UI-Icons';
    src: url('/Contents/fonts/Flat-UI-Icons.eot');
    src: url('/Contents/fonts/Flat-UI-Icons.eot?#iefix') format('embedded-opentype'), url('/Contents/fonts/Flat-UI-Icons.woff') format('woff'), url('/Contents/fonts/Flat-UI-Icons.ttf') format('truetype'), url('/Contents/fonts/Flat-UI-Icons.svg#Flat-UI-Icons') format('svg');
    font-weight: normal;
    font-style: normal;
}

.radio {
    margin-bottom: 5px !important;
}

.radioLabel {
    margin: 0 !important;
}

.fui-radio-unchecked,
.fui-radio-checked,
.fui-checkbox-unchecked,
.fui-checkbox-checked {
    display: inline-block;
    font-family: 'Flat-UI-Icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
}

.fui-radio-unchecked:before {
    content: "\e02b";
}

.fui-radio-checked:before {
    content: "\e032";
}

.fui-checkbox-unchecked:before {
    content: "\e033";
}

.fui-checkbox-checked:before {
    content: "\e034";
}

.fui-calendar-solid:before {
    content: "\e022";
}

.checkbox,
.radio {
    margin-bottom: 12px;
    padding-left: 32px;
    position: relative;
    outline: none;
}

.checkbox,
.radio {
    -webkit-transition: color 0.1s linear;
    -moz-transition: color 0.1s linear;
    -o-transition: color 0.1s linear;
    transition: color 0.1s linear;
    -webkit-backface-visibility: hidden;
}

.checkbox input,
.radio input {
    outline: none !important;
    display: none;
}

.checkbox .icons,
.radio .icons {
    color: #CDCDCD;
    display: block;
    height: 20px;
    left: 0;
    position: absolute;
    top: 0;
    width: 20px;
    text-align: center;
    line-height: 20px;
    font-size: 20px;
}

.checkbox .icons,
.radio .icons {
    -webkit-transition: color 0.1s linear;
    -moz-transition: color 0.1s linear;
    -o-transition: color 0.1s linear;
    transition: color 0.1s linear;
    -webkit-backface-visibility: hidden;
}

.checkbox .icons .first-icon-icon,
.radio .icons .first-icon-icon,
.checkbox .icons .second-icon,
.radio .icons .second-icon {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1;
    filter: alpha(opacity=100);
}

.checkbox .icons .second-icon,
.radio .icons .second-icon {
    opacity: 0;
    filter: alpha(opacity=0);
}

.checkbox:hover .first-icon,
.radio:hover .first-icon,
.checkbox:focus .first-icon,
.radio:focus .first-icon {
    opacity: 0;
    filter: alpha(opacity=0);
    /* color: #BA769B; Remarked - WP - March 21, 2025 - make different colour when hover and select radio button */
    color: #A9A9A9;
}

.checkbox:hover .second-icon,
.radio:hover .second-icon,
.checkbox:focus .second-icon,
.radio:focus .second-icon {
    opacity: 1;
    filter: alpha(opacity=100);
    /* color: #BA769B; Remarked - WP - March 21, 2025 - make different colour when hover and select radio button */
    color: #A9A9A9;
}

.checkbox.checked,
.radio.checked {
    color: #BA769B;
}

.checkbox.checked .icons,
.radio.checked .icons {
    color: #BA769B;
}

.checkbox.checked .first-icon,
.radio.checked .first-icon {
    opacity: 0;
    filter: alpha(opacity=0);
}

.checkbox.checked .second-icon,
.radio.checked .second-icon {
    opacity: 1;
    filter: alpha(opacity=100);
}

.checkbox.disabled,
.radio.disabled {
    cursor: default;
    color: #ddd;
}

.checkbox.disabled .icons,
.radio.disabled .icons {
    color: #ddd;
}

.checkbox.disabled .first-icon,
.radio.disabled .first-icon {
    opacity: 1;
    filter: alpha(opacity=100);
}

.checkbox.disabled .second-icon,
.radio.disabled .second-icon {
    opacity: 0;
    filter: alpha(opacity=0);
}

.checkbox.disabled:hover .first-icon,
.radio.disabled:hover .first-icon {
    color: #ddd;
}

.checkbox.disabled.checked .icons,
.radio.disabled.checked .icons {
    color: #ddd;
}

.checkbox.disabled.checked .first-icon,
.radio.disabled.checked .first-icon {
    opacity: 0;
    filter: alpha(opacity=0);
}

.checkbox.disabled.checked .second-icon,
.radio.disabled.checked .second-icon {
    opacity: 1;
    filter: alpha(opacity=100);
}

.checkbox.disabled.checked:hover .second-icon,
.radio.disabled.checked:hover .second-icon {
    color: #ddd;
}

span.required {
    color: #E00000;
}

.styled-form label,
.styled-form legend,
.styled-form p {
    display: block;
    clear: both;
    margin: 20px 0 5px 0;
}

.styled-form .accessibility-label {
    display: block;
    clear: both;
    margin: 20px 0 5px 3px;
}

.income-calc label,
.income-calc legend,
.income-calc p {
    display: block;
    clear: both;
    margin: 20px 0 5px 0;
}

.styled-form .help-message p {
    margin: 10px 0;
}

.styled-form label.radio,
.styled-form label.checkbox {
    margin: 5px 0;
    padding-left: 27px;
}

.styled-form .checkbox label {display: inline;} 

.styled-form input {
    display: block;
    clear: both;
    margin: 0 0;
}

.styled-form fieldset label input {
    display: inline;
    clear: none;
}

.styled-form .form-row {
    position: relative;
}

.styled-form .input.side-by-side label {
    display: inline-block;
    margin-right: 30px;
}

.styled-form .input.side-by-side label:last-of-type {
    margin-right: 0;
}

/* --- Validation Styles --- */

.invalid label,
.required label,
.invalid2 label,
.invalid p,
.required p,
.invalid2 p {
    color: #E00000;
}

.custom-validation p {color: #fff }

.invalid label.not-required,
.required label.not-required,
.invalid2 label.not-required,
.invalid p.not-required,
.required p.not-required,
.invalid2 p.not-required {
    color: #333;
}

.invalid input,
.invalid textarea,
.invalid input.file,
.required input,
.required textarea,
.required input.file {
    border: 1px solid #DF3A3E;
}

.invalid input.not-required,
.invalid textarea.not-required,
.invalid input.file.not-required,
.required input.not-required,
.required textarea.not-required,
.required input.file.not-required {
    border: 1px solid #CDCDCD;
}

/* .validation .error {display: none;} */

.validation .invalid,
.validation .required,
.validation .affirm,
.validation .hint,
.validation .invalid2 {
    display: none;
}

.invalid .validation .invalid,
.required .validation .required,
.affirm .validation .affirm,
.hint .validation .hint,
.invalid2 .validation .invalid2 {
    display: block;
}

.form-row {
    position: relative;
    clear: both;
    overflow: hidden;
}

/* Inline Validation */

.validation p {
    position: relative;
    padding: 7px 10px 7px 30px;
    margin: 10px 0 0 0;
}

/* Inline Validation - Up Arrow */

.validation p:before {
    position: absolute;
    top: -18px;
    left: 10px;
}

.validation p:before {
    content: '';
    display: block;
    width: 0;
    height: 0;
}

.validation p:before {
    border: solid;
    border-width: 10px 8px;
    border-color: transparent transparent #DF3A3E transparent;
}


.custom-validation p:not(:first-child):before {
    content: none ;
}


.lt-ie9 .validation p:before {
    display: none;
}

/* Hide arrow in less than IE9 */

/* Inline Validation Colors */

.validation .error {
    background: #E00000 url(/Contents/i/validation-error@2x.png) 10px 10px no-repeat;
    background-size: 16px 16px;
    color: #fff;
}

.lt-ie9 .validation .error {
    background-image: url(/Contents/i/validation-error.png);
}

.validation .hint {
    background: #F3F3F3 url(/Contents/i/validation-hint@2x.png) 10px 10px no-repeat;
    background-size: 16px 16px;
    color: #666;
}

.ter .validation .hint {
    background-color: #E0E0E0;
}

/* Hint color for login panel */

.validation .affirm {
    background: #CFE1FF url(/Contents/i/validation-affirm@2x.png) 10px 10px no-repeat;
    background-size: 16px 16px;
    color: #666;
}

.lt-ie9 .validation .affirm {
    background-image: url(/Contents/i/validation-affirm.png);
}

.validation .error:before {
    border-color: transparent transparent #DF3A3E transparent;
}

.validation .hint:before {
    border-color: transparent transparent #F3F3F3 transparent;
}

.ter .validation .hint:before {
    border-color: transparent transparent #E0E0E0 transparent;
}

/* Hint color for login panel */

.validation .affirm:before {
    border-color: transparent transparent #CFE1FF transparent;
}

.wrap-form .pri .question-text,
.wrap-form .pri .question .input,
.wrap-form .pri .actions {
    padding: 0 30px;
    position: relative;
}

.wrap-form .pri .validation {
    margin-left: 30px;
    margin-right: 30px;
}

.wrap-form .pri form .content h3 {
    border-bottom: 2px solid #22547D;
    color: #22547D;
    padding: 0 0 10px 0;
    font-size: 23px;
    margin-top: 40px;
    font-weight: 600;
}

.income-calc .content h3 {
    border-bottom: 2px solid #22547D;
    color: #22547D;
    padding: 0 0 10px 0;
    font-size: 23px;
    margin-top: 40px;
    font-weight: 600;
}

.wrap-form .pri form .content h4 {
    color: #333;
    font-size: 17px;
    font-weight: 600;
}

.wrap-view .pri .actions {
    padding: 0 30px;
    position: relative;
}

.wrap-view .pri form .content h3 {
    border-bottom: 2px solid #22547D;
    color: #22547D;
    padding: 0 0 10px 0;
    font-size: 23px;
    margin-top: 40px;
    font-weight: 600;
}

.wrap-view .pri form .content h4 {
    color: #333;
    font-size: 17px;
    font-weight: 600;
}

/* --- Change Validation to two column for screens 900 px and larger --- * / @media only screen and (min-width: 900px) { .wrap-form .pri {background: transparent url(/Contents/i/bkgd-column.png) 66.67% 0 repeat-y;} /* .wrap-form .pri .question {overflow: hidden;} * / /* Set Position & Padding * / .wrap-form .pri {width: 100%;} .wrap-form .pri .question-text, .wrap-form .pri .actions, .wrap-form .pri .content {width: 66.67%;} .wrap-form .pri .question .input {float: left; width: 66.67%;} .wrap-form .pri .question .validation {float: left; width: 33.33%;} /* Validation Styles * / .wrap-form .pri .validation {margin-left: 0; margin-right: 0;} .wrap-form .validation p {margin-top: 0; min-height: 34px; padding: 5px 10px 5px 30px;} .wrap-form .validation p:before {top: 11px; left: -16px;} .wrap-form .validation p:before {border-width: 6px 8px;} .wrap-form .validation .error:before {border-color: transparent #8AC068 transparent transparent;} .wrap-form .validation .hint:before {border-color: transparent #F3F3F3 transparent transparent;} .wrap-form .validation .affirm:before {border-color: transparent #CFE1FF transparent transparent;} .wrap-form .validation .error, .wrap-form .validation .affirm, .wrap-form .validation .hint {background-position: 8px 8px;} }*/

/* --- Settings for a one column question --- */

@media only screen and (min-width: 640px) {
    .one-column-question-wrapper {
        overflow: hidden;
        padding-right: 60px;
    }
    .wrap-form .form-row.one-column-question .validation p {
        margin-top: 0;
        padding: 5px 10px 5px 30px;
    }
    .one-column-question-wrapper .question-field1 {
        width: 100%;
        padding: 0 0 0 30px;
    }
    .one-column-question-wrapper {
        position: relative;
        overflow: hidden;
    }
    .one-column-question-wrapper .actions {
        position: absolute;
        width: 50px !important;
        right: 0;
        padding: 0 !important;
    }
    .one-column-question-wrapper .actions .button {
        padding: 0 !important;
        overflow: hidden;
        width: 25px;
        float: left;
        margin: 0;
    }
    .one-column-question-wrapper .actions .button:nth-child(2) {
        float: right;
    }
    .one-column-question-wrapper .actions .button a {
        width: 25px;
        font-size: 30px;
        color: #86181E;
        background: none;
        overflow: hidden;
        margin: 5px 0 0 0 !important;
        padding: 0;
        font-weight: 600;
        line-height: 30px;
    }
    .one-column-question-wrapper .actions .button a:hover {
        background: #f2f2f2;
    }
    .one-column-matrix-question label {
        display: none;
    }
    .one-column-matrix-question .question label {
        display: block;
        margin-top: 10px;
    }
    .one-column-matrix-question>:nth-child(1) label {
        display: block;
    }
    .one-column-matrix-question>:nth-child(1) .actions .button a {
        margin-top: 50px !important;
    }
}

/* --- Settings for a two column question --- */

@media only screen and (min-width: 640px) {
    .two-column-question-wrapper {
        overflow: hidden;
        padding-right: 60px;
    }
    .wrap-form .form-row.two-column-question .validation p {
        margin-top: 0;
        padding: 5px 10px 5px 30px;
    }
    .two-column-question-wrapper .question-field1,
    .two-column-question-wrapper .question-field2 {
        width: 50%;
        padding: 0 0 0 30px;
    }
    .two-column-question-wrapper {
        position: relative;
        overflow: hidden;
    }
    .two-column-question-wrapper .actions {
        position: absolute;
        width: 50px !important;
        right: 0;
        padding: 0 !important;
    }
    .two-column-question-wrapper .actions .button {
        padding: 0 !important;
        overflow: hidden;
        width: 25px;
        float: left;
        margin: 0;
    }
    .two-column-question-wrapper .actions .button:nth-child(2) {
        float: right;
    }
    .two-column-question-wrapper .actions .button a {
        width: 25px;
        font-size: 30px;
        color: #86181E;
        background: none;
        overflow: hidden;
        margin: 5px 0 0 0 !important;
        padding: 0;
        font-weight: 600;
        line-height: 30px;
    }
    .two-column-question-wrapper .actions .button a:hover {
        background: #f2f2f2;
    }
    .two-column-matrix-question label {
        display: none;
    }
    .two-column-matrix-question .question label {
        display: block;
        margin-top: 10px;
    }
    .two-column-matrix-question>:nth-child(1) label {
        display: block;
    }
    .two-column-matrix-question>:nth-child(1) .actions .button a {
        margin-top: 50px !important;
    }
}

/* --- Settings for a three column question --- */

@media only screen and (min-width: 640px) {
    .three-column-question-wrapper {
        padding-right: 60px;
    }
    .three-column-question-wrapper {
        overflow: hidden;
    }
    .wrap-form .pri .metric-calculationmatrixitems .question-text,
    .wrap-form .pri .metric-calculationmatrixitems .question .input,
    .wrap-form .pri .metric-calculationmatrixdesc .question-text,
    .wrap-form .pri .metric-calculationmatrixdesc .question .input,
    .wrap-form .pri .metric-calculationmatrixcosts .question-text,
    .wrap-form .pri .metric-calculationmatrixcosts .question .input,
    .wrap-form .pri .metric-calculationmatrixquantity .question-text,
    .wrap-form .pri .metric-calculationmatrixquantity .question .input,
    .wrap-form .pri .metric-calculationmatrixsubtotal .question-text,
    .wrap-form .pri .metric-calculationmatrixsubtotal .question .input {
        width: 100%;
        padding: 0;
    }
    .wrap-form .form-row.three-column-question .validation p {
        margin-top: 0;
        padding: 5px 10px 5px 30px;
    }
    .metric-calculationmatrixitems,
    .metric-calculationmatrixdesc,
    .metric-calculationmatrixcosts,
    .metric-calculationmatrixquantity,
    .metric-calculationmatrixsubtotal {
        float: left;
        margin: 0 0 20px 0;
        clear: none;
        padding: 0;
    }
    .metric-calculationmatrixitems {
        width: 33%;
        padding: 0 0 0 30px;
    }
    .metric-calculationmatrixdesc {
        width: 33%;
        padding: 0 0 0 30px;
    }
    .metric-calculationmatrixcosts {
        width: 34%;
        padding: 0 0 0 30px;
    }
    .three-column-question-wrapper {
        position: relative;
        overflow: hidden;
    }
    .three-column-question-wrapper .actions {
        position: absolute;
        width: 50px !important;
        right: 0;
        padding: 0 !important;
    }
    .three-column-question-wrapper .actions .button {
        padding: 0 !important;
        overflow: hidden;
        width: 25px;
        float: left;
        margin: 0;
    }
    .three-column-question-wrapper .actions .button:nth-child(2) {
        float: right;
    }
    .three-column-question-wrapper .actions .button a {
        width: 25px;
        font-size: 30px;
        color: #86181E;
        background: none;
        overflow: hidden;
        margin: 5px 0 0 0 !important;
        padding: 0;
        font-weight: 600;
        line-height: 30px;
    }
    .three-column-question-wrapper .actions .button a:hover {
        background: #f2f2f2;
    }
    #lyrAllCalculationMetricQuestions label,
    .three-column-matrix-question label {
        display: none;
    }
    .three-column-matrix-question .question label {
        display: block;
        margin-top: 10px;
    }
    #lyrAllCalculationMetricQuestions>:nth-child(1) label,
    .three-column-matrix-question>:nth-child(1) label {
        display: block;
    }
    #lyrAllCalculationMetricQuestions>:nth-child(1) .actions .button a,
    .three-column-matrix-question>:nth-child(1) .actions .button a {
        margin-top: 50px !important;
    }
    /* -- Dynamic question three column -- */
    .wrap-form .form-row.three-column-question .validation p {
        margin-top: 0;
        padding: 5px 10px 5px 30px;
    }
    .three-column-question-wrapper .question-field1,
    .three-column-question-wrapper .question-field2 {
        width: 33%;
        padding: 0 0 0 30px;
    }
    .three-column-question-wrapper .question-field3 {
        width: 34%;
        padding: 0 0 0 30px;
    }
}

/* --- Settings for a four column question --- */

@media only screen and (min-width: 640px) {
    .four-column-question-wrapper {
        overflow: hidden;
        padding-right: 60px;
        padding-left: 10px;
    }
    .wrap-form .form-row.four-column-question .validation p {
        margin-top: 0;
        padding: 5px 10px 5px 30px;
    }
    .four-column-question-wrapper .question-field1 {
        width: 25%;
        padding: 0 0 0 20px;
    }
    .four-column-question-wrapper .question-field2,
    .four-column-question-wrapper .question-field3,
    .four-column-question-wrapper .question-field4 {
        width: 25%;
        padding: 0 0 0 20px;
    }
    .four-column-question-wrapper {
        position: relative;
        overflow: hidden;
    }
    .four-column-question-wrapper .actions {
        position: absolute;
        width: 50px !important;
        right: 0;
        padding: 0 !important;
    }
    .four-column-question-wrapper .actions .button {
        padding: 0 !important;
        overflow: hidden;
        width: 25px;
        float: left;
        margin: 0;
    }
    .four-column-question-wrapper .actions .button:nth-child(2) {
        float: right;
    }
    .four-column-question-wrapper .actions .button a {
        width: 25px;
        font-size: 30px;
        color: #86181E;
        background: none;
        overflow: hidden;
        margin: 5px 0 0 0 !important;
        padding: 0;
        font-weight: 600;
        line-height: 30px;
    }
    .four-column-question-wrapper .actions .button a:hover {
        background: #f2f2f2;
    }
    .four-column-matrix-question label {
        display: none;
    }
    .four-column-matrix-question .question label {
        display: block;
        margin-top: 10px;
    }
    .four-column-matrix-question>:nth-child(1) label {
        display: block;
    }
    .four-column-matrix-question>:nth-child(1) .actions .button a {
        margin-top: 50px !important;
    }
}

/* --- Settings for a five column question --- */

@media only screen and (min-width: 640px) {
    .five-column-question-wrapper {
        overflow: hidden;
        padding-right: 60px;
        padding-left: 20px;
    }
    .wrap-form .form-row.five-column-question .validation p {
        margin-top: 0;
        padding: 5px 10px 5px 30px;
    }
    .five-column-question-wrapper .question-field1,
    .five-column-question-wrapper .question-field2,
    .five-column-question-wrapper .question-field3,
    .five-column-question-wrapper .question-field4,
    .five-column-question-wrapper .question-field5 {
        width: 20%;
        padding: 0 0 0 10px;
    }
    .five-column-question-wrapper {
        position: relative;
        overflow: hidden;
    }
    .five-column-question-wrapper .actions {
        position: absolute;
        width: 50px !important;
        right: 0;
        padding: 0 !important;
    }
    .five-column-question-wrapper .actions .button {
        padding: 0 !important;
        overflow: hidden;
        width: 25px;
        float: left;
        margin: 0;
    }
    .five-column-question-wrapper .actions .button:nth-child(2) {
        float: right;
    }
    .five-column-question-wrapper .actions .button a {
        width: 25px;
        font-size: 30px;
        color: #86181E;
        background: none;
        overflow: hidden;
        margin: 5px 0 0 0 !important;
        padding: 0;
        font-weight: 600;
        line-height: 30px;
    }
    .five-column-question-wrapper .actions .button a:hover {
        background: #f2f2f2;
    }
    .five-column-matrix-question label {
        display: none;
    }
    #lyrAllCalculationMetricQuestions .question label,
    .five-column-matrix-question .question label {
        display: block;
        margin-top: 10px;
    }
    /* #lyrAllCalculationMetricQuestions label, .three-column-matrix-question label {display: none;} */
    .five-column-matrix-question>:nth-child(1) label {
        display: block;
    }
    .five-column-matrix-question>:nth-child(1) .actions .button a {
        margin-top: 50px !important;
    }
    /* --- Settings for the advanced calculation matrix question --- */
    .adv-calc-matrix .metric-calculationmatrixitems {
        width: 30%;
        padding: 0 0 0 10px;
    }
    .adv-calc-matrix .metric-calculationmatrixdesc {
        width: 30%;
        padding: 0 0 0 10px;
    }
    .adv-calc-matrix .metric-calculationmatrixcosts {
        width: 15%;
        padding: 0 0 0 10px;
    }
    .adv-calc-matrix .metric-calculationmatrixquantity {
        width: 15%;
        padding: 0 0 0 10px;
    }
    .adv-calc-matrix .metric-calculationmatrixsubtotal {
        width: 10%;
        padding: 0 0 0 10px;
    }
    .adv-calc-matrix .metric-calculationmatrixsubtotal label {
        text-align: right;
    }
}

/* --- Settings for a six column question --- */

@media only screen and (min-width: 640px) {
    .six-column-question-wrapper {
        overflow: hidden;
        padding-right: 60px;
        padding-left: 20px;
    }
    .wrap-form .pri .question-field1 .question-text,
    .wrap-form .pri .question-field1 .question .input,
    .wrap-form .pri .question-field2 .question-text,
    .wrap-form .pri .question-field2 .question .input,
    .wrap-form .pri .question-field3 .question-text,
    .wrap-form .pri .question-field3 .question .input,
    .wrap-form .pri .question-field4 .question-text,
    .wrap-form .pri .question-field4 .question .input,
    .wrap-form .pri .question-field5 .question-text,
    .wrap-form .pri .question-field5 .question .input,
    .wrap-form .pri .question-field6 .question-text,
    .wrap-form .pri .question-field6 .question .input {
        width: 100%;
        padding: 0;
    }
    .wrap-form .form-row.six-column-question .validation p {
        margin-top: 0;
        padding: 5px 10px 5px 30px;
    }
    .question-field1,
    .question-field2,
    .question-field3,
    .question-field4,
    .question-field5,
    .question-field6 {
        float: left;
        margin: 0 0 20px 0;
        clear: none;
        padding: 0;
    }
    .six-column-question-wrapper .question-field1,
    .six-column-question-wrapper .question-field2,
    .six-column-question-wrapper .question-field3,
    .six-column-question-wrapper .question-field4 {
        width: 17%;
        padding: 0 0 0 10px;
    }
    .six-column-question-wrapper .question-field5,
    .six-column-question-wrapper .question-field6 {
        width: 16%;
        padding: 0 0 0 10px;
    }
    .six-column-question-wrapper {
        position: relative;
        overflow: hidden;
    }
    .six-column-question-wrapper .actions {
        position: absolute;
        width: 50px !important;
        right: 0;
        padding: 0 !important;
    }
    .six-column-question-wrapper .actions .button {
        padding: 0 !important;
        overflow: hidden;
        width: 25px;
        float: left;
        margin: 0;
    }
    .six-column-question-wrapper .actions .button:nth-child(2) {
        float: right;
    }
    .six-column-question-wrapper .actions .button a {
        width: 25px;
        font-size: 30px;
        color: #86181E;
        background: none;
        overflow: hidden;
        margin: 5px 0 0 0 !important;
        padding: 0;
        font-weight: 600;
        line-height: 30px;
    }
    .six-column-question-wrapper .actions .button a:hover {
        background: #f2f2f2;
    }
    .six-column-matrix-question label {
        display: none;
    }
    .six-column-matrix-question .question label {
        display: block;
        margin-top: 10px;
    }
    .six-column-matrix-question>:nth-child(1) label {
        display: block;
    }
    .six-column-matrix-question>:nth-child(1) .actions .button a {
        margin-top: 50px !important;
    }
}

@media only screen and (min-width: 900px) {
    .form-row.one-column-question,
    .form-row.two-column-question,
    .form-row.three-column-question,
    .form-row.four-column-question,
    .form-row.five-column-question,
    .form-row.six-column-question {
        width: 100%;
        overflow: visible;
    }
    .one-column-question-wrapper,
    .two-column-question-wrapper,
    .three-column-question-wrapper,
    .four-column-question-wrapper,
    .five-column-question-wrapper,
    .six-column-question-wrapper {
        width: 100%;
        overflow: visible;
    }
    .form-row.one-column-question .validation,
    .form-row.two-column-question .validation,
    .form-row.three-column-question .validation,
    .form-row.four-column-question .validation,
    .form-row.five-column-question .validation,
    .form-row.six-column-question .validation {
        width: 100%;
        margin-top: 0;
        clear: left;
    }
    .form-row.one-column-question .validation p,
    .form-row.two-column-question .validation p,
    .form-row.three-column-question .validation p,
    .form-row.four-column-question .validation p,
    .form-row.five-column-question .validation p,
    .form-row.six-column-question .validation p {
        margin-right: 60px;
    }
}

.question-divider {
    border-top: 1px solid #B9BEC4;
    width: calc(100% - 60px);
    height: 1px;
    display: block;
    margin: 10px 30px 0 30px;
    clear: both;
}

.input-acct input {
    padding-left: 25px;
}

.input-acct:before {
    content: "$";
    display: block;
    line-height: 36px;
    position: absolute;
    top: 2px;
    left: 40px;
    z-index: 100;
}

.input-acct2 input {
    padding-left: 25px;
}

.input-acct2:before {
    content: "$";
    display: block;
    line-height: 36px;
    position: absolute;
    top: 2px;
    left: 10px;
    z-index: 100;
}

/* --- Button styles --- */

.button a {
    width: 100%;
    margin-bottom: 30px;
    padding: 8px 0;
    display: block;
    text-align: center;
    border: none !important;
}

.button a {
    background: #BA769B;
    font-weight: 400;
    border-radius: 3px;
    box-shadow: inset 0 0 1px #000000;
}

.button.featured a {
    background: #A0D1CA;
    color: #3f3f3f;
}

.button.secondary a {
    background: #fff;
    border: 1px solid #868F9A;
    color: #58616C;
}

.button.negative a {
    background: #999;
}

.button.disabled a {
    background: #999;
    cursor: default;
}

.lyrProcessing {
    color: red;
    display: none;
}

.button a:hover,
.button a:focus,
.button a:active {
    background: #3f3f3f;
}

.button.featured a:hover,
.button.featured a:focus,
.button.featured a:active {
    background: #3f3f3f;
    color: #fff;
}

.button.secondary a:hover,
.button.secondary a:focus,
.button.secondary a:active {
    background: #fff;
    border: 1px solid #3f3f3f;
    color: #3f3f3f;
}

.button.negative a:hover,
.button.negative a:focus,
.button.negative a:active {
    background: #8AC068;
}

.button.disabled a:hover,
.button.disabled a:focus,
.button.disabled a:active {
    background: #999;
}

.input-text:disabled {
    background: #d3d7dC;
    color: #999;
}

.two-col .pri .button a {
    max-width: 260px;
}

.actions {
    overflow: hidden;
}

header .actions {
    margin: 0 auto;
    max-width: 260px;
}

/* center header buttons */

.actions .button a {
    display: block;
    width: 260px;
    margin: 0 0 30px 0;
    float: left;
}

header .actions .button:first-child a,
footer .actions .button:first-child a {
    margin-right: 60px;
}

.form-row .actions .button a {
    margin: 30px 0 0 0;
    max-width: 260px;
}

.form-row .actions .button:last-child a {
    margin-right: 0;
}

.form-row-add-more .actions .button a {
    margin: 20px 60px 10px 0;
}

.form-row-add-more .actions .button a {
    color: #1395D8;
    border: 1px solid #1395D8 !important;
    background: transparent;
    font-weight: normal;
}

.form-row-add-more .actions .button a:hover,
.form-row-add-more .actions .button a:focus,
.form-row-add-more .actions .button a:active {
    color: #fff;
    border: 1px solid #1395D8 !important;
    background: #1395D8;
}

.form-row-add-more .actions .button.negative a {
    color: #999;
    border: 1px solid #eee !important;
}

.form-row-add-more .actions .button.negative a:hover,
.form-row-add-more .actions .button.negative a:focus,
.form-row-add-more .actions .button.negative a:active {
    color: #fff;
    border: 1px solid #999 !important;
    background: #999;
}

.qq-upload-button {
    color: #1395D8;
    border: 1px solid #1395D8 !important;
    background: transparent;
    font-weight: normal;
    border-radius: 3px;
    box-shadow: inset 0 0 1px #000000;
}

.qq-upload-button:hover,
.qq-upload-button:focus,
.qq-upload-button:active {
    color: #fff;
    border: 1px solid #1395D8 !important;
    background: #1395D8;
}

.qq-upload-drop-area {
    display: none !important;
}

.actions.form-responses .button.featured a,
.actions.form-responses .button.disabled a {
    width: auto;
    padding: 8px 100px;
}

.actions.form-responses .negative-buttons {
    float: right;
}

.actions.form-responses .negative-buttons .button.negative {
    display: inline-block;
}

.actions.form-responses .negative-buttons .button.negative a {
    width: auto;
    padding: 8px 40px;
    margin: 30px 0 0 10px;
    display: inline-block;
    float: none;
}

/* Help Messages */

.icon-help {
    display: inline-block;
    margin: -5px 0 0 5px;
}

a .icon-help {}

/* ------------------------------------- Formatting ------------------------------------- */

body {
    background: #fff;
    line-height: 1.5em;
}

/* --- Logo Wrapper --- */

.wrap-logo {
    background: #70b5ba;
}

/* Set top background color */

.logo {
    padding: 6px 20px 0 20px;
    position: relative;
}

.logo {
    color: #747878;
    font-size: 24px;
    font-weight: 300;
    font-family: 'Tw Cen MT', 'Open Sans', Calibri, Arial, sans-serif
}

.logo img {margin: 16px 30px 20px 0;}

.logo .logo-image-wrapper {float:left; text-align: left;}
.logo h1 {position: absolute; padding: 32px 20px 0 220px;}

/* --- Header --- */

header {
    position: relative;
}

.header-image {
    max-height: 400px;
}

/* set a max height for the image */

.header-image img {
    width: 100%;
}

/* force the image to fill the width. */

.header-content {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.header-content {
    background: rgba(0, 0, 0, .4);
    color: #fff;
    text-align: center;
}

.header-content-wrapper {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.header-content h1 {
    font-size: 72px;
    padding: 0 10px;
}

.header-blurb {
    padding: 0 30px;
    font-weight: 300;
}

/* --- Navigation --- */

nav {
    background: #383C3A;
}

.wrap-nav {
    background: #383C3A;
    font-size: 16px;
    line-height: 36px;
    font-weight: 300;
}

/* Primary Nav */

.notification-badge {
    background: #1395D8;
    display: inline-block;
    color: #fff;
    line-height: 1.5em;
    border-radius: 10px;
    padding: 0 8px;
    font-size: 10px;
    margin-left: 6px;
    bottom: 2px;
    position: relative;
}

.prinav a:link,
.prinav a:visited {
    color: #fff;
    border-bottom: 2px solid transparent;
}

.prinav .active a {
    border-bottom: 2px solid #fff;
}

.prinav a:hover,
.prinav a:active {
    border-bottom: 2px solid #fff;
    text-decoration: none;
}

.prinav {
    float: left;
}

/*.prinav li {float: left; position: relative;}*/

.prinav li {
    float: left;
}

.prinav li a {
    display: block;
    margin: 0 0 0 30px;
    padding: 5px 5px;
}

.prinav ul {
    position: absolute;
    border-top: 1px solid #fff;
}

.prinav,
.prinav ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.prinav ul li {
    clear: both;
    background: #BA769B;
}

.prinav ul li a {
    margin: 0;
    width: 240px;
    padding: 5px 30px;
}

.prinav ul a:hover,
.prinav ul a:active {
    background-color: #3f3f3f;
}

.prinav ul li a:link,
.prinav ul li a:visited {
    border-bottom: 1px solid #fff;
}

.prinav li ul {
    display: none;
}

.prinav li:hover ul {
    display: block;
}

/* User Nav */

.usernav a:link,
.usernav a:visited {
    color: #fff;
    border-bottom: 2px solid transparent;
}

.usernav .active a {
    border-bottom: 2px solid #fff;
}

.usernav a:hover,
.usernav a:active,
.usernav a:focus {
    text-decoration: none;
}

.usernav {
    float: right;
}

.usernav li {
    position: relative;
}

.usernav li a {
    display: block;
    padding: 5px 54px 5px 30px;
}

.usernav ul {
    position: absolute;
    right: 0;
    text-align: right;
    border-top: 1px solid #fff;
}

.usernav,
.usernav ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.usernav ul li a {
    margin: 0;
    width: 240px;
}

.usernav ul li {
    clear: both;
    background: #005581;
}

.usernav ul a:hover,
.usernav ul a:active,
.usernav ul a:focus {
    background-color: #1295D8;
}

.usernav ul li a:link,
.usernav ul li a:visited {
    border-bottom: 1px solid #fff;
}

.usernav li ul {
    display: none;
}

.usernav li:hover ul,
.usernav li:focus ul {
    display: block;
}

.usernav .profile a {
    background: #BA769B url(/Contents/i/icon-profile@2x.png) 200px 50% no-repeat;
    background-size: 16px 16px;
}

.usernav .log-out a {
    background: #BA769B url(/Contents/i/validation-error@2x.png) 200px 50% no-repeat;
    background-size: 16px 16px;
}

.lt-ie9 .usernav .profile a {
    background: #BA769B url(/Contents/i/icon-profile.png) 196px 50% no-repeat;
}

.lt-ie9 .usernav .log-out a {
    background: #BA769B url(/Contents/i/icon-logout.png) 196px 50% no-repeat;
}

.usernav .name>a:before {
    position: absolute;
    top: 20px;
    right: 26px;
}

.usernav .name>a:before {
    content: '';
    display: block;
    width: 0;
    height: 0;
}

.usernav .name>a:before {
    border: solid;
    border-width: 10px 6px;
    border-color: transparent transparent #8AC068 transparent;
}

.usernav .name>a:before {
    border-color: rgba(255, 255, 255, .2) transparent transparent transparent;
}

.lt-ie9 .usernav .name>a:before {
    display: none;
}

/* Hide arrow in less than IE9 */

/* Subpage Nav */

.subnav h3 {
    padding-bottom: 6px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 0;
}

.subnav ul {
    padding: 0;
    list-style: none;
    border-bottom: 1px solid #ddd;
}

.subnav ul ul {
    border-bottom: none;
}

.subnav li {
    margin: 5px 0;
}

.subnav li.active {
    font-weight: 600;
}

.subnav li.active li {
    font-weight: 400;
}

.subnav li a {
    color: #1295D8;
    display: block;
}

.subnav li li a {
    color: #72CDF4;
    padding-left: 20px;
}

/* --- Fixed Header and Navigation --- */

@media only screen and (min-width: 640px) {
    .wrap-logo,
    nav {
        width: 100%;
        z-index: 10;
    }
    /* indicator for mobile/desktop view - BP - Oct 31, 2017 */
    .ismobile {
        display: none;
    }
}

/* --- Image Highlight --- */

.highlight .picture {
    position: relative;
    width: 100%;
    margin-top: 30px;
}

.highlight .image-highlight-title {
    position: absolute;
    bottom: 0;
    margin: 0 20px 20px 0;
    padding: 10px;
    background: rgba(18, 149, 216, .8);
}

.highlight .image-highlight-title,
.highlight .image-highlight-title a:link,
.highlight .image-highlight-title a:visited {
    color: #fff;
    font-size: 16px
}

.highlight .image-highlight-title a:hover,
.highlight .image-highlight-title a:active {
    color: #fff;
}

/* --- Wrap Content --- */

.wrap-content {
    background: #fff;
    padding-bottom: 10px;
}

.feature-image {
    text-align: center;
}

.ter {
    background: #F3F3F3;
}

/*.app-options {padding:0; list-style: none;}*/

.app-options {
    padding: 0;
}

/* --- Wrap View --- */

.wrap-view {
    background: #fff;
    padding-bottom: 30px;
    margin-top: 0;
    clear: both;
    overflow: hidden;
}

.wrap-view .form-row {
    overflow: hidden;
    clear: both;
}

.wrap-view .question-text,
.wrap-view .question {
    float: left;
}

.wrap-view .question-text {
    width: 33.33%;
    clear: left;
    padding: 0 30px;
}

.wrap-view .question {
    width: 66.67%;
    clear: right;
    padding: 0 30px 0 0;
}

.wrap-view .question-text {
    color: #999;
    text-align: right;
}

/* --- Wrap List --- */

.wrap-list {
    background: #fff;
    padding-bottom: 60px;
}

.list-title {
    background: #1295D8;
    padding: 10px 30px;
    color: #fff;
    overflow: hidden;
}

.list-title h2 {
    margin: 0;
    font-size: 24px;
}

.list-title.featured {
    background: #383C3A;
}

.list-row {
    border-bottom: 1px solid #1295D8;
    overflow: hidden;
}

.list-row .list-item,
.list-row .list-action {
    float: left;
}

.list-row .list-noitem {
    float: none;
}

.list-row .list-item {
    width: 66.67%;
    font-size: 20px;
    line-height: 1.5em;
    padding: 10px 0 10px 30px;
}

.list-row .list-action {
    width: 33.33%;
    font-size: 24px;
    font-weight: 300;
    line-height: 1.8em;
    text-align: right;
    padding: 18px 30px 10px 30px;
}

.list-row .list-noitem {
    width: 100%;
    font-size: 20px;
    text-align: center;
    line-height: 1.5em;
    padding: 10px 0 10px 30px;
}

.list-row .list-item-name {
    float: left;
}

.list-row .list-item-name {
    width: 42%;
    font-size: 24px;
    line-height: 1.5em;
    padding: 10px 0 10px 30px;
}

.list-item-name p {
    margin: 0;
}

.list-row .list-item-name .meta {
    color: #999;
}

.list-row .list-item-name .meta span {
    font-style: italic;
}

.list-row .list-item-score {
    float: left;
}

.list-row .list-item-score {
    width: 21.67%;
    font-size: 20px;
    line-height: 1.5em;
    padding: 10px 0 10px 30px;
}

.list-item-score p {
    margin: 0;
}

.list-row .list-item-check {
    float: left;
}

.list-row .list-item-check {
    width: 3%;
    font-size: 20px;
    line-height: 1.5em;
    padding: 20px 0 10px 30px;
}

.list-item-check p {
    margin: 0;
}

.list-item p,
.list-action p,
.list-status p,
.list-status-apply p,
.list-status-inprogress p,
.list-status-submitted p {
    margin: 0;
}

.list-row .list-item .meta {
    color: #757575;
}

.list-row .list-item .meta span {
    font-style: italic;
}

.rev-completed a:link,
.rev-completed a:visited {
    color: #008000;
}

.rev-completed a:hover,
.rev-completed a:active {
    color: #07384D;
}

.list-row .list-content {
    font-size: 16px;
    line-height: 1.5em;
    color: #666;
    margin: 10px 0 20px 0;
}

.list-subtitle {
    background: #D7EBF4;
    color: #222222;
    line-height: 0.5em;
    overflow: hidden;
}

.list-subtitle .list-subtitle-check {
    float: left;
}

.list-subtitle .list-subtitle-check {
    width: 3%;
    font-size: 24px;
    padding: 20px 0 10px 0px;
}

.list-subtitle-check p {
    margin: 0;
}

.list-subtitle .list-subtitle-name {
    float: left;
}

.list-subtitle .list-subtitle-name {
    width: 42%;
    font-size: 24px;
    padding: 20px 0 10px 30px;
}

.list-subtitle-name p {
    margin: 0;
}

.list-subtitle .list-subtitle-score {
    float: left;
}

.list-subtitle .list-subtitle-score {
    width: 21.67%;
    font-size: 24px;
    padding: 20px 0 10px 25px;
}

.list-subtitle-score p {
    margin: 0;
}

.list-subtitle .list-subtitle-status {
    float: left;
}

.list-subtitle .list-subtitle-status {
    width: 33.33%;
    font-size: 24px;
    text-align: right;
    padding: 20px 30px;
}

.list-subtitle-status p {
    margin: 0;
}

/* --- Wrap Review List --- */

.wrap-list-review {
    padding-bottom: 60px;
    clear: both;
    overflow: visible;
}

.wrap-list-review .list-item,
.wrap-list-review .list-review-status,
.wrap-list-review .list-rank,
.wrap-list-review .list-score,
.wrap-list-review .list-overall {
    display: block;
    float: left;
    text-align: left;
    padding-right: 30px;
}

.wrap-list-review .list-title {
    padding: 10px 0;
}

.wrap-list-review .list-title a {
    color: #fff;
}

.wrap-list-review .list-row {
    position: relative;
    overflow: visible;
    clear: both;
}

.wrap-list-review .list-row .list-item {
    font-size: 16px;
}

.wrap-list-review .list-row .list-item span {
    color: #999;
}

.wrap-list-review .list-row .list-item .meta {
    color: #999;
}

.list-checkbox {
    position: absolute;
    top: 17px;
    left: 5px;
    width: 25px;
    height: 25px;
}

.wrap-list-review .list-item {
    width: 38%;
    padding-left: 30px;
}

.wrap-list-review .list-review-status {
    width: 12%;
}

.wrap-list-review .list-rank {
    width: 12%;
}

.wrap-list-review .list-score {
    width: 11%;
}

.wrap-list-review .list-overall {
    width: 20%;
}

.wrap-list-review .list-action {
    width: 1px;
    height: 1px;
}

.wrap-list-review .list-action a.icon-print {
    position: absolute;
    right: 30px;
    top: 25px;
}

.wrap-list-review .list-row a.icon-print {
    background: transparent url(/Contents/i/icon-print.png) 0 0 no-repeat;
    width: 16px;
    height: 16px;
    display: block;
    background-size: 16px auto;
}

.wrap-list-review .list-row a.icon-print:hover {
    background-position: 0 -25px;
}

.wrap-list-review .list-row a.icon-print:hover span {
    display: block;
    z-index: 1;
}

.wrap-list-review .list-row a.icon-print span {
    display: none;
    position: absolute;
    padding: 5px 0;
    width: 60px;
    background: #444;
    font-size: 14px;
    top: 28px;
    right: -8px;
    border-radius: 3px;
    text-align: center;
    color: #fff;
    line-height: 1.4em;
}

.wrap-list-review .list-row a.icon-print span:before {
    position: absolute;
    top: -16px;
    right: 10px;
}

.wrap-list-review .list-row a.icon-print span:before {
    content: '';
    display: block;
    width: 0;
    height: 0;
}

.wrap-list-review .list-row a.icon-print span:before {
    border: solid;
    border-width: 8px 6px;
    border-color: transparent transparent #444 transparent;
}

.lt-ie9 .wrap-list-review .list-row a.icon-print span:before {
    display: none;
}

/* Hide arrow in less than IE9 */

/* Review Filters */

.reviewer-filters {
    overflow: hidden;
}

.review-section {
    width: 33.33%;
    float: left;
    padding: 0 30px 0 0;
}

.review-section:first-child {
    padding-left: 30px;
}

.review-section .button {
    width: 100% !important;
    margin-top: 36px;
}

.review-section .button a {
    margin-bottom: 0;
}

.review-row {
    clear: both;
    overflow: hidden;
}

.review-row:last-child {
    margin-bottom: 30px;
}

/* --- Wrap Review --- */

.wrap-review {
    background: #FBFBF9;
    padding-bottom: 30px;
    margin-top: 0;
    clear: both;
    overflow: hidden;
}

.wrap-review .pri {
    width: 66.67%;
}

.wrap-review .ter {
    width: 33.33%;
}

.wrap-review .form-row {
    overflow: hidden;
    clear: both;
}

.wrap-review .content {
    clear: both;
}

.wrap-review .pri .question-text,
.wrap-review .pri .question {
    float: left;
}

.wrap-review .pri .question-text {
    width: 33.33%;
    clear: left;
    padding: 0 30px;
}

.wrap-review .pri .question {
    width: 66.67%;
    clear: right;
    padding: 0 30px 0 0;
}

.wrap-review .pri .question-text {
    color: #999;
    text-align: right;
}

.wrap-review .ter .question-text,
.wrap-review .ter .actions,
.wrap-review .ter .question {
    padding: 0 30px;
}

.sticky-toggle {
    display: none;
    height: 16px;
    width: 16px;
}

.sticky-toggle span {
    display: none;
}

#review-form .content h3:first-child {
    margin-bottom: 0;
}

.form-row .no-margin p {
    margin-top: 0;
    margin-bottom: 0;
}

.search-field {
    background: transparent url(/Contents/i/icon-search@2x.png) right 9px no-repeat;
    background-size: 26px 16px;
    padding-right: 30px;
}

.search-field:hover {
    background: #fff url(/Contents/i/icon-search@2x.png) right 9px no-repeat;
    background-size: 26px 16px;
}

@media only screen and (min-width: 900px) {
    .fixed {
        max-width: 399px !important;
    }
}

@media only screen and (min-width: 640px) {
    /* fixes the review form in position */
    .fixed {
        position: fixed;
        max-width: none;
        top: 148px;
        z-index: 9;
        padding-bottom: 30px;
        margin-bottom: 0;
        max-height: 100% !important;
        overflow: auto;
    }
}

/* Allows users to un-fix the position of the review form */

.unfix {
    position: relative !important;
    top: auto !important;
}

.sticky-toggle {
    display: block;
}

/* Styles for the stickiness toggle */

a.icon-pin {
    padding-left: 20px;
    background: transparent url(/Contents/i/icon-pushpin.png) 0 0 no-repeat;
    background-size: 16px 16px;
}

.unfix a.icon-pin {
    padding-left: 20px;
    background: transparent url(/Contents/i/icon-pushpin-off.png) 0 0 no-repeat;
    background-size: 16px 16px;
}

a.icon-pin {
    display: inline-block;
    position: relative;
    float: right;
    margin-top: 15px;
}

/* Styles for the stickiness toggle tool tip */

a.icon-pin:hover span {
    display: block;
}

a.icon-pin span {
    position: absolute;
    padding: 5px 0;
    width: 140px;
    background: #444;
    font-size: 14px;
    top: 28px;
    right: -4px;
    border-radius: 3px;
    text-align: center;
    color: #fff;
}

a.icon-pin span:before {
    position: absolute;
    top: -16px;
    right: 10px;
}

a.icon-pin span:before {
    content: '';
    display: block;
    width: 0;
    height: 0;
}

a.icon-pin span:before {
    border: solid;
    border-width: 8px 6px;
    border-color: transparent transparent #444 transparent;
}

.lt-ie9 a.icon-pin span:before {
    display: none;
}

/* Hide arrow in less than IE9 */

/* Review form buttons styles */

#review-form .actions .button {
    float: left;
    margin: 0;
    width: 48%;
}

#review-form .actions .button:first-child {
    margin-right: 4%;
}

#review-form .actions .button.negative {
    float: none;
    width: 100%;
}

/* --- Wrap App Steps --- */

.wrap-app-steps {
    background: #fff;
    padding-bottom: 60px;
}

.wrap-app-steps ol {
    list-style: none;
    padding: 0;
    margin: 0;
}

.wrap-app-steps li {
    overflow: hidden;
    clear: both;
    padding: 0;
    position: relative;
}

.wrap-app-steps li p {
    padding: 8px 0;
}

.ter .wrap-app-steps li p {
    padding: 5px 0;
}

.wrap-app-steps .list-item,
.wrap-app-steps .list-status {
    float: left;
    line-height: 1.5em;
    font-size: 16px;
}

.ter .wrap-app-steps .list-item,
.ter .wrap-app-steps .list-status {
    font-size: 15px;
}

.wrap-app-steps .list-item {
    width: 75%;
    padding-right: 200px;
    font-weight: 600;
}

.wrap-app-steps .list-item .meta {
    font-weight: 400;
}

.ter .wrap-app-steps .list-item {
    width: 100%;
    padding-right: 60px;
}

.wrap-app-steps .list-title .list-item {
    width: 80%;
}

.wrap-app-steps .list-status {
    width: 150px;
    text-align: left;
    position: absolute;
    top: 0;
    right: 0;
}

.wrap-app-steps .list-title .list-status {
    width: auto;
    white-space: nowrap;
    text-align: left;
    position: absolute;
    top: 0;
    right: 0;
}

.ter .wrap-app-steps .list-status {
    width: 10%;
}

.wrap-app-steps .list-item .checklist-note {
    font-weight: normal;
    font-style: italic;
}

.list-app-steps .list-item {
    padding: 0 0 0 60px;
}

.list-app-steps .list-status {
    padding: 0 30px 0 30px;
}

.list-app-steps .list-content {
    padding: 0 60px 0 40px;
    color: #666;
	margin-top:40px;
}

.wrap-app-steps .list-app-steps .incomplete .list-item,
.wrap-app-steps .incomplete .list-item a:link,
.wrap-app-steps .incomplete .list-item a:visited,
.wrap-app-steps .incomplete .list-item a:hover,
.wrap-app-steps .incomplete .list-item a:active {
    color: #BA769B;
}

.wrap-app-steps .list-app-steps2 .incomplete .list-item,
.wrap-app-steps .incomplete .list-item a:link,
.wrap-app-steps .incomplete .list-item a:visited,
.wrap-app-steps .incomplete .list-item a:hover,
.wrap-app-steps .incomplete .list-item a:active {
    color: #BA769B !important;
}

.wrap-app-steps .list-app-steps .inprogress .list-item,
.wrap-app-steps .inprogress .list-item a:link,
.wrap-app-steps .inprogress .list-item a:visited,
.wrap-app-steps .inprogress .list-item a:hover,
.wrap-app-steps .inprogress .list-item a:active {
    color: #1395D8;
}

.wrap-app-steps .list-app-steps2 .inprogress .list-item,
.wrap-app-steps .inprogress .list-item a:link,
.wrap-app-steps .inprogress .list-item a:visited,
.wrap-app-steps .inprogress .list-item a:hover,
.wrap-app-steps .inprogress .list-item a:active {
    color: #1395D8 !important;
}

.wrap-app-steps .list-app-steps .complete .list-item,
.wrap-app-steps .complete .list-item a:link,
.wrap-app-steps .complete .list-item a:visited,
.wrap-app-steps .complete .list-item a:hover,
.wrap-app-steps .complete .list-item a:active {
    color: #333;
}

.wrap-app-steps .list-app-steps2 .complete .list-item,
.wrap-app-steps .complete .list-item a:link:not(.expand-content),
.wrap-app-steps .complete .list-item a:visited:not(.expand-content),
.wrap-app-steps .complete .list-item a:hover:not(.expand-content),
.wrap-app-steps .complete .list-item a:active:not(.expand-content) {
    color: #333 !important;
}

.wrap-app-steps .list-app-steps .locked .list-item,
.wrap-app-steps .locked .list-item a:link,
.wrap-app-steps .locked .list-item a:visited,
.wrap-app-steps .locked .list-item a:hover,
.wrap-app-steps .locked .list-item a:active {
    color: #A0A6AD;
}

.wrap-app-steps .list-app-steps2 .locked .list-item,
.wrap-app-steps .locked .list-item a:link,
.wrap-app-steps .locked .list-item a:visited,
.wrap-app-steps .locked .list-item a:hover,
.wrap-app-steps .locked .list-item a:active {
    color: #A0A6AD !important;
}

.ter .wrap-app-steps .incomplete .list-item,
.ter .wrap-app-steps .incomplete .list-item a:link,
.ter .wrap-app-steps .incomplete .list-item a:visited,
.ter .wrap-app-steps .incomplete .list-item a:hover,
.ter .wrap-app-steps .incomplete .list-item a:active {
    color: #333333;
}

.ter .wrap-app-steps .inprogress .list-item,
.ter .wrap-app-steps .inprogress .list-item a:link,
.ter .wrap-app-steps .inprogress .list-item a:visited,
.ter .wrap-app-steps .inprogress .list-item a:hover,
.ter .wrap-app-steps .inprogress .list-item a:active {
    color: #333333;
}

.ter .wrap-app-steps .active .list-item,
.ter .wrap-app-steps .active .list-item a:link,
.ter .wrap-app-steps .active .list-item a:visited,
.ter .wrap-app-steps .active .list-item a:hover,
.ter .wrap-app-steps .active .list-item a:active {
    color: #333333;
}

.ter .wrap-app-steps .complete .list-item,
.ter .wrap-app-steps .complete .list-item a:link,
.ter .wrap-app-steps .complete .list-item a:visited,
.ter .wrap-app-steps .complete .list-item a:hover,
.ter .wrap-app-steps .complete .list-item a:active {
    color: #868F9A;
}

.ter .wrap-app-steps .locked .list-item,
.ter .wrap-app-steps .locked .list-item a:link,
.ter .wrap-app-steps .locked .list-item a:visited,
.ter .wrap-app-steps .locked .list-item a:hover,
.ter .wrap-app-steps .locked .list-item a:active {
    color: #868F9A;
}

.wrap-app-steps .incomplete .list-status,
.wrap-app-steps .incomplete .list-status a:link,
.wrap-app-steps .incomplete .list-status a:visited,
.wrap-app-steps .incomplete .list-status a:hover,
.wrap-app-steps .incomplete .list-status a:active {
    color: #333333;
}

.wrap-app-steps .inprogress .list-status,
.wrap-app-steps .inprogress .list-status a:link,
.wrap-app-steps .inprogress .list-status a:visited,
.wrap-app-steps .inprogress .list-status a:hover,
.wrap-app-steps .inprogress .list-status a:active {
    color: #333333;
}

.wrap-app-steps .complete .list-status,
.wrap-app-steps .complete .list-status a:link,
.wrap-app-steps .complete .list-status a:visited,
.wrap-app-steps .complete .list-status a:hover,
.wrap-app-steps .complete .list-status a:active {
    color: #868F9A;
}

.wrap-app-steps .locked .list-status,
.wrap-app-steps .locked .list-status a:link,
.wrap-app-steps .locked .list-status a:visited,
.wrap-app-steps .locked .list-status a:hover,
.wrap-app-steps .locked .list-status a:active {
    color: #333333;
}

.wrap-app-steps .list-status:before {
    content: "";
    width: 26px;
    height: 26px;
    background-color: #fff;
    border: 1px solid #C9CED1;
    border-radius: 50%;
    position: absolute;
    top: 6px;
    right: calc(100% - 15px);
    background-repeat: no-repeat;
    background-size: 16px 166px;
    background-image: url(/Contents/i/checklist-icons@2x.png);
    background-position: 100px 100px;
}

.ter .wrap-app-steps .list-item:after {
    content: "";
    width: 24px;
    height: 24px;
    background-color: #fff;
    border: 1px solid #C9CED1;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    right: 20px;
    background-repeat: no-repeat;
    background-size: 16px 166px;
    background-image: url(/Contents/i/checklist-icons@2x.png);
    background-position: 100px 100px;
}

.wrap-app-steps .list-app-steps .incomplete .list-status:before,
.ter .wrap-app-steps .incomplete .list-item:after {}

.wrap-app-steps .list-app-steps .inprogress .list-status:before {
    background-color: #8AC068;
    border: 1px solid #8AC068;
    background-position: 5px -95px;
}

.wrap-app-steps .list-app-steps2 .inprogress .list-status:before {
    background-color: #8AC068 !important;
    border: 1px solid #8AC068 !important;
    background-position: 5px -95px !important;
}

.ter .wrap-app-steps .list-app-steps .inprogress .list-item:after {
    background-color: #8AC068;
    border: 1px solid #8AC068;
    background-position: 4px -96px;
}

.ter .wrap-app-steps .list-app-steps2 .inprogress .list-item:after {
    background-color: #8AC068 !important;
    border: 1px solid #8AC068 !important;
    background-position: 4px -96px !important;
}

.ter .wrap-app-steps .list-app-steps .active .list-item:after {
    background-color: #29B6F6;
    border: 1px solid #29B6F6;
    background-position: 5px -146px;
}

.ter .wrap-app-steps .list-app-steps2 .active .list-item:after {
    background-color: #29B6F6 !important;
    border: 1px solid #29B6F6 !important;
    background-position: 5px -146px !important;
}

.wrap-app-steps .list-app-steps .complete .list-status:before {
    background-color: #00B16A;
    border: 1px solid #00B16A;
    background-position: 5px -45px;
}

.wrap-app-steps .list-app-steps2 .complete .list-status:before {
    background-color: #00B16A !important;
    border: 1px solid #00B16A !important;
    background-position: 5px -45px !important;
}

.ter .wrap-app-steps .list-app-steps .complete .list-item:after {
    background-color: #00B16A;
    border: 1px solid #00B16A;
    background-position: 4px -46px;
}

.ter .wrap-app-steps .list-app-steps2 .complete .list-item:after {
    background-color: #00B16A !important;
    border: 1px solid #00B16A !important;
    background-position: 4px -46px !important;
}

.wrap-app-steps .list-app-steps .locked .list-status:before {
    background-color: #FFFFFF;
    border: 1px solid #C9CED1;
    background-position: 5px 5px;
}

.wrap-app-steps .list-app-steps2 .locked .list-status:before {
    background-color: #FFFFFF !important;
    border: 1px solid #C9CED1 !important;
    background-position: 5px 5px !important;
}

.ter .wrap-app-steps .list-app-steps .locked .list-item:after {
    background-color: #FFFFFF;
    border: 1px solid #C9CED1;
    background-position: 4px 4px;
}

.ter .wrap-app-steps .list-app-steps2 .locked .list-item:after {
    background-color: #FFFFFF !important;
    border: 1px solid #C9CED1 !important;
    background-position: 4px 4px !important;
}

.wrap-app-steps .list-app-steps .complete:not(.screening-step) .list-status a:after {
    content: "EDIT";
    position: absolute;
    left: -100px;
    top: 10px;
    border: 1px solid #ADB4BB;
    border-radius: 5px;
    font-size: 12px;
    padding: 0 15px;
    line-height: 1.5em;
    background: #fff;
}

.wrap-app-steps .list-app-steps2 .complete .list-status a:after {
    content: "EDIT" !important;
    position: absolute !important;
    left: -100px !important;
    top: 10px !important;
    border: 1px solid #ADB4BB !important;
    border-radius: 5px !important;
    font-size: 12px !important;
    padding: 0 15px !important;
    line-height: 1.5em !important;
    background: #fff !important;
}

.wrap-app-steps .list-app-steps .complete.noedit .list-status a:after {
    content: "";
    display: none;
}

.wrap-app-steps .list-app-steps2 .complete.noedit .list-status a:after,
.wrap-app-steps .list-app-steps2 .inprogress.noedit .list-status a:after,
.wrap-app-steps .list-app-steps2 .incomplete.noedit .list-status a:after {
    content: "" !important;
    display: none !important;
}

.wrap-app-steps .list-app-steps .complete .list-status a:hover:after ,
.wrap-app-steps .list-app-steps .complete .list-status a:focus:after {
    background: #1395D8;
    color: #fff;
    border: 1px solid #1395D8;
}

.wrap-app-steps .list-app-steps2 .complete .list-status a:hover:after {
    background: #1395D8 !important;
    color: #fff !important;
    border: 1px solid #1395D8 !important;
}

.wrap-app-steps .list-app-steps .incomplete .list-item a:after,
.wrap-app-steps .list-app-steps .inprogress .list-item a:after {
    content: " \203A";
}

.wrap-app-steps .list-app-steps2 .incomplete .list-item a:after,
.wrap-app-steps .list-app-steps2 .inprogress .list-item a:after {
    content: " \203A" !important;
}

.wrap-app-steps .list-title {
    position: relative;
}

.list-title .list-status a:link,
.list-title .list-status a:visited,
.list-title .list-status p {
    color: #fff;
    padding: 14px 30px 12px 30px;
    background: #BA769B;
    position: absolute;
    right: 0;
    top: 0;
}

.list-title .list-status a:hover,
.list-title .list-status a:focus,
.list-title .list-status a:active {
    background: #3f3f3f;
    text-decoration: none;
}

.list-title .list-status a:before,
.list-title .list-status p:before {
    content: "STATUS:";
    font-size: 11px;
    font-weight: 300;
    margin-right: 7px;
}

.list-title .list-status a:before,
.list-title .list-status p:before {
    content: "";
    font-size: 11px;
    font-weight: 300;
    margin-right: 7px;
}

.ter .list-app-steps li:first-child {
    margin-top: 10px;
}

.list-app-steps li:nth-child(odd) {
    background-color: #fff;
}

.list-app-steps li:nth-child(even) {
    background-color: #F4F4F5;
}

.list-app-steps li:nth-child(odd) li {
    background-color: #fff;
    color: #999;
}

.list-app-steps li:nth-child(even) li {
    background-color: #F4F4F5;
    color: #999;
}

.wrap-app-steps.inactive .list-title {
    border-bottom: 10px solid #F5F5F5;
    background: #005581;
}

.wrap-app-steps.inactive .list-app-steps {
    border-bottom: 1px solid #1295D8;
}

.wrap-app-steps.inactive .list-app-steps li {
    display: none;
}

/* Wrap App Steps - Add Counter */

.list-app-steps {
    counter-reset: app-steps;
    position: relative;
}

.list-app-steps>li:before {
    content: counter(app-steps, decimal-leading-zero) ".";
    counter-increment: app-steps;
}

.list-app-steps li:before {
    display: block;
    position: absolute;
    left: 30px;
    top: 8px;
}

.ter .list-app-steps li:before {
    top: 5px;
}

.list-app-steps li:before {
    font-size: 16px;
    line-height: 1.5em;
}

.ter .list-app-steps li:before {
    font-size: 15px;
}

.list-app-steps li.incomplete:before {
    color: #1395D8;
}

.list-app-steps li.inprogress:before {
    color: #1395D8;
}

.list-app-steps li.complete:before {
    color: #333;
}

.list-app-steps li.locked:before {
    color: #A0A6AD;
}

.ter .list-app-steps li.incomplete:before {
    color: #333;
}

.ter .list-app-steps li.inprogress:before {
    color: #333;
}

.ter .list-app-steps li.complete:before {
    color: #969CA3;
}

.ter .list-app-steps li.locked:before {
    color: #969CA3;
}

/* Wrap App Steps - Content Toggle */

.list-app-steps ol>li .list-item span {
    display: block;
    float: left;
}

.list-app-steps ol>li .list-item .arrow-down,
.list-app-steps ol>li .list-item .arrow-up {
    width: 0;
    height: 0;
    border: solid;
    border-width: 10px 6px;
}

.list-app-steps ol>li .list-item .arrow-down {
    margin: 24px 0 0 10px;
    border-color: rgba(0, 0, 0, .4) transparent transparent transparent;
}

.list-app-steps ol>li .list-item .arrow-up {
    margin: 12px 0 0 10px;
    border-color: transparent transparent rgba(0, 0, 0, .4) transparent;
}

.lt-ie9 .list-app-steps ol>li .list-item .arrow-down,
.lt-ie9 .list-app-steps ol>li .list-item .arrow-up {
    display: none;
}

/* Hide arrow in less than IE9 */

/* --- Steps --- */

.steps {
    font-weight: 700;
    font-size: 24px;
    line-height: 1.5em;
    padding: 0;
    list-style: none;
}

.steps li {
    margin: 0;
    padding: 0 0 32px 80px;
    position: relative;
}

.steps li span {
    display: block;
    padding: 12px 0 0 0
}

/* Steps - Add Counter */

.steps {
    counter-reset: steps;
}

.steps li:before {
    content: counter(steps);
    counter-increment: steps;
}

.steps li:before {
    display: block;
    position: absolute;
    left: 0;
    height: 60px;
    width: 60px;
}

.steps li:before {
    background: #1295D8;
    border-radius: 100%;
    font-weight: 300;
    text-align: center;
    color: #D6EBF5;
}

.steps li:before {
    line-height: 60px;
    padding: 0;
}

/* --- Steps --- */

.wrap-progress-bar {
    background: #A0C3FF;
}

.progress-bar {
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}

.progress-bar li {
    margin: 0;
    position: relative;
    display: inline;
    float: left;
    padding: 8px 15px 8px 80px;
    height: 48px;
    border-right: 2px solid #fff;
}

.progress-bar li p {
    margin: 0;
}

.progress-bar li:first-child {
    padding-left: 75px;
}

.progress-bar li:last-child {
    border-right: none;
}

.progress-bar .active,
.progress-bar .complete {
    background: #1295D8;
}

/* Steps - Add Counter */

.progress-bar {
    counter-reset: prog-steps;
}

.progress-bar li:before {
    content: counter(prog-steps, decimal-leading-zero);
    counter-increment: prog-steps;
}

.progress-bar li:before {
    display: block;
    position: absolute;
    left: 35px;
}

.progress-bar li:before {
    font-weight: 300;
    font-size: 30px;
    color: rgba(0, 0, 0, .2);
}

.progress-bar li:before {
    line-height: 30px;
    padding: 0;
}

.progress-bar li:first-child:before {
    left: 30px;
}

.progress-bar li:after {
    position: absolute;
    top: 0;
    right: -48px;
}

.progress-bar li:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
}

.progress-bar li:after {
    border: solid;
    border-width: 24px 24px;
    border-color: transparent transparent transparent #A0C3FF;
}

.progress-bar li {
    color: #666;
}

.progress-bar li.complete,
.progress-bar li.active {
    color: #fff;
}

.progress-bar li.complete:after,
.progress-bar li.active:after {
    border-color: transparent transparent transparent #1295D8;
}

.progress-bar li:last-child:after {
    border: none;
}

.progress-bar li p:after {
    position: absolute;
    top: 0;
    right: 4px;
    right: -50px;
}

.progress-bar li p:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
}

.progress-bar li p:after {
    border: solid;
    border-width: 24px 24px;
    border-color: transparent transparent transparent #fff;
}

.progress-bar li:last-child p:after {
    border: none;
}

/* --- Footer --- */

.wrap-footer-marketing {
    background: #383C3A;
    color: #fff;
}

.wrap-footer-links {
    background: #F9F9F9;
}

.wrap-footer-copyright {
    background: #F5F5F5;
    border-top: 1px solid #eee;
}

.wrap-footer-marketing .content {
    margin: 60px 0 80px 0;
}

.wrap-footer-marketing a:link,
.wrap-footer-marketing a:visited {
    color: #fff;
    text-decoration: underline;
}

.wrap-footer-marketing a:hover,
.wrap-footer-marketing a:active {
    color: #fff;
    text-decoration: none;
}

.footer-marketing {
    position: relative;
}

.google-flourish {
    width: 138px;
    position: absolute;
    bottom: 0;
    right: 30px;
}

.google-flourish {
    border-left: 34px solid #1295D8;
    border-right: 34px solid #0F9D58;
}

.google-flourish-inside {
    min-height: 4px;
    border-left: 35px solid #8AC068;
    border-right: 35px solid #F4B400;
}

.footer-links .wrap-plusone {
    padding-bottom: 20px;
    border-bottom: 1px dashed #E5E5E5;
}

.footer-links {
    padding: 25px 30px 25px 30px;
    position: relative;
}

.footer-links .content {
    padding: 0;
}

.footer-links p {
    margin: 0;
}

.footer-nav {
    margin: 20px 0 0 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    display: block;
    line-height: 1.5em;
}

.footer-nav li {
    float: left;
    margin: 0 30px 0 0;
}

.footer-nav li:last-child {
    margin: 0;
}

.footer-nav li a:link,
.footer-nav li a:visited {
    border: none;
}

.footer-copyright {
    display: block;
    font-size: 12px;
    color: #999;
}

/*.orchestrate {position: absolute; top: 10px; right: 30px; padding-top: 30px;}*/

.orchestrate {
    position: absolute;
    bottom: 20px;
    right: 30px;
    padding-top: 20px;
}

/* --- View Application Updates --- */

.wrap-view {
    position: relative;
}

.status-wrapper {
    position: absolute;
    right: 30px;
    top: 5px;
}

.status-wrapper .status-wrapper-label {
    float: left;
    padding: 10px 20px;
}

.status-wrapper .status-wrapper-status {
    float: left;
    border: 1px solid #ececec;
    padding: 10px 20px;
    background: #fafafa;
    color: #00B16A;
    font-size: 20px;
}

.wrap-view-revised {
    margin-bottom: 40px;
}

.wrap-view-revised br {
    display: none;
}

.wrap-view-revised .answer br,
.wrap-view-revised .wrap-view-app-steps br {
    display: initial;
}

.wrap-view-revised .pri,
.wrap-view-revised .sec,
.wrap-view-revised .ter {
    padding-bottom: 0;
    margin-bottom: 0;
    float: right;
}

.wrap-view-revised .pri {
    border: 1px solid #ccc;
    padding-bottom: 30px;
}

.wrap-view-revised .ter {
    border: 1px solid #ccc;
    border-right: none;
    margin-right: -1px;
}

.wrap-view-revised h2 {
    font-size: 22px;
    margin: 30px 0 20px 0;
    color: #2a2c2f;
    font-weight: 400;
}

.wrap-view-revised h3 {
    font-size: 20px !important;
    margin: 20px 0;
    border-bottom: none !important;
}

.wrap-view-revised .styled-form .form-row {
    margin: 0;
    padding: 0;
    border-top: 1px solid #E9EDEF;
}

.wrap-view-revised .styled-form .form-row:first-child {
    border-top: none;
}

.wrap-view-revised .styled-form .question-text {
    background: #FAFAFA;
    text-align: left;
    padding: 10px 20px 10px 30px;
}

.wrap-view-revised .styled-form .question {
    padding: 10px 30px 10px 20px;
}

.wrap-view-app-steps {
    background: #fff;
    padding-bottom: 60px;
}

.wrap-view-app-steps ol {
    list-style: none;
    padding: 0;
    margin: 0;
}

.wrap-view-app-steps li {
    overflow: hidden;
    clear: both;
    padding: 0;
    position: relative;
    border-top: 1px solid #666;
}

.wrap-view-app-steps li p {
    padding: 8px 0;
}

.wrap-view-app-steps li li {
    margin-right: -1px;
}

.wrap-view-app-steps li a {}

.wrap-view-app-steps .list-app-steps li:before {
    padding: 3px 0 0 0;
    font-size: 14px;
    color: #fff !important;
    left: 20px;
}

.wrap-view-app-steps .list-app-steps2 li:before {
    padding: 3px 0 0 0 !important;
    font-size: 14px !important;
    color: #fff !important;
    left: 20px !important;
}

.wrap-view-app-steps .list-app-steps li:first-child {
    margin-top: 0;
}

.wrap-view-app-steps .list-app-steps li:nth-child(odd) {
    background-color: #3B4F6A;
}

.wrap-view-app-steps .list-app-steps li:nth-child(even) {
    background-color: #3B4F6A;
}

.wrap-view-app-steps .list-app-steps li:nth-child(odd) li {
    background-color: #3B4F6A;
    color: #fff;
}

.wrap-view-app-steps .list-app-steps li:nth-child(even) li {
    background-color: #3B4F6A;
    color: #fff;
}

.wrap-view-app-steps .list-app-steps li .list-item {
    padding: 0 50px;
}

.wrap-view-app-steps .list-app-steps2 li .list-item {
    padding: 0 50px !important;
}

.wrap-view-app-steps .list-app-steps li,
.wrap-view-app-steps .list-app-steps li li {
    color: #aaa !important;
    padding: 0 !important;
    position: relative;
}

.wrap-view-app-steps .list-app-steps2 li,
.wrap-view-app-steps .list-app-steps2 li li {
    color: #aaa !important;
    padding: 0 !important;
    position: relative !important;
}

.wrap-view-app-steps .list-app-steps li a:link,
.wrap-view-app-steps .list-app-steps li a:visited {
    color: #fff;
}

.wrap-view-app-steps .list-app-steps2 li a:link,
.wrap-view-app-steps .list-app-steps2 li a:visited {
    color: #fff !important;
}

.wrap-view-app-steps .list-app-steps li.active {
    background: #fff;
}

.wrap-view-app-steps .list-app-steps2 li.active {
    background: #fff !important;
}

.wrap-view-app-steps .list-app-steps li.active a:link,
.wrap-view-app-steps .list-app-steps li.active a:visited {
    color: #1495D8;
}

.wrap-view-app-steps .list-app-steps2 li.active a:link,
.wrap-view-app-steps .list-app-steps2 li.active a:visited {
    color: #1495D8 !important;
}

.wrap-view-app-steps .list-app-steps li.active:before {
    color: #1495D8 !important;
}

.wrap-view-app-steps .list-app-steps2 li.active:before {
    color: #1495D8 !important;
}

.wrap-view-app-steps .list-app-steps li.active:after {
    content: "";
    width: 6px;
    background: #1495D8;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
}

/* hidden notification accessibility */

.screen-reader-alert-invisible {
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    right: 0;
    bottom: 0;
    position: absolute;
}

.checkboxLabel {
    display: inline !important;
    font-weight: 400 !important;
}

.screen-reader-label-invisible {
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    right: 0;
    bottom: 0;
    position: absolute;
}


/* ========================================================================== Media Queries ========================================================================== */

@media only screen and (max-width: 900px) {
    /* Positioning Updates for Columns */
    .three-col .pri {
        width: 100%;
    }
    .three-col .sec,
    .three-col .ter,
    .two-col .pri,
    .two-col .sec,
    .two-col .ter {
        width: 50%;
    }
    .footer-feature,
    .footer-secondary {
        width: 50%;
    }
    .wrap-view-revised.two-col .pri {
        width: 50%;
    }
    .wrap-view-revised.two-col .sec,
    .wrap-view-revised.two-col .ter {
        width: 50%;
    }
    /* Hide secondary column on form pages */
    .tForm .two-col .pri {
        width: 100%;
    }
    .tForm .two-col .sec,
    .tForm .two-col .ter {
        display: none;
    }
    /* Minimize Header */
    .header-content {
        height: 100%;
        width: 100%;
    }
    .header-content-wrapper {
        position: absolute;
        bottom: 0;
        width: 100%;
    }
    .header-blurb {
        display: block;
        font-size: 30px;
    }
    .header-content h1 {
        font-size: 48px;
    }
    .logo {
        font-size: 24px;
    }
    .logo img {
        margin: 0 10px 4px 0;
    }
    footer .actions .button:first-child a {
        margin-right: 0;
    }
    /* --- Wrap List & Wrap App Steps Font Size Adjustments --- */
    h2,
    h3 {
        font-size: 24px;
        line-height: 1.333;
    }
    /* 30 px */
    h4 {
        font-size: 20px;
    }
    /* 24 px */
    .list-title {
        font-size: 20px;
    }
    .list-row .list-item {
        font-size: 20px;
    }
    .list-row .list-action {
        font-size: 20px;
    }
    .list-app-steps ol>li .list-item .arrow-down {
        margin: 15px 0 0 10px;
    }
    .list-app-steps ol>li .list-item .arrow-up {
        margin: 3px 0 0 10px;
    }
    .two-col .pri .button a {
        max-width: none;
    }
    .list-app-steps .list-content {
        padding: 0 60px 0 70px;
    }
    /* Progress Bar Updates */
    .progress-bar li {
        padding: 8px 0 8px 75px;
    }
    .progress-bar li:before {
        left: 30px;
    }
    .progress-bar li span {
        display: none;
    }
    .progress-bar li.active span {
        display: inline;
    }
    /* Remove Absolute Positioning for Orchestrate Logo */
    .footer-links {
        padding-bottom: 0;
    }
    .orchestrate {
        position: relative;
        top: auto;
        right: auto;
        margin-top: 20px;
    }
    footer .actions .button a {
        display: block;
        width: auto;
        float: none;
    }
}

@media only screen and (max-width: 640px) {
    /* indicator for mobile/desktop view - BP - Oct 31, 2017 */
    .ismobile {
        display: block;
    }
    /* Positioning Updates for Columns */
    .three-col .pri,
    .three-col .sec,
    .three-col .ter {
        width: 100%;
    }
    .two-col .pri,
    .two-col .sec,
    .two-col .ter {
        width: 100%;
    }
    .footer-feature,
    .footer-secondary {
        width: 100%;
    }
    .wrap-view-revised.two-col .pri {
        width: 100%;
    }
    .wrap-view-revised.two-col .sec,
    .wrap-view-revised.two-col .ter {
        width: 100%;
    }
    /* Minimize / Re-style Header */
    .header-content {
        position: relative;
        bottom: auto;
    }
    .header-content {
        background: transparent;
        color: #333;
    }
    .header-content-wrapper {
        position: relative;
        bottom: auto;
    }
    .header-blurb {
        font-size: 20px;
    }
    header .actions {
        max-width: none;
    }
    header .actions .button a {
        display: block;
        width: auto;
        float: none;
        margin: 0 30px 30px 30px;
    }
    header .actions .button:first-child a {
        margin-right: 30px;
    }
    .logo .wrap-plusone {
        display: none;
    }
    .list-app-steps .actions {
        padding: 10px 30px 0 30px;
    }
    .list-app-steps .actions .button a {
        width: 100%;
    }
    /* Mobile navigation */
    /* .logo div {
        display: none;
    } */
    .wrap-nav {
        border-top: 2px solid #383C3A;
        font-size: 16px;
        line-height: 36px;
        position: relative;
    }
    .prinav {
        background: #383C3A;
        display: none;
    }
    .prinav a {
        width: 240px;
    }
    .menu:hover .prinav {
        display: block;
        z-index: 105;
    }
    .menu {
        position: absolute;
        width: 84px;
        height: 48px;
    }
    .menu {
        background: #383C3A url(/Contents/i/icon-menu-alt@2x.png) 24px 7px no-repeat;
        background-size: 32px 32px;
    }
    .lt-ie9 .menu {
        background: #383C3A url(/Contents/i/icon-menu.png) 0 14px no-repeat;
        background-size: 24px 16px;
    }
    .prinav {
        position: absolute;
        top: 48px;
    }
    .prinav li {
        float: left;
        clear: both;
    }
    .prinav:hover li {
        display: block;
        background-color: #383C3A;
    }
    .prinav ul {
        position: relative;
    }
    .prinav ul a {
        background: #383C3A;
    }
    .prinav .active {
        display: block;
    }
    .prinav .active {
        background: #383C3A url(/Contents/i/bkgd-check@2x.png) 7px 16px no-repeat;
        background-size: 16px 16px;
    }
    .lt-ie9 .prinav .active {
        background: #383C3A url(/Contents/i/bkgd-check.png) 10px 20px no-repeat;
    }
    .prinav:hover .active a span {
        display: block;
    }
    .prinav a:hover,
    .prinav a:active {
        color: #BA769B;
    }
    .prinav li li a:hover,
    .prinav li li a:active {
        background-color: transparent;
    }
    .prinav li ul {
        display: block;
    }
    .prinav li a {
        margin: 0;
        padding: 5px 30px 5px 30px;
    }
    .prinav ul li a {
        padding: 5px 30px 5px 40px;
    }
    /* Mobile Nav - Reset Borders */
    .prinav a:link,
    .prinav a:visited {
        border-bottom: none !important;
        border-top: 1px solid #fff;
    }
    .prinav ul a:link,
    .prinav ul a:visited {
        border-top: 1px solid #fff;
    }
    .prinav a:hover,
    .prinav a:active,
    .prinav ul li a:hover,
    .prinav ul li a:active {
        background: #BA769B;
    }
    nav {
        height: 50px;
    }
    .prinav {
        border: none;
        border-bottom: 1px solid #fff;
    }
    .prinav ul {
        border-top: none;
    }
    .usernav {
        float: right;
        position: absolute;
        top: 0;
        right: 0;
    }
    .usernav li {
        position: relative;
    }
    /* View Form */
    .wrap-view .question-text {
        width: 100%;
        padding: 0 30px;
        text-align: left;
    }
    .wrap-view .question {
        width: 100%;
        clear: right;
        padding: 0 30px 20px 60px;
    }
    .wrap-view .question-text p,
    .wrap-view .question * {
        margin: 0 0 10px 0;
    }
    /* Wrap List */
    .list-subtitle .list-subtitle-check {
        width: 3%;
        padding-bottom: 0;
    }
    .list-subtitle .list-subtitle-name {
        width: 42%;
        padding-bottom: 0;
    }
    .list-subtitle .list-subtitle-score {
        width: 21.67%;
        padding-bottom: 0;
    }
    .list-subtitle .list-subtitle-status {
        width: 100%;
        margin: 0;
        text-align: left;
    }
    .wrap-app-steps .list-item {
        float: none;
        padding-right: 30px;
    }
    .wrap-app-steps .list-status {
        width: 150px;
        text-align: left;
        position: relative;
        top: auto;
        right: auto;
        margin-left: 75px;
    }
    .wrap-app-steps .list-status a:after {
        content: "";
        display: none;
    }
    .wrap-app-steps .list-title {
        padding: 10px 0 0 0;
    }
    .wrap-app-steps .list-title .list-item {
        padding: 0 30px 10px 30px;
    }
    .wrap-app-steps .list-item,
    .wrap-app-steps .list-status {
        width: 100%;
        text-align: left;
    }
    .wrap-app-steps .list-title .list-item,
    .wrap-app-steps .list-title .list-status {
        display: block;
        position: relative;
        top: auto;
        right: auto;
        float: none;
        width: auto;
        margin-left: 0;
    }
    .wrap-app-steps .list-title .list-status:before {
        display: none;
    }
    .list-title .list-status a:link,
    .list-title .list-status a:visited {
        color: #fff;
        padding: 14px 30px 12px 30px;
        /* background: #0F2C45; */
        position: relative;
        right: auto;
        top: auto;
        display: block;
    }
    .list-title .list-status a:hover,
    .list-title .list-status a:active {
        /* background: #0F2C45; */
    }
    .list-title .list-status p {padding: 0;}
    .list-title .list-status a:link,
    .list-title .list-status a:visited, 
    .list-title .list-status p {position: relative;}
    .list-title .list-status p:before {display: none;}
    .footer-nav {
        font-size: 16px;
    }
    .wrap-footer-marketing .content {
        margin: 30px 0 40px 0;
    }
}

@media only screen and (max-width: 500px) {
    .progress-bar li.active span {
        display: none;
    }
}

@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {}

/* ========================================================================== Helper classes ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.question:before,
.question:after,
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.question:after,
.clearfix:after {
    clear: both;
}

.question,
.clearfix {
    *zoom: 1;
}

/* ========================================================================== Print styles ========================================================================== */

@media print {
    * {
        background: transparent !important;
        box-shadow: none !important;
        text-shadow: none !important;
        color: #000 !important;
        /* Black prints faster: h5bp.com/s */
    }
    a,
    a:visited {
        text-decoration: underline;
    }
    a[href]:after {
        content: " (" attr(href) ")";
    }
    abbr[title]:after {
        content: " (" attr(title) ")";
    }
    /* --- Don't show links for images, or javascript/internal links --- */
    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }
    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }
    thead {
        display: table-header-group;
        /* h5bp.com/t */
    }
    tr,
    img {
        page-break-inside: avoid;
    }
    img {
        max-width: 100% !important;
    }
    @page {
        margin: 0.5cm;
    }
    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }
    h2,
    h3 {
        page-break-after: avoid;
    }
}

/* ================================================================ Side by side fotf ================================================================*/

#side-by-side {
    overflow: hidden;
    height: auto;
    padding: 0px;
}

.left-question-text {
    width: 45%;
    float: left;
    height: auto;
}

.right-question {
    width: auto;
    float: none;
    overflow: hidden;
}

/* ================================================================ Validation message ================================================================*/

.validation_message {
    border: 1px solid #ff0000;
    padding: 10px 10px 10px 40px;
    color: #D63301;
    background: #FFCCBA url(/Contents/images/validation.gif) left center no-repeat;
    background-position: 5px;
}

.validation_message ul {
    margin-left: 20px;
    margin-top: 0px;
    margin-bottom: 0px;
}

.warning {
    border: 1px solid;
    padding: 10px 10px 10px 40px;
    color: #9F6000;
    background: #FEEFB3 url(/Contents/images/box-warning.gif) left center no-repeat;
    background-position: 5px;
}

.success {
    border: 1px solid;
    padding: 10px 10px 10px 40px;
    color: #4F8A10;
    background: #DFF2BF url(/Contents/images/box-success.gif) left center no-repeat;
    background-position: 5px;
}

.errormsg {
    border: 1px solid;
    padding: 10px 10px 10px 40px;
    color: #D8000C;
    background: #FFBABA url(/Contents/images/box-validation.gif) left center no-repeat;
    background-position: 5px;
}

#list-title {
    color: #333;
}

/* ================================================================ Style for rank page ================================================================*/

.list-sort {
    padding-bottom: 30px;
}

.list-sort .ui-sortable-handle {
    cursor: pointer;
}

.list-sort .list-row,
.list-sort .list-row-norecord {
    overflow: hidden;
    border: 1px solid rgb(18, 149, 216);
    margin: 3px 0px;
    background: white;
    min-height: 44px;
}

.list-sort .list-row-norecord {
    text-align: center;
    padding-top: 10px;
}

/*** Content Block Menu ***/

.content-block {
    position: relative;
    overflow: hidden;
}

.content-block .menu {
    position: absolute;
    overflow: hidden;
    right: 15px;
    top: 8px;
}

.content-block .menu ul {
    list-style: none;
    padding: 0;
}

.content-block .menu li {
    float: left;
    margin: 0 0 0 20px;
    font-weight: 700;
}

.content-block .menu li a {
    font-size: 16px;
    color: #e9e9e9;
}

.content-block .menu li a.active {
    color: #fff;
}

/*** for loading screen ***/

#loading {
    display: none;
    position: fixed;
    z-index: 100001;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba( 255, 255, 255, .8) url('/Contents/Images/ajax-loader.gif') 50% 50% no-repeat;
}

/* --- Master Portal Application Updates --- */

.app-updates {
    background: #e8f6f8;
    padding: 20px;
    position: relative;
}

.app-updates-dismiss {
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer;
}

.app-updates-title h3 {
    margin: 0;
    padding-left: 40px;
    font-size: 18px;
}

.app-updates-title {
    position: relative;
    margin-right: 30px;
}

.app-updates-list .app-status {
    font-weight: 600;
}

.app-updates-title:after {
    background: transparent url(/Contents/i/phfh-mp-icons.png) 0 -100px no-repeat;
    background-size: 200px 400px;
    content: "";
    height: 16px;
    width: 16px;
    display: block;
    position: absolute;
    top: 4px;
    left: 4px;
}

.app-updates-list {
    padding: 0 0 0 40px;
    list-style: none;
    margin-bottom: 0;
}

.app-updates-list a:link,
.app-updates-list a:visited {
    color: #1dabb8;
    text-decoration: underline;
}

.app-updates-list a:hover,
.app-updates-list a:active {
    text-decoration: none;
}

.app-updates-list li p {
    margin: 0;
}

/*Homes Gallery*/

.gallery-item-container {
    height: 30%;
    position: relative;
}

.gallery-item {
    background: #f7f7f7;
    border: 1px solid #fff;
    display: inline;
    width: 200px;
    height: 200px;
    margin-right: 5%;
}

.gallery-item img {
    width: 200px;
    height: 200px;
    object-fit: cover;
    padding: 6px;
    margin-bottom: 5%;
    -webkit-box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 0 0px 2px rgba(0, 0, 0, 0.3);
}

.gallery-item a:hover {
    outline: none;
    text-decoration: none;
}

.hide {
    position: absolute;
    top: -9999px;
    left: -9999px;
}

img.img-hl {
    width: 100%;
}

/*testnia edited*/

/* --- View Message Updates --- */

.back-to-previous {
    padding-left: 30px;
    position: relative;
}

.back-to-previous:before {
    position: absolute;
    content: "";
    left: 0;
    width: 36px;
    height: 36px;
    background: transparent url(/Contents/images/view-message-sprite.png) -50px 1px no-repeat;
    background-size: 150px 100px;
}

.back-to-previous span {
    display: none;
}

.wrap-message {
    padding: 40px 40px 0 100px;
    position: relative;
    padding-top: 40px;
}

/* Remarked on August 10, 2021 .wrap-message:focus { outline-style: dashed; outline-color: #00547f; outline-width: 2px; outline-offset: -15px; } */

.wrap-message .form-row:last-child {
    border-bottom: 1px solid #D8DEE6;
    padding-bottom: 40px;
}

.wrap-message:before {
    position: absolute;
    content: "";
    left: 30px;
    top: 24px;
    width: 48px;
    height: 48px;
    border: 1px solid #D9E1E8;
    border-radius: 50%;
}

.wrap-message:before {
    background: transparent url(/Contents/images/view-message-sprite.png) -86px 14px no-repeat;
    background-size: 150px 100px;
}

.message-header-from p {
    margin: 0;
    color: #2F3439;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 600;
}

.message-header-subject h3 {
    margin: 0;
    color: #000;
    font-size: 24px;
    font-weight: 600;
    padding-right: 30px;
}

.message-header-date p {
    margin: 5px 0 0 0;
    color: #51575D;
}

.wrap-message .actions.form-responses .button.featured {
    float: right;
}

.wrap-message .actions.form-responses .button.featured a,
.actions.form-responses .button.disabled a {
    width: auto;
    /* padding: 8px 50px; */
    padding: 8px 100px;
}

.wrap-message.inactive .message-content,
.wrap-message.inactive .actions {
    display: none;
}

.wrap-message:after {
    position: absolute;
    content: "";
    right: 40px;
    top: 70px;
    width: 20px;
    height: 20px;
}

.wrap-message:after {
    background: transparent url(/Contents/images/view-message-sprite.png) 0 0 no-repeat;
    background-size: 150px 100px;
}

.wrap-message.inactive:after {
    background-position: 0 -50px;
}

.errorNotif {
    position: relative;
    padding: 7px 10px 7px 30px;
    margin: 10px 0 0 0;
    background: #E00000 url(/Contents/i/validation-error@2x.png) 10px 10px no-repeat;
    background-size: 16px 16px;
    color: #fff;
    border: none;
}

@media only screen and (max-width: 640px) {
    .wrap-message {
        padding: 40px 40px 0 30px;
    }
    .wrap-message .form-row:last-child {
        border-bottom: 1px solid #D8DEE6;
        padding-bottom: 40px;
    }
    .wrap-message:before {
        display: none;
    }
    .message-header-subject h3 {
        font-size: 20px;
    }
    .wrap-message .actions.form-responses .button.featured {
        float: none;
    }
    .wrap-message .actions.form-responses .button.featured a,
    .actions.form-responses .button.disabled a {
        width: 100%;
    }
}

a.accessibility-skiptomain {
    left: -999px;
    position: absolute;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

a.accessibility-skiptomain:focus {
    background: #e6e6e6;
    color: #0067b8;
    position: fixed;
    top: 0;
    left: 0;
    padding: 30px;
    width: auto;
    height: auto;
    overflow: auto;
    right: 0;
    text-decoration: underline;
    text-align: center;
    z-index: 800;
    outline: none;
}

/* Remarked on August 10, 2021
a:focus {
    outline-style: dashed;
    outline-color: #446cb3;
    outline-offset: -1px;
    outline-width: 2px;
}
button:focus, .button a:focus {
    outline-style: dashed;
    outline-color: #FFF;
    outline-offset: -3px;
    outline-width: 2px;
}

select:focus,
input:focus,
textarea:focus {
    outline-style: dashed;
    outline-color: #446cb3;
    outline-offset: -4px;
    outline-width: 2px;
}

#mainarea:focus {
    outline-style: dashed;
    outline-color: #446cb3;
    outline-offset: -2px;
    outline-width: 2px;
}

.dropzone:focus {
    outline-style: dashed;
    outline-color: #446cb3;
    outline-offset: 2px;
    outline-width: 2px;
}
*/

.prinav li a:focus {
    outline-offset: -2px;
    outline-color: #FFF;
}

.prinav li.prinav-link-container ul li a:focus {
    outline-offset: -6px
}

.lnkLogoTop {
    display: inline-block
}

.prinav ul {
    position: absolute;
    border-top: 1px solid #fff
}

.prinav,
.prinav ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.prinav ul li {
    clear: both;
    background: #005581
}

.prinav ul li a {
    margin: 0;
    width: 240px;
    padding: 5px 30px
}

.prinav ul a:hover,
.prinav ul a:active,
.prinav ul a:focus {
    background-color: #1295d8
}

.prinav ul li a:link,
.prinav ul li a:visited {
    border-bottom: 1px solid #fff
}

.prinav li ul {
    display: none
}

.prinav li:hover ul,
.prinav li:focus ul,
.prinav li.prinav-link-container.focus ul {
    display: block;
    z-index: 100
}

.prinav ul li a:focus {}

.usernav a:link,
.usernav a:visited {
    color: #fff;
    border-bottom: 2px solid transparent
}

.usernav .active a {
    border-bottom: 2px solid #fff
}

.usernav a:hover,
.usernav a:active,
.usernav a:focus {
    text-decoration: none
}

.usernav {
    float: right
}

.usernav li {
    position: relative
}

.usernav li a {
    display: block;
    padding: 5px 54px 5px 30px
}

.usernav ul {
    position: absolute;
    right: 0;
    text-align: right;
    border-top: 1px solid #fff
}

.usernav,
.usernav ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.usernav ul li a {
    margin: 0;
    width: 240px
}

/* Remarked on August 10, 2021
.usernav a:focus {
    outline-style: dashed;
    outline-color: #fff;
    outline-width: 2px;
    outline-offset: -5px
}
*/

.usernav ul li {
    clear: both;
    background: #005581
}

.usernav ul a:hover,
.usernav ul a:active,
.usernav ul a:focus {
    background-color: #3f3f3f
}

.usernav ul li a:link,
.usernav ul li a:visited {
    border-bottom: 1px solid #fff
}

.usernav li ul {
    display: none
}

.usernav li:hover ul,
.usernav li.usernav-link-container.focus ul {
    display: block
}

.lt-ie9 .usernav .profile a {
    background: #005581 url(/contents/public/images/i/icon-profile.png) 196px 50% no-repeat
}

.lt-ie9 .usernav .log-out a {
    background: #005581 url(/contents/public/images/i/icon-logout.png) 196px 50% no-repeat
}

.usernav .name>a:before {
    position: absolute;
    top: 20px;
    right: 26px
}

.usernav .name>a:before {
    content: '';
    display: block;
    width: 0;
    height: 0
}

.usernav .name>a:before {
    border: solid;
    border-width: 10px 6px;
    border-color: transparent transparent #8AC068 transparent
}

.usernav .name>a:before {
    border-color: rgba(255, 255, 255, .2) transparent transparent transparent
}

.lt-ie9 .usernav .name>a:before {
    display: none
}

.modalDialog {
    display: none;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba( 255, 255, 255, .8) url('/contents/images/ajax-loader.gif') 50% 50% no-repeat;
}

body.loading {
    overflow: hidden;
}

/* Make spinner image visible when body element has the loading class */

a.expand-content:link, a.expand-content:visited {
	color: #0264AF !important;
    text-decoration: none;
}

a.expand-content:hover, a.expand-content:active{
	color: #0264AF !important;
    text-decoration: none;
}

.visually-hidden { 
    position: absolute !important;
    height: 1px; 
    width: 1px;
    overflow: hidden;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap; /* added line */
}