/* eResources Orchestrate OAMS Template 
Sheet: main.css
Web Development Firm: www.eResources.com
CSS Coder: Matt Harris (www.focusontheclouds.com)
Date: Sept 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;}

body, button, input, select, textarea {
    -moz-font-feature-settings: "liga", "kern";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* ==========================================================================
   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%;}
.pri {width: 100%;}
.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 {}

/* 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 - test new ro123 "'qc' "test" <b>ro1</b> ~test~., */ 
.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;}
.wrap-content {overflow: visible; display: flex;}
.wrap-content:after {content: ""; clear: both; display: table;}
.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
   ------------------------------------- */

html, body, button, input, select, textarea {font-family: '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: 26px; line-height: 1.333;} /* 30 px */
h4 {font-size: 22px;} /* 24 px */
h5 {font-size: 20px;} /* 20 px */
h6 {font-size: 16px; font-weight: 300;} /* 16 px */

.pri .content h2 {
    font-size: 26px;
    line-height: 1.333;
    font-weight: 600;
}

/*
a:link, a:visited {color: #0287EE; text-decoration: none;}
a:hover, a:active {color: #0287EE; text-decoration: underline;}
*/

/*
a:link, a:visited {color: #0275CE; text-decoration: none;}
a:hover, a:active {color: #0275CE; text-decoration: underline;}
*/
a:link, a:visited {color: #0264AF; text-decoration: none;}
a:hover, a:active {color: #0264AF; 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; border-radius: 3px;}
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 #1295D8;}

.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 #062651;}

.dropdown .dropdown-button {display: block; position: absolute; right: 0; cursor: default;}
.dropdown .dropdown-button {width: 34px; height: 100%; padding-top: 5px; background: #062651; color: #fff; text-align: center;}

.dropdown + .dropdown-options {width: 100%; position: relative; list-style-type: none; padding: 0; margin: 0; border: 1px solid #062651; 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: #062651; color: #fff;}
.dropdown + .dropdown-options li.selected {background: #062651; 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;
}

.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: #A9A9A9;}
.checkbox:hover .second-icon, .radio:hover .second-icon, .checkbox:focus .second-icon, .radio:focus .second-icon {opacity: 1; filter: alpha(opacity=100); color: #A9A9A9;}
*/
/*
.checkbox:focus .first-icon, .radio:focus .first-icon {opacity: 0; filter: alpha(opacity=0); color: #A9A9A9;}
.checkbox:focus .second-icon, .radio:focus .second-icon {opacity: 1; filter: alpha(opacity=100); color: #A9A9A9;}
*/

.radio:focus .first-icon {opacity: 0; filter: alpha(opacity=0); color: #F27801;}
.radio:focus .second-icon {opacity: 1; filter: alpha(opacity=100); color: #F27801;}

.checkbox:focus .first-icon, .radio:focus .first-icon {color: #F27801;}
.checkbox:focus .second-icon, .radio:focus .second-icon {color: #F27801;}

.checkbox.checked, .radio.checked {color: #062651;}
.checkbox.checked .icons, .radio.checked .icons {color: #062651;}
.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: #e20000; font-size: 17px; font-weight: bold;}

.styled-form label {font-weight: 600;}
.styled-form label, .styled-form legend, .styled-form p {display: block; clear: both; margin: 20px 0 5px 0;} 
.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; font-weight: 400;} 
.styled-form input {display: block; clear: both; margin: 0 0;} 
.styled-form fieldset label input {display: inline; clear: none;} 

.styled-form input {display: block; clear: both; margin: 0 0;} 

.styled-form .form-row .form-question-meta {position: absolute; right: 0; top: 0;}

.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;}

.styled-form .input.browse .input-text {
    display: inline-block;
    width: 300px;
    max-width: 75%;
}

.styled-form .input.browse .button {
    display: inline-block;
    max-width: 20%;
    width: 100px;
}

.styled-form .input.browse .button a {
    margin:0;
}

/* --- Validation Styles --- */
/*.invalid label, .required label, .invalid2 label, .invalid p, .required p, .invalid2 p {color: #DF3A3E;}*/
.invalid label, .required label, .invalid2 label, .invalid p, .required p, .invalid2 p {color: #D62326;}
.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, .invalid textarea, .invalid input.file, .required input, .required textarea, .required input.file {border: 1px solid #D62326;}
.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;}
.hint .validation .hint {display: none;}
.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 #F27801 transparent;}
.lt-ie9 .validation p:before {display: none;} /* Hide arrow in less than IE9 */

/* Inline Validation Colors */
/*.validation .error {background: #DF3A3E url(/Contents/i/validation-error@2x.png) 10px 10px no-repeat; background-size: 16px 16px; color: #fff;}*/
.validation .error {background: #D62326 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 .error:before {border-color: transparent transparent #D62326 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 .additional-notes {margin-left: 30px; margin-right: 30px; display: none;}
.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;}

.login-content {text-align: center; padding-bottom: 10px;}
/*input[type="password"]  {background: #fff url(/Contents/i/icon-password.png) right 10px center no-repeat; background-size: 16px 16px;}*/

.fa-eye {
	float: right;
	margin-left: -1px;
	margin-right:2px;
	margin-top: -30px;
	position: relative;
	z-index: 2;
	width:25px;
	background: #fff url(/Contents/i/icon-password.png) right 5px center no-repeat; background-size: 16px 16px;
}
.fa-eye-slash {
	float: right;
	margin-left: -1px;
	margin-right:2px;
	margin-top: -30px;
	position: relative;
	z-index: 2;
	width:25px;
	background: #fff url(/Contents/i/icon-password-slash.png) right 5px center no-repeat; background-size: 16px 16px;
}
.fa-eye:hover, .fa-eye-slash:hover {
	cursor:pointer;
}
/* --- 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 #F27801 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 .question-field1,
  .two-column-question-wrapper .question-field2 {width: 30%; padding: 0 10px 0 0;}

  .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: 1px solid #062651;}

/* Accessibility
.button a {background: #0287EE; font-weight: 400; border-radius: 3px; box-shadow: inset 0 0 1px #000000;} */
.button a {background: #0275ce; font-weight: 400; border-radius: 3px; box-shadow: inset 0 0 1px #000000;} 

/*.button.featured a {background: #DF3A3E; border: 1px solid #CF0E05; }*/
.button.featured a {background: #D62326; border: 1px solid #CF0E05; }
.button.secondary a {background: transparent; border: 1px solid #062651; color: #062651;}
/*
.button.negative a {background: #999;}
.button.disabled a {background: #999; cursor:default;}
*/
.button.negative a {background: #6a6a6a;}
.button.disabled a {background: #6a6a6a; cursor:default;}
.lyrProcessing {color:#e20000; display:none;}

.button a:hover, .button a:focus, .button a:active {background: #062651;} 
.button.featured a:hover, .button.featured a:focus, .button.featured a:active {background: #CF0E05; border: 1px dashed #000;}
.button.secondary a:hover, .button.secondary a:focus, .button.secondary a:active {background: transparent; border: 1px solid #0287EE; color: #0287EE;}
.button.negative a:hover, .button.negative a:focus, .button.negative a:active {background: #F27801;}
.button.disabled a:hover, .button.disabled a:focus, .button.disabled a:active {background: #999;}
.input-text:disabled {background: #d3d7dC; color: #999;}

.btnBrowse a, .btnRemove a {
    width: 80px;
    color: #FFF;
    padding: 7px;
    text-align: center;
    border: 1px solid #062651;
    background: #0287EE;
    font-weight: 400;
    border-radius: 3px;
    box-shadow: inset 0 0 1px #000000;
}
.btnBrowse a:hover, .btnBrowse a:focus, .btnBrowse a:active {
    background: #062651;
    text-decoration: none;
}
.btnRemove a:hover, .btnRemove a:focus, .btnRemove a:active {
    background: #062651;
    text-decoration: none;
} 

.two-col .pri .button a {max-width: 260px;}

.actions {overflow: hidden;}
header .actions {max-width: 300px; padding: 0 30px;} /* center header buttons */
.actions .button a {display: block; width: 260px; margin: 0 0 30px 0; float: left;}
.actions .button.btnNextRank a {display: block; width: 260px; margin: 0 0 30px 0; float: right;}

header .actions .button:first-child a, 
footer .actions .button:first-child a {}

.form-row .actions .button a {margin: 30px 60px 0 0; max-width: 260px;}
.form-row .actions .button.btnFinalizeRankOrder a {
    margin: 30px 0 0 20px;
    max-width: 260px;
    float: right;
}
.form-row .actions .button.btnSaveRankOrder a {
    margin: 30px 0 0 20px;
    max-width: 160px;
    float: right;
    background-color: #fff;
    color: #0275ce;
}
.form-row .actions .button.btnNextRank a {margin: 30px 0 0 0; max-width: 175px;}
.form-row .actions .button:last-child a {margin-right: 0;}
.form-row-add-more .actions .button a {margin: 20px 60px 10px 0;}
.ter .form-row .actions .button a {max-width: 100%; width: 100%;}

/* -- Accessibility
.form-row-add-more .actions .button a {color: #0287EE; border: 1px solid #0287EE !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 #0287EE !important; background: #0287EE;}*/

.form-row-add-more .actions .button a {color: #0275CE; border: 1px solid #0275CE !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 #0275CE !important; background: #0275CE;}

/* -- Accessibility
.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;}*/

.form-row-add-more .actions .button.negative a {color: #4C4C4C; 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 #4C4C4C !important; background: #4C4C4C;}

.qq-upload-button {color: #0287EE; border: 1px solid #0287EE !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 #0287EE !important; background: #0287EE;}
.qq-upload-drop-area {display:none !important;}

.actions.form-responses .button.featured a, .actions.form-responses .button.disabled a {width: auto; padding: 8px 50px;} 
.actions.form-responses .negative-buttons {float: right;}
.actions.form-responses .negative-buttons.btnCancelRankOrder {float: left;}
.actions.form-responses .negative-buttons.btnBackRank {float: left;}
.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;}
.actions.form-responses .negative-buttons.btnBackRank .button.negative a {width: auto; padding: 8px 40px; margin:30px 0px; display: inline-block; float: none;}

/* -- Accessibility
.form-browse  {display: inline-block; width: 105px; padding: 7px 0; text-align: center; color: #0287EE; border: 1px solid #0287EE !important; background: transparent; font-weight: normal; border-radius: 3px; box-shadow: inset 0 0 1px #000000;} 
.form-browse:hover, .form-browse:focus, .form-browse:active {color: #fff; border: 1px solid #0287EE !important; background: #0287EE;}*/
.form-browse  {display: inline-block; width: 105px; padding: 7px 0; text-align: center; color: #0275CE; border: 1px solid #0275CE !important; background: transparent; font-weight: normal; border-radius: 3px; box-shadow: inset 0 0 1px #000000;}
.form-browse:hover, .form-browse:focus, .form-browse:active {color: #fff; border: 1px solid #0275CE !important; background: #0275CE;}

/* -- Accessibility
.form-browse.negative {display: inline-block; width: 105px; padding: 7px 0; text-align: center; color: #999; border: 1px solid #ccc !important; background: transparent; font-weight: normal; border-radius: 3px; box-shadow: inset 0 0 1px #000000;}*/
.form-browse.negative {display: inline-block; width: 105px; padding: 7px 0; text-align: center; color: #4C4C4C; border: 1px solid #4C4C4C !important; background: transparent; font-weight: normal; border-radius: 3px; box-shadow: inset 0 0 1px #000000;}
.form-browse.negative-institution-fill {display: inline-block; width: 105px; padding: 7px 0; text-align: center; color: red; border: 1px solid red !important; background: transparent; font-weight: normal; border-radius: 3px; box-shadow: inset 0 0 1px #000000;}
/* -- Accessibility
.form-browse.negative:hover, .form-browse.negative:focus, .form-browse.negative:active {color: #fff; border: 1px solid #999 !important; background: #999;}*/
.form-browse.negative:hover, .form-browse.negative:focus, .form-browse.negative:active {color: #fff; border: 1px solid #999 !important; background: #4C4C4C;}

.apply-fellowship  {display: inline-block; width: 105px; padding: 7px 0; text-align: center; color: #0287EE; border: 1px solid #0287EE !important; background: transparent; font-weight: normal; border-radius: 3px; box-shadow: inset 0 0 1px #000000; cursor: pointer;}
.apply-fellowship:hover, .apply-fellowship:focus, .apply-fellowship:active {color: #fff; border: 1px solid #0287EE !important; background: #0287EE; cursor: pointer;}
.apply-fellowship.applied {display: inline-block; width: 105px; padding: 7px 0; text-align: center; color: #00B16A; border: none !important; background: transparent; font-weight: normal; border-radius: 3px; box-shadow: none !important; cursor: default; pointer-events: none;}

/* Help Messages */
.icon-help {display: inline-block; margin: -5px 0 0 5px;}
a .icon-help {}

/* Multiple Column Radio or Check Box Lists */
@media only screen and (min-width: 960px) {
.skills-question fieldset div, .two-column-options fieldset div {width: calc(50% - 10px); display: inline-block; vertical-align:top; }
.two-column-options fieldset div:nth-child(odd), .skills-question fieldset div:nth-child(odd) {margin-left: 10px;}
.two-column-options fieldset div:nth-child(even), .skills-question fieldset div:nth-child(even) {margin-right: 10px;}
}

/* -------------------------------------
   Formatting
   ------------------------------------- */
body {background: #fff; line-height: 1.5em;}

/* --- Logo Wrapper --- */
.wrap-logo {background: #fff;} /* Set top background color */
.logo {padding: 10px 30px; 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: 0;}

/* --- 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: left;}
.header-content-wrapper {position: absolute; bottom: 30px; left: calc(50% - 600px); width: 1200px;} 
.header-content-wrapper p {padding-left: 30px;}

.header-content h1 {font-size: 72px; padding: 0 10px;}
.header-blurb {padding: 0 30px; font-weight: 300;}


/* --- Navigation --- */
nav {background: #062651;} 
.wrap-nav {background: #062651; font-size: 16px; line-height: 36px; font-weight: 300;}

/* Primary Nav */
.notification-badge {background: #0287EE; 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 a {display: block; margin: 0 0 0 30px; padding: 5px 0;}

.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: #062651;}
.prinav ul li a {margin:0; width: 240px; padding: 5px 30px;}

.prinav ul a:hover, .prinav ul a:active {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 {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: #062651;}
.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: #062651 url(/Contents/i/icon-profile@2x.png) 200px 50% no-repeat; background-size: 16px 16px;}
.usernav .log-out a {background: #062651 url(/Contents/i/validation-error@2x.png) 200px 50% no-repeat; background-size: 16px 16px;}  

.lt-ie9 .usernav .profile a {background: #062651 url(/Contents/i/icon-profile.png) 196px 50% no-repeat;}
.lt-ie9 .usernav .log-out a {background: #062651 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 #F27801 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: #0d6e9f;
    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;}
.pri, .sec, .ter {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: 50px; 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;}
/* Accessibility
.wrap-view .question-text {color: #999; text-align: right;} */
.wrap-view .question-text {color: #6a6a6a; text-align: right;}

/* --- Wrap List --- */
.wrap-list {background: #fff; padding-bottom: 60px;}

.list-title {background: #062651; padding: 10px 30px; color: #fff; overflow: hidden;}
.list-title h2 {margin:0; font-size: 24px;}
.list-title.featured {background: #062651;}
.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-check-reader {position: absolute;}
.list-item-check-reader {width: 3%; font-size: 20px; line-height: 1.5em; padding: 0 0 0 5px;}
.list-item-check-reader p {margin: 0;}
.list-subtitle .list-item-check-reader {width: 3%; font-size: 20px; line-height: 1.5em; padding: 10px 0 0 5px;}

.list-item-reader {float: left;}
.list-item-reader {width: 100%; font-size: 16px; line-height: 1.5em; padding: 0px 0 0px 60px;}
.list-item-reader p {margin:0;}
.list-item-reader .meta {color: #999;}
.list-item-reader .meta span {font-style: italic;}

.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: #999;}
.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: 5%; font-size: 18px; padding: 20px 0 10px 30px;}
.list-subtitle-check p {margin:0;}

.list-subtitle .list-subtitle-name {float: left;}
.list-subtitle .list-subtitle-name {width: 30%; font-size: 18px; padding: 20px 0 10px 30px;}
.list-subtitle-name p {margin:0;}

.list-queue-subtitle-name {float: left;}
.list-queue-subtitle-name {width: 70%; font-size: 18px; padding: 20px 0 10px 30px;}
.list-queue-subtitle-name p {margin:0;}

.list-queue-subtitle-action {float: right;}
.list-queue-subtitle-action {width: 150px; font-size: 18px; padding: 20px 0 10px 30px;}
.list-queue-subtitle-action p {margin:0;}

.list-row .list-item-interview {float: left;}
.list-row .list-item-interview {width: 30%; font-size: 18px; padding: 20px 0 10px 30px;}
.list-item-interview p {margin:0;}

.list-subtitle .list-subtitle-score{float: left;}
.list-subtitle .list-subtitle-score {width: 10.7%; font-size: 18px;  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: 18px; 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 */

#queueApplicationList .list-item {display: inline-block;}
#queueApplicationList .list-item:nth-child(2) {width: 100%;}
#queueApplicationList .list-item:nth-child(3) {width: 40%;}
#queueApplicationList .list-item:nth-child(4) {width: 25%;}
#queueApplicationList .list-item:nth-child(5) {width: 25%;}

/* 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 10px 0;}
.wrap-review .pri .question-text {color: #999; text-align: right;}
.wrap-review .pri .memo-question .question, .wrap-review .pri .memo-question .question-text {padding: 10px 30px 20px 0;}

.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: 0; background: #F3F3F3; z-index: 100; 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, .ter .wrap-app-steps .list-ref {font-size: 15px;}
.wrap-app-steps .list-item, .wrap-app-steps .list-ref {width: 100%; padding-right: 200px; font-weight: 600;}
.wrap-app-steps .list-item .meta {font-weight: 400;}
.ter .wrap-app-steps .list-item, .ter .wrap-app-steps .list-ref {width: 100%; padding-right: 60px;}
.wrap-app-steps .list-title .list-item {width: 70%;}



/*.wrap-app-steps .list-status {width: 150px; text-align: left; position: absolute; top: 0; right: 0;}*/
.wrap-app-steps .list-status {width: 180px; text-align: left; position: absolute; top: 0; right: 0;}
.wrap-app-steps .list-toggler {width: 430px; text-align: left; position: absolute; top: 0; right: 0;}
.wrap-app-steps .list-toggler .agenda-view, .wrap-app-steps .list-toggler .calendar-view, .wrap-app-steps .list-toggler .appt-view { margin: 10px 0px 10px 0px;} 
.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, .list-split-steps .list-ref {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;}

.list-split-steps .list-item {padding: 0 0 0 60px;}
.list-split-steps .list-item.appt {padding: 0 0 20px 60px;}
.list-split-steps .lyrcalendar {padding: 0 40px 0px 60px;}
.list-split-steps .list-status {padding: 0 30px 0 30px;}
.list-split-steps .list-content {padding: 0 60px 0 40px; color: #666;}

/* -- Accessibility Patch
.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: #0287EE;}
.wrap-app-steps .list-split-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: #0287EE;}
.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: #0287EE !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: #0287EE;}
.wrap-app-steps .list-split-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: #0287EE;}
.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: #0287EE !important;}*/

.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: #0264AF;}
.wrap-app-steps .list-split-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: #0264AF;}
.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: #0264AF !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: #0264AF;}
.wrap-app-steps .list-split-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: #0264AF;}
.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: #0264AF !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-split-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, .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 !important;}

/* -- Accessibility Patch
.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; pointer-events: none;}
.wrap-app-steps .list-split-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; pointer-events: none;}
.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; pointer-events: none;}
*/

.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: #61676F; pointer-events: none;}
.wrap-app-steps .list-split-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: #61676F; pointer-events: none;}
.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: #61676F !important; pointer-events: none;}

.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, .wrap-app-steps .incomplete .list-status a:focus {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, .wrap-app-steps .inprogress .list-status a:focus {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, .wrap-app-steps .complete .list-status a:focus {
    color: #666f7a;
}
.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, .wrap-app-steps .locked .list-status a:focus {color: #333333; pointer-events: none;}

.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-split-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: #F27801; border: 1px solid #F27801; background-position: 5px -95px;}
.wrap-app-steps .list-split-steps .inprogress .list-status:before {background-color: #F27801; border: 1px solid #F27801; background-position: 5px -95px;}
.wrap-app-steps .list-app-steps2 .inprogress .list-status:before {background-color: #F27801 !important; border: 1px solid #F27801 !important; background-position: 5px -95px !important;}

.ter .wrap-app-steps .list-app-steps .inprogress .list-item:after {background-color: #F27801; border: 1px solid #F27801; background-position: 4px -96px;}
.ter .wrap-app-steps .list-split-steps .inprogress .list-item:after {background-color: #F27801; border: 1px solid #F27801; background-position: 4px -96px;}
.ter .wrap-app-steps .list-app-steps2 .inprogress .list-item:after {background-color: #F27801 !important; border: 1px solid #F27801 !important; background-position: 4px -96px !important;}

.ter .wrap-app-steps .list-app-steps .active .list-item:after {background-color: #0287EE; border: 1px solid #0287EE; background-position: 5px -146px;}
.ter .wrap-app-steps .list-split-steps .active .list-item:after {background-color: #0287EE; border: 1px solid #0287EE; background-position: 5px -146px;}
.ter .wrap-app-steps .list-app-steps2 .active .list-item:after {background-color: #0287EE !important; border: 1px solid #0287EE !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-split-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-split-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-split-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-split-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 .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-split-steps .complete .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 .withdrawn-steps  .withdraw-button .list-item a:after {content: "WITHDRAW"; top: 10px; border: 1px solid #ADB4BB; border-radius: 5px; font-size: 14px; padding: 0 15px; line-height: 1.5em; background: #fff;color: #868F9A;}

.wrap-app-steps .list-app-steps .complete.noedit .list-status a:after {content: ""; display: none;}
.wrap-app-steps .list-split-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: #0287EE; color: #fff; border: 1px solid #0287EE;}
.wrap-app-steps .list-split-steps .complete .list-status a:hover:after, .wrap-app-steps .list-split-steps .complete .list-status a:focus:after {background: #0287EE; color: #fff; border: 1px solid #0287EE;}
.wrap-app-steps .list-app-steps2 .complete .list-status a:hover:after, .wrap-app-steps .list-app-steps2 .complete .list-status a:focus:after {background: #0287EE !important; color: #fff !important; border: 1px solid #0287EE !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-split-steps .incomplete .list-item a:after,
.wrap-app-steps .list-split-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:before, .list-title .list-status .withdraw-btn a:before, .list-title .list-status .remove-btn a:before {display: none;}
.list-title .list-status {position: absolute; right: 0; top: 50px;}
.list-title .list-status p {margin: 13px 0;}
.list-title .list-status a:link, .list-title .list-status a:visited {color: #fff; padding: 20px 30px 20px 30px; background: #0275ce;}
.wrap-app-steps .list-title .withdraw-btn, .wrap-app-steps .list-title .remove-btn, .wrap-app-steps .list-title p {display: inline-block;}
.wrap-app-steps .list-title .withdraw-btn, .wrap-app-steps .list-title .remove-btn {margin-right: 20px;}
.wrap-app-steps .list-title .withdraw-btn a, .wrap-app-steps .list-title .remove-btn a {border: none; font-size: 14px; padding: 3px 15px; line-height: 1.5em; background: #4f6571; color: #fff;}


.list-title .list-status a:hover, .list-title .list-status a:active, .list-title .list-status a:focus {background: #F27801; text-decoration: none;}
.list-title .list-status a:before {content: "STATUS:"; font-size: 11px; font-weight: 300; margin-right: 7px;}
.list-title .list-status a.apply: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;}

.ter .list-split-steps li:first-child {margin-top: 10px;}
.list-split-steps li:nth-child(odd) {background-color: #fff;}
.list-split-steps li:nth-child(even) {background-color: #F4F4F5;}
.list-split-steps li:nth-child(odd) li {background-color: inherit;}
.list-split-steps li:nth-child(even) li {background-color: inherit;}

.ref-detail {font-size: 16px; overflow: hidden; margin: 0; padding-left: calc(1px);}
.ref-detail li {padding: 0 0 0 60px; color: #333;}

.wrap-app-steps.inactive .list-title {border-bottom: 10px solid #F5F5F5; background: #0287EE;}
.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.inactive .list-split-steps {border-bottom: 1px solid #1295D8;}
.wrap-app-steps.inactive .list-split-steps li {display: none;}

/* Wrap App Steps - Add Counter  */ 
.list-app-steps {counter-reset: app-steps 0; position: relative;}
.list-app-steps > li:before {content: counter(app-steps, decimal) "."; counter-increment: app-steps;}

.list-split-steps {counter-reset: split 4; position: relative;}
.list-split-steps > li.split-step:before {content: counter(split, decimal) "."; counter-increment: split;}

.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-split-steps li:before {display: block; position: absolute; left: 30px; top: 8px;}
.ter .list-split-steps li:before {top: 5px;}
.list-split-steps li:before {font-size: 16px; line-height: 1.5em;}
.ter .list-split-steps li:before {font-size: 15px;}

.list-app-steps li.incomplete:before {color: #0287EE;}
.list-app-steps li.inprogress:before {color: #0287EE;}
.list-app-steps li.complete:before {color: #333;}
/*-- Accessibility
    .list-app-steps li.locked:before {color: #A0A6AD;}*/
.list-app-steps li.locked:before {color: #61676F;}


.list-split-steps li.incomplete:before {color: #0287EE;}
.list-split-steps li.inprogress:before {color: #0287EE;}
.list-split-steps li.complete:before {color: #333;}
/*-- Accessibility
.list-split-steps li.locked:before {color: #A0A6AD;}*/
.list-split-steps li.locked:before {color: #61676F;}

.ter .list-app-steps li.incomplete:before {color: #333;}
.ter .list-app-steps li.inprogress:before {color: #333;}
/*-- Accessibility
.ter .list-app-steps li.complete:before {color: #969CA3;}
.ter .list-app-steps li.locked:before {color: #969CA3;}*/
.ter .list-app-steps li.complete:before {color: #61676F;}
.ter .list-app-steps li.locked:before {color: #61676F;}

.ter .list-split-steps li.incomplete:before {color: #333;}
.ter .list-split-steps li.inprogress:before {color: #333;}
/*-- Accessibility
.ter .list-split-steps li.complete:before {color: #969CA3;}
.ter .list-split-steps li.locked:before {color: #969CA3;}*/
.ter .list-split-steps li.complete:before {color: #61676F;}
.ter .list-split-steps li.locked:before {color: #61676F;}

/* 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 */

.list-split-steps ol > li .list-item span {display: block; float: left;}
.list-split-steps ol > li .list-item .arrow-down, 
.list-split-steps ol > li .list-item .arrow-up {width: 0; height: 0; border: solid; border-width: 10px 6px;}
.list-split-steps ol > li .list-item .arrow-down {margin: 24px 0 0 10px; border-color: rgba(0,0,0,.4) transparent transparent transparent;}
.list-split-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-split-steps ol > li .list-item .arrow-down, 
.lt-ie9 .list-split-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: #7C7E7F; color: #fff;}
*/
.wrap-footer-marketing {background: #6C6D6E; 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 #F27801; 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;}
*/
.footer-copyright {display: block; font-size: 12px; color: #6a6a6a;}

/*.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: #007446;
        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-split-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-split-steps li:first-child {margin-top: 0;}
.wrap-view-app-steps .list-split-steps li:nth-child(odd) {background-color: #3B4F6A;}
.wrap-view-app-steps .list-split-steps li:nth-child(even) {background-color: #3B4F6A;}
.wrap-view-app-steps .list-split-steps li:nth-child(odd) li {background-color: #3B4F6A; color: #fff;}
.wrap-view-app-steps .list-split-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-split-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-split-steps li, .wrap-view-app-steps .list-split-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-split-steps li a:link,
.wrap-view-app-steps .list-split-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-split-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: #0f6b9d;
}
.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-split-steps li.active a:link, 
.wrap-view-app-steps .list-split-steps li.active a:visited {color: #1495D8;}
.wrap-view-app-steps .list-split-steps li.active a:link,
.wrap-view-app-steps .list-split-steps li.active a:visited {
    color: #0f6b9d !important;
}

.wrap-view-app-steps .list-app-steps li.active:before {color: #1495D8 !important;}
.wrap-view-app-steps .list-split-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;}
.wrap-view-app-steps .list-split-steps li.active:after {content: ""; width: 6px; background: #1495D8; position: absolute; left: 0; top: 0; bottom: 0;}

.wrap-view-app-steps .ref-detail {font-size: 14px; overflow: hidden; margin: 0;}
.wrap-view-app-steps .ref-detail li {padding: 0 0 0 60px; color: #333;}
.wrap-view-app-steps .ref-detail li.active {background: #fff !important;}

/* Positioning Updates for Columns */

.scheduler-form {margin-left: 30px; margin-right: 30px; margin-bottom: 30px; padding-bottom: 30px; background: #FAFAFA; border-bottom: 1px solid #CCCCCC;}
.scheduler-row .question-text label {padding-bottom: 3px; border-bottom: 1px solid #ccc;}

.day-selection-wrapper {white-space: nowrap; padding: 20px 30px 0 30px;}
.day-selection {width: calc(50% - 10px); display: inline-block; white-space: normal; border: 1px solid #ccc; background: #fff; vertical-align: top;}
.day-selection.active {border: 1px solid #4788F2;}
.day-selection:first-child {margin-right: 16px;}

@media only screen and (max-width: 900px) {
  .day-selection {width: 100%; display: block;}
  .day-selection:first-child {margin: 0 0 20px 0;}
}

.button-day a {width: 100%; text-align: center; display: block; color: #222; padding: 15px 20px; text-decoration: none;}
.button-day a:hover, .button-day a:active {color: #4788F2;}
.button-day.day-selected a {background: #4788F2; color: #fff;}
.button-day.day-selected a:hover, .button-day.day-selected a:active {color: #4788F2; background: #fff;}
.active .button-day a {text-align: left; padding-left: 0; padding-right: 0; margin: 0 20px; border-bottom: 1px solid #ccc; width: calc(100% - 40px); position: relative;}
.active .button-day a:after {content: "X"; position: absolute; right: 3px; color: #4788F2;}

.active .timeslot-list {display: block;}
.timeslot-list {display: none;}

.timeslot-list ul {list-style: none; margin: 10px 0; padding: 0; max-height: 168px; overflow: scroll; }
.timeslot-list ul li {text-align: center; display: block;}
.timeslot-list ul li a {padding: 8px 10px; color: #222222; display: block; margin: 0 20px; font-weight: 300; text-decoration: none;}
.timeslot-list ul li:nth-child(3) a, .timeslot-list ul li a:hover, .timeslot-list ul li a:active {color: #222222; background: #E2ECFD; }


/* Liaison Portal Appointment Style */
.appt-wrapper {
    position: relative;
    margin-bottom: 40px;
    padding-left: 30px;
    padding-right: 30px;
}
.browse-title {
    padding: 9px 0px;
    clear: both;
}
.browse-appt-by {width: 42%;float: left;}
.browse-appt-reset {width: 4%;float: left;}
.browse-appt-date, .browse-appt-as {width: 25%;float: left; margin-right: 10px;}
.browse-reset {
    width: 50%;
    float: left;
    text-align: right;
}
.browse-by {
    width: 50%;
    float: left;
}
.browse-reset {
    width: 50%;
    float: left;
    text-align: right;
    background: transparent url(/Contents/images/reset.png) 20px center no-repeat;
    background-size: 17px 17px;
    background-position: 80%;
}
.browse-reset a {text-decoration: underline; font-size: 14px;}
.browse-reset a:hover {text-decoration: none;}
.browse-filter {
    margin: 20px 0px;
    padding: 20px;
    background: #FAFAFA;
    display:table;
    clear:both;
    border: 1px solid #A9A9A9;
}

.browse-filter .browse-filter-left {
    display: block;
    float: left;
    width: 65%;
}

.browse-filter .browse-filter-right {
    display: block;
    float: right;
    width: 30%;
}

input.search-applicant-list {
    width: 100%;
}

.browse-filter-appt1 {
    margin-bottom: 20px;
    margin-right: 10px;
    padding: 25px 20px 5px 20px;
    background: #FAFAFA;
    overflow: hidden;
    border: 1px solid #d7d7d7;
    width: 45%;
    float: left;
}
.browse-filter-appt2 {
    margin-bottom: 20px;
    margin-right: 10px;
    padding: 25px 20px 5px 25px;
    background: #FAFAFA;
    overflow: hidden;
    border: 1px solid #d7d7d7;
    width: 25%;
    float: left
}

.agenda-view {float:right;margin-bottom: 22px;}
.calendar-view {float:right;margin-bottom: 22px;}

.agenda-view a {
    border: 1px solid #D1D9E5;
    padding: 6px 20px 6px 40px;
    display: inline-block;
    color: #222;
    border-radius: 3px;
    background: transparent url(/Contents/images/list-outline.png) 15px center no-repeat;
    background-size: 17.5px 18.5px;
    background-color: #fff;
}

.calendar-view a {
    border: 1px solid #D1D9E5;
    padding: 6px 20px 6px 40px;
    display: inline-block;
    color: #222;
    border-radius: 3px;
    background: transparent url(/Contents/images/calendar-vector-icon.png) 15px center no-repeat;
    background-size: 17.5px 18.5px;
    background-color: #fff;
}

.cal-header {display: block; width: 100%; border-bottom: 1px solid; height: 30px; text-align: center;}
.cal-dates {width: 20%; float:left;}
.cal-col {
    width: 20%;
    float: left;
}
.cal-col .cal-rows {
    /*min-height: 225px;*/
    border: 1px solid #787878;
    margin-right: 10px;
    margin-bottom: 10px;
}

.cal-col .cal-rows p.time {
    margin: 0;
    background-color: #062651;
    padding: 5px 5px 5px 10px;
    color: #fff;
}

.cal-col .cal-rows p.agency {
    margin: 0;
    padding: 5px 5px 5px 10px;
    font-size: 16px;
    font-weight: 600;
}

.cal-col .cal-rows p.office, .cal-col .cal-rows p.interviewee, .cal-col .cal-rows p.link {
    margin: 0;
    padding: 5px 10px 10px 10px;
}

.cal-col .cal-rows p.link {
    border-top: 1px solid #787878;
    min-height: 35px;
}

.link span.byliasion {
    float: right;
    display: block;
    padding: 2px 5px 2px 5px;
    color: #008000;
    background: #e3f8e9;
}

.link span.byapplicant {
    float: right;
    display: block;
    padding: 2px 5px 2px 5px;
    color: #666f7a;
    background: #F4F4F5;
}


.cal-content-wrapper {display:block; overflow:hidden; margin-top: 10px; border-bottom: 1px solid;}
#calendar {clear: both; width: 100%;}

.agenda-view a:hover, .agenda-view a.active, .calendar-view a:hover, .calendar-view a.active {
    border: 1px solid #062651;
    background-color: #D1EEEE;
    text-decoration: none;
}
/*.filter-agency {width: calc(60% - 20px); float:left; margin-bottom: 20px;} 
.filter-office { width: calc(60% - 20px); float: left;}
*/
.filter-interviewer {
    width: calc(60% - 20px);
    float: left;
    margin-bottom: 20px;
}
.filter-keyword { width: 40%; float: left; clear:right !important; margin-left: 20px !important; background: url("/Contents/i/icon-search@2x.png") no-repeat right !important; background-size: 20px 16px !important;}
.filter-date, .filter-stars {margin-top: 10px;float: left;}
.filter-discipline, .filter-options { float: left; margin-bottom: 20px; }
.filter-discipline { width: calc(60% - 20px); }
.filter-options { width: calc(80% - 20px); }
.filter-multiple-checkbox { width: 100%; float: left; }
/* -- Accessibility
.select-multiple-button, .apply-filter-button {display: inline-block;width: calc(23% - 20px);color: #0287EE;padding: 7px 0;border: 1px solid #C7D0DF !important;background: transparent;font-weight: normal;border-radius: 3px;text-align: center;box-shadow: inset 0 0 1px #000000;}
.select-multiple-button, .apply-filter-button {
    display: inline-block;
    width: calc(23% - 20px);
    color: #0287EE;
    padding: 7px 0;
    border: 1px solid #C7D0DF !important;
    background: transparent;
    font-weight: normal;
    border-radius: 3px;
    text-align: center;
    box-shadow: inset 0 0 1px #000000;
}*/

.select-multiple-button, .apply-filter-button {
    display: inline-block;
    width: calc(23% - 20px);
    color: #0275CE;
    padding: 7px 0;
    border: 1px solid #C7D0DF !important;
    background: transparent;
    font-weight: normal;
    border-radius: 3px;
    text-align: center;
    box-shadow: inset 0 0 1px #000000;
}

.apply-filter-button-disabled {
    display: inline-block;
    float:right;
    width: calc(23% - 20px);
    color: grey;
    pointer-events: none;
    cursor: default;
    padding: 7px 0;
    border: 1px solid #C7D0DF !important;
    background: transparent;
    font-weight: normal;
    border-radius: 3px;
    text-align: center;
    box-shadow: inset 0 0 1px #000000;
}

.apply-filter-button-disabled a{
    color: #A9A9A9;
}

.select-multiple-button { float: left; margin-left: 10px; }
.apply-filter-button { float: right; }
/* -- Accessibility
.select-multiple-button:hover, .select-multiple-button:active, .select-multiple-button:hover a, 
.apply-filter-button:hover, .apply-filter-button:hover:active, .apply-filter-button:hover:hover a{
    color: #fff !important;
    border: 1px solid #0287EE !important;
    background: #0287EE;
    display: inline-block;
    text-align: center;
    text-decoration: none;
}*/
.select-multiple-button:hover, .select-multiple-button:active, .select-multiple-button:hover a, 
.apply-filter-button:hover, .apply-filter-button:hover:active, .apply-filter-button:hover:hover a{
    color: #fff !important;
    border: 1px solid #0275CE !important;
    background: #0275CE;
    display: inline-block;
    text-align: center;
    text-decoration: none;
}
.view-by { padding: 0; clear: both;}


.add-appt {
    display: inline-block;
    padding: 8px 0;
    text-align: center;
    color: #fff;
    background: #0287EE;
    font-weight: 400;
    border: 1px solid #062651;
    border-radius: 3px;
    box-shadow: inset 0 0 1px #000000;
    float: right;
    width: 180px;
    margin-top: 8px;
}
.add-appt:hover, .add-appt:focus, .add-appt:active {
    color: #fff;
    border: 1px solid #062651 !important;
    background: #062651;
}
.add-appt a {color: #fff;}
.add-appt a::before {
    content: "+";
    position: relative;
right: 6px;
color: #fff;
font-size: 22px;
top: 2px;
}
.add-appt a:hover {text-decoration: none;}
.appt-list {
    padding: 5px 0px;
    clear: both;
}
.list-appt-title { padding-bottom: 30px; border-bottom: 1px solid #A9A9A9; font-weight: 600; clear:both; }
.list-appt-value0 {
    width: calc(5% - 10px);
    float: left;
    padding-left: 10px;
}
.list-appt-value1 {
    width: calc(30% - 10px);
    float: left;
    padding-left: 10px;
    word-wrap: break-word;
}
.list-appt-value2 {
    width: calc(20% - 10px);
    float: left;
    padding-left: 10px;
    word-wrap: break-word;
}
.list-appt-value3 {
    width: calc(15% - 10px);
    float: left;
    padding-left: 10px;
    word-wrap: break-word;
}
.list-appt-value4 {
    width: calc(10% - 10px);
    float: left;
    padding-left: 10px;
    word-wrap: break-word;
}
.list-appt-value5, .list-appt-value6, .list-appt-value7 {
    width: calc(28% - 10px);
    float: left;
    padding-left: 10px;
    word-wrap: break-word;
}
.list-appt-value8 {
    width: calc(6% - 10px);
    float: right;
    padding-left: 10px;
    word-wrap: break-word;
}

.list-saved-star {
    width: calc(11% - 10px);
    float: left;
    padding-left: 40px;
    padding-top: 30px;
    word-wrap: break-word;
}

.appt-header {
    width: 60%;
    float:left;
}
.appt-toggler {
    float: right;
    padding-top: 30px;
}

.pd-star {
	padding:0 20px 0 100px; 
	color: #E24C4B; 
	position: absolute; 
	display:inline; 
	top: 32px;
}

.star-notsaved a{
    color: rgba(0,0,0,0);
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-image: url("/contents/images/star-inactive.png");
    background-repeat: no-repeat;
    background-position: left;
    background-size: 21px auto;
}

.star-saved a:hover {
    color: rgba(0,0,0,0);
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: left;
    background-size: 21px auto;
}

.star-saved a, .star-notsaved a:hover {
    color: rgba(0,0,0,0);
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-image: url("/contents/images/star-active.png");
    background-repeat: no-repeat;
    background-position: left;
    background-size: 21px auto;
}


.list-appt-valuea {
    width: calc(40% - 10px);
    float: left;
    padding-left: 10px;
}
.list-appt-valueb {
    width: calc(25% - 10px);
    float: left;
    padding-left: 10px;
}
.list-appt-valuec {
    width: calc(15% - 10px);
    float: left;
    padding-left: 10px;
}
.list-appt-valued {
    width: calc(15% - 10px);
    float: right;
    padding-left: 10px;
}


.list-date {
    padding: 10px;
    display: block;
    background-color: #E8E8E8;
    color: #787878;
}
.list-appt-value {
    padding-top: 20px;
    padding-bottom: 20px;
    overflow: hidden;
    /*border-bottom: 1px solid #C0C0C0;*/
    font-size: 16px;
}
.list-appt-empty {
    padding-bottom: 30px;
    padding-top: 30px;
    border-bottom: 1px solid #ddd;
    font-size: 16px;
}

.pagging {
    clear: both;
}

.totalRecord.app-list, .event-paging.app-list, .page-number.app-list{
	width: 33%;
}

.totalRecord.app-list{
	margin-top: 15px;
	float: left;
}

.event-paging {
    width: 50%;
    float: left;
}
.page-number {
    width: 50%;
    float: right;
    text-align: right;
    padding-top: 15px;
}
.pagging ul { display: inline-block; padding-left:10px;}
.pagging .event-paging ul li {
    list-style: none;
    display: inline-block;
}
.pagging .event-paging ul li a {
    padding: 2px 5px;
    text-align: center;
    color: #0287EE;
    border: 1px solid #ccc !important;
    background: transparent;
    font-weight: normal;
    border-radius: 3px;
    box-shadow: inset 0 0 1px #000000;
}
.pagging .event-paging ul li:hover, .pagging .event-paging ul li a:hover, .pagging .event-paging ul li.active a, .pagging .event-paging ul li.active {
    color: #fff;
    text-align: center;
    background: #062651;
    text-decoration: none;
}
.pagging .page-number ul li {
    list-style: none;
    display: inline-block;
    padding: 3px 7px;
}
.pagging .page-number ul li:hover, .pagging .page-number ul li a:hover, .pagging .page-number ul li.active a, .pagging .page-number ul li.active {
    text-align: center;
    display: inline-block;
    color: #fff;
    background: #062651;
    font-weight: normal;
    border-radius: 3px;
    text-decoration: none;
}

label.twocol {
    display: inline-block !important;
    width: calc(50% - 10px);
    vertical-align: top;
}
.collapsable { display: none;}
.expanded .collapsable { display: block; }

/* --- 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;}
.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;}

.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;}

@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%;}
}

/* ==========================================================================
   Position Description Styling
   ========================================================================== */
/* --- Position Detail Updates --- */
.position-content {position: relative; overflow: auto;}
.position-content h2 {font-size: 36px; font-weight: 600; font-color: #212324; margin: 60px 0 5px 0;}
.position-content h3 {font-size: 19px; font-weight: 600; font-color: #212324; margin: 0 0 5px 0;}
.position-content h4 {font-size: 12px; text-transform: uppercase; font-weight: 700; font-color: #212324; border-bottom: 1px solid #C7D0DF;}

.pd-office {font-size: 15px; margin-top: 0; color: #5B5D62;}
.pd-tag {border: 1px solid #E24C4B; border-radius: 20px; font-size: 12px; text-transform: uppercase; font-weight: 600; padding: 0 20px 0 30px; color: #E24C4B; position: absolute; display: inline; top: 10px;}
.pd-closed:before {content:"X"; font-weight: 700; position: absolute; left: 14px; top: 0;}
.pd-open {border: 1px solid #00B16A; color: #00B16A;}
.pd-open:after {content: ""; position: absolute; top: 4px; left: 14px; display: inline-block; transform: rotate(45deg); height: 8px; width: 4px; border-bottom: 2px solid #00B16A; border-right: 2px solid #00B16A;}

.pd-security {font-size: 13px; color: #212324; padding-left: 20px; background: transparent url(/Contents/images/icon-lock@2x.png) 0 2px no-repeat; background-size: 11px 14.5px}
.pd-dual-columns { overflow: hidden;}
.pd-pri-column {width: 50%; display: block; overflow: hidden; float: left; padding-right: 20px;}
.pd-sec-column {width: 50%; display: block; overflow: hidden; float: left; padding-left: 20px;}
.position-content #map {width: 100%;}

.pd-contact {font-size: 18px; margin-bottom: 0;}
.pd-title {font-size: 13px; margin-top: 0;}
.pd-email {font-size: 15px; margin-bottom: 5px; padding-left: 30px; background: transparent url(/Contents/images/icon-mail@2x.png) 0 4px no-repeat; background-size: 19px 13.5px;}
.pd-phone {font-size: 15px; margin-top: 0; padding-left: 30px; background: transparent url(/Contents/images/icon-phone@2x.png) 3px 2px no-repeat; background-size: 12px 18px;}

#physical-address, .physical-address {font-size: 16px; margin-bottom: 0;}
#physical-address2, .physical-address2 {font-size: 16px; margin-top: 0;}

.pd-question {font-size: 13px; color: #5B5D62; margin-bottom: 5px;}
.pd-answer {font-size: 16px; margin-top: 0;}

.pd-pdf p {border-top: 1px solid #C7D0DF;}
.pd-pdf p a {border: 1px solid #D1D9E5; margin-top: 10px; padding: 5px 20px 5px 50px; display:inline-block; color: #222; border-radius: 3px; background: transparent url(/Contents/images/icon-pdf@2x.png) 20px center no-repeat; background-size: 17.5px 18.5px}
.pd-pdf p a:link, .pd-pdf p a:visited {}
.pd-pdf p a:hover, .pd-pdf p a:active {border: 1px solid #062651; text-decoration: none;}

.pd-dnc {color: red;}

.pos-filter-search {overflow: hidden;}
.styled-form.pos-filter-menus {padding: 5px 0;}
.content.menu-wrapper {padding: 10px 10px 15px 20px; margin-top: 10px;}
.styled-form.pos-filter-menus .list-filter {width: calc(50% - 10px); margin-top: 0; margin-bottom: 5px;}

/* --- Acceptance Styles --- */

.accept-plc, .decline-plc  {display: inline-block; width: 105px; padding: 7px 0; text-align: center; color: #0287EE; border: 1px solid #0287EE !important; background: transparent; font-weight: normal; border-radius: 3px; box-shadow: inset 0 0 1px #000000; cursor: pointer; vertical-align:top;}
.accept-plc:hover, .accept-plc:focus, .accept-plc:active {color: #fff; border: 1px solid #0287EE !important; background: #0287EE; cursor: pointer;}
.accept-plc.completed.accepted {display: inline-block; padding: 0; text-align: left; color: #00B16A; border: none !important; background: transparent; font-weight: normal; box-shadow: none !important; cursor: default; pointer-events: none;}
.accept-plc.completed.declined {display: inline-block; padding: 0; text-align: left; color: #F27801; border: none !important; background: transparent; font-weight: normal; box-shadow: none !important; cursor: default; pointer-events: none;}

.decline-plc:hover, .decline-plc:focus, .decline-plc:active {color: #fff; border: 1px solid #0287EE !important; background: #F27801; cursor: pointer;}
.decline-plc.completed {display: none;}

.acceptance-group {padding: 0 30px;}
.acceptance-group + .acceptance-group .acceptance-group-position-details {border-top: 1px solid #C7D0DF; margin-top: 30px;}
.acceptance-group-position-details {}
.acceptance-group-position-name {font-size: 36px; font-weight: 600; font-color: #212324; margin: 30px 0 5px 0; line-height: 1.33;}
.acceptance-group-position-agency {font-size: 19px; font-weight: 600; font-color: #212324; margin: 0 0 5px 0; line-height: 1.33;}
.acceptance-group-position-dept {font-size: 15px; margin-top: 0; color: #5B5D62;}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (max-width: 1200px) {
.header-content-wrapper {left: auto; width: 100%;} 
}

@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: relative; bottom: 0; left: auto; 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;}

  /* 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 */
  .wrap-content {overflow: hidden; display: block;}
  .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 #0287EE; font-size: 16px; line-height: 36px; position: relative;}
  
  .prinav {background: #0287EE; display: none;}
  .prinav a {width: 240px;}
  .menu:hover .prinav {display: block; z-index: 105;}
  .menu {position: absolute; width: 84px; height: 48px;}
  .menu {background: #0287EE url(/Contents/i/icon-menu-alt@2x.png) 24px 7px no-repeat; background-size: 32px 32px;}
  .lt-ie9 .menu {background: #0287EE 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: #0287EE;}
  .prinav ul {position: relative;}
  .prinav ul a {background: #0287EE;}
  
  .prinav .active {display: block;}
  .prinav .active {background: #0287EE url(/Contents/i/bkgd-check@2x.png) 7px 16px no-repeat; background-size: 16px 16px;}
  .lt-ie9 .prinav .active {background: #0287EE url(/Contents/i/bkgd-check.png) 10px 20px no-repeat;}
  .prinav:hover .active a span {display: block;}

  .prinav a:hover, .prinav a:active {color: #D7EBF4;}
  .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: #1295D8;}

  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;}

  .wrap-app-steps .list-title .withdraw-btn, .wrap-app-steps .list-title .remove-btn, .wrap-app-steps .list-title p {display: block; margin: 0;}
  .wrap-app-steps .list-title .withdraw-btn, .wrap-app-steps .list-title .remove-btn {display: inline-block; margin: 5px 20px 15px 20px;}
  .wrap-app-steps .list-title .withdraw-btn a, .wrap-app-steps .list-title .remove-btn a {background: none; border: 1px solid white; padding: 2px 20px; border-radius: 5px;}
  .wrap-app-steps .list-title .withdraw-btn a:hover, .wrap-app-steps .list-title .withdraw-btn a:active, .wrap-app-steps .list-title .remove-btn a:hover, .wrap-app-steps .list-title .remove-btn a:active {background: #F27801; border: 1px solid #062651;}


  .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: #3E6C0D;
  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: #980008;
    background: #FFBABA url(/Contents/images/box-validation.gif) left center no-repeat;
    background-position: 5px;
}

#list-title {
  color: #333;
}

 /* ================================================================
   Style for rank page
   ================================================================*/
#poscounter {display:inline; clear: none;}
.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;}

/* ================================================================
   Style for internship preference
   ================================================================*/
.intern-title {background: #22547D; padding: 10px 30px; color: #fff; overflow: hidden;}
.intern-title h2 {margin:0; font-size: 22px; margin-bottom: 0; padding: 5px 0; color: #fff;}
.intern-title.featured {background: #0287EE;}
.list-row {border-bottom: 1px solid #C6CDD9; 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-chk-pos {width: 5%; float:left;padding:10px 0px 10px 5px;}
.list-row .list-item {width: 56.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: 30%; font-size: 16px; line-height: 1.5em; padding: 10px 0 10px 30px;}
.list-row .list-item-avg-title {float: left;}
.list-row .list-item-avg-title {width: 35%; font-size: 16px; 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: 10.7%; font-size: 16px; 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: 5%; font-size: 16px; 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, .list-ref p { margin: 0; }
.list-row .list-item .meta {
    color: #6a6a6a;
}
.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-sort {
    padding-bottom:30px;
}
.list-sort .intern-title h2 {font-size: 16px;}
.list-sort .ui-sortable-handle { 
    cursor:pointer;
}
.list-sort .list-row,
.list-sort .list-row-norecord {
    overflow:hidden;
    border-top: 1px solid #C6CDD9;
    border-bottom: 1px solid #C6CDD9;
    margin: 0 0 -1px 0;
    background: white;
    min-height:44px;
}
.list-sort .list-row-norecord {
    text-align:center;
    padding-top:10px;
}

#nextBtn .disabled {
    pointer-events: none !important;
}

/* ---------------------------------------------
Table Layout
--------------------------------------------- */
#listing, .listing {
    clear: both;
    overflow: visible;
    height: 100%;
}

.tbllist {
    width: 100%;
    border-bottom: 2px solid #666;
}
    /* sets table width to 100%  */
    .tbllist td {
        margin: 0;
        padding: 0;
    }

head + body .tbllist td {
    margin: 0;
    padding: 2px 0 2px 0;
}

/*** Table Formatting ***/
.tbllist .odd {
    background: #eee;
}

.tbllist .headerList, .tbllist .headerList input {
    background: #446cb3;
    color: #fff;
}

.tbllist .flagged {
    background: #F2DCDB;
}

.tbllist tr td {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.tbllist tr.tag-row td {
    padding-top: 0 !important;
}

.tbllist tr.headerList td {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
/* .tbllist tr:hover {background: #ffc;} */
.tbllist tr.headerList:hover {
    background: #446cb3;
}

.tbllist td.borderbottom {
    border-bottom: 1px solid #446cb3;
}

.tbllist .expanded-row:nth-child(odd) td {
    background: #eee !important;
}

.tbllist .expanded-row:nth-child(even) td {
    background: #fff !important;
}

.tbllist .expanded-row:hover td {
    background: #ffc !important;
    cursor: pointer;
}

input.input-field {
    padding: 5px;
}

.ui-datepicker-trigger {
    /*
    vertical-align: middle;
    float:right;
    margin-top: -30px;
    */
    display:none;
}

/* ranking start --------- */

.rank-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border: 1px solid #D8DEE8;
    padding:15px;
}

.rank-column {
    width: 100%;
    position: relative;
}

.rank-column h6 {
    margin: 0 10px 10px 37px;
}

.rank-column .rank-available-search {
    position: absolute;
    top: 0;
    left: 0;
}

ul.rank {
    list-style-type: none;
    padding: 5px;
    margin: 0;
    height: 965px;
    overflow: auto;
}

ul.rank li {
    padding: 0;
    margin: 5px 0 5px 0;
    cursor: pointer;
    height: auto;
    overflow:hidden;
    border-bottom: 1px solid #D8DEE8;
}

ul.rank-available {
    border-top: 1px solid;
    height: 1000px;
}


ul.rank li:hover {
    background: #EBECF0;
}

ul.rank li.no-record {
    border: 1px dashed #4C4CFF;
    text-align: center;
    cursor: default;
    height: 275px;
}

ul.rank-used li {
    padding: 0px;
    border: 1px solid #D8DEE8;
    border-radius: 5px;
}

ul.rank-used .rank-item-title, ul.rank-available .rank-item-title {font-weight:bold;font-size:16px;}
ul.rank-used .rank-item-subtitle {padding-left: 28px;}
ul.rank-used .rank-item-subtitle .subtitle, ul.rank-available .rank-item-subtitle .subtitle {float: left;width: 80%;}
ul.rank-used .rank-item-subtitle .item-id, ul.rank-available .rank-item-subtitle .item-id {float: right;width: 20%; padding-left: 10px; padding-right: 10px; text-align:right;}

ul.rank-used .rank-item-order {
    display: inline-block;
    margin: 0px;
    padding-right: 15px;
}

ul.rank-used .rank-item-handler { display:none;}

.rank-column h6.rank-column-title {
    margin: 10px 0 0 0;
}

.rank-item-title {

}

.rank-item-subtitle {
    font-size:12px;
}

button.rank-finalize {
    padding: 8px;
    background: #4E82ED;
    margin: 5px 0 5px 0;
    border-radius: 5px;
    color: white;
    cursor: pointer;
    border: none;
    min-width: 200px;
    max-width: 100%;
    border: 1px solid #3771CE;
}

button.rank-finalize:hover {
    background : #204176;
}

button.rank-finalize:focus {
    background: #204176;
    border: 1px dashed #F8F8F8;
}

.has-loading-relative {
    position: relative;
}

.loading-relative {
    display: none;
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba( 255, 255, 255, .8 ) url('/contents/images/loading.gif') 50% 50% no-repeat;
}

.rank-container.rank-view {
    margin-top: 0;
}

.rank-container.rank-view .rank-column {
    padding-top: 0;
    width: 100%;
}

.rank-container.rank-view .rank-column-title {
    display:none;
}

@media only screen and (max-width: 400px) {
    .rank-container {
        flex-direction: column;
    }
    .rank-column {
        width: 100%;
    }
    ul.rank {
        height: 150px;
    }
    .rank-column.rank-column-available {
        margin-top:15px;
    }
    button.rank-finalize {
        width:100%;
    }
}

/* ranking end ----------- */

/* appointment list - application portal */
.list-app-appt {
    width: 100%;
    padding-left: 60px;
    padding-right: 40px;
    clear: both;
}

.list-app-appt .title1 {
    padding-top: 5px;
    border-bottom: 1px solid #393939;
    font-weight: 600;
    padding-bottom: 5px;
    width: 28%;
    float: left;
}
.list-app-appt .title2 {
    padding-top: 5px;
    border-bottom: 1px solid #393939;
    font-weight: 600;
    padding-bottom: 5px;
    width: 20%;
    float: left;
}
.list-app-appt .title3 {
    padding-top: 5px;
    border-bottom: 1px solid #393939;
    font-weight: 600;
    padding-bottom: 5px;
    width: 11%;
    float: left;
}
.list-app-appt .date{
    width: 98%;
    background-color: #E8E8E8;
    overflow: hidden;
    font-weight: 600;
    padding: 5px 0px;
}
.list-app-appt .sub1 {
    padding-top: 5px;
    padding-bottom: 10px;
    width: 28%;
    float: left;
}
.list-app-appt .sub2 {
    padding: 5px 5px 10px 8px;
    width: 20%;
    float: left;
}
.list-app-appt .sub3 {
    padding-top: 5px;
    padding-bottom: 10px;
    width: 11%;
    float: left;
}
.list-app-appt .detail {
    width: 95%;
    background-color: #F8F8F8;
    overflow: hidden;
    padding: 0px 20px 20px 20px;
}


.list-app-appt .detail h2 {
    font-size: 16px;
    font-weight: 600;
	text-decoration: underline;
}

.list-app-appt .detail .vappt {
    display: flex;
}
.list-app-appt .detail .vappt .vappt-question{
    width: 25%;
    font-weight: 550;
}

.print-pdf-btn {position:relative; top:80px; right: 30px; float: right;}

/*  Accessibility start ------------------------------- */
font.warningText {
    color: #DF0000;
}

.checkbox:focus, .radio:focus {
    color: #F27801;
    font-weight: bold;
}

.styled-form span.questionLabel {
    font-weight: 600;
    display: block;
    clear: both;
    margin: 20px 0 5px 0;
} 
.styled-form div.radio {
    margin: 5px 0;
    padding-left: 27px;
    font-weight: 400;
} 
.checkboxLabel {
    display: inline !important;
    font-weight: 400 !important;
}
.radioLabel {
    display: inline !important;
    font-weight: 400 !important;
}

.button.message, .button.btnfocus a:focus {
    border: 1px dashed #F8F8F8;
}
.list-title:focus {
    border: 1px dashed #F8F8F8;
}
/*  Accessibility end ------------------------------- */

a.disabled {
    pointer-events: none;
    cursor: default;
}

/* SCORING SC DETAIL */
.scoring-wrapper {display: table;}
.scoring-titles, .scoring-values {
    display: table-row;
}
.scoring-title-cells, .scoring-value-cell {
    display: table-cell;
    padding: 5px;
    border-right: 1px solid;
    border-top: 1px solid;
}
.scoring-title-cells.name, .scoring-value-cell.name {
    width: 20% !important;
    border-left: 1px solid;
}
.end-row {
    border-bottom: 1px solid;
}

.score-summary {
    margin-top: 20px;
    display: block;
    float: right;
    width: 30%;
    font-weight:bold;
}

.score-summary-left {
    display: block;
    float: left;
}

.score-summary-right {
    display: block;
    float: right;
}


/* ADD APPOINTMENT - Applicant Portal */
.appt-view {
    float: left;
}

.appt-view a::before {
    content: "+";
    position: relative;
    right: 6px;
    color: #fff;
    font-size: 22px;
    top: 3px;
}

.appt-view a {
    color: #fff;
    border: 1px solid #D1D9E5;
    padding: 3px 20px 6px 20px;
    display: inline-block;
    color: #fff;
    border-radius: 3px;
    background-size: 17.5px 18.5px;
    background-color: #4787F1;
}
.appt-view a:hover {
    background-color: #062651;
    text-decoration: none;
}

.app .list-appt-value5 {
    width: calc(10% - 10px);
    float: left;
    padding-left: 10px;
    word-wrap: break-word;
}
.app .list-appt-value7 {
    width: calc(23% - 10px);
    float: left;
    padding-left: 10px;
    word-wrap: break-word;
}

/* Add to calendar dropdown button styling*/
button.addcalbtn {
    background-color: #4787F1;
    color: white;
    padding: 5px;
    box-shadow: 1px 5px 10px 0px #cacad2;
    border: 1px solid #d2d2d2;
    min-width: 125px;
}

.addcal {
    position: relative;
    display: inline-block;
    padding: 20px 20px;
}

.addcalcontent {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 125px;
    /*box-shadow: 0px 8px 16px 0px #d2d2d2;*/
    z-index: 1;
    border: 1px solid #d2d2d2;
}

.addcalcontent a {
    color: black;
    padding: 5px 15px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.addcalcontent a:hover {
    background-color: #ddd;
}

/* Show the dropdown menu on hover */
.addcal:hover .addcalcontent {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.addcal:hover .addcalbtn {
    background-color: #0264AF;
}

