/* 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;}

::-moz-selection {background: #b3d4fc; text-shadow: none;}
::selection {background: #b3d4fc; text-shadow: none;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}
img {vertical-align: middle;}
fieldset {border: 0; margin: 0; padding: 0;}
textarea {resize: vertical;}

/* ==========================================================================
   Site Stylesheet
   ========================================================================== */

/* -------------------------------------
   Positioning
   ------------------------------------- */

/* fix footer to the bottom of the page when at the end of the content: http://codepen.io/paulobrien/pen/FKAxH */
html, body, .wrapper {margin: 0; padding: 0; height: 100%;}
.wrapper, footer {display: table-row;}
footer {height: 1px;}

/* 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; display: table; width: 100%;}
.wrap-page, .wrap-rutgers, .wrapper-logo, .wrap-footer-marketing, .wrap-footer-links, .wrap-footer-copyright {width: 100%; min-width: 320px; margin: 0 auto; overflow: visible !important;}
.wrap-logo, .wrap-content, .wrap-form, .wrap-rutgers .wrap-rutgers-links, .wrap-list, header, .wrap-list-review, .wrap-app-steps, .wrap-view, .wrap-review, .wrap-nav, .wrap-progress-bar, .footer-marketing, .footer-links, .footer-copyright {max-width: 1200px; margin: 0 auto;}

.lt-ie9 .logo, .lt-ie9 .wrap-page {min-width: 900px;} /* set min-width in less than IE 9 */
.lt-ie8 .logo, .lt-ie8 .wrap-page {width: 1200px;} /* set width in less than IE 8 */

/* Content Column Widths */
.pri, .sec, .ter {float: left;}
.three-col .pri {width: 33.34%;}
.three-col .sec, .three-col .ter {width: 33.33%;}
.two-col .pri {width: 66.67%;}
.two-col .sec, .two-col .ter {width: 33.33%;}

/* Content Column Length Fix */
/* .pri, .sec, .ter {padding-bottom: 100000px; margin-bottom: -100000px;} */

/* Footer Widths */
.footer-feature, .footer-secondary {float: left; overflow: hidden;}
.footer-links {clear:both;}

.footer-feature {width: 66.67%;}
.footer-secondary {width: 33.33%;}

/* Footer Column Length Fix */
footer {overflow: hidden;}
.footer-feature, .footer-secondary {padding-bottom: 1000px; margin-bottom: -1000px;}

/* Misc */
.wrap-logo, header, .wrap-content, .header-content, .wrap-progress-bar, .wrap-list, .wrap-app-steps, .wrap-form, .footer-marketing, .footer-links, .footer-copyright {overflow: hidden;}
.content {padding: 0 30px;}
.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
   ------------------------------------- */

body, input, textarea {font-family: 'Source Sans Pro', Calibri, Arial, sans-serif; font-weight: 400; font: normal normal normal 16px/26px; font-size-adjust: auto; color: #222;}
h1, h2, h3 {font-family: "PT Serif", Georgia, Times, serif;}

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.2;} /* 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 {margin: 24px 0;}
h1 {font-size: 36; line-height: 1.5; color: #ba0808;} /* 36 px */
h2, h3 {font-size: 24px; line-height: 1.333; color: #333;} /* 30 px */
h4 {font-size: 24px;} /* 24 px */
h5 {font-size: 20px;} /* 20 px */
h6 {font-size: 16px; font-weight: 300;} /* 16 px */

a:link, a:visited {color: #007FAC; text-decoration: underline;}
a:hover, a:active {color: #CC0033;}

header a:link, .button a:link, header a:visited, .button a:visited {color: #fff; text-decoration: none;}
header a:hover, .button a:hover, header a:active, .button a:active {color: #fff;}

a img {border: none; margin: 0;}

/* -------------------------------------
   Forms
   ------------------------------------- */

/* --- Form Content Area --- */
.wrap-form {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: 5px;}
input, textarea, input.file {border: 1px solid #DDD9D0; background-color: #FAFAFA;}
input:hover, textarea:hover, input.file:hover {background: #fff; border: 1px solid #333;}
input:focus, input:active, textarea:focus, textarea:active, input.file:focus, input.file:active {border: 1px solid #000;}
textarea {min-height: 200px}

.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; border-radius: 0; border-top-left-radius: 5px; border-top-right-radius: 5px;}
.dropdown .dropdown-input:hover {border: 1px solid #000;}

.dropdown .dropdown-button {display: block; position: absolute; right: 0; cursor: default; border-top-right-radius: 5px;}
.dropdown .dropdown-button {width: 34px; height: 100%; padding-top: 5px; background: #DDD9D0; color: #fff; text-align: center;}

.dropdown + .dropdown-options {width: 100%; position: relative; list-style-type: none; padding: 0; margin: 0; border: 1px solid #000; border-top: none; z-index: 5; display: none;}
.dropdown + .dropdown-options li {padding: 6px 8px; border-bottom: 1px solid #DDD9D0; background: #fff;}
.dropdown + .dropdown-options li:last-child {border-bottom: none;}
.dropdown + .dropdown-options li:hover {background: #CC0033; color: #fff;}
.dropdown + .dropdown-options li.selected {background: #CC0033; color: #fff;}
.dropdown + .dropdown-options {max-height: 400px; overflow-y: auto; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}

/* 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;}
.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 {opacity: 0; filter: alpha(opacity=0); color: #A9A9A9;}
.checkbox:hover .second-icon, .radio:hover .second-icon {opacity: 1; filter: alpha(opacity=100); color: #A9A9A9;}
.checkbox.checked, .radio.checked {}
.checkbox.checked .icons, .radio.checked .icons {color: #CC0033;}
.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; filter: brightness(1.5);}
.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;}

.styled-form .checkbox label {display: block; clear: both; margin: 10px 0 5px 0;} 

span.required {color: #df0008;}

.styled-form label, .styled-form legend, .styled-form div.label-question {display: block; clear: both; margin: 20px 0 5px 0;} 
.styled-form label.radio, .styled-form label.checkbox, .styled-form div.radio  {margin: 5px 0; padding-left: 27px;} 
.styled-form input {display: block; clear: both; margin: 0 0;} 
.styled-form fieldset label input {display: inline; clear: none;} 

.inline-input .input label {display: inline-block; margin-right: 20px;}
.inline-input .input label:last-child {margin-right: 0;}

.styled-form .form-row {position: relative;}

.styled-form .radio label {display: block;clear: both; margin: 0px 0 5px 0;} 

/* --- Likert Questions --- */
.likert, .likert ul {list-style: none; padding: 0; margin: 0;}
.likert, .likert ul, .likert li, .likert a {display: inline-block;}
.likert ul {margin-left: 20px;}
.likert li a {width: 16px; height: 16px;}
.likert li {background: url(/Contents/i/bkgd-star@2x.png) 0 0 no-repeat; background-size: 16px auto;}
.likert li:hover, .likert li.active {background-position: 0 -25px;}
.likert li span {display: none;}

.likert-view, .likert-view ul {list-style: none; padding: 0; margin: 0;}
.likert-view, .likert-view ul, .likert-view li, .likert-view a {display: inline-block;}
.likert-view ul {margin-left: 20px;}
/*.likert-view li a {width: 16px; height: 16px;}*/
.likert-view li a {width: 16px;}
.likert-view li {background: url(/Contents/i/bkgd-star@2x.png) 0 0 no-repeat; background-size: 16px auto;}
.likert-view li.active {background-position: 0 -25px;}
.likert-view li span {display: none;}

/* --- Validation Styles --- */
.invalid label, .required label, .invalid2 label, .invalid .question-text span, .required .question-text span, .invalid2 .question-text span,
.required fieldset, .required fieldset
 {color: #CC0033;}


.invalid input, .invalid textarea, .invalid input.file, .required input, .required textarea, .required input.file {border: 1px solid #CC0033;}

/* .validation .error {display: none;} */
.validation .invalid, .validation .required, .validation .affirm, .validation .hint, .validation .invalid2 {display: none;}
.invalid .validation .invalid, 
.required .validation .required, 
.affirm .validation .affirm, 
.hint .validation .hint, 
.invalid2 .validation .invalid2 {display: block;}
.form-row {position: relative; clear: both;}

.hint .validation {display: none;}

/* Inline Validation */
.validation p {position: relative; padding: 7px 10px 7px 30px; margin: 10px 0 0 0; border-radius: 5px;}

/* 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 #CC0033 transparent;}
.lt-ie9 .validation p:before {display: none;} /* Hide arrow in less than IE9 */

/* Inline Validation Colors */
.validation .error {background: #E4B63E url(/Contents/i/validation-error@2x.png) 10px 10px no-repeat; background-size: 16px 16px; color: #000;}
.lt-ie9 .validation .error {background-image: url(/Contents/i/validation-error.png);}
.validation .hint {background: #F5F3EC url(/Contents/i/validation-hint@2x.png) 10px 10px no-repeat; background-size: 16px 16px; color: #666;}
.validation .affirm {background: #eee 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 #E4B63E transparent;}
.validation .hint:before {border-color: transparent transparent #F5F3EC transparent;}
.ter .validation .hint:before {border-color: transparent transparent #F5F3EC transparent;} /* Hint color for login panel */
.validation .affirm:before {border-color: transparent transparent #eee transparent;}

.wrap-form .pri .question-text, .wrap-form .pri .question .input, .wrap-form .pri .actions {padding: 0 30px;}
.wrap-form .pri .validation {margin-left: 30px; margin-right: 30px;}

.validation .error a:link, .validation .error a:visited {color: #fff;}
.validation .error a:hover, .validation .error a:active {color: #fff;}

/* --- Change Validation to two column for screens 900 px and larger --- * /
@media only screen and (min-width: 900px) {

  /* 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 #CC0033 transparent transparent;}
  .wrap-form .validation .hint:before {border-color: transparent #F5F3EC transparent transparent;}
  .wrap-form .validation .affirm:before {border-color: transparent #eee transparent transparent;}

  .wrap-form .validation .error, .wrap-form .validation .affirm, .wrap-form .validation .hint {background-position: 8px 8px;}
}
*/
/* --- Button styles --- */
.button a {width: 100%; margin-bottom: 30px; padding: 11px 0 10px 0; display: block; text-align: center; border: none !important; text-transform: uppercase; font-weight: 600;}
.button a {background: #CC0033; border-radius: 5px;} 
.button:has(#btnloginShibboleth) a {background: #fff; color: #222; border: 1px solid #CC0033 !important;} 
.button.featured a {background: #CC0033;}
.button.secondary a {background: #CC0033;}
.button.negative a {background: #EBEBEF; color: #222; font-size: 16px;} 
.button.negative a:hover, .button.negative a:active {}

.button a:hover, .button a:active, .button:has(#btnloginShibboleth) a:hover, .button:has(#btnloginShibboleth) a:active {background: #8E0E18; color: #fff;} 
.button:has(#btnloginShibboleth) a:hover, .button:has(#btnloginShibboleth) a:active {border: 1px solid #8E0E18 !important;} 
.button.featured a:hover, .button.featured a:active {background: #8E0E18; color: #fff;}
.button.secondary a:hover, .button.secondary a:active {background: #6E1011;}
.button.negative a:hover, .button.negative a:active {background: #666;}
.lyrProcessing {color:red; display:none;}

#btnloginShibboleth {}

.two-col .pri .button a {max-width: 260px;}

header .actions {margin: 0 auto; max-width: 260px;} /* center header buttons */
.actions .button a {display: block; width: 260px; margin: 0 0 30px 0; float: left;}

.ter .actions .button a {width: 100%;}

header .actions .button:first-child a, 
footer .actions .button:first-child a {margin-right: 60px;}

.sec .actions {}

.form-row .actions .button a {margin: 30px 60px 0 0;}
.form-row .actions .button:last-child a {margin-right: 0;}

/* Help Messages */
.icon-help {display: inline-block; margin: -5px 0 0 5px;}

/* -------------------------------------
   Formatting
   ------------------------------------- */
body {background: #FBFBF9; line-height: 1.5em;}

/* --- Logo Wrapper --- */
.wrap-rutgers {background: #FBFBF9; height: 32px; display: none;}
ul.rutgers-links {margin: 0; padding: 0;}
.rutgers-links li {display: block; float: left; font-weight: 200;}
.rutgers-links li {border-right: 1px solid #ffffff; line-height: 100%; margin-top: 8px; padding: 0 8px;}
.rutgers-links li:first-of-type {padding-left: 0;}
.rutgers-links li:last-of-type {border: none;}

.rutgers-links a:link, .rutgers-links a:visited {color: #666; text-decoration: none;}
.rutgers-links a:hover, .rutgers-links a:active {text-decoration: underline;}

.slogan {position: absolute; font-size: 21px; top: 36px; right: 30px; line-height: 1;}
.slogan a {text-decoration: none; color: #222; font-weight: 600; display: block;}
.slogan .portal-title {margin-top: 10px; color: #ccc; font-size: 26px;}

.wrapper {background: #fff;}
.wrap-page {background: #fff;}
.wrapper-logo {background: #fff; border-bottom: 1px solid #222;}
.wrap-logo {background: #fff; margin-bottom: 0; height: 90px; position: relative;}
.wrap-logo .logo {padding: 18px 0 0 18px;}

/* --- Header --- */
header {position: relative; padding-top: 30px;}
.header-image img {width: 100%;} /* force the image to fill the width. */
.header-content {position: absolute; bottom: 0; width: 100%; height: 100%;}
.header-content {color: #fff; text-align: center; background: transparent url(/Contents/i/hdr-image-gradient@2x.png) top left no-repeat; background-size: 100% 100%; background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent 60%);}
.header-content-wrapper {position: absolute; bottom: 0; width: 100%;} 

.header-content h1 {font-size: 72px; padding: 0 10px;}
.header-blurb {padding: 0 30px; font-weight: 300;}

header {display: none;}
.tHome header {display: block;}

/* --- Navigation --- */
nav {background: #333; margin-bottom: 30px;} 
.wrap-nav {background: #333; font-size: 16px; line-height: 43px; font-weight: 400;}

/* Primary Nav */
.notification-badge {background: #1395D8; display: inline-block; color: #fff; line-height: 1.5em; border-radius: 10px; padding: 0 8px; font-size: 10px; margin-left: 6px; bottom: 2px; position: relative;}
.prinav a:link, .prinav a:visited {color: #fff; text-decoration: none; font-weight: 600;}
.prinav .active a {color: #fff;}
.prinav a:hover, .prinav a:active {background: #CC0033; color: #fff; text-decoration: none;}

.prinav {float: left;}
.prinav li {float: left; position: relative;}
.prinav li a {display: block; margin: 0 0 0 30px; padding: 6px 15px;}

.prinav li.active a {background: #CC0033;}

.prinav ul {position: absolute; border-top: 1px solid #666;}
.prinav, .prinav ul {margin:0; padding:0; list-style: none;}

.prinav ul li {clear: both; background: #454545;}
.prinav ul li a {margin:0; width: 240px; padding: 5px 30px;}

.prinav ul a:hover, .prinav ul a:active {} 
.prinav ul li a:link, .prinav ul li a:visited {border-bottom: 1px solid #666;}

.prinav li ul {display: none;}
.prinav li:hover ul {display: block;}

/* User Nav */
.usernav a:link, .usernav a:visited {color: #fff; text-decoration: none; font-weight: 600;}
.usernav a:hover, .usernav a:active {color: #fff; background: #CC0033;}

.usernav {float: right;}
.usernav li {position: relative;}
.usernav li a {display: block; padding: 6px 54px 6px 30px;}

.usernav ul {position: absolute; right: 0; text-align: right; border-top: 1px solid #666;}
.usernav, .usernav ul {margin:0; padding:0; list-style: none;}

.usernav ul li a {margin:0; width: 240px;}
.usernav ul li {clear: both; background: #454545;}
.usernav ul a:hover, .usernav ul a:active {background: #CC0033;} 
.usernav ul li a:link, .usernav ul li a:visited {border-bottom: 1px solid #666;}

.usernav li ul {display: none;}
.usernav li:hover ul {display: block;}

.usernav .profile a {background: transparent url(/Contents/i/icon-profile@2x.png) 200px 50% no-repeat; background-size: 16px 16px;}
.usernav .log-out a {background: transparent url(/Contents/i/icon-logout@2x.png) 200px 50% no-repeat; background-size: 16px 16px;}  

.lt-ie9 .usernav .profile a {background: transparent url(/Contents/i/icon-profile.png) 196px 50% no-repeat;}
.lt-ie9 .usernav .log-out a {background: transparent url(/Contents/i/icon-logout.png) 196px 50% no-repeat;}

.usernav .name > a:before {position: absolute; top: 25px; right: 30px;}
.usernav .name > a:before {content: ''; display: block; width: 0; height: 0;}
.usernav .name > a:before {border: solid; border-width: 8px 5px; border-color: transparent transparent #666 transparent;}
.usernav .name > a:before {border-color: rgba(255, 255, 255, .6) transparent transparent transparent;}
.lt-ie9 .usernav .name > a:before {display: none;} /* Hide arrow in less than IE9 */

.usernav li:hover ul,
.usernav li.usernav-link-container.focus ul {
    display: block
}

/* --- Wrap Content --- */
.wrap-content {background: #fff; padding-bottom: 10px;}
.feature-image {text-align: center;}

.ter {background: transparent;}
/*.app-options {padding:0; list-style: none;}*/
.app-options {padding:0;}

/* --- Wrap View --- */
.wrap-view {padding-bottom: 30px; margin-top: 0; clear: both; overflow: hidden;}
.wrap-view .form-row {overflow: hidden; clear: both;}

.wrap-view .question-text, .wrap-view .question {float: left;}
.wrap-view .question-text {width: 33.33%; clear: left; padding: 0 30px;}
.wrap-view .question {width: 66.67%; clear: right; padding: 0 30px 0 0;}
.tForm .wrap-view .styled-form p {margin: 0;}
.tForm .wrap-view .styled-form p label {margin: 0;}
.wrap-view .question-text {filter: brightness(1.5); text-align: right;}
.tForm .wrap-view .content div p {margin: 3px;}
.tForm .wrap-view .content div p label {margin: 0;}


/* --- Wrap List --- */
.wrap-list {padding-bottom: 60px;}

.list-title {background: #EFEFEF; padding: 10px 30px; color: #222; overflow: hidden;}
.wrap-list .list-title {background: #fff; padding: 10px 30px; overflow: hidden; border-bottom: 1px solid #222;}
.list-title h2 {margin:0; color: #222; font: normal normal 600 24px/28px Source Sans Pro;}
.wrap-list .list-title h2 {font: normal normal 600 18px/26px Source Sans Pro;}
.list-title.featured {background: #EFEFEF;}
.wrap-list .list-title.featured {background: #fff;}
.list-row {border-bottom: 1px solid #D5CFC1; overflow: hidden;}

.list-row .list-item, .list-row .list-action, .list-row .list-action-reviewer {float: left;}
.list-row .list-noitem {float: center;}
.list-row .list-item {width: 66.67%; font-size: 20px; line-height: 1.5em; padding: 10px 0 10px 30px;}
.wrap-list .list-row .list-item {font-size: 24px; line-height:28px; font-weight: 600;}
.wrap-list .list-row .list-item {font-size: 24px; line-height:28px; font-weight: 600;}
.list-row .list-action, .list-row .list-action-reviewer {width: 33.33%; font-size: 30px; font-weight: 300; line-height: 1.8em; text-align: right; padding: 10px 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-title a, .list-row .list-action a, .list-row .list-action-reviewer a, .list-status a {text-decoration: none; color: #222;}
.list-row .list-action a {font: normal normal 600 16px/26px Source Sans Pro; border: 1px solid #CC0033; text-transform: uppercase; border-radius: 4px; padding: 4px 20px;}
.list-title a:hover, .list-row .list-action a:hover, .list-status a:hover {color: #5F574F;}
.list-row .list-action a:hover {color: #fff; background: #8E0E18; border: 1px solid #8E0E18;}

.list-row .list-action-reviewer a {font: normal normal 600 16px/26px Source Sans Pro; text-transform: uppercase; padding: 4px 20px;}
.list-row .list-action-reviewer a:hover {color: #fff; background: #8E0E18;}

.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 {filter: brightness(1.5);}
.list-row .list-item-name .meta span {font-style: italic;}

.list-row .list-item-score {float: left;}
.list-row .list-item-score {width: 21.67%; font-size: 20px; line-height: 1.5em; padding: 10px 0 10px 30px;}
.list-item-score p {margin: 0;}

.list-row .list-item-check{float: left;}
.list-row .list-item-check {width: 3%; font-size: 20px; line-height: 1.5em; padding: 20px 0 10px 30px;}
.list-item-check p {margin: 0;}

.list-item p, .list-action p, .list-status p, .list-status-apply p, .list-status-inprogress p, .list-status-submitted p {margin:0;}
.list-row .list-item .content {font-size: 16px; line-height: 20px; font-weight: 400; padding: 0; margin: 10px 0;}
.list-row .list-item .meta {filter: brightness(1.5); font-size: 16px; line-height: 20px; color: #666; font-weight: 400;}
.list-row .list-item .meta span {font-style: italic;}

.rev-completed a:link, .rev-completed a:visited {color: #008000;}
.rev-completed a:hover, .rev-completed a:active {color: #07384D;}

.list-row .list-content {font-size: 16px; line-height: 1.5em; color: #666; margin: 10px 0 20px 0;}

.list-subtitle {background: #D7EBF4; color: #222222; line-height: 0.5em; overflow: hidden;}
.list-subtitle .list-subtitle-check{float: left;}
.list-subtitle .list-subtitle-check {width: 3%; font-size: 24px; padding: 20px 0 10px 0px;}
.list-subtitle-check p {margin:0;}

.list-subtitle .list-subtitle-name{float: left;}
.list-subtitle .list-subtitle-name {width: 42%; font-size: 24px; padding: 20px 0 10px 30px;}
.list-subtitle-name p {margin:0;}

.list-subtitle .list-subtitle-score{float: left;}
.list-subtitle .list-subtitle-score {width: 21.67%; font-size: 24px;  padding: 20px 0 10px 25px;}
.list-subtitle-score p {margin:0;}

.list-subtitle .list-subtitle-status{float: left;}
.list-subtitle .list-subtitle-status {width: 33.33%; font-size: 24px; text-align: right; padding: 20px 30px;}
.list-subtitle-status p {margin:0;}

/* --- Wrap Review List --- */

.wrap-list-review {padding-bottom: 60px; clear: both; overflow: visible;}


.wrap-list-review .list-item, 
.wrap-list-review .list-student-status, 
.wrap-list-review .list-review-status, 
.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;}
.list-checkbox {position: absolute; top:17px; left: 5px; width:25px; height: 25px;}
/*.wrap-list-review .list-row .list-item span {filter: brightness(1.5);}*/
/*.wrap-list-review .list-row .list-item .meta {filter: brightness(1.5);}*/
.wrap-list-review .list-item {width: 50%; padding-left: 30px;}
.wrap-list-review .list-student-status {width: 12%;}
.wrap-list-review .list-review-status {width: 12%;}
.wrap-list-review .list-score {width: 11%;}
.wrap-list-review .list-overall {width: 20%;}

.wrap-list-review .list-action, .wrap-list-review .list-action-reviewer {width: 1px; height: 1px;}

.wrap-list-review .list-action a.icon-print {position: absolute; right: 30px; top: 25px;}

.wrap-list-review .list-row a.icon-print {background: transparent url(/Contents/i/icon-print.png) 0 0 no-repeat; width: 16px; height: 16px; display: block; background-size: 16px auto;}
.wrap-list-review .list-row a.icon-print:hover {background-position: 0 -25px;}

.wrap-list-review .list-row a.icon-print:hover span {display: block; z-index: 1;}

.wrap-list-review .list-row a.icon-print span {display: none; position: absolute; padding: 5px 0; width: 60px; background: #444; font-size: 14px; top: 28px; right:-8px; border-radius: 3px; text-align: center; color: #fff; line-height: 1.4em;}
.wrap-list-review .list-row a.icon-print span:before {position: absolute; top: -16px; right: 10px;}
.wrap-list-review .list-row a.icon-print span:before {content: ''; display: block; width: 0; height: 0;}
.wrap-list-review .list-row a.icon-print span:before {border: solid; border-width: 8px 6px; border-color: transparent transparent #444 transparent;}
.lt-ie9 .wrap-list-review .list-row a.icon-print span:before {display: none;} /* Hide arrow in less than IE9 */

/* Review Filters */
.reviewer-filters {overflow: hidden;}
.review-section {width: 50%; 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 .pri .question-text, .wrap-review .pri .question {float: left;}
.wrap-review .pri .question-text {width: 33.33%; clear: left; padding: 0 30px;}
.wrap-review .pri .question {width: 66.67%; clear: right; padding: 0 30px 0 0;}
.wrap-review .pri .question-text {filter: brightness(1.5); text-align: right;}

.wrap-review .ter .question-text, .wrap-review .ter .actions,
.wrap-review .ter .question {padding: 0 30px;}

.sticky-toggle {display:none; height: 16px; width: 16px;}
.sticky-toggle span {display: none;}
#formReview .content h3:first-child {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: #FBFBF9; 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 */
  #formReview .actions .button {float: left; margin:0; width: 48%;}
  #formReview .actions .button:first-child {margin-right: 4%;}
  #formReview .actions .button.negative {float: none; width: 100%;}
}

/* --- Wrap App Steps --- */
.wrap-app-steps {padding-bottom: 60px;}
.wrap-app-steps ol {list-style: none; padding: 0; margin: 0;}
.wrap-app-steps li {border-bottom: 1px solid #D5CFC1; overflow: hidden; clear: both;}
.wrap-app-steps li li {border: none;}

.wrap-app-steps .list-item, .wrap-app-steps .list-status , .wrap-app-steps .list-status-apply, .wrap-app-steps .list-status-inprogress, .wrap-app-steps .list-status-submitted {float: left; font-weight: 400; line-height: 2em; font-size: 18px;}
.wrap-app-steps .list-item {width: 60%;}
.wrap-app-steps .list-status, .wrap-app-steps .list-status-apply, .wrap-app-steps .list-status-inprogress, .wrap-app-steps .list-status-submitted  {width: 40%; text-align: right;}

.list-app-steps .list-item {width: 60%; padding: 0 0 0 80px;}
.list-app-steps .list-status {padding: 0 40px 0 30px;}
.list-app-steps .list-status-apply, .wrap-app-steps .list-status-inprogress, .wrap-app-steps .list-status-submitted {padding: 0 60px 0 30px;}
.list-app-steps .list-content {padding: 0 40px 0 80px; color: #666;}

.list-title .list-status a:link, .list-title .list-status a:visited {background: #EBB600; font: normal normal 600 16px/26px Source Sans Pro; text-transform: uppercase; border-radius: 4px; padding: 4px 20px; color: #222;}
.list-title .list-status a:hover, .list-title .list-status a:active {color: #fff; background: #8E0E18;}

.list-app-steps .complete {background: #fff url(/Contents/i/bkgd-check@2x.png) right 12px no-repeat; background-size: 30px 16px;}

.complete .list-status a:link, .complete .list-status a:visited {color: #222;}
.complete .list-status a:hover, .complete .list-status a:active {color: #cc0033;}

.complete .list-status-submitted a:link, .complete .list-status-submitted a:visited {color: #000;}
.complete .list-status-submitted a:hover, .complete .list-status-submitted a:active {color: #07384D;}

.list-app-steps .complete2 {background: #fff right 12px no-repeat; background-size: 30px 16px;}

.complete2 .list-status a:link, .complete2 .list-status a:visited {color: #000;}
.complete2 .list-status a:hover, .complete2 .list-status a:active {color: #07384D;}

.complete2 .list-status-submitted a:link, .complete2 .list-status-submitted a:visited {color: #000;}
.complete2 .list-status-submitted a:hover, .complete2 .list-status-submitted a:active {color: #07384D;}


.list-app-steps .incomplete {background: #fff; color: #666;}
.incomplete .list-status a:link, .incomplete .list-status a:visited {color: #007FAC; text-decoration: underline;}
.incomplete .list-status a:hover, .incomplete .list-status a:active {color: #CC0033; text-decoration: none;}

.incomplete .list-status-apply a:link, .incomplete .list-status-apply a:visited {color: #5F574F;}
.incomplete .list-status-apply a:hover, .incomplete .list-status-apply a:active {color: #CC0033;}

.incomplete .list-status-inprogress a:link, .incomplete .list-status-inprogress a:visited {color: #5F574F;}
.incomplete .list-status-inprogress a:hover, .incomplete .list-status-inprogress a:active {color: #CC0033;}

.incomplete .list-status-submitted a:link, .incomplete .list-status-submitted a:visited {color: #000;}
.incomplete .list-status-submitted a:hover, .incomplete .list-status-submitted a:active {color: #CC0033;}

.list-app-steps .not-started {background: #fff; color: #999;}

.list-app-steps .actions {padding: 20px 0 0 80px;}
.list-app-steps .actions .button:first-child a {margin-right: 30px;}

.wrap-app-steps.inactive .list-title {border-bottom: 10px solid #F5F5F5; background: #5F574F;}
.wrap-app-steps.inactive .list-app-steps {border-bottom: 1px solid #5F574F;}
.wrap-app-steps.inactive .list-app-steps li {display: none;}

/* Wrap App Steps - Add Counter  */
.list-app-steps {counter-reset: app-steps; position: relative;}
.list-app-steps > li:before {content: counter(app-steps, decimal-leading-zero); counter-increment: app-steps;}

.list-app-steps li:before {display: block; position: absolute; left: 30px;}
.list-app-steps li:before {font-weight: 400; color: #222;}
.list-app-steps li:before {font-size: 16px; line-height: 2em; padding:0;}

/* 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: 14px 0 0 10px; border-color: rgba(0,0,0,.4) transparent transparent transparent;}
.list-app-steps ol > li .list-item .arrow-up {margin: 4px 0 0 10px; border-color: transparent transparent rgba(0,0,0,.4) transparent;}
.lt-ie9 .list-app-steps ol > li .list-item .arrow-down, 
.lt-ie9 .list-app-steps ol > li .list-item .arrow-up {display: none;} /* Hide arrow in less than IE9 */

/* --- Steps --- */
.steps {font-weight: 700; font-size: 24px; line-height: 1.5em; padding:0; list-style: none;}
.steps li {margin: 0; padding: 0 0 32px 80px; position: relative;}
.steps li span {display: block; padding: 12px 0 0 0}

/* Steps - Add Counter  */
.steps {counter-reset: steps;}
.steps li:before {content: counter(steps); counter-increment: steps;}

.steps li:before {display: block; position: absolute; left: 0; height: 60px; width: 60px;}
.steps li:before {background: #4285F4; 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: #4285F4;}

/* 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 #4285F4;}
.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 --- */

footer {}

.wrap-footer-marketing {background: #d4d4d4; color: #333; border-top: 1px solid #DDD9D0;}
.wrap-footer-marketing h3 {color: #CC0033;}
.wrap-footer-links {background: #000; color: #fff; position: relative;}

.wrap-footer-marketing .content {margin: 20px 0 30px 0;}

.footer-marketing {position: relative; display: none;}

.footer-links a:link, .footer-links a:visited {color: #fff; text-decoration: underline;}
.footer-links a:hover, .footer-links a:active {text-decoration: none;}
.footer-links {padding: 25px 30px 25px 30px; padding:0; position: relative;}
.footer-links .content  {padding: 20px 0 0 0; font-size: 14px; text-align: left;}
.footer-links p {margin: 0;}

.footer-logo {position: absolute; top: 40px; left: 30px;}
.footer-links {padding: 40px 30px 40px 30px; position: relative;}
.orchestrate {position: absolute; top: 43px; right: 30px;}

.footer-nav {padding: 0; list-style: none; overflow: hidden; display: block; line-height: 1.5em; margin: 0;}
.footer-nav li {float: left; margin: 0 15px 5px 0;}
.footer-nav li:last-child {margin: 0;}
.footer-nav li a:link, .footer-nav li a:visited {border: none;}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (max-width: 900px) {
  /* Positioning Updates for Columns */
  .three-col .pri {width: 100%;}
  .three-col .sec, .three-col .ter, .two-col .pri, .two-col .sec, .two-col .ter  {width: 50%;}
  .footer-feature, .footer-secondary {width: 50%;}

  /* Hide secondary column on form pages */
  .tForm .two-col .pri {width: 100%;}
  .tForm .two-col .sec, .tForm .two-col .ter {display: none;}

  /* Minimize Header */
  .header-content {height: 100%; width: 100%;}
  .header-content-wrapper {position: absolute; bottom: 0; width: 100%;} 
  .header-blurb {display:block; font-size: 24px;}
  .header-content h1 {font-size: 48px;}
  .wrap-giving-buttons {display: none;}

  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, .list-row .list-action-reviewer {font-size: 24px;}
  .list-app-steps .list-item, .list-app-steps .list-status , .list-app-steps .list-status-apply, .list-app-steps .list-status-inprogress, .list-app-steps .list-status-submitted {font-size: 20px;}
  .list-app-steps li:before {font-size: 20px; line-height: 1.2em;}
  .list-app-steps ol > li .list-item .arrow-down {margin: 11px 0 0 10px;}
  .list-app-steps ol > li .list-item .arrow-up {margin: 0 0 0 10px;}

  .list-app-steps .list-item {padding: 0 0 0 70px;}
  .list-app-steps .list-status, .list-app-steps .list-content {padding: 0 60px 0 70px;}
  .list-app-steps .list-status-apply, .list-app-steps .list-status-inprogress, .list-app-steps .list-status-submitted {padding: 0 60px 0 70px;}

  .list-app-steps .actions {padding: 0 0 0 70px;}
  .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 .actions .button a {display: block; width: auto; float: none;}
}

@media only screen and (max-width: 640px) {
  /* Positioning Updates for Columns */
  .three-col .pri, .three-col .sec, .three-col .ter {width: 100%;}
  .two-col .pri, .two-col .sec, .two-col .ter {width: 100%;}
  .footer-feature, .footer-secondary {width: 100%;}

  /* 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 br {display: none;}
  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;}
  .list-app-steps .actions {padding: 10px 30px 0 30px;}
  .list-app-steps .actions .button a {width: 100%;}

  .two-col .pri .button a {width: 100%;}
  
  .wrap-logo {height: 90px;}
  .wrap-logo .logo {width: 100px; height: 75px; background-size: 100px 75px;}

  .wrap-rutgers {display: none;}
  .slogan {position: absolute; font-size: 20px; top: 10px; left: 110px;}
  .slogan .portal-title {margin-top: 5px; font-size: 16px;}

  /* Mobile navigation */
  .wrap-nav {font-size: 16px; position: relative; padding-left: 0;}
  
  .prinav {background: #333; display: none;}
  .prinav a {width: 240px;}
  .menu:hover .prinav {display: block;}
  .menu {position: absolute; width: 84px; height: 55px;}
  .menu {background: #333 url(/Contents/i/icon-menu-alt@2x.png) 24px 12px no-repeat; background-size: 32px 32px;}
  .lt-ie9 .menu {background: #F2F1EB url(/Contents/i/icon-menu.png) 0 14px no-repeat; background-size: 24px 16px;}

  .prinav {position: absolute; top: 55px;}
  .prinav li {float: left; clear: both; background: #333;}

  .prinav:hover li {display: block; background-color: #333;}
  .prinav ul {position: relative;}
  .prinav ul a {background: #444;}
  
  .prinav .active {display: block;}
  .prinav .active {color: #ffcc00;}
  .prinav:hover .active a span {display: block;}

  .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 #666;}
  .prinav ul a:link, .prinav ul a:visited {border-top: 1px solid #666;}

  .prinav {border: none;}
  .prinav ul {border-top: none;}

  /* 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;}

  /* Review Form */
  .wrap-review .question-text {width: 100%; padding: 0 30px; text-align: left;}
  .wrap-review .question {width: 100%; clear: right; padding: 0 30px 20px 60px;}

  /* Review List */
  .wrap-list-review .list-item {width: 100%; padding: 5px 60px 5px 30px;}
  .wrap-list-review .list-student-status {width: 22%;}
  .wrap-list-review .list-review-status {width: 28%; padding-left: 30px;}
  .wrap-list-review .list-score {width: 22%;}
  .wrap-list-review .list-overall {width: 50%;}

  .wrap-list-review .list-item p,
  .wrap-list-review .list-student-status p,
  .wrap-list-review .list-review-status p,
  .wrap-list-review .list-score p,
  .wrap-list-review .list-overall p {margin: 0;}

  .wrap-list-review .list-item {padding-top: 10px;}
  .wrap-list-review .list-student-status,
  .wrap-list-review .list-review-status,
  .wrap-list-review .list-score,
  .wrap-list-review .list-overall {padding-top: 10px; padding-bottom: 10px;}

  .review-section {width: 100%; float: left; padding: 0 30px;}
  .review-section .button {margin: 30px 0 0 0;}

  /* Wrap List */
  .list-row .list-item {width: 100%; padding-bottom: 0;}
  .list-row .list-action, .list-row .list-action-reviewer {width: 100%; padding-top: 0; text-align: left;}
  
  .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, .wrap-app-steps .list-status, .wrap-app-steps .list-status-apply, .wrap-app-steps .list-status-inprogress, .wrap-app-steps .list-status-submitted {width: 100%; padding-top: 0; text-align: left;}
  .list-app-steps .list-item {padding: 0 30px 0 70px;}

  .list-app-steps .list-status, .list-app-steps .list-content {padding: 0 30px 0 70px;}
  .list-app-steps .list-status-apply, .list-app-steps .list-status-inprogress, .list-app-steps .list-status-submitted {padding: 0 30px 0 70px;}
  .list-app-steps .complete, .list-app-steps .incomplete, .list-app-steps .not-started {background-image: none;}

  .list-app-steps ol > li .list-item .arrow-down {margin: 10px 0 0 10px;}

  /* Footer */
  .footer-logo {position: relative; top: auto; left: auto; margin: 20px 0; float: left;}
  .footer-links {padding: 30px; position: relative;}
  .orchestrate {position: relative; top: auto; right: auto; margin: 20px 0; float: right;t}

  .footer-nav {padding: 0; list-style: none; overflow: hidden; display: block; line-height: 1.5em; margin: 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;}

.wrap-list-review .list-row:before, .wrap-list-review .list-row:after, .question:before, .question:after, .clearfix:before, .clearfix:after {content: " "; display: table;}
.wrap-list-review .list-row:after, .question:after, .clearfix:after {clear: both;}
.wrap-list-review .list-row, .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(/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(/images/warning.gif) left center no-repeat;
  background-position: 5px;
}

.success {
    border: 1px solid;
    padding:10px 10px 10px 40px;
    color: #4F8A10;
  background: #DFF2BF url(/images/success.gif) left center no-repeat;
  background-position: 5px;
}

.errormsg {
    border: 1px solid;
  padding:10px 10px 10px 40px;
  color: #D8000C;
    background: #FFBABA url(/images/validation.gif) left center no-repeat;
  background-position: 5px;
}

#list-title {
  color: #333;
}

/* --- Wrap Reference List --- */
.wrap-list-ref {max-width: 1200px; margin: 0 auto;}
.wrap-list-ref {padding-bottom: 60px; clear: both; overflow: visible;}

.wrap-list-ref .list-item, 
.wrap-list-ref .list-applicant, 
.wrap-list-ref .list-app, 
.wrap-list-ref .list-deadline {display: block; float: left; text-align: left; padding-right: 30px;}

.wrap-list-ref .list-title {padding: 10px 0;}
.wrap-list-ref .list-title a {color: #fff;}

.wrap-list-ref .list-row {position: relative; overflow: visible; clear: both;}
.wrap-list-ref .list-row .list-item {font-size: 16px;}
.wrap-list-ref .list-row .list-item span {color: #999;}
.wrap-list-ref .list-row .list-item .meta {color: #999;}
.wrap-list-ref .list-row {border-bottom: 1px solid #D5CFC1; overflow: hidden;}

.wrap-list-ref .list-item {width: 25%; padding-left: 30px;}
.wrap-list-ref .list-applicant {width: 25%; padding-left: 30px;}
.wrap-list-ref .list-app {width: 50%;}
.wrap-list-ref .list-deadline {width: 25%;}

.wrap-list-ref .list-action {width: 1px; height: 1px;}

.wrap-list-ref .list-action a.icon-print {position: absolute; right: 30px; top: 25px;}

.wrap-list-ref .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-ref .list-row a.icon-print:hover {background-position: 0 -25px;}

.wrap-list-ref .list-row a.icon-print:hover span {display: block; z-index: 1;}

.wrap-list-ref .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-ref .list-row a.icon-print span:before {position: absolute; top: -16px; right: 10px;}
.wrap-list-ref .list-row a.icon-print span:before {content: ''; display: block; width: 0; height: 0;}
.wrap-list-ref .list-row a.icon-print span:before {border: solid; border-width: 8px 6px; border-color: transparent transparent #444 transparent;}
.lt-ie9 .wrap-list-ref .list-row a.icon-print span:before {display: none;} /* Hide arrow in less than IE9 */

/* --- Record Per Page --- */
#left-col {width:30%; float:left;}
#right-col {text-align:right}


/* hidden notification accessibility */
.screen-reader-alert-invisible {width: 0 !important; height: 0 !important; overflow: hidden !important; right: 0; bottom: 0; position: absolute;}
.checkboxLabel { display: inline !important; font-weight: 400 !important;}

a.accessibility-skiptomain {
    left: -999px;
    position: absolute;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

a.accessibility-skiptomain:focus {
    background: #e6e6e6;
    color: #0067b8;
    position: fixed;
    top: 0;
    left: 0;
    padding: 24px;
    width: auto;
    height: auto;
    overflow: auto;
    right: 0;
    text-decoration: underline;
    text-align: center;
    z-index: 800;
    outline: none;
}

/* hidden notification accessibility */
.screen-reader-alert-invisible {
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    right: 0;
    bottom: 0;
    position: absolute;
}

.checkboxLabel {
    display: inline !important;
    font-weight: 400 !important;
}

.screen-reader-label-invisible {
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    right: 0;
    bottom: 0;
    position: absolute;
}

.hide-calendar .ui-datepicker-calendar {
    display: none;
}

.ui-datepicker-buttonpane .ui-datepicker-current {
    display: none;
}

.styled-form .valid input {
    border: 1px solid black !important;
}


.appcoursegrade-value {
    margin-top: 20px;
}
.appcoursegrade-course.question > .form-row {
    margin-bottom: 10px;
}
/*.appcoursegrade-detail.question-text span.required {
    display: none;
}*/

.errorNotif {
    position: relative;
    padding: 7px 10px 7px 30px;
    margin: 10px 0 0 0;
    background: #E00000 url(/Contents/i/validation-error@2x.png) 10px 10px no-repeat;
    background-size: 16px 16px;
    color: #fff;
    border: none;
}

/* Course question styles  */
  #rowappcourse .question {border: 1px solid #aaa; border-radius: 3px; max-height: 400px; overflow-y: scroll; padding-top: 10px;}
  .appcoursegrade-course {font-weight: 600; color: #000; margin-top: 30px; display: block;}
  .appcoursegrade-course:before {content: "\2013"; position: absolute; right: 45px; display: table; overflow: hidden; width: 10; height: 10; margin-top: 8px;}
  .coursegradehidden .appcoursegrade-course:before {content: '+'}
  .appcoursegrade-course span {padding: 10px 20px; display: block; background: #EFEFEF;}
  .coursegradehidden .form-row {display: none;}
  /* for view mode */
  .wrap-view #rowappcourse .question {
	  border: none;
	  border-radius: 0;
	  max-height: none;
	  overflow-y: visible;
	  padding-top: 0;
   }
  .wrap-view .appcoursegrade-course {
	  font-weight: 600;
	  color: inherit;
	  margin-top: 0;
	  display: inline;
   }
   .wrap-view .appcoursegrade-course:before {
	  content: none;
	  position: static;
	  display: none;
	  width: auto;
	  height: auto;
	  margin-top: 0;
   }
   .wrap-view .appcoursegrade-course span {
	  padding: 0;
	  background: none;
	  display: inline;
   }
   .wrap-view .coursegradehidden .form-row {
	  display: block;
   }
/* Help Messages */
.help-message {
    display: none;
}

.help-message {
    position: relative;
    padding: 1px 15px;
}

.help-message p {
    margin: 10px 0;
}

.help-message {
    background: #F0F8FC;
    color: #22547D;
    margin-bottom: 10px;
    border: 1px solid #E4EFF5;
}

.help-message p a {
    text-decoration: underline;
}

.filter-keyword {
    /*width: 20%;*/
    float: left;
    clear: right !important;
    /*margin-left: 330px !important;*/
    margin-right: 20px !important;
    margin-top: 23px !important;
    background: url("/Contents/i/icon-search@2x.png") no-repeat right !important;
    background-size: 20px 15px !important;
}

.content {
    padding: 0 30px;
}
.list-title.list-review {
    background: #88161A !important
}

.wrap-list-review .list-title.list-review a {
    color: #fff;
    font-weight: 400;
}

.list-title {
    background: #EFEFEF;
    padding: 10px 30px;
    color: #222;
    overflow: hidden;
}
.list-title .list-item-check-reviewer {
	padding: 0px 0 0 5px;
} 


.list-item-check-reviewer {position:relative; float:left; width:20px;}
.list-item-check-reviewer fieldset { padding-top:5px; border:0;}
.list-item-check-reviewer {/* width: 3%;  */font-size: 20px; line-height: 1.5em; padding: 10px 0 0 5px;}
.list-item-check-reviewer p {margin: 0;}
.list-row .list-overall p, .list-row .list-score p, .list-row .list-review-status p,.list-row .list-student-status p { margin: 10px 0; }
