﻿/*  
    IMPORTANT!!!

    This stylesheet uses Sass! Please don't edit the .css file directly as this will get overwritten if anyone saves the .scss file.

    To enable Sass in Visual Studio 2013 enable the CompileSass extension then work on the .scss file just as you would normally in a .css file
*/
/******** VARIABLES ********/
/* Fonts */
/* Colors */
/******** STYLES ********/
/* Global Styles */
html {
  font-family: Carlito, Calibri, "Helvetica Neue", Sans-Serif;
  font-size: 1em;
}

body {
  padding-top: 20px;
}

img {
  width: 100%;
  margin-bottom: 20px;
}

/* Fix image size & spacing of BrowseAloud on Mobiles*/
#rwSpanner img, #rwcloseBAPlus img {
  width: auto;
  margin-bottom: 0;
}

div.portfolioHome li img {
  margin-bottom: 0;
}

.slick-slide img {
  margin-bottom: 0;
}

a.career-areas-btn img {
  margin-bottom: 0;
}

a.career-pathways-btn img {
  margin-bottom: 0;
}

a.subject-areas-main img {
  margin-bottom: 0;
}

h1 {
  font-size: 2em;
  font-weight: bold;
  color: #fff;
  margin-top: 15px;
  /*margin-top: 15px;*/
  margin-bottom: 5px;
  float: left;
  /*font-family: $font-stack;*/
}

h2 {
  font-size: 1.3em;
  font-weight: bold;
  color: #eb050e;
  /*font-family: $font-stack;*/
}

div.titleBox h2 {
  color: #fff;
  float: left;
  clear: left;
  margin: 0 0 0 45px;
}

div.titleBox div.grid h2 {
  margin: 0 0 0 25px;
}

h3 {
  font-size: 1.2em;
  font-weight: normal;
  color: #fff;
  /*font-family: $font-stack;*/
}

h4 {
  font-size: 1.4em;
  font-weight: bold;
  margin: 20px 0 10px 0;
  color: #636466;
  /*font-family: $font-stack;*/
}

h4.home {
  font-size: 1.1em;
  margin: 20px 0 0 0;
}

h5 {
  /*font-family: $font-stack;*/
}

h6 {
  /*font-family: $font-stack;*/
}

hr {
  height: 1px;
  border: 0;
  background-color: #636466;
  color: #636466;
}

ul {
  margin: 0 0 20px 0;
}

li {
  margin-top: 5px;
}

a {
  font-weight: bold;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

input[type=file] {
  font-size: 1em;
  height: auto;
  line-height: 1.2;
  padding: 0;
}

.black {
  color: #000;
}

.red {
  color: #eb050e;
}

.white {
  color: #fff;
}

#_ba__link {
  color: #fff;
}

.grey {
  color: #636466;
}

p {
  margin: 0 0 20px 0;
}

a img {
  border: none;
}

img {
  max-width: 100%;
}

img.logo {
  margin-top: 5px;
  margin-bottom: 15px;
  width: auto;
}

/* Screen reader only.  To improve accessibility for non content visible links, e.g. use of glyph icons*/
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
  z-index: -1000;
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

form div.feedback div.input-holder {
  width: 100%;
}

form div.feedback .field-validation-error {
  margin-left: 31%;
}

form div.feedback div.message-error .field-validation-error {
  float: left;
  margin: 15px 0 0 5px;
}

form div.login-div {
  color: #fff;
  font-size: 0.85em;
  font-weight: normal;
  background-color: #636466;
  text-align: center;
  float: left;
  clear: left;
  width: 28%;
  height: 25px;
  padding: 4px 0 0 0;
  margin: 0 0 15px 0;
}

form div.login-div.portfolio {
  background-color: #b9595d;
}

form div.login-div.portfolio-2 {
  background-color: #ce3a3f;
}

div.logged-in-container {
  float: left;
  width: 100%;
}

div.logged-in-div {
  color: #fff;
  font-size: 0.85em;
  font-weight: normal;
  background-color: #636466;
  text-align: center;
  float: left;
  clear: none;
  width: 100%;
  height: 25px;
  width: calc(50% - 10px);
  margin: 10px 0 15px 0;
}

div.logged-in-div.portfolio {
  background-color: #ce3a3f;
}

div.logged-in-div.left {
  margin-right: 20px;
}

div.logged-in-div:hover {
  background-color: #a8040a;
  color: #fff;
  cursor: pointer;
}

div.logged-in-div:hover a {
  color: #fff;
  cursor: pointer;
  display: block;
  width: 100%;
}

div.logged-in-div a {
  font-weight: bold;
  color: #fff;
}

div.logged-in-div a:hover {
  text-decoration: none;
}

div.logged-in-welcome {
  margin-top: 5px;
  height: 25px;
  float: left;
  clear: none;
  width: 100%;
}

div.logged-in-welcome p {
  font-size: 0.9em;
  line-height: 1;
  z-index: 0;
  text-align: center;
}

div.signed-in {
  width: 70px;
  height: 25px;
  float: left;
}

a.forgot-password {
  font-weight: normal;
  margin-left: 10px;
  font-size: 0.9em;
}

input {
  color: #000;
  font-size: 0.8em;
  font-weight: normal;
  background-color: #fff;
  text-align: left;
  height: 25px;
  width: 100%;
  padding: 0 5px;
  float: left;
  border-radius: 0;
  border-style: solid;
  border-width: 1px;
  border-color: #c7c8ca;
  margin: 0 0 15px 0;
  font-family: Carlito, Calibri, "Helvetica Neue", Sans-Serif;
}
input[type=checkbox] {
  width: 18px;
  height: 18px;
  margin: 0 10px;
}

td input {
  margin: 0;
}

div.radio-container {
  width: 72%;
  float: left;
  padding-left: 5px;
}

div.radio-container span.label {
  line-height: 25px;
}

div.radio-container span.radio {
  float: right;
  width: 50px;
  line-height: 25px;
}

div#PurchaseNo input#PurchaseNo {
  margin-bottom: 0;
}

div#PurchaseNo span.FontSmall {
  margin-bottom: 20px;
  display: inline-block;
  text-align: left;
  width: 100%;
  padding-left: 5px;
  font-size: 0.9em;
  font-weight: bold;
}

div.radio-container span.radio input[type=radio] {
  width: auto;
}

form.login div.login-div {
  width: 25%;
  background-color: #c7c8ca;
}

form.login input {
  width: 100%;
  border-color: #c7c8ca;
}

div.username-input {
  width: 72%;
  float: left;
  clear: none;
  margin: 0;
}

div.password-input {
  width: 53%;
  float: left;
  clear: none;
  margin: 0;
  padding: 0;
}

input.login-submit {
  background-color: #c7c8ca;
  text-align: center;
  float: left;
  clear: none;
  margin: 0;
  font-size: 0.75em;
  font-weight: normal;
  width: 19%;
  cursor: pointer;
  padding: 0;
  text-align: center;
}

div.username-input.portfolio input {
  border-color: #b9595d;
}

div.password-input.portfolio input {
  border-color: #b9595d;
}

input.login-submit.portfolio {
  border-color: #b9595d;
  background-color: #b9595d;
  color: #fff;
}

div.username-input.portfolio-2 input {
  border-color: #ce3a3f;
}

div.password-input.portfolio-2 input {
  border-color: #ce3a3f;
}

input.login-submit.portfolio-2 {
  border-color: #ce3a3f;
  background-color: #ce3a3f;
  color: #fff;
}

input.login-submit.portfolio:hover, input.login-submit.portfolio-2:hover {
  border-color: #a8040a;
  background-color: #a8040a;
}

form.search div {
  width: 30%;
  background-color: #747476;
  color: #fff;
  padding: 0;
  overflow: hidden;
}

form.search div svg {
  position: relative;
  top: -24px;
  left: 40%;
  width: 24px;
  height: 24px;
  pointer-events: none;
}

form.search select::-ms-expand {
  display: none; /* hide default arrow in IE10 */
}

form.search select {
  width: 120%;
  margin: 0;
  padding: 0 0 0 2px;
  border: solid 1px #747476;
  background-color: #747476;
  font-size: 0.9em;
  color: #fff;
  float: left;
  clear: none;
  height: 25px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

form.search select:hover {
  border-color: #c7c8ca;
  background-color: #c7c8ca;
  cursor: pointer;
}

form.search input {
  width: calc(70% - 24px);
  border-color: #747476;
  float: left;
  clear: none;
}

form.search div.search-button {
  width: 24px;
  height: 25px;
  background-color: #747476;
  float: left;
}

form.search div.search-button input {
  background-color: #747476;
  color: #fff;
  width: 100%;
  float: left;
  margin: 0;
  position: static;
  font-size: 14px;
  border-left: none;
  cursor: pointer;
}

form.search div.search-button input:hover {
  background-color: #c7c8ca;
  border-color: #c7c8ca;
}

div.advanced-search {
  float: left;
  clear: left;
}

div.advanced-search-top {
  padding: 0 40px 0 20px;
  margin-bottom: -2px;
}

div.advanced-search form input, div.advanced-search form label {
  width: auto;
}

div.advanced-search form select {
  width: 100%;
}

div.advanced-search form input {
  margin-bottom: 5px;
}

div.advanced-search span {
  display: block;
  float: left;
  clear: none;
}

div.advanced-search span.float-right {
  float: right;
}

div.advanced-search input.checkbox {
  margin-right: 0;
}

input.search-buttons {
  background-color: #e2e3e4;
  margin: 0 5px 0 0;
  cursor: pointer;
  border-radius: 5px;
  border: solid 1px #c7c8ca;
  -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}
input.search-buttons.selected {
  background-color: #c7c8ca;
  font-weight: bold;
  border: solid 1px #e2e3e4;
  box-shadow: none;
}
input.search-buttons:hover {
  background-color: #c7c8ca;
  text-decoration: underline;
  border: solid 1px #e2e3e4;
}

input.search-buttons.selected:hover {
  text-decoration: none;
}

div.advanced-search span.section-container {
  margin: 0 0 0 20px;
  padding: 5px 0 3px 0;
  width: calc(33.3% - 20px);
  min-width: 220px;
}

div.advanced-search span.section-container.buttons {
  min-width: 250px;
}

div.advanced-search-bottom {
  padding: 20px 20px 20px 40px;
  background-color: #c7c8ca;
}

div.advanced-search span.section-1 {
  width: 100%;
}

div.advanced-search span.section-1 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-1 input {
  float: left;
  clear: left;
}

div.advanced-search span.section-1 input.text-box {
  width: 100%;
}

div.advanced-search span.section-2 {
  clear: left;
}

div.advanced-search span.section-2 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-2 input {
  height: auto;
  float: left;
  margin-top: 1px;
}

div.advanced-search span.section-3 {
  clear: none;
}

div.advanced-search span.section-3 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-4 {
  clear: left;
}

div.advanced-search a.advanced-search-toggle {
  font-weight: normal;
  margin: 0 5px;
}

div.advanced-search span.section-5 {
  padding-right: 20px;
  width: 33.3%;
  min-width: 240px;
}

div.advanced-search span.section-5 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-5 select {
  float: left;
  clear: left;
}

div.advanced-search span.section-6 {
  padding-right: 20px;
  width: 33.3%;
  min-width: 240px;
}

div.advanced-search span.section-6 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-6 select {
  float: left;
  clear: left;
}

div.advanced-search span.section-7 {
  padding-right: 20px;
  width: 33.3%;
  min-width: 240px;
}

div.advanced-search span.section-7 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-7 select {
  float: left;
  clear: left;
}

div.advanced-search span.section-8 {
  padding-right: 20px;
  width: 33.3%;
  min-width: 240px;
}

div.advanced-search span.section-8 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-8 select {
  float: left;
  clear: left;
}

div.advanced-search span.section-9 {
  padding-right: 20px;
  width: 33.3%;
  min-width: 240px;
}

div.advanced-search span.section-9 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-9 select {
  float: left;
  clear: left;
}

div.advanced-search span.section-10 {
  padding-right: 20px;
  width: 33.3%;
  min-width: 240px;
}

div.advanced-search span.section-10 label {
  float: left;
  margin: 0 5px;
}

div.advanced-search span.section-10 select {
  float: left;
  clear: left;
}

div.portfolioHome span.glyphicons {
  float: right;
  font-size: 0.8em;
}

div.portfolioHome span.glyphicons.complete {
  color: #52ca00;
}

div.portfolioHome span.glyphicons.in-progress {
  color: #d3a100;
}

div.portfolioHome span.glyphicons.not-started {
  color: #d14000;
}

div.portfolio-select select {
  float: left;
  clear: none;
  height: 25px;
  width: 70%;
  color: #000;
  font-size: 0.9em;
  font-weight: normal;
  background-color: #fff;
  padding: 0;
  float: left;
  border-style: solid;
  border-width: 1px;
  border-color: #c7c8ca;
  margin: 0 0 15px 0;
}

div.portfolio-select input[type=file] {
  float: left;
  clear: none;
  height: 25px;
  width: 70%;
  color: #000;
  font-size: 0.9em;
  font-weight: normal;
  background-color: #fff;
  padding: 0;
  float: left;
  border-style: solid;
  border-width: 1px;
  border-color: #c7c8ca;
  margin: 0 0 15px 0;
}

div.register {
  background-color: #b9595d;
  text-align: center;
  float: left;
  clear: left;
  width: 110px;
  height: 25px;
  padding: 2px 0 0;
  margin: 0 0 15px 0;
}

div.register a {
  color: #fff;
  font-size: 0.9em;
  font-weight: normal;
  text-align: center;
  width: 70px;
  height: 25px;
}

div.register:hover {
  color: #fff;
  background-color: #a8040a;
  cursor: pointer;
}

div.register a:hover {
  text-decoration: none;
}

div.article-options {
  float: right;
  margin: 25px 0 0 0;
}
div.article-options a, div.article-options span.video-button {
  font-weight: 700;
  color: #fff;
  line-height: 1;
  vertical-align: middle;
  display: block;
  height: 32px;
}
div.article-options a:hover, div.article-options span.video-button:hover {
  text-decoration: none;
  cursor: pointer;
}
div.article-options a span.glyphicons, div.article-options a span.social, div.article-options a span.glyphicons-custom, div.article-options span.video-button span.glyphicons, div.article-options span.video-button span.social, div.article-options span.video-button span.glyphicons-custom {
  line-height: 1;
  vertical-align: middle;
  font-size: 19px;
}
div.article-options a span.glyphicons:hover, div.article-options a span.social:hover, div.article-options a span.glyphicons-custom:hover, div.article-options span.video-button span.glyphicons:hover, div.article-options span.video-button span.social:hover, div.article-options span.video-button span.glyphicons-custom:hover {
  color: #c7c8ca;
  text-decoration: none;
  cursor: pointer;
}
div.article-options a span.glyphicons-custom, div.article-options span.video-button span.glyphicons-custom {
  top: -1px;
}

div.article-resourses-download a {
  float: left;
  margin: 5px 0;
}

div.article-resourses-download span.glyphicons {
  font-size: 1.5em;
  vertical-align: text-bottom;
  color: #000;
}

div.article-resourses-download a:hover span.glyphicons {
  color: blue;
}

div.rateIt-div {
  float: left;
  clear: both;
  width: 100%;
  border-top: solid 1px #636466;
  padding: 30px 0 0 0;
  margin: 30px 0;
}

div.socialButtons {
  height: 25px;
  width: calc(100% - 110px);
  margin-bottom: 15px;
  float: left;
}

div.socialButtons .social-twitter {
  height: 24px;
  width: 24px;
  font-size: 24px;
  float: right;
  color: #3faff4;
}
div.socialButtons .social-twitter:hover {
  color: #1da1f2;
}

div.socialButtons .social-facebook {
  height: 24px;
  width: 24px;
  font-size: 24px;
  float: right;
  margin-right: 16px;
  color: #4568b2;
}
div.socialButtons .social-facebook:hover {
  color: #3b5998;
}

form.search {
  margin-top: 15px;
}

select {
  width: 80%;
}

textarea {
  font-family: Verdana, Helvetica, Arial, sans-serif;
  margin: 0;
  width: 100%;
  height: 180px;
  border-style: solid;
  border-style: solid;
  border-width: 1px;
  border-color: #c7c8ca;
  padding: 15px 4px 4px 4px;
}

table.orderForm {
  table-layout: auto;
  padding: 10px;
  margin: 0;
}
table.orderForm td input {
  width: 100%;
  max-width: 120px;
  min-width: 80px;
}

table {
  table-layout: auto;
  width: 100%;
  padding: 20px;
  background-color: #c7c8ca;
}

td {
  white-space: nowrap;
}

th {
  text-align: left;
  background-color: #c7c8ca;
  padding: 5px;
  font-weight: normal;
}

td {
  text-align: left;
  background-color: #e2e3e4;
  padding: 5px;
}
td.icon {
  text-align: center;
}

td.data-3-4 {
  width: 69.5%;
}

td.data-2-3 {
  width: 62%;
}

td.data-1-2 {
  width: 46.5%;
}

td.data-3-8 {
  width: 34.5%;
}

td.data-1-3 {
  width: 31%;
}

td.data-1-4 {
  width: 23%;
}

td.edit {
  width: 7%;
  text-align: center;
}

td.edit-1-2 {
  width: 3.5%;
  text-align: center;
}

table.wrap td {
  width: 100%;
  white-space: normal;
}

td.wrap {
  width: 100%;
  white-space: normal;
}

td.absorbing-column, th.absorbing-column {
  width: 50%;
}

div.accordion-container h3 {
  text-align: center;
}

div.subject-result {
  padding: 20px 0;
  border-bottom: solid 1px #999;
}
div.subject-result h4 {
  margin: 0;
}
div.subject-result p {
  margin: 10px 0;
}
div.subject-result:last-of-type {
  border-bottom: none;
}

/* Header and Nav Bar */
.nav {
  margin: 0;
  padding: 0;
}

.nav ul {
  margin: 0;
  padding: 0;
  background-color: #000;
  z-index: 2;
}

.nav li {
  margin: 15px 0 15px 1.85%;
  width: 14.18%;
  list-style: none;
  display: inline-block;
  font-size: 1em;
  z-index: 2;
  vertical-align: top;
}

nav a {
  text-align: center;
  display: block;
  text-decoration: none;
  background-color: #636466;
  color: #fff;
  line-height: 100%;
  margin: 0;
  padding: 10px 0 9px 0;
}
@media screen and (min-width: 761px) {
  nav a.multi-line {
    line-height: 0.9;
    padding: 4px 0 3px 0;
  }
}

nav div.main {
  font-weight: bold;
  text-align: center;
  display: block;
  text-decoration: none;
  background-color: #636466;
  color: #fff;
  line-height: 100%;
  margin: 0;
  padding: 10px 0 9px 0;
}

div.btnContainer {
  max-width: 1020px;
  margin: 0 auto;
  z-index: 2;
}

div.drop {
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  width: 100%;
  max-width: 1020px;
  z-index: 2;
}

div.drop ul {
  z-index: 2;
}

/* Job Selector */
div.job-block-menu {
  margin: 0;
  padding: 15px;
}

div.job-block-menu ul {
  margin: 0;
  padding: 0;
}

div.job-block-menu li {
  width: 100%;
  margin: 2px 0 0 0;
  padding: 0;
  list-style: none;
}

div.job-block-menu a {
  text-align: center;
  display: block;
  text-decoration: none;
  background-color: #fff;
  line-height: 100%;
  margin: 0;
  padding: 5px 3px 5px 3px;
}

div.job-block-menu a.selected span.glyphicons-chevron-down:before {
  content: "\e601";
}

div.job-block-menu div#FurtherEvents {
  margin-top: 0;
}

div.job-block-menu a#ShowMore {
  float: none;
  margin-top: 10px;
  margin-bottom: 0;
  color: #00803e;
}

h4.job-menu-title {
  color: #fff;
  margin-top: 0;
}

table.courses {
  padding: 0;
  margin: 0;
  background-color: transparent;
  border: solid 1px #007BA8;
}

table.courses a {
  color: #000;
}

table.courses td {
  background-color: transparent;
}

table.courses th {
  background-color: transparent;
}

table.courses tr:nth-of-type(odd) {
  background-color: #fff;
}

table.courses tr:nth-of-type(even) {
  background-color: #e2e3e4;
}

table.courses tr.head {
  background-color: #007BA8;
}

table.courses th a {
  color: #fff;
}

table.courses th.no-link {
  color: #fff;
  font-weight: bold;
}

table.courses tr.foot {
  background-color: #636466;
}

table.courses tr.foot a, table.courses tr.foot span {
  color: #fff;
}

table.courses tr.foot a:hover {
  color: #c7c8ca;
}

table.courses div.pagination {
  float: right;
}

table.courses span.paginationLeft, table.courses span.paginationRight {
  float: left;
}

table.list-table {
  background-color: #fff;
  padding: 0;
  margin: 0 0 15px 0;
  border-collapse: collapse;
  border-spacing: 0;
}

table.list-table td {
  background-color: #fff;
  padding: 0;
  margin: 0;
  width: 50%;
}

div.course-info.grid {
  min-width: 0;
}

div.course-apply.grid {
  min-width: 0;
}

div.apply-button-container {
  padding: 5px 40px 0;
}

a.apprenticeship-apply {
  display: block;
  background-color: #465c7c;
  color: #fff;
  font-size: 1.3em;
  font-weight: normal;
  text-align: center;
  padding: 10px;
  margin-top: 20px;
  transition: 0.2s;
}
a.apprenticeship-apply:hover {
  background-color: #21406e;
  text-decoration: none;
  transition: 0.2s;
}

div.course-info div.col-1-3:nth-child(3n+1) {
  clear: left;
}

div.course-info h4 {
  margin-top: 5px;
  margin-bottom: 3px;
}

div.news-summary {
  border-top: solid 1px #eb050e;
  padding: 30px 0;
  margin: 0 40px 0 20px;
  float: left;
  width: 87.5%;
}

div.news-summary h5 {
  margin-top: 5px;
}

a.news-summary {
  margin: 0 0 15px 0;
  float: left;
  width: 100%;
  color: #636466;
  font-size: 1.5em;
  padding: 0;
  font-weight: bold;
}

a.news-summary:hover {
  text-decoration: underline;
}

a.archived {
  display: block;
  width: 100%;
  float: left;
  color: blue;
}

div.published p {
  color: #636466;
  float: right;
  margin-bottom: 0;
}

div.subject-areas-main-child {
  margin-bottom: 20px;
}

div.subject-areas-main-child a.subject-areas-main img.curricularAreaImage {
  height: 40vw;
  max-height: 445px;
  width: auto;
}

span.paginationLeft {
  margin-right: 15px;
}

div.college-tab, div.area-tab {
  height: 35px;
  margin-top: 30px;
  border: solid 1px #000;
}

div#MapOnly {
  padding: 20px;
}

div.google-map-plugin {
  height: 30vw;
  margin-top: 20px;
  max-height: 265px;
  height: 265px\9 ;
  border: solid 1px #000;
}

div.google-map-plugin-large {
  height: 55vw;
  margin-top: 20px;
  max-height: 566px;
  height: 566px\9 ;
  border: solid 1px #000;
}

a.google-map-switch-button {
  color: #000;
}

div.contact-main-div {
  margin-top: 30px;
}

div.contact-main-div h4 {
  margin-top: 0;
}

div.contact-main-div div.col-3-5 {
  padding-right: 0;
}

p.contact-icons {
  line-height: 1.7em;
  margin-top: 22px;
}
p.contact-icons span.glyphicons, p.contact-icons span.social {
  color: #000;
  vertical-align: bottom;
  margin-right: 5px;
}

p.contact-icons a:hover span.glyphicons {
  color: inherit;
}

.ui-tabs .ui-tabs-nav li a {
  font-size: 1em;
}

div.uni-contact {
  background-color: #e0e6e3;
  margin-top: 20px;
  padding-bottom: 20px;
}

div.uni-no-tabs {
  border: solid 1px #00803e;
  padding-top: 30px;
}

ul.a-to-z {
  padding: 7px;
  margin: 20px 0;
  background-color: #9ccab2;
}

ul.a-to-z li {
  display: inline-block;
  list-style: none;
  font-size: 1.2em;
  border-left: 2px solid #000;
  padding-left: 0.4%;
  width: 3.06%;
  min-width: 15px;
  text-align: center;
  margin: 5px 0;
  text-transform: uppercase;
}

ul.a-to-z.jobs li {
  width: 3.3%;
}

ul.a-to-z a {
  color: #000;
  text-decoration: none;
  font-weight: bold;
}

ul.a-to-z a:hover {
  color: #007BA8;
}

ul.a-to-z li.no-border {
  border-left: 0 none;
}

ul.a-to-z a.current {
  color: #fff;
}

ul.search-list {
  list-style: none;
  margin: 0 0 30px 0;
  padding: 10px 20px;
}

ul.search-list li {
  color: #000;
  text-decoration: none;
  font-size: 0.95em;
  font-weight: normal;
  display: block;
  border: 1px solid #c7c8ca;
  padding: 8px;
  margin: 10px 0;
}

ul.search-list li:hover {
  background-color: #c7c8ca;
}

ul.search-list span.glyphicons {
  margin-top: 2px;
  color: #333436;
}

ul#filters {
  list-style: none;
  padding: 0;
}

span.search-result-title {
  font-size: 1.5em;
  color: #333436;
}

span.search-result-title:hover {
  color: #333436;
  text-decoration: underline;
}

span.search-result-important {
  color: #000;
  margin-left: 23px;
}

span.search-result-info {
  font-weight: normal;
  color: #000;
}

ul.jobs-list {
  list-style: none;
  margin: 0 0 30px 0;
  padding: 10px 20px;
}

ul.jobs-list a {
  color: #000;
  text-decoration: none;
  font-size: 0.95em;
  font-weight: normal;
  display: block;
  border: 1px solid #007BA8;
  padding: 4px 5px 7px 5px;
  margin: 10px 0;
}

ul.jobs-list a:hover {
  background-color: #007BA8;
}

ul.jobs-list img {
  width: auto;
}

.job-block-menu img {
  width: auto;
}

ul.jobs-list li.empty {
  color: #000;
  text-decoration: none;
  font-size: 0.95em;
  font-weight: normal;
  display: block;
  border: 1px solid #007BA8;
  padding: 5px;
  margin: 10px 0;
}

ul.campus-list {
  list-style: none;
  margin: 0 0 30px 0;
  padding: 10px 0;
}

ul.campus-list li {
  color: #000;
  text-decoration: none;
  font-weight: normal;
  display: block;
  border: 1px solid #007BA8;
  padding: 10px;
  margin: 10px 0;
}

ul.campus-list li span {
  font-size: 1.2em;
  font-weight: bold;
}

ul.campus-list li:hover {
  background-color: #007BA8;
}

ul.campus-list img {
  width: auto;
}

div.campus-list h3 {
  display: block;
  padding: 10px 10px 10px 30px;
  font-size: 1.2em;
  color: #000;
  font-weight: bold;
  background: transparent;
}

div.campus-list div {
  background: transparent;
  border: none;
  margin: 0;
}

ul.course {
  list-style-type: none;
  padding: 0;
}

a.uni {
  display: block;
  color: #000;
  text-decoration: none;
  margin: 20px;
}

div.logo-container {
  height: 150px;
  height: 9vw;
  max-height: 100px;
  width: 100%;
  box-sizing: content-box;
}

div.logo-container img {
  max-height: 95px;
  width: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  z-index: 0;
}

div.logo-container div.placeholder {
  width: auto;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  z-index: 0;
}

div.logo-container div.placeholder div {
  padding: 0 10px;
}

div.logo-container div.placeholder div img {
  float: left;
}

div.logo-container div.placeholder div span {
  display: block;
  float: left;
  max-width: calc(100% - 15px);
  margin-top: 0;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  z-index: 0;
}

div.institution-logo {
  margin-left: 30px;
  margin-bottom: 30px;
}

div.institution-logo img {
  max-height: 123px;
  width: auto;
  float: right;
}

a.uni img {
  width: auto;
}

/* Page Banners */
div.titleBox {
  margin: 0 auto;
  width: 100%;
  max-width: 1020px;
  min-height: 140px;
}

div.titleBox h1 {
  max-width: 81%;
}

div.titleSquare {
  height: 1.4em;
  width: 0.8em;
  margin: 25px 12px 0 20px;
  float: left;
  background-color: #eb050e;
}

.grid-pad div.titleSquare {
  margin-left: 0;
}

div.titleSquare.home {
  background-color: #c31d24;
}

div.titleSquare.choicess3 {
  margin-top: 28px;
}

div.subPageMenu {
  clear: left;
  width: 100%;
  padding-bottom: 8px;
}

a.subBtn {
  display: block;
  font-weight: normal;
  padding: 0;
  margin: 8px 0 0 0;
  height: 28px;
  text-align: center;
  text-decoration: none;
  background-color: #fff;
  color: #000;
  box-sizing: content-box;
}

span.subBtn-vertalign {
  display: block;
  position: relative;
  top: 48%;
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 0;
  line-height: 1;
}

div.subBtn-vertalign {
  position: relative;
  top: 48%;
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 0;
  line-height: 1;
}

a.quickLinks-BtnL span.subBtn-vertalign, a.quickLinks-BtnR span.subBtn-vertalign {
  line-height: 1;
}

/* Main Content */
div.light-grey {
  width: 100%;
  background-color: #e2e3e4;
  margin: 20px 0 20px 0;
  padding: 20px;
}

div.tip-box {
  padding: 10px;
  color: #fff;
}

div.address:nth-of-type(odd) {
  clear: left;
}

form.easy-cv {
  display: block;
  font-size: 1.2em;
}

form.easy-cv input {
  height: 30px;
}

form.references input {
  width: 30%;
  margin-left: 20px;
}

form.easy-cv textarea {
  width: 70%;
}

input.submit-easy-cv {
  width: 30%;
  min-width: 100px;
  text-align: center;
  height: 30px;
  background-color: #a8040a;
  color: #fff;
  font-size: 0.6em;
}

input.submit-easy-cv:hover, input.submit-portfolio:hover {
  background-color: #c55050;
}

input.submit-portfolio {
  width: 30%;
  text-align: center;
  height: 30px;
  background-color: #a8040a;
  color: #fff;
}

input.submit-portfolio-sign-up {
  width: 28%;
  text-align: center;
  background-color: #a8040a;
  color: #fff;
  border-color: #a8040a;
}
input.submit-portfolio-sign-up:hover {
  background-color: #c44e52;
  border-color: #c44e52;
}

a.cv-download {
  background-color: #000;
  color: #E7134F;
  width: 100%;
  padding: 20px;
  font-size: 1em;
  display: block;
  text-align: center;
  text-decoration: none;
  margin-bottom: 30px;
}

input.checkbox {
  width: 20px;
  height: 20px;
  max-width: 20px;
  max-height: 20px;
  margin: 0 15px 0 0;
  float: left;
  cursor: pointer;
}

form.easy-cv div {
  height: 30px;
}

p.easy-cv-example {
  display: block;
  height: 25px;
  margin-top: 5px;
}

div.example-box {
  width: 100%;
}

a.easy-cv-edit {
  color: #eb050e;
  width: 100%;
  text-decoration: none;
  font-size: 1em;
  font-weight: normal;
}

img.cv-template {
  width: 50%;
  float: left;
  margin: 0 0 30px 20px;
}

form.checklist {
  float: left;
  width: 50%;
}

a.outlineBtn {
  display: block;
  width: 100%;
  margin: 0 0 15px 0;
  text-align: left;
  padding: 7px 15px 7px 15px;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #636466;
  font-size: 1.2em;
  font-weight: bold;
}

a.outlineBtn span {
  font-size: 0.8em;
  font-weight: normal;
  color: #000;
}

div.outlineBtn {
  display: block;
  width: 100%;
  margin: 0 0 15px 0;
  text-align: left;
  padding: 7px 15px 7px 15px;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #636466;
  font-size: 1.3em;
  font-weight: bold;
}

a.outlineBtn-Bottom {
  margin-bottom: 20px;
}

a.nextBtn {
  display: block;
  color: #636466;
  margin-bottom: 20px;
  text-decoration: none;
  font-size: 2em;
  margin-top: 10px;
}

div.quickLinks-Box {
  /*margin-top: 28px;*/
  margin-top: -2px;
}

h3.quickLinks-Header {
  background-color: #E7134F;
  text-align: center;
  margin-top: 30px;
  margin-bottom: 17px;
  padding-bottom: 1px;
  font-weight: bold;
}

a.quickLinks-BtnL {
  font-size: 1.2em;
  text-align: center;
  text-decoration: none;
  display: block;
  width: 46%;
  height: 60px;
  float: left;
  margin: 2px 0 20px 0;
  padding: 0 5px;
  background-color: #c7c8ca;
  font-weight: bold;
  color: #fff;
}

a.quickLinks-BtnR {
  font-size: 1.2em;
  text-align: center;
  text-decoration: none;
  display: block;
  width: 46%;
  height: 60px;
  float: right;
  margin: 2px 0 20px 0;
  padding: 0 5px;
  background-color: #c7c8ca;
  font-weight: bold;
  color: #fff;
}

div.map {
  max-width: 323px;
}

div.storySummaries {
  background-color: #e2e3e4;
}

a.optionsS3 {
  color: #000;
  font-weight: normal;
}

a.optionsS3:hover {
  text-decoration: none;
}

div.optionsS3-main {
  border: solid 1px #e2e3e4;
  background-color: #e2e3e4;
  padding: 15px 20px;
}
div.optionsS3-main:hover {
  border: solid 1px #662d91;
  background-color: #af90c7;
}

div.schoice-radio {
  padding-top: 15px;
}

input.submit-subject-select {
  margin: 20px 20px 20px 0;
  width: 20%;
  min-width: 110px;
  text-align: center;
  height: 30px;
  background-color: #662d91;
  color: #fff;
}
input.submit-subject-select:hover {
  background-color: #8139b8;
}

table.saved-choices {
  padding: 2px;
}

img.storySummaryImg {
  margin-top: 0;
  margin-bottom: 0;
}

a.largeBtn {
  display: block;
  text-align: center;
  text-decoration: none;
  color: #636466;
  border: solid 1px #eb050e;
  margin: 20px 0 20px 0;
  font-size: 1.5em;
  padding: 15px;
}
a.largeBtn:hover {
  color: #fff;
  background-color: #eb050e;
}

a.mediumBtn {
  display: inline-block;
  text-align: center;
  width: auto;
  text-decoration: none;
  color: #636466;
  border: solid 1px #662d91;
  margin: 0;
  font-size: 1.2em;
  padding: 12px 22px;
}
a.mediumBtn:hover {
  color: #fff;
  background-color: #662d91;
}

h2.subject-choice-level {
  padding: 12px 0;
  margin: 0 0 15px 0;
  color: #636466;
}

div.career-area {
  height: 9em;
  margin-bottom: 0;
}

div.career-pathway {
  height: 10.5em;
  margin-bottom: 24px;
}

div.dropdown-careers ul, div.dropdown-learning ul, div.dropdown-schools ul, div.dropdown-apprenticeships ul, div.dropdown-job ul, div.dropdown-links ul {
  min-height: 140px;
}

div.dropdown-careers, div.dropdown-learning, div.dropdown-schools, div.dropdown-apprenticeships, div.dropdown-job, div.dropdown-links {
  display: none;
  z-index: 2000;
}

div.subject-areas-sfw {
  height: 54px;
  position: relative;
  margin: 0 0 15px 0;
  padding-right: 20px;
  font-size: 1.1em;
}

div.subject-areas-child-sfw {
  position: relative;
  height: 100%;
  border: solid 1px #662d91;
}

a.subject-areas-sfw {
  position: absolute;
  background-image: url(../images/glyphicons-224-chevron-right.svg);
  background-size: 32px 32px;
  background-position: 0 center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  color: #000;
  font-weight: normal;
}

div.subject-areas-child-sfw:hover {
  background-color: #662d91;
}

a.subject-areas-main-sfw {
  position: absolute;
  background-image: url(../images/glyphicons-224-chevron-right.svg);
  background-size: 32px 32px;
  background-position: 0 center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  color: #000;
  font-weight: normal;
}

span.subject-areas-main-sfw {
  position: absolute;
  top: 50%;
  left: 30px;
  transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  padding-right: 5px;
  z-index: 1;
  line-height: 1;
}

@media screen and (min-width: 761px) {
  li.careers:hover div.dropdown-careers, li.learning:hover div.dropdown-learning, li.schools:hover div.dropdown-schools, li.apprenticeships:hover div.dropdown-apprenticeships, li.job:hover div.dropdown-job, li.links:hover div.dropdown-links {
    display: block;
  }
}
a.careers-drop, a.learning-drop, a.schools-drop, a.apprenticeships-drop, a.job-drop, a.links-drop {
  background-color: #fff;
}

h1.h1-careers, h1.h1-learning, h1.h1-schools, h1.h1-apprenticeships, h1.h1-job, h1.h1-links, h1.h1-portfolio, div.h1-careers, h1.h1-stem {
  margin-bottom: 15px;
  float: none;
  margin-top: 28px;
  font-size: 2.2em;
}

h1.h1-portfolio.savedInfo {
  margin-left: 20px;
}

a.subBtn-learning.single-row {
  margin-top: 45px;
}

a.subBtn-learning.single-row-alt {
  margin-top: 19px;
}

a.subBtn-learning.white-bold {
  color: #fff;
  font-weight: bold;
}

a.outlineBtn-learning:hover {
  color: #fff;
}

a.outlineBtn-schools:hover {
  color: #662d91;
}

div.storySumHead-schools {
  width: 100%;
  color: #fff;
  font-size: 0.7em;
  font-weight: bold;
  text-align: center;
  margin: 20px 0 0 0;
  padding: 8px 0 0 0;
  height: 30px;
}

div.storySumHead-schools.optionsS3 {
  font-size: 1em;
  padding: 5px 0 0 0;
  margin: 5px 0 0 0;
}

div.storySumHead-schools.optionsS3 span.glyphicons-chevron-right {
  float: left;
  margin-left: 5px;
}

a.outlineBtn-job:hover {
  color: #fff;
}

a.subBtn-links {
  background-color: #f5a1d3;
  color: #000;
}

a.largeBtn-links:hover {
  color: #fff;
}

.jss-banner {
  margin-top: 20px;
}
.jss-banner a {
  display: block;
}
.jss-banner a img {
  margin: 0;
}

h1.news {
  color: #eb050e;
  margin-bottom: 20px;
}

/* Career Areas Buttons */
a.career-areas-btn {
  display: block;
  margin-top: 30px;
  margin-bottom: 20px;
  padding: 5px;
  display: block;
  color: #000;
  text-align: center;
  text-decoration: none;
  line-height: 1.1;
}

a.career-pathways-btn {
  display: block;
  margin-top: 30px;
  margin-bottom: 40px;
  padding: 5px;
  display: block;
  color: #000;
  text-align: center;
  text-decoration: none;
  line-height: 1.1;
}

a.outlineBtn-news {
  margin-top: 0;
  margin-bottom: 20px;
  border-color: #eb050e;
  color: #636466;
}

a.outlineBtn-news:hover {
  background-color: #eb050e;
  color: #fff;
}

a.outlineBtn-news:hover span {
  color: #fff;
}

a.outlineBtn-news.selected {
  background-color: #eb050e;
  color: #fff;
}

a.outlineBtn-news.selected span {
  color: #fff;
}

/* Portfolio Colours */
a.subBtn-portfolio {
  background-color: #ce3a3f;
  color: #000;
}
a.subBtn-portfolio.current:hover {
  background-color: #fc777c;
}

a.largeBtn-portfolio {
  color: #a8040a;
  border-color: #a8040a;
}
a.largeBtn-portfolio:hover {
  background-color: #a8040a;
}

h1.h1-portfolio {
  color: #a8040a;
}

div.portfolioHome {
  text-align: left;
  padding: 7px 15px 7px 15px;
  text-decoration: none;
  border: solid 1px #a8040a;
  font-size: 1.3em;
  font-weight: bold;
  margin: 20px 0;
}

div.portfolioHome h2 {
  color: #000;
  margin: 0;
}

div.portfolioHome ul {
  font-size: 0.9em;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

div.portfolioHome ul.strengths-results {
  height: 300px;
  overflow-y: scroll;
}

div.portfolioHome a, div.portfolioHome li {
  color: #636466;
}

div.portfolioHome li span {
  font-size: 0.85em;
}

div.portfolioHome li span, div.portfolioHome li span a {
  color: #007BA8;
}

div.portfolio-accordion {
  padding: 0 40px 0 20px;
  margin-top: -15px;
}

div.portfolio-accordion span.glyphicons, div.portfolio-accordion span.glyphicons-custom {
  font-size: 1.2em;
}

div.savedInfo.left {
  border-right: solid 1px #a8040a;
  margin-right: -1px;
}

div.savedInfo.middle {
  border-left: solid 1px #a8040a;
  border-right: solid 1px #a8040a;
}

div.savedInfo.right {
  border-left: solid 1px #a8040a;
  margin-left: -1px;
}

div.savedInfo h2 {
  margin: 0 0 0 20px;
  color: #000;
}

div.savedInfo ul {
  list-style-type: none;
  padding: 0;
  margin: 20px 10px 0 20px;
}

/* ----bottom subject area---- */
div.subject-areas {
  height: 54px;
  position: relative;
  margin: 0 0 15px 0;
  padding-right: 20px;
  font-size: 1.1em;
}

div.subject-areas-child {
  position: relative;
  height: 100%;
  border: solid 1px #662d91;
}

a.subject-areas {
  position: absolute;
  background-image: url(../images/glyphicons-224-chevron-right.svg);
  background-size: 32px 32px;
  background-position: 0 center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  color: #000;
  font-weight: normal;
}

div.subject-areas-child:hover {
  background-color: #662d91;
}

span.subject-areas {
  position: absolute;
  top: 50%;
  line-height: 1.1;
  left: 25px;
  transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  padding-right: 5px;
  z-index: 1;
}

div.link-buttons {
  height: 52px;
  position: relative;
  margin: 0 0 15px 0;
  padding-right: 20px;
}

div.link-buttons-child {
  position: relative;
  height: 100%;
  border: solid 1px #E7134F;
}

a.link-buttons {
  position: absolute;
  background-image: url(../images/glyphicons-224-chevron-right.svg);
  background-size: 32px 32px;
  background-position: 0 center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  color: #000;
  font-weight: normal;
}

div.link-buttons-child:hover {
  background-color: #E7134F;
}

span.link-buttons {
  position: absolute;
  top: 50%;
  left: 25px;
  -ms-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding-right: 5px;
  z-index: 1;
}

/* Feedback Box */
#some-div {
  display: none;
}

/* This bit is fine */
div.feedbackBox {
  background-color: #e2e3e4;
  padding-top: 15px;
  margin-top: 15px;
  margin-bottom: -30px;
}

form#feedbackForm {
  width: 100%;
}

div.feedback {
  clear: none;
  background: none;
  padding-right: 20px;
}

div.feedback div {
  width: 30%;
  font-size: 0.9em;
  margin-top: 4px\9 ;
}

div.feedback div.message-error {
  width: 100%;
}

div.feedback div#text-errormsg {
  width: 100%;
  margin: 15px 0 0 5px;
  float: left;
  color: #d14000;
  font-size: 1em;
}

div.feedback input {
  width: 70%;
  font-size: 1em;
}

div.feedback div.messageTop {
  width: 100%;
  margin: 0;
}

div.feedback input.submit {
  width: 30%;
  text-align: center;
  background-color: #eb050e;
  border-color: #eb050e;
  font-size: 0.9em;
  color: #fff;
  margin-top: 4px\9 ;
}

div.feedback input.submit:hover {
  background-color: #000;
  border-color: #000;
  color: #fff;
}

input.login-submit:hover {
  background-color: #636466;
  color: #fff;
  border-color: #636466;
}

div.feedback div.feedbackTitleBox {
  float: left;
  width: 100%;
  background-color: #636466;
  color: #fff;
  margin: 0 0 15px 0;
}

span.job-sector {
  font-size: 0.8em;
  color: #636466;
}

/* Footer */
div.footer {
  background-color: #747476;
  padding: 20px;
  border-top: solid 8px #eb050e;
  margin-top: 30px;
}

img.logo-white {
  margin: 15px 0 0 0;
  width: auto;
}

img.logo-white.gateway {
  margin-top: 10px;
  max-width: 188px;
}

ul.footer {
  list-style: none;
  color: #fff;
  font-size: 0.6em;
  font-weight: lighter;
  margin: 0 0 3px 0;
  padding-left: 0;
}

ul.footer li b {
  font-weight: bold;
}

#tabs-2 ul.college-area-select {
  border: none;
  background-color: #fff;
}

#tabs-2 ul.college-area-select li {
  background-color: #fff;
  list-style-type: none;
  border: none;
}

div.colleges-map-container {
  position: relative;
  max-width: 80%;
  margin-top: 30px;
  margin-bottom: 20px;
}

/* new-window-indicator*/
.new-window-indicator {
  margin-left: 5px;
}

/* Position Modifiers */
h1.hidden-h1 {
  display: none;
}

.no-right-padding {
  padding-right: 0;
}

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

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

.bottom-margin {
  margin-bottom: 20px;
}

top-small-margin {
  margin-top: 10px;
}

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

.top-page-padding {
  padding-top: 30px;
}

.top-story-margin {
  margin-top: 20px;
}

.left-padding {
  padding-left: 20px;
}

.right-padding {
  padding-right: 20px;
}

.bottom-padding {
  padding-bottom: 30px;
}

.left-margin {
  margin-left: 50px;
}

.right-margin {
  margin-right: 5px;
}

.no-float {
  float: none;
}

.float {
  float: left;
}

.float-right {
  float: right;
}

.no-clear {
  clear: none;
}

.clear {
  clear: left;
}

.right-align {
  text-align: right;
}

.left-align {
  text-align: right;
}

.center-align {
  text-align: center;
}

div.early-bird-offer {
  padding: 15px;
  border: 2px solid #eb050e;
  margin-bottom: 20px;
}
div.early-bird-offer p {
  margin: 0;
}
div.early-bird-offer span {
  font-size: 1.25em;
  line-height: 1.5;
  font-weight: 900;
}
div.early-bird-offer span strong {
  color: #eb050e;
}

span.score-bar-container {
  position: absolute;
  right: 20px;
  top: 15px;
  width: 200px;
}

span.score-bar {
  float: right;
  background-repeat: repeat-x;
  background-position: left;
  width: 200px;
  height: 25px;
}

.Gold {
  background-image: url("../Images/MatchScoreBackgrounds/gold.png");
}

.Silver {
  background-image: url("../Images/MatchScoreBackgrounds/silver.png");
}

.Bronze {
  background-image: url("../Images/MatchScoreBackgrounds/bronze.png");
}

.Black {
  background-image: url("../Images/MatchScoreBackgrounds/black.png");
}

div.more {
  float: right;
  color: blue;
  font-weight: bold;
  cursor: pointer;
}

div.ms-options-wrap div.ms-options {
  left: 50%;
  transform: translateX(-50%);
}

.clearfix:before,
.clearfix:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.clearfix:after {
  clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.clearfix {
  *zoom: 1;
}

li.strengthcategory_info img {
  position: absolute;
  right: 0;
  top: 0;
}

li.strengthcategory_info {
  padding-right: 30px;
  position: relative;
}

.display-table.maxwidth550 {
  max-width: 550px;
}

@media screen and (min-width: 761px) {
  .display-table {
    display: table;
    float: left;
    border-spacing: 20px;
  }
  .display-table-row {
    display: table-row;
    width: 100%;
  }
  .display-table-cell {
    display: table-cell;
    width: 50%;
  }
  .display-table-caption {
    display: table-caption;
    text-align: center;
  }
  .display-table-cell-strengths-results {
    display: table-cell;
    width: 50%;
    overflow: auto;
  }
  .display-table.no-top-margin {
    border-spacing: 0;
    margin-top: -1px;
  }
}
/* Address links */
a.weblink {
  font-size: 1em;
  color: blue;
  text-decoration: none;
  font-weight: normal;
  -ms-word-wrap: break-word;
  word-wrap: break-word;
}

a.weblink:hover {
  text-decoration: underline;
}

/* Media Specific */
/* Tablet Site */
@media screen and (max-width: 900px) {
  nav a {
    font-size: 0.85em;
  }
  nav div.main {
    font-size: 0.85em;
  }
  input.login-submit {
    font-size: 0.8em;
  }
  form div.login-div {
    font-size: 0.8em;
  }
}
/* Expanding Tabs */
@media screen and (min-width: 761px) {
  li.careers:hover div.careers, li.learning:hover div.learning, li.schools:hover div.schools, li.apprenticeships:hover div.apprenticeships, li.job:hover div.job, li.links:hover div.links {
    padding-bottom: 24px;
  }
  li.careers:hover, li.learning:hover, li.schools:hover, li.apprenticeships:hover, li.job:hover, li.links:hover {
    margin-bottom: 0;
  }
}
/* IE8 Hacked Tabs */
li.careers:hover div.careers, li.learning:hover div.learning, li.schools:hover div.schools, li.apprenticeships:hover div.apprenticeships, li.job:hover div.job, li.links:hover div.links {
  padding-bottom: 24px\9 ;
}

/* Mobile Site */
@media screen and (max-width: 760px) {
  html {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  h1 {
    font-size: 1.5em;
    margin-top: 23px;
  }
  h2 {
    margin-top: 30px;
  }
  li {
    margin-top: 15px;
  }
  .nav {
    position: relative;
    min-height: 71px;
  }
  .nav ul {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  .nav ul li {
    cursor: pointer;
  }
  .ui-menu .ui-menu-item a {
    z-index: 1000;
  }
  li.main.show {
    display: block;
  }
  li.main span.glyphicons {
    margin-right: 4px;
  }
  .nav li span.glyphicons {
    font-size: 14px;
    display: none;
    vertical-align: top;
  }
  .nav li span.glyphicons.show {
    display: inline;
  }
  div.dropdown-careers.show li, div.dropdown-learning.show li, div.dropdown-schools.show li, div.dropdown-job.show li, div.dropdown-apprenticeships.show li, div.dropdown-links.show li {
    display: block;
  }
  div.dropdown-careers.show, div.dropdown-learning.show, div.dropdown-schools.show, div.dropdown-job.show, div.dropdown-apprenticeships.show, div.dropdown-links.show {
    display: block;
  }
  .nav li {
    display: none; /* hide all <li> items */
    width: 90%;
    width: calc(100% - 40px);
    margin: 20px;
    padding: 0;
  }
  .nav li.careers, .nav li.learning, .nav li.schools, .nav li.apprenticeships, .nav li.job, .nav li.links, .nav li.open-menu, .nav li.close-menu, .nav li.portfolio {
    font-size: 1.1em;
  }
  .nav a {
    display: block;
    padding: 10px 10px 10px 10px;
    text-align: left;
    height: 33px;
  }
  .nav div.main, .nav li.main, .nav a.main {
    height: 35px;
  }
  div.drop a {
    height: 35px;
  }
  .nav div.main {
    display: block;
    padding: 10px 10px 10px 10px;
    text-align: left;
  }
  div.dropdown-careers ul, div.dropdown-learning ul, div.dropdown-schools ul, div.dropdown-apprenticeships ul, div.dropdown-job ul, div.dropdown-links ul {
    min-height: 0;
  }
  .ui-autocomplete {
    z-index: 1000;
  }
  div.titleBox {
    float: left;
  }
  form.search div {
    width: 30%;
  }
  form.search input {
    width: 70%;
    padding-right: 24px;
    /*width: calc(70% - 24px);*/
  }
  form.search div.search-button {
    margin-left: -25px;
    border-left: solid 1px #c7c8ca;
    padding-left: 1px;
  }
  form.search div.search-button:hover {
    background-color: #fff;
    padding-left: 0;
  }
  form.search select {
    width: 100%;
    padding-left: 7%;
  }
  form.search div svg {
    left: 37%;
  }
  div.grid.advanced-search {
    padding: 0;
  }
  span.search-result-title {
    font-size: 1.2em;
  }
  ul.search-list {
    padding: 10px 0;
  }
  div.article-options {
    float: left;
  }
  div.article-options a, div.article-options span.video-button {
    display: inline-block;
    margin-right: 10px;
  }
  div.drop {
    position: relative;
    margin: 0 0 0 40%;
    left: auto;
    right: auto;
    max-width: 60%;
  }
  .ui-tabs .ui-tabs-nav li a {
    padding: 0;
  }
  .ui-tabs-nav a {
    width: auto;
    display: block;
    margin: 0;
    padding: 8px;
    font-size: 0.8em;
  }
  div.dropdown-careers, div.dropdown-learning, div.dropdown-schools, div.dropdown-apprenticeships, div.dropdown-job, div.dropdown-links {
    min-height: 0;
  }
  div.logged-in-container {
    width: 25%;
  }
  div.logged-in-welcome {
    width: calc(75% - 80px);
    margin-top: 0;
  }
  div.signed-in {
    margin-bottom: 15px;
  }
  div.socialButtons {
    width: auto;
    float: right;
    margin-top: 8px;
  }
  div.logged-in-spacer {
    width: 70%;
    float: left;
    margin: 0 0 15px 0;
    height: 25px;
  }
  div.logged-in-container {
    width: 30%;
  }
  div.logged-in-welcome {
    width: calc(70% - 80px);
  }
  div.titleSquare {
    height: 1.05em;
    width: 0.7em;
    margin-top: 30px;
  }
  a.subBtn-learning.single-row {
    margin-top: 8px;
  }
  a.subBtn-learning.single-row-alt {
    margin-top: 8px;
  }
  a.subBtn {
    text-align: left;
    padding-left: 12px;
  }
  a.quickLinks-BtnL {
    height: 30px;
  }
  a.quickLinks-BtnR {
    height: 30px;
  }
  div.job-block-menu a {
    text-align: left;
    padding: 8px 12px;
    font-size: 0.8em;
  }
  a.career-areas-btn {
    text-align: left;
    font-weight: normal;
    border-style: solid;
    border-width: 1px;
    font-size: 0.95em;
    padding: 5px;
    margin: 10px 0;
  }
  a.career-areas-btn img {
    width: auto;
  }
  a.career-pathways-btn {
    text-align: left;
    font-weight: normal;
    border-style: solid;
    border-width: 1px;
    font-size: 0.95em;
    padding: 5px;
    margin: 10px 0;
  }
  a.career-pathways-btn img {
    width: auto;
  }
  a.google-map-switch-button {
    display: none;
  }
  div.career-area {
    height: auto;
  }
  div.career-pathway {
    height: auto;
  }
  form div.login-div {
    font-size: 0.8em;
  }
  div.logged-in-div {
    font-size: 0.8em;
  }
  div.register {
    font-size: 0.8em;
    width: 30%;
  }
  input {
    font-size: 0.8em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
  }
  input[type=checkbox] {
    -webkit-appearance: checkbox;
    -moz-appearance: checkbox;
    appearance: checkbox;
    width: 18px;
    height: 18px;
    margin: 0 10px;
  }
  input[type=radio] {
    -webkit-appearance: radio;
    -moz-appearance: radio;
    appearance: radio;
    width: 18px;
    height: 18px;
    margin: 0 10px;
  }
  div.radio-container span.radio input[type=radio] {
    -webkit-appearance: radio;
    -moz-appearance: radio;
    appearance: radio;
  }
  input#IsTitleOnly {
    -webkit-appearance: checkbox;
    -moz-appearance: checkbox;
    appearance: checkbox;
    width: 14px;
    height: 14px;
    border-radius: initial;
  }
  div.feedbackTitleBox {
    font-size: 0.8em;
  }
  form.feedback div.login-div {
    font-size: 0.8em;
  }
  form.feedback input.submit {
    font-size: 0.8em;
    width: 60px;
  }
  input.login-submit {
    font-size: 0.8em;
    width: 20%;
    width: 65px;
  }
  div.password-input {
    width: 50%;
    width: calc(70% - 65px);
  }
  div.feedbackBox {
    height: 580px;
  }
  div.feedback {
    clear: both;
  }
  div.google-map-plugin {
    height: 50%;
    height: 60vw;
    max-height: none;
  }
  div.uni {
    border: solid 1px #00803e;
    margin: 20px 10px 20px 0;
    padding: 0;
  }
  a.uni {
    margin: 0;
    padding: 10px;
  }
  a.uni:hover {
    background-color: #00803e;
  }
  div.institution-logo img {
    padding-left: 20px;
    padding-bottom: 20px;
    max-width: 50%;
    max-height: 100px;
  }
  img#scot-map {
    max-width: 50%;
  }
  div.subject-areas-main {
    height: 40px;
    position: relative;
    margin: 0 0 15px 0;
  }
  div.subject-areas-main-child {
    position: relative;
    height: 100%;
    border: solid 1px #662d91;
  }
  a.subject-areas-main {
    position: absolute;
    background-image: url(../images/glyphicons-224-chevron-right.svg);
    background-size: 32px 32px;
    background-position: 0 center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    color: #000;
    font-weight: normal;
  }
  div.subject-areas-main-child:hover {
    background-color: #662d91;
  }
  span.subject-areas-main {
    position: absolute;
    top: 50%;
    left: 30px;
    transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    padding-right: 5px;
    z-index: 1;
    line-height: 1;
  }
  div.savedInfo.left {
    border-right: none;
    margin-right: 0;
  }
  div.savedInfo.middle {
    border-left: none;
    border-right: none;
  }
  div.savedInfo.right {
    border-left: none;
    margin-left: 0;
  }
  .display-table.no-top-margin {
    margin-top: -11px;
  }
  div.news-summary {
    width: 90%;
  }
  div.portfolio-accordion {
    padding: 0 10px 0 0;
  }
  div.level-year-filters {
    padding: 15px;
  }
  /* on nav hover */
  ul.main.show li {
    display: block;
  }
  .float-right {
    float: none;
  }
}
/* Career Area Menu Colors */
div.job-block-menu.top {
  background-color: #007BA8;
}
div.job-block-menu.second-top {
  background-color: #0091c7;
}
div.job-block-menu.third-top {
  background-color: #00a8e5;
}
div.job-block-menu.fourth-top {
  background-color: #05bcff;
}
div.job-block-menu.fifth-top {
  background-color: #23c4ff;
}
div.job-block-menu a {
  color: #007BA8;
  font-weight: bold;
}
div.job-block-menu a:hover {
  background-color: #75daff;
}
div.job-block-menu a.selected {
  background-color: #5cd3ff;
}

/* Area Specific Colors */
/* Home Colors */
div.title-home {
  background-color: #a8040a;
}

/* Search Colors */
div.title-search {
  background-color: #c7c8ca;
}

/* Career Colors */
li.home:hover a.home {
  background-color: #eb050e;
}

div.dropdown-home ul {
  background-color: #eb050e;
}

a.home-drop {
  color: #eb050e;
}

a.home-drop:hover {
  color: #fff;
  background-color: #ca7474;
}

div.title-home {
  background-color: #eb050e;
}

a.quickLinks-home:hover {
  background-color: #eb050e;
}

h1.h1-home {
  color: #eb050e;
}

/* Portfolio Colors */
div.title-portfolio {
  background-color: #a8040a;
}

a.quickLinks-portfolio {
  background-color: #d04247;
}

a.quickLinks-portfolio:hover {
  background-color: #a8040a;
}

/* Career Colors */
li.careers:hover div.careers {
  background-color: #007BA8;
}

div.dropdown-careers ul {
  background-color: #007BA8;
}

a.careers-drop {
  color: #007BA8;
}
a.careers-drop:hover {
  color: #fff;
  background-color: #5bb9dc;
}

div.title-careers {
  background-color: #007BA8;
}

a.quickLinks-careers {
  background-color: #179dce;
}

a.quickLinks-careers:hover {
  background-color: #007BA8;
}

h1.h1-careers {
  color: #007BA8;
}

/* Learning Colors */
li.learning:hover div.learning {
  background-color: #00803e;
}

div.dropdown-learning ul {
  background-color: #00803e;
}

a.learning-drop {
  color: #00803e;
}

a.learning-drop:hover {
  color: #fff;
  background-color: #61d198;
}

div.title-learning {
  background-color: #00803e;
}

a.quickLinks-learning {
  background-color: #00e66f;
}

a.quickLinks-learning:hover {
  background-color: #00803e;
}

a.subBtn-learning {
  background-color: #00a952;
}
a.subBtn-learning:hover, a.subBtn-learning.selected {
  background-color: #00c25e;
}

a.outlineBtn-learning {
  color: #00803e;
}
a.outlineBtn-learning:hover, a.outlineBtn-learning.selected {
  border-color: #00803e;
  background-color: #00803e;
  color: #fff;
}

h1.h1-learning {
  color: #00803e;
}

/* Schools Colors */
li.schools:hover div.schools {
  background-color: #662d91;
}

div.dropdown-schools ul {
  background-color: #662d91;
}

a.schools-drop {
  color: #662d91;
}

a.schools-drop:hover {
  color: #fff;
  background-color: #b293c9;
}

div.title-schools {
  background-color: #662d91;
}

a.quickLinks-schools {
  background-color: #9a59cb;
}

a.quickLinks-schools:hover {
  background-color: #662d91;
}

h1.h1-schools {
  color: #662d91;
}

div.storySumHead-schools {
  background-color: #662d91;
}

a.outlineBtn-schools {
  color: #662d91;
}

a.outlineBtn-schools:hover {
  border-color: #662d91;
  background-color: #662d91;
  color: #fff;
}

a.outlineBtn-schools.selected {
  border-color: #662d91;
  background-color: #662d91;
  color: #fff;
}

a.largeBtn-schools {
  color: #662d91;
  border-color: #662d91;
}
a.largeBtn-schools:hover {
  background-color: #662d91;
}

/* Apprenticeships Colors */
li.apprenticeships:hover div.apprenticeships {
  background-color: #21406e;
}

div.dropdown-apprenticeships ul {
  background-color: #21406e;
}

a.apprenticeships-drop {
  color: #21406e;
}

a.apprenticeships-drop:hover {
  color: #fff;
  background-color: #829fd0;
}

div.title-apprenticeships {
  background-color: #21406e;
}

a.quickLinks-apprenticeships {
  background-color: #396ebc;
}

a.quickLinks-apprenticeships:hover {
  background-color: #21406e;
}

/* Finding a Job Colors */
li.job:hover div.job {
  background-color: #D44211;
}

div.dropdown-job ul {
  background-color: #D44211;
}

li.job:hover a.job {
  background-color: #D44211;
}

a.job-drop {
  color: #D44211;
}

a.job-drop:hover {
  color: #fff;
  background-color: #f28059;
}

div.title-job {
  background-color: #D44211;
}

a.quickLinks-job {
  background-color: #f28059;
}

a.quickLinks-job:hover {
  background-color: #D44211;
}

a.subBtn-job {
  background-color: #ec4d17;
}

a.subBtn-job:hover {
  background-color: #F59363;
}

a.subBtn-job.selected {
  background-color: #F59363;
}

a.outlineBtn-job {
  color: #D44211;
}

a.outlineBtn-job:hover {
  border-color: #D44211;
  background-color: #D44211;
}

a.outlineBtn-job.selected {
  border-color: #D44211;
  background-color: #D44211;
  color: #fff;
}

h1.h1-job {
  color: #D44211;
}

/* Stem Colors */
li.stem:hover div.stem {
  background-color: #067A74;
}

div.dropdown-stem ul {
  background-color: #067A74;
}

a.stem-drop {
  color: #067A74;
}

a.stem-drop:hover {
  color: #fff;
  background-color: #829fd0;
}

div.title-stem {
  background-color: #067A74;
}

a.quickLinks-stem {
  background-color: #509693;
}

a.quickLinks-stem:hover {
  background-color: #067A74;
}

a.outlineBtn-stem {
  color: #067A74;
}

a.outlineBtn-stem:hover {
  background-color: #067A74;
  border-color: #067A74;
  color: #fff;
}

a.outlineBtn-stem.selected {
  background-color: #067A74;
  border-color: #067A74;
  color: #fff;
}

h1.h1-stem {
  color: #067A74;
}

/* Links Colors */
li.links:hover div.links {
  background-color: #E7134F;
}

div.dropdown-links ul {
  background-color: #E7134F;
}

li.links:hover a.links {
  background-color: #E7134F;
}

a.links-drop {
  color: #E7134F;
}

a.links-drop:hover {
  color: #fff;
  background-color: #f2648c;
}

a.subBtn-links {
  background-color: #f2648c;
  font-size: 0.9em;
}
a.subBtn-links:hover {
  background-color: #f580a1;
}
a.subBtn-links.selected {
  background-color: #f693af;
}

a.largeBtn-links {
  color: #E7134F;
  border-color: #E7134F;
}

a.largeBtn-links:hover {
  background-color: #E7134F;
}

div.title-links {
  background-color: #E7134F;
}

a.quickLinks-links {
  background-color: #f36d93;
}

a.quickLinks-links:hover {
  background-color: #E7134F;
}

a.outlineBtn-links {
  color: #E7134F;
}

a.outlineBtn-links:hover {
  background-color: #E7134F;
  border-color: #E7134F;
  color: #fff;
}

a.outlineBtn-links.selected {
  background-color: #E7134F;
  border-color: #E7134F;
  color: #fff;
}

h1.h1-links {
  color: #E7134F;
}

div.tip-box {
  background-color: #a8040a;
}

/*.ui-tabs .ui-tabs-panel a
{
    color: #006666;
    text-decoration: none;
}

    .ui-tabs .ui-tabs-panel a:hover
    {
        color: green;
        text-decoration: underline;
    }

    .ui-tabs .ui-tabs-panel a.underline
    {
        text-decoration: underline;
    }*/
@media screen and (max-width: 900px) {
  a.quickLinks-BtnL, a.quickLinks-BtnR {
    width: 48%;
  }
}
@media screen and (max-width: 760px) {
  a.career-areas-btn {
    border-color: #007BA8;
  }
  a.career-areas-btn:hover {
    background-color: #007BA8;
  }
  a.career-pathways-btn {
    border-color: #007BA8;
  }
  a.career-pathways-btn:hover {
    background-color: #007BA8;
  }
  .nav li.open-menu:hover div.main {
    background-color: #636466;
  }
  .nav li.close-menu:hover div.main {
    background-color: #eb050e;
  }
  div.main.careers.highlighted {
    background-color: #007BA8;
  }
  div.main.learning.highlighted {
    background-color: #00803e;
  }
  div.main.schools.highlighted {
    background-color: #662d91;
  }
  div.main.apprenticeships.highlighted {
    background-color: #21406e;
  }
  div.main.job.highlighted {
    background-color: #D44211;
  }
  div.main.links.highlighted {
    background-color: #E7134F;
  }
  .nav a.portfolio {
    background-color: transparent;
  }
  .nav li.portfolio div.main {
    padding: 0;
    font-size: 1em;
  }
  .nav li.portfolio:hover div.main {
    background-color: #a8040a;
  }
  a.log-out-button span.glyphicons-lock.float-right, a.log-out-button span.glyphicons-unlock.float-right {
    float: right;
  }
  .nav li.portfolio a.log-out {
    width: 90%;
    float: left;
  }
  .nav li.portfolio a.log-out-button {
    width: 10%;
    display: inline-block;
    clear: none;
    background-color: transparent;
  }
  table.orderForm {
    display: block;
    min-width: 354px;
  }
  table.orderForm tr {
    background-color: #e2e3e4;
  }
  table.orderForm td {
    display: block;
  }
  table.orderForm td.first-row {
    width: 100%;
    float: left;
    padding-bottom: 0;
    padding-top: 8px;
    font-size: 1.2em;
    white-space: normal;
  }
  table.orderForm td.second-row {
    width: auto;
    float: left;
    padding-top: 0;
  }
  table.orderForm td.second-row input {
    max-width: 100px;
  }
  table.orderForm td.absorbing-column {
    display: none;
  }
  table.orderForm td.totals {
    min-width: 220px;
  }
  table.orderForm td span.small-label {
    font-size: 0.75em;
    color: #636466;
  }
  .mobile-top-margin {
    margin-top: 20px;
  }
}
/* asp.net mvc validation classes */
.input-validation-error {
  border: 1px solid #d14000;
}

.input-validation-valid {
  /* Optional: you can set whatever style you want */
}

.field-validation-error {
  color: #d14000;
}

.field-validation-valid {
  display: none;
}

.validation-summary-errors, .error {
  background: #FFEEEE url(/Content/Images/error.png) no-repeat 10px 10px;
  border: solid 1px #FF6A6A;
  padding: 10px 10px 10px 50px;
  margin-bottom: 10px;
  color: #333436;
  border-radius: 0.6em;
  -moz-border-radius: 0.6em;
}

.validation-summary-errors ul {
  list-style-type: disc;
  margin-left: 30px;
}

.validation-summary-errors ul li {
  margin: 5px 0 5px 0;
}

.validation-summary-valid {
  display: none;
}

/* Used for the validation in SignInPartial */
#SignIn .validation-summary-errors {
  background: #FFEEEE;
  border: solid 1px #FF6A6A;
  padding: 0;
  margin-bottom: 10px;
  color: #333333;
  border-radius: 0.6em;
  -moz-border-radius: 0.6em;
}

#SignIn .validation-summary-errors ul {
  list-style-type: disc;
  margin-left: 50px;
}

#SignIn .validation-summary-errors ul li {
  margin: 5px 0 5px 0;
}

#SignIn .validation-summary-valid {
  display: none;
}

/* Tiny Mobile site */
@media screen and (max-width: 300px) {
  html {
    font-size: 0.8em;
  }
  div.titleBox {
    min-height: 80px;
  }
  div.titleSquare {
    margin-top: 16px;
  }
  h1 {
    margin-top: 10px;
  }
  div.socialButtons {
    margin-top: -4px;
  }
  div.socialButtons .social-twitter {
    height: 20px;
    width: 20px;
    font-size: 20px;
  }
  div.socialButtons .social-facebook {
    height: 20px;
    width: 20px;
    font-size: 20px;
    margin-right: 14px;
  }
  img.logo {
    width: 110px;
  }
  img.logo-white {
    max-width: 60%;
  }
  .nav div.main, .nav li.main, .nav a.main, div.drop a {
    height: 32px;
  }
  .nav li.portfolio a.log-out {
    width: 80%;
  }
  .nav li.portfolio a.log-out-button {
    width: 20%;
  }
}
@media screen and (max-width: 240px) {
  img.logo {
    width: 100px;
  }
  div.socialButtons {
    float: left;
    clear: left;
  }
}
div.uni {
  position: relative;
}

div.uni div.border-holder {
  top: 0;
  right: 20px;
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: 1000;
}

@media screen and (min-width: 761px) {
  div.uni div.border-holder:hover {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 5px;
  }
}
/* Twitter Stuff */
div.twitter-container {
  margin-right: -8px;
  margin-left: -8px;
}

h2.twitter-header {
  width: 100%;
  max-width: 505px;
}

span.twitter-follow-button {
  float: right;
  margin-top: 2px;
}

ul.footer li span.glyphicons {
  line-height: 1;
  vertical-align: top;
}

.courses-bold {
  font-weight: bold;
}

span.course-code-header {
  font-size: 0.75em;
  font-weight: normal;
}

ul.jobs-list a span.glyphicons {
  top: 2px;
}

/* video button */
div.video-button-container {
  height: 60px;
  margin-bottom: -60px;
  position: relative;
}

div.video-button {
  width: 60px;
  height: 60px;
  border-top: 30px solid #636466;
  border-left: 30px solid #636466;
  border-right: 30px solid rgba(0, 0, 0, 0);
  border-bottom: 30px solid rgba(0, 0, 0, 0);
  z-index: 101;
  position: absolute;
  top: 0;
  left: 0;
  padding: -25px;
  display: none;
  cursor: pointer;
}

div.video-button.no-image {
  border-top: 30px solid #636466;
  border-right: 30px solid #636466;
  border-left: 30px solid rgba(0, 0, 0, 0);
  border-bottom: 30px solid rgba(0, 0, 0, 0);
  top: -60px;
  right: 0;
  left: auto;
}

div.video-button.institution {
  width: auto;
  height: auto;
  border: none;
  position: static;
  top: auto;
  left: auto;
  padding: 0 0 15px 0;
  display: none;
  cursor: pointer;
  line-height: 1;
}

div.video-button.institution:hover {
  text-decoration: underline;
  vertical-align: middle;
}

div.video-button.institution span.glyphicons-video-button {
  position: static;
  top: auto;
  left: auto;
  color: #555;
  vertical-align: middle;
}

div.video-button.institution:hover span.glyphicons-video-button {
  color: #888;
}

div.video-close-button {
  width: 40px;
  height: 40px;
  z-index: 1500;
  position: absolute;
  display: none;
  cursor: pointer;
  right: -44px;
  top: -30px;
}

div.video-close-button.article-close-button {
  right: -16px;
}

div.video-container {
  position: relative;
  width: 100%;
  display: none;
}

div.video-greyout {
  background-color: rgba(0, 0, 0, 0.8);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: none;
  z-index: 100;
}

div.video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 34.7vw;
  max-height: 363px;
  background-color: rgba(200, 0, 0, 0.3);
  z-index: 102;
}

div.videoHolder {
  width: 100%;
  height: 34.7vw;
  max-height: 363px;
}
div.videoHolder.autoAspectRatio {
  aspect-ratio: 16/9.2;
  max-height: none;
}

div.videoHolderBBC {
  width: 100%;
  height: 52.7vw;
  max-height: 440px;
  max-width: 600px;
}

div.videoHolder p, div.videoHolderBBC p {
  float: right;
  line-height: 1;
}

span.glyphicons-video-button:before {
  content: "\e221";
}

span.glyphicons-video-close-button:before {
  content: "\e198";
}

div.video-button.show, div.video-close-button.show, div.video-container.show, div.video-greyout.show {
  display: block;
}

span.glyphicons-video-button {
  position: absolute;
  top: -27px;
  left: -23px;
  font-size: 1.4em;
  color: #fff;
}

div.video-button.no-image span.glyphicons-video-button {
  top: -27px;
  right: -23px;
  left: auto;
}

span.glyphicons-video-close-button {
  position: absolute;
  font-size: 1.4em;
  color: #eee;
}

div.video-button:hover span.glyphicons-video-button, div.video-close-button:hover span.glyphicons-video-close-button {
  color: #bbb;
}

p.lmi-disclaimer {
  color: #636466;
  text-align: right;
  font-size: 0.8em;
}

p.lmi-disclaimer a {
  color: #636466;
}

@media screen and (max-width: 760px) {
  div.video {
    height: 52vw;
    max-height: none;
  }
  div.videoHolder {
    height: 52vw;
    max-height: none;
  }
  div.video-close-button {
    right: -27px;
  }
}
span.text {
  max-width: calc(100% - 30px);
  display: inline-block;
}

.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front {
  width: 80% !important;
  max-width: 800px !important;
}

.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front #TermsConditionDialog {
  height: 80vh !important;
  overflow-y: scroll;
}

.x-icon {
  display: inline-block;
  float: right;
  width: 26px;
  border-radius: 4px;
}
.x-icon:hover {
  background: #e2e3e4;
}
.x-icon img {
  vertical-align: top;
  margin: 0;
}

.values-accordion h3, .skills-accordion h3 {
  background: none !important;
  border: none !important;
  color: #636466 !important;
  font-weight: bold !important;
  margin: 0 !important;
  padding: 0 0 0 2em !important;
}
.values-accordion .ui-accordion-content, .skills-accordion .ui-accordion-content {
  font-size: 0.8em !important;
  font-weight: normal !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  border: none !important;
}

.skills-accordion {
  font-size: 20px !important;
  font-weight: normal !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  border: none !important;
}

div#tabs-stage1 h2 {
  color: #000;
  margin: 0;
}
