/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/******************* 
START SITE WIDE VALUES
*******************/
body.body-master {
  background-color: #FFFFFF;
  font-size: 16px; }
  body.body-master section.color-three {
    background-color: #FFFFFF; }

button.btn,
input.btn,
.btn
section.content-body button.btn, section.content-body .btn,
section.content-body .btn.btn-three, section.content-body .btn.btn-two {
  color: #FFFFFF;
  background-color: #0D6FB5;
  border-color: #0D6FB5;
  border-radius: 6px;
  padding: 6px 12px; }
  button.btn:hover, button.btn:focus,
  input.btn:hover,
  input.btn:focus,
  .btn
section.content-body button.btn:hover,
  .btn
section.content-body button.btn:focus, section.content-body .btn:hover, section.content-body .btn:focus,
  section.content-body .btn.btn-three:hover,
  section.content-body .btn.btn-three:focus, section.content-body .btn.btn-two:hover, section.content-body .btn.btn-two:focus {
    color: #FFFFFF;
    background-color: #23A7DF;
    border-color: #23A7DF; }
  button.btn.btn-large,
  input.btn.btn-large,
  .btn
section.content-body button.btn.btn-large, section.content-body .btn.btn-large,
  section.content-body .btn.btn-three.btn-large, section.content-body .btn.btn-two.btn-large {
    width: 100%;
    font-size: 16px; }
  button.btn.btn-three, button.btn.btn-two,
  input.btn.btn-three,
  input.btn.btn-two,
  .btn
section.content-body button.btn.btn-three,
  .btn
section.content-body button.btn.btn-two, section.content-body .btn.btn-three, section.content-body .btn.btn-two,
  section.content-body .btn.btn-three.btn-three,
  section.content-body .btn.btn-three.btn-two, section.content-body .btn.btn-two.btn-three, section.content-body .btn.btn-two.btn-two {
    color: #FFFFFF;
    background-color: #0D6FB5;
    border-color: #0D6FB5;
    border-radius: 6px;
    padding: 6px 12px; }
    button.btn.btn-three:hover, button.btn.btn-three:focus, button.btn.btn-two:hover, button.btn.btn-two:focus,
    input.btn.btn-three:hover,
    input.btn.btn-three:focus,
    input.btn.btn-two:hover,
    input.btn.btn-two:focus,
    .btn
section.content-body button.btn.btn-three:hover,
    .btn
section.content-body button.btn.btn-three:focus,
    .btn
section.content-body button.btn.btn-two:hover,
    .btn
section.content-body button.btn.btn-two:focus, section.content-body .btn.btn-three:hover, section.content-body .btn.btn-three:focus, section.content-body .btn.btn-two:hover, section.content-body .btn.btn-two:focus,
    section.content-body .btn.btn-three.btn-three:hover,
    section.content-body .btn.btn-three.btn-three:focus,
    section.content-body .btn.btn-three.btn-two:hover,
    section.content-body .btn.btn-three.btn-two:focus, section.content-body .btn.btn-two.btn-three:hover, section.content-body .btn.btn-two.btn-three:focus, section.content-body .btn.btn-two.btn-two:hover, section.content-body .btn.btn-two.btn-two:focus {
      color: #FFFFFF;
      background-color: #23A7DF;
      border-color: #23A7DF; }
    button.btn.btn-three.btn-xs, button.btn.btn-two.btn-xs,
    input.btn.btn-three.btn-xs,
    input.btn.btn-two.btn-xs,
    .btn
section.content-body button.btn.btn-three.btn-xs,
    .btn
section.content-body button.btn.btn-two.btn-xs, section.content-body .btn.btn-three.btn-xs, section.content-body .btn.btn-two.btn-xs,
    section.content-body .btn.btn-three.btn-three.btn-xs,
    section.content-body .btn.btn-three.btn-two.btn-xs, section.content-body .btn.btn-two.btn-three.btn-xs, section.content-body .btn.btn-two.btn-two.btn-xs {
      padding: 1px 5px; }
  button.btn.btn-four,
  input.btn.btn-four,
  .btn
section.content-body button.btn.btn-four, section.content-body .btn.btn-four,
  section.content-body .btn.btn-three.btn-four, section.content-body .btn.btn-two.btn-four {
    color: #FFFFFF;
    background-color: #0D6FB5;
    border-color: #0D6FB5;
    border-radius: 6px;
    padding: 6px 12px; }
    button.btn.btn-four:hover, button.btn.btn-four:focus,
    input.btn.btn-four:hover,
    input.btn.btn-four:focus,
    .btn
section.content-body button.btn.btn-four:hover,
    .btn
section.content-body button.btn.btn-four:focus, section.content-body .btn.btn-four:hover, section.content-body .btn.btn-four:focus,
    section.content-body .btn.btn-three.btn-four:hover,
    section.content-body .btn.btn-three.btn-four:focus, section.content-body .btn.btn-two.btn-four:hover, section.content-body .btn.btn-two.btn-four:focus {
      color: #FFFFFF;
      background-color: #23A7DF;
      border-color: #23A7DF; }
    button.btn.btn-four.btn-xs,
    input.btn.btn-four.btn-xs,
    .btn
section.content-body button.btn.btn-four.btn-xs, section.content-body .btn.btn-four.btn-xs,
    section.content-body .btn.btn-three.btn-four.btn-xs, section.content-body .btn.btn-two.btn-four.btn-xs {
      padding: 1px 5px; }
  button.btn.btn-five,
  input.btn.btn-five,
  .btn
section.content-body button.btn.btn-five, section.content-body .btn.btn-five,
  section.content-body .btn.btn-three.btn-five, section.content-body .btn.btn-two.btn-five {
    color: #FFFFFF;
    background-color: #0D6FB5;
    border-color: #0D6FB5;
    border-radius: 6px;
    padding: 6px 12px; }
    button.btn.btn-five:hover, button.btn.btn-five:focus,
    input.btn.btn-five:hover,
    input.btn.btn-five:focus,
    .btn
section.content-body button.btn.btn-five:hover,
    .btn
section.content-body button.btn.btn-five:focus, section.content-body .btn.btn-five:hover, section.content-body .btn.btn-five:focus,
    section.content-body .btn.btn-three.btn-five:hover,
    section.content-body .btn.btn-three.btn-five:focus, section.content-body .btn.btn-two.btn-five:hover, section.content-body .btn.btn-two.btn-five:focus {
      color: #FFFFFF;
      background-color: #23A7DF;
      border-color: #23A7DF; }
    button.btn.btn-five.btn-xs,
    input.btn.btn-five.btn-xs,
    .btn
section.content-body button.btn.btn-five.btn-xs, section.content-body .btn.btn-five.btn-xs,
    section.content-body .btn.btn-three.btn-five.btn-xs, section.content-body .btn.btn-two.btn-five.btn-xs {
      padding: 1px 5px; }

button.form-control, section.content-body button.form-control {
  color: #27255F;
  background-color: #FFFFFF; }

section.slice {
  padding: 0; }

.w-box.dark {
  color: #FFFFFF;
  background-color: #8BC541;
  border: 0px solid #FFFFFF; }

.w-box.light {
  color: #27255F;
  background-color: #FFFFFF;
  border: 0px solid #27255F; }

/* Validation */
.validation-success {
  color: green !important; }

.validation-error {
  color: red !important; }

/******************* 
END SITE WIDE VALUES
*******************/
/******************* 
START SECTION STYLES 
Note: Every master should have a custom style on the body tag, so that sections and style can be targetted for that specific master
eg: body.body-master-public
*******************/
/* START TOP NAV BAR */
.top-header {
  color: #27255F;
  background-color: #FFFFFF;
  min-height: 52px;
  border-bottom: 0px solid #FFFFFF; }
  .top-header .top-header-menu .top-level-nav {
    width: 100%; }
  .top-header ul.menu,
  .top-header div.menu {
    padding-right: 0; }
    .top-header ul.menu li a,
    .top-header ul.menu a.dropdown-toggle,
    .top-header div.menu li a,
    .top-header div.menu a.dropdown-toggle {
      color: #27255F;
      background-color: #FFFFFF; }
      .top-header ul.menu li a:hover,
      .top-header ul.menu a.dropdown-toggle:hover,
      .top-header div.menu li a:hover,
      .top-header div.menu a.dropdown-toggle:hover {
        color: #27255F;
        background-color: #FFFFFF; }
      .top-header ul.menu li a .caret,
      .top-header ul.menu a.dropdown-toggle .caret,
      .top-header div.menu li a .caret,
      .top-header div.menu a.dropdown-toggle .caret {
        border-top-color: #27255F;
        border-bottom-color: #27255F; }
    .top-header ul.menu .dropdown-menu li a,
    .top-header div.menu .dropdown-menu li a {
      color: #27255F;
      background-color: #FFFFFF; }
      .top-header ul.menu .dropdown-menu li a:hover,
      .top-header div.menu .dropdown-menu li a:hover {
        color: #27255F;
        background-color: #FFFFFF;
        font-weight: bold; }
    .top-header ul.menu table.table a,
    .top-header div.menu table.table a {
      color: #27255F;
      background-color: #FFFFFF; }
    .top-header ul.menu #notification-toggle i.fa-bell,
    .top-header div.menu #notification-toggle i.fa-bell {
      margin-right: 0px; }
  .top-header .top-header-menu {
    padding-right: 20px;
    width: 100%; }
    .top-header .top-header-menu div.navbar-collapse {
      padding-left: 0px;
      padding-right: 0px; }

/* END TOP NAV BAR */
/* START HEADER AND MAIN NAVBAR */
header .navbar {
  margin: 0;
  min-height: 140px;
  color: #27255F;
  border: 0;
  border-radius: 0; }
  header .navbar img.main-header-logo {
    margin-top: 16px;
    margin-bottom: 16px;
    padding-left: 15px;
    height: 108px; }

@media (min-width: 768px) {
  .navbar .navbar-container-table {
    min-height: 140px;
    width: 100%;
    display: table; }
    .navbar .navbar-container-table .navbar-header-icon,
    .navbar .navbar-container-table .navbar-header-menu {
      display: table-cell;
      vertical-align: middle;
      float: none; }
    .navbar .navbar-container-table .navbar-header-menu {
      text-align: right; }
    .navbar .navbar-container-table .main-level-nav {
      padding-left: 0;
      padding-right: 0;
      margin-right: -15px; } }

@media (max-width: 767px) {
  .navbar .navbar-container-table ul.nav.navbar-nav li {
    width: 100%;
    text-align: center; }
    .navbar .navbar-container-table ul.nav.navbar-nav li i.fa.fa-user {
      display: none; }
  .navbar .navbar-container-table .main-level-nav {
    padding-right: 0; } }

.navbar .navbar-nav {
  margin-top: 0px;
  background-color: #FFFFFF; }
  .navbar .navbar-nav li {
    color: #27255F;
    background-color: #FFFFFF;
    border-radius: 0px;
    margin-right: 0px;
    min-width: 100px;
    /* one item */
    /* two items */
    /* three items */
    /* four items */
    /* five items */
    /* six items */
    /* seven items */ }
    .navbar .navbar-nav li a {
      display: flex;
      align-items: center;
      justify-content: center;
      color: inherit;
      background-color: inherit;
      border-radius: 0px;
      text-align: center; }
      .navbar .navbar-nav li a:hover, .navbar .navbar-nav li a:focus {
        color: inherit;
        background-color: inherit; }
    .navbar .navbar-nav li:hover, .navbar .navbar-nav li:focus {
      color: #27255F;
      background-color: #FFFFFF; }
    .navbar .navbar-nav li:nth-child(1):nth-last-child(1) {
      width: 25%; }
    .navbar .navbar-nav li:nth-child(1):nth-last-child(2), .navbar .navbar-nav li:nth-child(2):nth-last-child(1) {
      width: 25%; }
    .navbar .navbar-nav li:nth-child(1):nth-last-child(3), .navbar .navbar-nav li:nth-child(2):nth-last-child(2), .navbar .navbar-nav li:nth-child(3):nth-last-child(1) {
      width: 33.33333333333333%; }
    .navbar .navbar-nav li:nth-child(1):nth-last-child(4), .navbar .navbar-nav li:nth-child(2):nth-last-child(3), .navbar .navbar-nav li:nth-child(3):nth-last-child(2), .navbar .navbar-nav li:nth-child(4):nth-last-child(1) {
      width: 25%; }
    .navbar .navbar-nav li:nth-child(1):nth-last-child(5), .navbar .navbar-nav li:nth-child(2):nth-last-child(4), .navbar .navbar-nav li:nth-child(3):nth-last-child(3), .navbar .navbar-nav li:nth-child(4):nth-last-child(2), .navbar .navbar-nav li:nth-child(5):nth-last-child(1) {
      width: 20%; }
    .navbar .navbar-nav li:nth-child(1):nth-last-child(6), .navbar .navbar-nav li:nth-child(2):nth-last-child(5), .navbar .navbar-nav li:nth-child(3):nth-last-child(4), .navbar .navbar-nav li:nth-child(4):nth-last-child(3), .navbar .navbar-nav li:nth-child(5):nth-last-child(2), .navbar .navbar-nav li:nth-child(6):nth-last-child(1) {
      width: 16.667%; }
    .navbar .navbar-nav li:nth-child(1):nth-last-child(7), .navbar .navbar-nav li:nth-child(2):nth-last-child(6), .navbar .navbar-nav li:nth-child(3):nth-last-child(5), .navbar .navbar-nav li:nth-child(4):nth-last-child(4), .navbar .navbar-nav li:nth-child(5):nth-last-child(3), .navbar .navbar-nav li:nth-child(6):nth-last-child(2), .navbar .navbar-nav li:nth-child(7):nth-last-child(1) {
      width: 14.2857%; }
  .navbar .navbar-nav .active a,
  .navbar .navbar-nav .active a:hover,
  .navbar .navbar-nav .active a:focus {
    font-weight: bold;
    border-radius: 0px; }
  .navbar .navbar-nav .disabled a,
  .navbar .navbar-nav .disabled a:hover,
  .navbar .navbar-nav .disabled a:focus {
    color: #27255F;
    background-color: transparent; }
  .navbar .navbar-nav .dropdown a.dropdown-toggle {
    padding-top: 16px; }
  .navbar .navbar-nav .dropdown a .caret {
    border-top-color: #27255F;
    border-bottom-color: #27255F; }
  .navbar .navbar-nav .dropdown a:hover .caret,
  .navbar .navbar-nav .dropdown a:focus .caret {
    border-top-color: #27255F;
    border-bottom-color: #27255F; }
  .navbar .navbar-nav .dropdown li {
    height: 50px !important; }
  .navbar .navbar-nav .open {
    color: #27255F;
    background-color: #FFFFFF; }
    .navbar .navbar-nav .open a {
      color: #27255F;
      background-color: #FFFFFF; }
      .navbar .navbar-nav .open a .caret {
        border-top-color: #27255F;
        border-bottom-color: #27255F; }
    .navbar .navbar-nav .open .dropdown-menu {
      margin-top: 0px;
      padding: 0;
      border: 0;
      box-shadow: 0;
      background-clip: inherit;
      -webkit-box-shadow: 0;
      background-color: rgba(255, 255, 255, 0); }
      .navbar .navbar-nav .open .dropdown-menu li a {
        margin-top: 0px;
        min-height: 50px;
        padding-top: 0px;
        color: #FFFFFF;
        background: #0D6FB5;
        border-bottom: 1px solid #FFFFFF;
        width: 190px;
        border-radius: 0px;
        text-align: right; }
        .navbar .navbar-nav .open .dropdown-menu li a:hover {
          color: #FFFFFF;
          background: #23A7DF;
          font-weight: bold; }
      .navbar .navbar-nav .open .dropdown-menu:after {
        bottom: 100%;
        left: 86%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-color: rgba(35, 31, 32, 0);
        border-bottom-color: #0D6FB5;
        border-width: 10px;
        margin-left: -10px;
        z-index: 1000; }

.navbar .navbar-toggle {
  border-color: #0D6FB5;
  background-color: #0D6FB5; }
  .navbar .navbar-toggle .icon-bar {
    background-color: #FFF; }

.navbar .navbar-toggle:hover,
.navbar .navbar-toggle:focus {
  background-color: #23A7DF; }

.navbar .navbar-collapse,
.navbar .navbar-form {
  border-color: #e7e7e7; }

.navbar .dropdown-menu li {
  border-bottom: 1px solid #f6f6f6; }
  .navbar .dropdown-menu li a:hover {
    color: #27255F;
    background: #FFFFFF; }

.navbar #main-nav-small li {
  height: 40px !important; }

.navbar #main-nav-small li a {
  min-height: 40px !important; }

.navbar #main-nav-small .fa {
  padding-right: 10px; }

/* END HEADER AND NAVBAR */
/* START BANNER SECTION*/
section.banner-section {
  color: #27255F;
  background: #FFFFFF; }
  section.banner-section h1, section.banner-section h2, section.banner-section h3, section.banner-section h4, section.banner-section h5 {
    color: #27255F; }
  section.banner-section .banner-edging {
    height: 0px;
    background-color: #8BC541; }
  section.banner-section .carousel-inner {
    height: 440px; }
    section.banner-section .carousel-inner .item {
      height: 440px; }
  section.banner-section .banner-links-row {
    margin-top: 250px; }

/* END BANNER SECTION*/
/* START CONTENT (PAGE) HEADER */
section.content-header {
  color: #FFFFFF;
  background-color: #23A7DF;
  padding: 24px 0; }
  section.content-header .cta-wr h1 {
    padding-left: 15px; }

/* END CONTENT (PAGE) HEADER */
/* START CONTENT BODY */
.body-master.body-master-standard section.content-body {
  padding-top: 0px; }

section.content-body {
  color: #27255F;
  background-color: #FFFFFF;
  padding: 0px 0;
  min-height: 500px; }
  section.content-body h1, section.content-body h2, section.content-body h3, section.content-body h4, section.content-body h5 {
    color: #27255F; }
  section.content-body a {
    color: #27255F; }
    section.content-body a:hover {
      color: #bca36a; }
  section.content-body table {
    width: 100%; }
    section.content-body table th,
    section.content-body table thead td {
      font-weight: bold;
      color: #FFFFFF;
      background-color: #0D6FB5; }
    section.content-body table td {
      padding-left: 12px;
      padding-right: 12px; }
    section.content-body table.table-activity-stmt th, section.content-body table.table-activity-stmt thead td {
      font-weight: bold;
      color: #27255F;
      background-color: #FFFFFF; }

.row.home-program {
  color: #FFFFFF;
  background-color: #0E6FB6; }
  .row.home-program h1, .row.home-program h2, .row.home-program h3 {
    margin-top: 0px; }
  .row.home-program .header {
    padding-top: 50px;
    padding-bottom: 40px; }

/*section.social-share 
{
    .dropdown > a:after {
        content: "\f107";
        margin-left: 6px;
        font-family: "FontAwesome";
        position: relative;
    }

}*/
.indicator-down.color-one {
  border-top-color: #0D6FB5;
  background: none; }

.indicator-down.color-three {
  border-top-color: #FFFFFF;
  background: none; }

@media (max-width: 767px) {
  .col-xs-padding-top {
    padding-top: 12px; } }

/* END CONTENT BODY */
/* START FOOTER */
footer.page-footer {
  color: #FFFFFF;
  background: #8BC541;
  padding: 20px 0 20px 0;
  min-height: 30px;
  font-size: 14px; }
  footer.page-footer h4 {
    margin-top: 5px;
    margin-bottom: 10px; }
  footer.page-footer a {
    color: #FFFFFF; }

.footer-logo {
  margin-bottom: 20px; }
  .footer-logo img.footer-logo-img {
    width: inherit;
    height: inherit; }

/* END FOOTER */
/******************* 
END SECTION STYLES 
*******************/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Site wide general styles */
.button-row-text-center {
  padding-top: 7px; }

.button-row-text-bottom {
  padding-top: 14px; }

.sign-in-wr input[type=checkbox] {
  margin-left: 2px;
  margin-right: 5px; }

/* START LOGIN */
.login-section .banner-section.main-image-background {
  width: 100%;
  height: 440px;
  background-size: cover; }

@media (max-width: 1340px) {
  .login-section .banner-section.main-image-background {
    height: 550px; }
  .login-section-background {
    height: 550px; } }

@media (max-width: 1200px) {
  .login-section .banner-section.main-image-background {
    height: 650px; }
  .login-section-background {
    height: 650px; } }

@media (max-width: 990px) {
  .login-section .banner-section.main-image-background {
    width: 100%;
    height: 600px; }
  .login-section-background {
    width: 100%;
    height: 600px;
    padding-bottom: 20px; } }

.w-box.login-box {
  color: #FFFFFF;
  background-color: #81BD41;
  border: 0px solid #81BD41;
  box-shadow: none; }
  .w-box.login-box a {
    color: #FFFFFF; }
    .w-box.login-box a:hover {
      color: #FFFFFF; }

.login-option {
  padding-left: 18px;
  padding-right: 18px; }

.login-option-last {
  padding-left: 18px;
  padding-right: 18px;
  padding-bottom: 10px; }

.login-section .banner-edging {
  height: 0px;
  background-color: #8BC541; }

.login-section-background {
  background: #81BD41;
  min-height: 440px; }
  .login-section-background h2 {
    display: none !important; }
  .login-section-background h3 {
    color: #FFFFFF !important; }
  .login-section-background .form-light .form-control {
    border: 0; }

.login-section .holding-page-content-wrapper {
  padding-top: 24px;
  color: #FFFFFF; }
  .login-section .holding-page-content-wrapper p {
    color: #FFFFFF; }
  .login-section .holding-page-content-wrapper a {
    color: #FFFFFF; }
    .login-section .holding-page-content-wrapper a:hover {
      color: #bca36a; }

.login-success-message {
  color: #D3EDF9; }

.login-error-message {
  color: #FFFFFF !important; }

/* ENG LOGIN */
/* START FORGOT/RESET PASSWORD */
.forgotten-password-form .w-section.form-errors {
  margin-top: 30px;
  margin-bottom: 0px;
  padding-bottom: 0px; }

.w-box.forgot-password-box {
  color: #FFFFFF;
  background-color: #81BD41;
  border: 0px solid #81BD41; }
  .w-box.forgot-password-box a {
    color: #FFFFFF; }
    .w-box.forgot-password-box a:hover {
      color: #FFFFFF; }

.forgot-password-container {
  background-color: #81BD41; }

.forgot-password-container .form-errors h2 {
  font-size: 16px !important; }

.forgotPasswordText, .forgotPasswordText h2 {
  color: #FFFFFF !important; }

.forgot-password-container .form-errors {
  margin-bottom: 0; }

.forgot-password-container .sign-in-wr {
  margin-top: 0;
  padding-top: 0; }

.w-box.reset-password-box {
  color: #FFFFFF;
  background-color: #81BD41;
  border: 0px solid #81BD41; }
  .w-box.reset-password-box a {
    color: #FFFFFF; }
    .w-box.reset-password-box a:hover {
      color: #FFFFFF; }

/* END FORGOT/RESET PASSWORD */
/* User Registration Page */
.registration-content {
  padding-top: 0px; }

.w-box.registration-box {
  color: #FFFFFF;
  background-color: #8BC541;
  border: 0px solid #8BC541; }

/* START GENERIC CONTENT STYLES */
[contenteditable=true]:empty:before {
  content: attr(placeholder);
  display: block;
  /* For Firefox */
  color: lightgray; }

.content-flow-divider {
  border-bottom: 1px solid #27255F; }

/* Multi Tab Content Template */
.multi-tab-container .multi-tab-hide {
  display: none; }

/* END GENERIC CONTENT STYLES */
/* Contact Us */
.w-section.contact-us-form-section {
  background-color: #FFFFFF; }

.w-box.contact-us-box {
  color: #FFFFFF;
  background-color: #81BD41;
  border: 0px solid #81BD41; }

/* FAQ */
.w-box.faq-quicktip-box {
  color: #FFFFFF;
  background-color: #0D6FB5;
  border: 0px solid #0D6FB5; }
  .w-box.faq-quicktip-box h2 {
    border: 0px; }

/* START FORMS */
.form-header {
  color: #FFFFFF;
  background-color: #0D6FB5;
  margin-bottom: 16px;
  font-size: 16px; }
  .form-header.title {
    font-size: 24px; }

/* END FORMS */
/* SECTIONS COLOURS (there's a few more then normal) */
.section-light {
  background-color: #D3EDF9;
  color: #27255F; }
  .section-light h1 {
    color: #27255F !important; }

.section-medium {
  background-color: #23A7DF;
  color: #FFFFFF; }
  .section-medium h1 {
    color: #FFFFFF !important; }

.section-medium-dark {
  background-color: #0D6FB5;
  color: #FFFFFF; }
  .section-medium-dark h1 {
    color: #FFFFFF !important; }

.section-dark {
  background-color: #27255F;
  color: #FFFFFF; }
  .section-dark h1 {
    color: #FFFFFF !important; }

.section-alternate {
  background-color: #8BC541;
  color: #FFFFFF; }
  .section-alternate h1 {
    color: #FFFFFF !important; }

/* Login page - login has some different colour schemes */
.login-home-container .section-medium {
  background-color: #2C3384;
  color: #FFFFFF; }
  .login-home-container .section-medium h1 {
    color: #FFFFFF !important; }

/*MAIN PAGE HEADING SECTION (moved to separate class as the one it was using was being used else where which needs to be different colours) */
.section-page-header {
  background-color: #2C3384;
  color: #FFFFFF; }
  .section-page-header .content-header {
    background-color: #2C3384;
    color: #FFFFFF; }

/* Backgrounds - Arrow like background pointing down that's in a couple of sections */
.section-bottom-blue {
  height: 200px;
  background: url(/images/fivesteps/bg-down-blue.png) no-repeat bottom center; }

.section-middle-blue-light {
  background: url(/images/fivesteps/bg-down-blue.png) no-repeat top center #D3EDF9; }

.section-bottom-blue-bg-light-blue {
  height: 200px;
  background: url(/images/fivesteps/bg-down-step-5.png) no-repeat bottom center; }

/* //END: Backgrounds */
.section-heading {
  padding: 30px 0 25px 0;
  text-align: center; }

.section-content {
  padding-top: 30px;
  padding-bottom: 80px; }

/* CUSTOMISED BUTTONS */
.but-faq {
  background: url(/images/fivesteps/button-faq.png) no-repeat top right #fff;
  padding: 20px 100px 20px 20px;
  font-size: 20px;
  color: #27255F; }

.but-faq:hover {
  background: url(/images/fivesteps/button-faq-hover.png) no-repeat top right #fff;
  text-decoration: none;
  color: #27255F !important; }

.but-play {
  background: url(/images/fivesteps/button-play.png) no-repeat top right #fff;
  padding: 20px 100px 20px 20px;
  font-size: 20px;
  color: #27255F; }

.but-play:hover {
  background: url(/images/fivesteps/button-play-hover.png) no-repeat top right #fff;
  text-decoration: none;
  color: #27255F !important; }

/* ----- STEP PANELS ----- */
.step1, .step2, .step3, .step4, .step5 {
  color: #FFFFFF; }

.step1 {
  background-color: #23A7DF; }

.step2 {
  background-color: #0D6FB5; }

.step3 {
  background-color: #F5921F; }

.step4 {
  background-color: #8AC441; }

.step5 {
  background-color: #27255F; }

.box-container {
  width: 100%;
  height: 277px; }

.box-heading {
  height: 120px;
  padding-top: 40px;
  font-size: 60px;
  text-align: center; }

.box-text {
  height: 97px;
  padding-top: 10px;
  font-size: 20px;
  text-align: center; }

.box-footer {
  height: 60px;
  background: white;
  /*fallback*/
  background: rgba(255, 255, 255, 0.5);
  text-align: center; }

.box-arrow {
  position: relative;
  top: -25px;
  font-size: 70px;
  font-weight: 100;
  color: #FFFFFF;
  z-index: 100; }

/* Slider */
.box-slider {
  overflow: hidden;
  position: relative; }

.box-slider .box-hover-container {
  /*background: rgba( 0, 0, 0, 0.9 );*/
  bottom: -100%;
  color: #fff;
  height: 100%;
  left: 0%;
  text-align: center;
  position: absolute;
  transition: bottom 0.5s ease;
  width: 100%; }

.box-slider:hover .box-hover-container {
  bottom: 0%; }

.box-slider:hover .box-footer {
  display: none; }

.box-hover-header {
  position: relative;
  top: -25px;
  height: 70px;
  font-size: 70px;
  font-weight: 100;
  color: #FFFFFF; }

.box-hover-content {
  padding: 0 10px; }

.step1 .box-hover-container {
  background: #23a7df; }

.step2 .box-hover-container {
  background: #0d6fb5; }

.step3 .box-hover-container {
  background: #f5921f; }

.step4 .box-hover-container {
  background: #8ac441; }

.step5 .box-hover-container {
  background: #27255f; }

/* Hack to remove padding from col-md-12 only within the steps container */
.box-outer-container .col-md-12 {
  padding-left: 0 !important;
  padding-right: 0 !important; }

/* ----- CIRCLES (RESULTS) ----- */
.result-circle-inner {
  width: 166px;
  margin: 0 auto; }

.result-circle {
  width: 164px;
  height: 144px;
  background: url(/images/fivesteps/circle-green.png) no-repeat center center; }

.result-circle-title {
  width: 166px;
  padding: 10px 0 25px 0;
  font-size: 20px;
  text-align: center;
  color: #FFFFFF; }

.result-circle-text {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  font-size: 60px;
  font-weight: bold;
  color: #FFFFFF; }

/* //END: ----- CIRCLES ----- */
/* ==================================================
TIMELINE 
================================================== */
.timeline-container {
  background-color: #D3EDF9; }

.timeline .event-date {
  padding: 15px 15px;
  background-color: #23A7DF !important;
  color: #FFFFFF;
  border-bottom: 0px !important;
  margin: 0 !important; }

.timeline-subheading {
  padding: 10px 0 5px 0;
  text-align: left;
  font-weight: bold;
  color: #27255F; }

.timeline-content {
  padding-bottom: 20px;
  text-align: left;
  color: #3F3F3F; }

/* Timeline overrides */
.timeline .event:nth-child(2n) .event-date, .timeline .event:nth-child(2n-1) .event-date {
  border-radius: 0px !important; }

.timeline .event:nth-child(2n)::before {
  /*
    background: $green none repeat scroll 0 0;
    border-radius: 50%;
    content: "";
    display: inline-block;
    height: 20px;
    position: absolute;
    right: -7.3% !important;
    top: 10px;
    width: 20px;
    */
  border-radius: 0;
  content: "";
  display: inline-block;
  height: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  background-image: url(/images/fivesteps/timeline-pointer-left.png);
  background-position: right 0px top 10px;
  background-repeat: no-repeat;
  background-color: transparent;
  width: 100%;
  height: 43px;
  z-index: -100;
  overflow: auto; }

.timeline .event:nth-child(2n-1)::before {
  /*
    background: $green none repeat scroll 0 0;
    border-radius: 60%;
    content: "";
    display: inline-block;
    height: 20px;
    left: -7.3% !important;
    position: absolute;
    top: 10px;
    width: 20px;
    */
  border-radius: 0;
  content: "";
  display: inline-block;
  height: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  background-image: url(/images/fivesteps/timeline-pointer-right.png);
  background-position: left 0px top 10px;
  background-repeat: no-repeat;
  background-color: transparent;
  width: 100%;
  height: 43px;
  z-index: -100;
  overflow: auto; }

.timeline {
  background: url(/images/fivesteps/timeline-line.png);
  background-repeat: repeat-y;
  background-position: 50% 0; }

.timeline-end {
  width: 100%;
  height: 30px;
  background: url(/images/fivesteps/timeline-end.png) no-repeat top center; }

.timeline .event:nth-child(2n)::after {
  content: none; }

.timeline .event:nth-child(2n-1)::after {
  content: none; }

/* ==================================================
SPONSORS
================================================== */
.sponsor-section {
  background-color: #fff; }

.sponsors {
  padding-bottom: 160px; }

.sponsor-heading {
  padding-top: 60px;
  padding-bottom: 30px; }

.sponsors h3 {
  color: #27255F !important; }

.sponsors-row {
  border-top: 1px solid #CFCFCF;
  border-bottom: 1px solid #CFCFCF; }

.sponsors-row-2 {
  border-bottom: 1px solid #CFCFCF; }

.sponsors-logo-container {
  width: 906px;
  /*need to fix width to float center*/
  margin: 0 auto; }

.sponsor-logo, .sponsor-logo-right {
  width: 33%;
  /*300px images*/
  float: left; }

.sponsor-logo-right {
  width: 34%;
  /*300px images*/
  float: left; }
  .sponsor-logo-right.middle {
    width: 33%; }

.sponsor-logo {
  border-left: 1px solid #CFCFCF; }

.sponsor-logo-right {
  border-left: 1px solid #CFCFCF;
  border-right: 1px solid #CFCFCF; }

.sponsor-logo-4col, .sponsor-logo-4col-right {
  width: 25%;
  /*300px images*/
  float: left; }

.sponsor-logo-4col {
  border-left: 1px solid #CFCFCF; }

.sponsor-logo-4col-right {
  border-left: 1px solid #CFCFCF;
  border-right: 1px solid #CFCFCF; }

.sponsor-logo-4col img, .sponsor-logo-4col-right img {
  width: 100% !important;
  height: auto; }

.sponsor-logo img, .sponsor-logo-right img {
  width: 80% !important;
  height: auto; }

/* ==================================================
SCORECARD
================================================== */
.scorecard-total {
  background-color: #3E3E3E;
  border-bottom: 1px solid #FFFFFF;
  padding: 15px 10px; }

.scorecard-subtotal {
  background-color: #9F9F9F;
  border-bottom: 1px solid #FFFFFF;
  padding: 15px 10px; }

.scorecard-totals-heading {
  color: #FFFFFF;
  text-align: center;
  font-size: 16px; }

.scorecard-total-amount {
  color: #FFFFFF;
  text-align: center;
  font-size: 37px; }

.model-header-step1 {
  background-color: #23A7DF !important;
  color: #FFFFFF !important; }

.model-header-step2 {
  background-color: #0D6FB5 !important;
  color: #FFFFFF !important; }

.model-header-step3 {
  background-color: #F5921F !important;
  color: #FFFFFF !important; }

.model-header-step4 {
  background-color: #8AC441 !important;
  color: #FFFFFF !important; }

.model-header-step5 {
  background-color: #27255F !important;
  color: #FFFFFF !important; }

.model-header-step1 .modal-title,
.model-header-step2 .modal-title,
.model-header-step3 .modal-title,
.model-header-step4 .modal-title,
.model-header-step5 .modal-title {
  color: #FFFFFF; }

.modal .modal-content .modal-body a {
  font-weight: bold; }

.modal .modal-content .modal-body a {
  font-weight: bold; }

.score-modal {
  color: #3E3E3E; }

.scorecard-highlight {
  font-style: italic;
  font-weight: bold;
  color: #8BC541; }

.scorecard-highlight-dark {
  font-style: italic;
  font-weight: bold;
  color: #27255F; }

ul.scoretabs {
  margin: 0px;
  padding: 0px;
  list-style: none; }

ul.scoretabs li {
  background: none;
  color: #FFFFFF;
  display: inline-block;
  padding: 10px 15px;
  cursor: pointer; }

ul.scoretabs li.current {
  color: #FFFFFF; }

.scoretab-step1, .scoretab-step2, .scoretab-step3, .scoretab-step4, .scoretab-step5 {
  width: 182px;
  height: 100px;
  text-align: center; }

ul.scoretabs li {
  margin-right: 6px; }

ul.scoretabs li#step1 {
  background-color: #23A7DF; }

ul.scoretabs li#step2 {
  background-color: #0D6FB5; }

ul.scoretabs li#step3 {
  background-color: #F5921F; }

ul.scoretabs li#step4 {
  background-color: #8AC441; }

ul.scoretabs li#step5 {
  background-color: #27255F; }

.scoretab-tab-heading {
  font-size: 24px; }

.scoretab-tab-subheading {
  font-size: 15px; }

ul.scoretabs li.current::after {
  content: "";
  position: relative;
  top: 13px;
  left: -15px;
  border-width: 30px 91px 0;
  border-style: solid;
  display: block;
  width: 18%; }

ul.scoretabs li.scoretab-step1.current::after {
  border-color: #23A7DF transparent; }

ul.scoretabs li.scoretab-step2.current::after {
  border-color: #0D6FB5 transparent; }

ul.scoretabs li.scoretab-step3.current::after {
  border-color: #F5921F transparent; }

ul.scoretabs li.scoretab-step4.current::after {
  border-color: #8AC441 transparent; }

ul.scoretabs li.scoretab-step5.current::after {
  border-color: #27255F transparent; }

.scoretab-content {
  display: none; }

.scoretab-content.current {
  display: inherit; }

.scoretab-content {
  padding-top: 40px; }

.score-step1-complete {
  background-color: #23A7DF; }

.score-step1-incomplete {
  background-color: rgba(35, 167, 223, 0.4); }

.score-step2-complete {
  background-color: #0D6FB5; }

.score-step2-incomplete {
  background-color: rgba(13, 111, 181, 0.4); }

.score-step3-complete {
  background-color: #F5921F; }

.score-step3-incomplete {
  background-color: rgba(245, 146, 31, 0.4); }

.score-step4-complete {
  background-color: #8AC441; }

.score-step4-incomplete {
  background-color: rgba(138, 196, 65, 0.4); }

.score-step5-complete {
  background-color: #27255F; }

.score-step5-incomplete {
  background-color: rgba(39, 37, 95, 0.4); }

.score-table-heading {
  background-color: #3E3E3E;
  border-right: 1px solid #FFFFFF;
  border-bottom: 1px solid #FFFFFF;
  color: #FFFFFF; }

.score-table-heading-last {
  background-color: #3E3E3E;
  border-bottom: 1px solid #FFFFFF;
  color: #FFFFFF; }

.score-table-sponsor {
  padding: 6px 0;
  background-color: #9F9F9F;
  border-bottom: 1px solid #FFFFFF;
  color: #FFFFFF;
  font-size: 24px; }

.score-table-line-title {
  padding: 10px 0;
  background-color: #ECECEC;
  border-bottom: 1px solid #FFFFFF;
  color: #3E3E3E; }

.score-table-line-item {
  text-align: center;
  border-right: 1px solid #FFFFFF;
  border-bottom: 1px solid #FFFFFF;
  color: #FFFFFF; }

.score-info {
  text-align: left;
  vertical-align: middle; }

.score-last {
  border-right: 0px; }

.score-step-total {
  background-color: #3E3E3E; }

.score-more-info {
  border: 0;
  background: none; }

/* ==================================================
KAM Leaderboard
================================================== */
table.table.table-kam-lb th {
  background-color: #23A7DF;
  color: #FFFFFF;
  text-align: center;
  vertical-align: top; }

table.table.table-kam-lb td.coltype-name {
  vertical-align: middle;
  font-weight: bold; }

table.table.table-kam-lb td.coltype-data {
  text-align: center;
  vertical-align: middle; }

table.table.table-kam-lb td.coltype-circle-and-data .data-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column; }
  table.table.table-kam-lb td.coltype-circle-and-data .data-wrapper .circle-data {
    color: #FFFFFF;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center; }
    table.table.table-kam-lb td.coltype-circle-and-data .data-wrapper .circle-data.red {
      background-color: #FF4E52; }
    table.table.table-kam-lb td.coltype-circle-and-data .data-wrapper .circle-data.orange {
      background-color: #FAA632; }
    table.table.table-kam-lb td.coltype-circle-and-data .data-wrapper .circle-data.green {
      background-color: #8BC541; }
    table.table.table-kam-lb td.coltype-circle-and-data .data-wrapper .circle-data.blue {
      background-color: #23A7DF; }
  table.table.table-kam-lb td.coltype-circle-and-data .data-wrapper .content-data {
    margin-top: 12px; }

/* Auction Macro Partial */
.auction-macro {
  color: #27255F;
  /*background-color: $color-secondary-back;*/
  /*padding: 15px;*/
  margin-left: -15px;
  padding-left: 20px;
  margin-bottom: 15px; }
  .auction-macro .row.auction-macro-body {
    margin-right: 0px;
    margin-left: 0px; }
    .auction-macro .row.auction-macro-body .auction-macro-image {
      padding-top: 10px;
      padding-bottom: 10px; }
      .auction-macro .row.auction-macro-body .auction-macro-image img {
        width: initial; }

/* Auction Macro Partial */
.auction-macro {
  color: #27255F;
  /*background-color: $color-secondary-back;*/
  /*padding: 15px;*/
  margin-left: -15px;
  padding-left: 20px;
  margin-bottom: 15px; }
  .auction-macro .row.auction-macro-body {
    margin-right: 0px;
    margin-left: 0px; }
    .auction-macro .row.auction-macro-body .auction-macro-image {
      padding-top: 10px;
      padding-bottom: 10px; }
      .auction-macro .row.auction-macro-body .auction-macro-image img {
        width: initial; }

/* ==================================================
START AUCTION STYLES
================================================== */
/* Auction Page */
.auction-list-item {
  color: #27255F;
  background-color: #FFFFFF;
  margin-bottom: 15px;
  border: 1px solid #27255F; }
  .auction-list-item figure {
    padding: 10px;
    min-height: 380px; }
    .auction-list-item figure .auction-list-item-image {
      height: 250px;
      display: flex;
      align-items: center;
      justify-content: center; }
      .auction-list-item figure .auction-list-item-image img {
        margin: auto;
        max-height: 250px; }
    .auction-list-item figure .auction-list-item-name {
      text-align: center;
      padding-top: 10px; }
  .auction-list-item .auction-list-item-footer {
    padding: 10px;
    border-top: 1px solid #27255F;
    background-color: #27255F;
    color: #FFFFFF; }
    .auction-list-item .auction-list-item-footer .points {
      color: #FFFFFF; }

/* Auction Item Details Page */
.auction-details-page .auction-details-pagerow,
.auction-bids-page .auction-bids-pagerow {
  padding: 30px; }
  .auction-details-page .auction-details-pagerow .auction-item-image-cell,
  .auction-bids-page .auction-bids-pagerow .auction-item-image-cell {
    padding: 10px;
    max-height: 240px;
    max-width: 240px;
    border: 2px solid #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center; }
    .auction-details-page .auction-details-pagerow .auction-item-image-cell img,
    .auction-bids-page .auction-bids-pagerow .auction-item-image-cell img {
      max-height: 220px;
      max-width: 220px; }

#CountdownTimer {
  border: none;
  background-color: inherit; }

.CountdownTimerMulti.is-countdown {
  border: none;
  background-color: inherit; }
  .CountdownTimerMulti.is-countdown .countdown-row {
    padding: 0;
    font-size: 10px; }
    .CountdownTimerMulti.is-countdown .countdown-row .countdown-section {
      padding: 0px;
      margin: 0px;
      font-size: 100%; }

/*
.countdown-row{
        padding:0;
        font-size:20px;
        .countdown-section{
            padding:0px;
            margin:0px;
            font-size:40%;
        }
    }
*/
#bid-amount-input {
  width: 100px;
  text-align: center;
  margin-right: 5px;
  /*height: 34px;
    border-width: 2px;
    border-style: inset;
    border-color: initial;
    border-image: initial;*/ }

#bid-submit {
  width: 100px;
  line-height: 18px; }

.auction-details-message {
  font-size: 16px;
  color: #F5921F; }

.auction-message-current {
  font-size: 16px;
  color: #8AC441; }

.auction-message-prompt {
  font-size: 16px;
  color: #FFFFFF; }

.bid-error {
  background-color: #F5921F;
  padding: 10px;
  color: #FFFFFF; }

.bid-success {
  background-color: #8AC441;
  padding: 10px;
  color: #FFFFFF; }

/* Current Bids Page */
.table-bids {
  color: #27255F;
  background-color: #FFFFFF;
  margin-bottom: 15px;
  border: 1px solid #FFFFFF; }

/* Status Credits Summary Partial */
.status-credits-summary-header {
  background-color: #23A7DF;
  padding: 15px;
  font-size: 22px;
  color: #FFFFFF; }

.status-credits-summary-item-row {
  background-color: #F5F5F5;
  padding: 15px 0;
  color: #27255F; }

.status-credits-summary-item-alt-row {
  background-color: #ebebeb;
  padding: 15px 0;
  color: #27255F; }

.status-credits-summary-row {
  border-bottom: 1px solid #ebebeb;
  padding: 15px 0;
  color: #27255F; }

.status-credits-summary-partial {
  color: #27255F;
  background-color: #FFFFFF;
  padding: 5px;
  margin-bottom: 15px; }
  .status-credits-summary-partial .label-row {
    padding-top: 10px; }
  .status-credits-summary-partial .value-row {
    padding-bottom: 10px; }

/* Other Auction Items Partial */
.other-auction-items-partial {
  color: #27255F;
  background-color: #FFFFFF;
  padding: 5px;
  margin-bottom: 15px; }
  .other-auction-items-partial .auction-item-row {
    padding-top: 10px;
    padding-bottom: 10px; }

/* ==================================================
END AUCTION STYLES
================================================== */
/* ==================================================
HEADER (internal page)
================================================== */
.header-banner {
  height: 450px; }

/* ==================================================
GRID GALLERY
================================================== */
section.content-body .grid-gallery-col {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #0D6FB5;
  padding: 0;
  margin-bottom: 15px; }
  section.content-body .grid-gallery-col img {
    max-height: 180px;
    min-height: 180px;
    margin: auto;
    padding-bottom: 10px;
    padding-top: 10px; }
  section.content-body .grid-gallery-col h2 {
    font-size: 36px;
    text-align: center;
    background-color: #0D6FB5;
    color: #FFFFFF;
    margin: 0;
    padding: 6px 0; }
  section.content-body .grid-gallery-col figure {
    width: 100%; }

section.content-body .section-bottom-blue-bg-light-blue h4 {
  color: #FFFFFF; }

/* ==================================================
Content Grid Styles for content areas
================================================== */
.umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col,
.umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading {
  color: #FFFFFF;
  background-color: #0D6FB5;
  height: 80px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column; }
  .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col img,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading img {
    width: auto; }
  .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col h1,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading h1 {
    color: #FFFFFF;
    font-size: 24px;
    margin-top: 0;
    margin-bottom: 10px; }
  .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step1 h1, .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step2 h1, .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step3 h1, .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step4 h1, .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step5 h1,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step1 h1,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step2 h1,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step3 h1,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step4 h1,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step5 h1 {
    color: #FFFFFF !important; }
  .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step1,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step1 {
    background-color: #23A7DF; }
  .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step2,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step2 {
    background-color: #0D6FB5; }
  .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step3,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step3 {
    background-color: #F5921F; }
  .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step4,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step4 {
    background-color: #8AC441; }
  .umb-grid.ci-umb-grid .content-col-heading .umb-grid-row .umb-grid-col.grid-step5,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .content-col-heading.grid-step5 {
    background-color: #27255F; }

.umb-grid.ci-umb-grid .link-item .umb-grid-row .umb-grid-col,
.umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .link-item {
  color: #27255F;
  min-height: 120px;
  border: 2px solid #0D6FB5;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  /*
        > div:first-of-type
        {
            padding-top: $content-grid-item-padding-top;
            img
            {
                margin-bottom:$content-grid-item-padding-top;
            }
        }

        > img:first-of-type,
        > table:first-of-type
        {                    
            padding-top: $content-grid-item-padding-top;
        }

        // This is when there is just a RTE content item in the  column             
        > p:first-of-type
        {
            padding-top: $content-grid-item-content-padding-top;
            font-size:$large-font-size;
        }
        */ }
  .umb-grid.ci-umb-grid .link-item .umb-grid-row .umb-grid-col > div,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .link-item > div {
    width: 100%; }
  .umb-grid.ci-umb-grid .link-item .umb-grid-row .umb-grid-col img,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .link-item img {
    margin-bottom: 14px; }
  .umb-grid.ci-umb-grid .link-item .umb-grid-row .umb-grid-col p,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .link-item p {
    font-size: 22px;
    text-align: center;
    padding-left: 8px;
    padding-right: 8px; }
  .umb-grid.ci-umb-grid .link-item .umb-grid-row .umb-grid-col a,
  .umb-grid.ci-umb-grid .umb-grid-row .umb-grid-col .link-item a {
    color: #27255F; }

.umb-grid.ci-umb-grid .link-item h1 {
  font-size: 24px;
  color: #FFFFFF;
  background-color: #0D6FB5;
  margin: 0;
  padding: 8px;
  text-align: center; }

.umb-grid.ci-umb-grid .link-item h2 {
  font-size: 24px;
  color: #27255F;
  background-color: #FFFFFF;
  margin: 0;
  padding: 8px;
  text-align: center; }

.umb-grid.ci-umb-grid .link-item.normal-content .umb-grid-row .umb-grid-col p {
  font-size: 16px; }

.umb-grid.ci-umb-grid .link-item.green {
  background-color: #FFFFFF; }
  .umb-grid.ci-umb-grid .link-item.green .umb-grid-row .umb-grid-col {
    color: #FFFFFF;
    background-color: #8BC541; }
    .umb-grid.ci-umb-grid .link-item.green .umb-grid-row .umb-grid-col a {
      color: #FFFFFF; }

.umb-grid.ci-umb-grid .link-item.dark-green .umb-grid-row .umb-grid-col {
  color: #FFFFFF;
  background-color: #024938; }
  .umb-grid.ci-umb-grid .link-item.dark-green .umb-grid-row .umb-grid-col a {
    color: #FFFFFF; }

.umb-grid.ci-umb-grid .link-item.gold .umb-grid-row .umb-grid-col {
  color: #FFFFFF;
  background-color: #bca36a; }
  .umb-grid.ci-umb-grid .link-item.gold .umb-grid-row .umb-grid-col a {
    color: #FFFFFF; }

.umb-grid.ci-umb-grid .link-item.red .umb-grid-row .umb-grid-col {
  color: #FFFFFF;
  background-color: #FF4E52; }
  .umb-grid.ci-umb-grid .link-item.red .umb-grid-row .umb-grid-col a {
    color: #FFFFFF; }

.umb-grid.ci-umb-grid .link-item.purple .umb-grid-row .umb-grid-col {
  color: #FFFFFF;
  background-color: #626b97; }
  .umb-grid.ci-umb-grid .link-item.purple .umb-grid-row .umb-grid-col a {
    color: #FFFFFF; }

.umb-grid.ci-umb-grid .link-item.orange .umb-grid-row .umb-grid-col {
  color: #FFFFFF;
  background-color: #FAA632; }
  .umb-grid.ci-umb-grid .link-item.orange .umb-grid-row .umb-grid-col a {
    color: #FFFFFF; }

.umb-grid.ci-umb-grid .grid-quote-step1 {
  background-color: #23A7DF;
  color: #FFFFFF; }
  .umb-grid.ci-umb-grid .grid-quote-step1 blockquote {
    border-left: 5px solid #27255F; }

.umb-grid.ci-umb-grid .grid-quote-step2 {
  background-color: #0D6FB5;
  color: #FFFFFF; }
  .umb-grid.ci-umb-grid .grid-quote-step2 blockquote {
    border-left: 5px solid #27255F; }

.umb-grid.ci-umb-grid .grid-quote-step3 {
  background-color: #F5921F;
  color: #FFFFFF; }
  .umb-grid.ci-umb-grid .grid-quote-step3 blockquote {
    border-left: 5px solid #27255F; }

.umb-grid.ci-umb-grid .grid-quote-step4 {
  background-color: #8AC441;
  color: #FFFFFF; }
  .umb-grid.ci-umb-grid .grid-quote-step4 blockquote {
    border-left: 5px solid #27255F; }

.umb-grid.ci-umb-grid .grid-quote-step5 {
  background-color: #27255F;
  color: #FFFFFF; }
  .umb-grid.ci-umb-grid .grid-quote-step5 blockquote {
    border-left: 5px solid #23A7DF; }

.umb-grid.ci-umb-grid .grid-border-step1, .umb-grid.ci-umb-grid .grid-border-step2, .umb-grid.ci-umb-grid .grid-border-step3, .umb-grid.ci-umb-grid .grid-border-step4, .umb-grid.ci-umb-grid .grid-border-step5 {
  padding: 0 10px 5px 10px; }

.umb-grid.ci-umb-grid .grid-border-step1 {
  border: 2px solid #23A7DF; }

.umb-grid.ci-umb-grid .grid-border-step2 {
  border: 2px solid #0D6FB5; }

.umb-grid.ci-umb-grid .grid-border-step3 {
  border: 2px solid #F5921F; }

.umb-grid.ci-umb-grid .grid-border-step4 {
  border: 2px solid #8AC441; }

.umb-grid.ci-umb-grid .grid-border-step5 {
  border: 2px solid #27255F; }

.umb-grid.ci-umb-grid .grid-text-step1 {
  color: #23A7DF; }
  .umb-grid.ci-umb-grid .grid-text-step1 h1 {
    color: #23A7DF; }
  .umb-grid.ci-umb-grid .grid-text-step1 h2 {
    color: #23A7DF; }

.umb-grid.ci-umb-grid .grid-text-step2 {
  color: #0D6FB5; }
  .umb-grid.ci-umb-grid .grid-text-step2 h1 {
    color: #0D6FB5; }
  .umb-grid.ci-umb-grid .grid-text-step2 h2 {
    color: #0D6FB5; }

.umb-grid.ci-umb-grid .grid-text-step3 {
  color: #F5921F; }
  .umb-grid.ci-umb-grid .grid-text-step3 h1 {
    color: #F5921F; }
  .umb-grid.ci-umb-grid .grid-text-step3 h2 {
    color: #F5921F; }

.umb-grid.ci-umb-grid .grid-text-step4 {
  color: #8AC441; }
  .umb-grid.ci-umb-grid .grid-text-step4 h1 {
    color: #8AC441; }
  .umb-grid.ci-umb-grid .grid-text-step4 h2 {
    color: #8AC441; }

.umb-grid.ci-umb-grid .grid-text-step5 {
  color: #27255F; }
  .umb-grid.ci-umb-grid .grid-text-step5 h1 {
    color: #27255F; }
  .umb-grid.ci-umb-grid .grid-text-step5 h2 {
    color: #27255F; }

.umb-grid.ci-umb-grid .grid-block-header-step1 h1 {
  margin: 0;
  padding: 5px 5px 10px 5px;
  background-color: #23A7DF;
  color: #FFFFFF; }

.umb-grid.ci-umb-grid .grid-block-header-step1 p {
  padding-left: 5px;
  padding-right: 5px; }

.umb-grid.ci-umb-grid .grid-block-header-step2 h1 {
  margin: 0;
  padding: 5px 5px 10px 5px;
  background-color: #0D6FB5;
  color: #FFFFFF; }

.umb-grid.ci-umb-grid .grid-block-header-step2 p {
  padding-left: 5px;
  padding-right: 5px; }

.umb-grid.ci-umb-grid .grid-block-header-step3 h1 {
  margin: 0;
  padding: 5px 5px 10px 5px;
  background-color: #F5921F;
  color: #FFFFFF; }

.umb-grid.ci-umb-grid .grid-block-header-step3 p {
  padding-left: 5px;
  padding-right: 5px; }

.umb-grid.ci-umb-grid .grid-block-header-step4 h1 {
  margin: 0;
  padding: 5px 5px 10px 5px;
  background-color: #8AC441;
  color: #FFFFFF; }

.umb-grid.ci-umb-grid .grid-block-header-step4 p {
  padding-left: 5px;
  padding-right: 5px; }

.umb-grid.ci-umb-grid .grid-block-header-step5 h1 {
  margin: 0;
  padding: 5px 5px 10px 5px;
  background-color: #27255F;
  color: #FFFFFF; }

.umb-grid.ci-umb-grid .grid-block-header-step5 p {
  padding-left: 5px;
  padding-right: 5px; }

.umb-grid.ci-umb-grid .grid-border-back-step1 img, .umb-grid.ci-umb-grid .grid-border-back-step2 img, .umb-grid.ci-umb-grid .grid-border-back-step3 img, .umb-grid.ci-umb-grid .grid-border-back-step4 img, .umb-grid.ci-umb-grid .grid-border-back-step5 img {
  padding: 10px; }

.umb-grid.ci-umb-grid .grid-border-back-step1 p, .umb-grid.ci-umb-grid .grid-border-back-step2 p, .umb-grid.ci-umb-grid .grid-border-back-step3 p, .umb-grid.ci-umb-grid .grid-border-back-step4 p, .umb-grid.ci-umb-grid .grid-border-back-step5 p {
  padding: 10px; }

.umb-grid.ci-umb-grid .grid-border-back-step1 {
  border: 2px solid #23A7DF; }
  .umb-grid.ci-umb-grid .grid-border-back-step1 h1 {
    background-color: #23A7DF;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0; }
  .umb-grid.ci-umb-grid .grid-border-back-step1 h2 {
    background-color: #23A7DF;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0;
    font-size: 20px; }

.umb-grid.ci-umb-grid .grid-border-back-step2 {
  border: 2px solid #0D6FB5; }
  .umb-grid.ci-umb-grid .grid-border-back-step2 h1 {
    background-color: #0D6FB5;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0; }
  .umb-grid.ci-umb-grid .grid-border-back-step2 h2 {
    background-color: #0D6FB5;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0;
    font-size: 20px; }

.umb-grid.ci-umb-grid .grid-border-back-step3 {
  border: 2px solid #F5921F; }
  .umb-grid.ci-umb-grid .grid-border-back-step3 h1 {
    background-color: #F5921F;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0; }
  .umb-grid.ci-umb-grid .grid-border-back-step3 h2 {
    background-color: #F5921F;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0;
    font-size: 20px; }

.umb-grid.ci-umb-grid .grid-border-back-step4 {
  border: 2px solid #8AC441; }
  .umb-grid.ci-umb-grid .grid-border-back-step4 h1 {
    background-color: #8AC441;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0; }
  .umb-grid.ci-umb-grid .grid-border-back-step4 h2 {
    background-color: #8AC441;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0;
    font-size: 20px; }

.umb-grid.ci-umb-grid .grid-border-back-step5 {
  border: 2px solid #27255F; }
  .umb-grid.ci-umb-grid .grid-border-back-step5 h1 {
    background-color: #27255F;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0; }
  .umb-grid.ci-umb-grid .grid-border-back-step5 h2 {
    background-color: #27255F;
    color: #FFFFFF;
    padding: 6px 0;
    margin: 0;
    font-size: 20px; }

.umb-grid .grid-section .column img {
  width: auto; }

/* ==================================================
CALLOUT BOXES STYLES
================================================== */
.callout-outer-container {
  background-color: #fff; }
  .callout-outer-container .callout-inner-container {
    padding: 20px 0 20px 0;
    height: 260px; }
  .callout-outer-container .callout-inner-container-small {
    padding: 20px 0 20px 0;
    height: 240px; }
  .callout-outer-container .heading {
    margin-bottom: 0px;
    padding-bottom: 0px;
    font-size: 20px;
    font-weight: bold;
    color: #515151; }
  .callout-outer-container .subheading {
    margin-top: 0px;
    padding-top: 0px;
    padding-bottom: 10px;
    font-size: 25px;
    font-weight: bold; }
  .callout-outer-container .content {
    color: #515151; }
  .callout-outer-container .callout-image {
    /*margin: -15px !important;
        padding: -15px !important;*/ }
    .callout-outer-container .callout-image img {
      width: 100%; }
  .callout-outer-container .callout-darkblue {
    border-top: 8px solid #6C2282;
    margin-left: -15px !important;
    margin-right: -15px; }
  .callout-outer-container .subheading-darkblue {
    color: #6C2282; }
  .callout-outer-container .callout-red {
    border-top: 8px solid #EE1D24;
    margin-left: -15px !important;
    margin-right: -15px; }
  .callout-outer-container .subheading-red {
    color: #EE1D24; }
  .callout-outer-container .callout-green {
    border-top: 8px solid #81BD41;
    margin-left: -15px !important;
    margin-right: -15px;
    background-color: #F5F5F5; }
  .callout-outer-container .subheading-green {
    color: #81BD41; }
  .callout-outer-container .callout-orange {
    border-top: 8px solid #F99D1C;
    margin-left: -15px !important;
    margin-right: -15px;
    background-color: #F5F5F5; }
  .callout-outer-container .subheading-orange {
    color: #F99D1C; }

/* ==================================================
OVERRIDES
================================================== */
/* Carousel overrides for the Your Say section */
.your-say-banner section.banner-section .carousel-inner, section.banner-section .carousel-inner .item {
  height: 350px;
  background-color: #23A7DF; }

.your-say-banner .carousel-1 .item {
  background-size: auto !important; }

.your-say-banner .item-dark, .your-say-banner .active {
  background-color: #23A7DF; }

.post-container .post-header {
  color: #707070 !important; }

.post-container .post-header .stream-item-head-text {
  color: #262660; }

@media (max-width: 1200px) {
  .callout-inner-container-small {
    height: 280px !important; } }

@media (max-width: 900px) {
  .callout-inner-container-small {
    height: 240px !important; } }

@media (max-width: 767px) {
  .main-banner {
    display: none; }
  .sponsors-logo-container {
    width: 100%;
    /*need to fix width to float center*/
    margin: 0 auto; }
  .sponsor-heading {
    padding-top: 20px;
    padding-bottom: 15px; }
  .sponsors {
    padding-bottom: 60px; }
  .but-faq {
    display: block; } }

@media (max-width: 450px) {
  .but-faq {
    display: block;
    background: #fff;
    padding: 5px 20px; }
  /*
    .scoretabs {
        display:none;
    }
    */ }

/* --------------------------------------------------
    BOOTSTRAP OVERRIDES
-------------------------------------------------- */
.carousel-inner, .w-section .container-fluid, .content2-fullwidth {
  margin: 0 auto;
  padding-top: 20px; }

.login-section .container-fluid {
  width: 100%;
  padding-top: 0 !important; }

.tooltip > .tooltip-inner {
  color: #FFFFFF;
  background-color: #8BC541;
  border: 1px solid #8BC541;
  padding: 8px;
  font-size: 14px;
  text-align: left; }

/* Tooltip on top */
.tooltip.top > .tooltip-arrow {
  border-top: 5px solid #8BC541; }

/* Tooltip on bottom */
.tooltip.bottom > .tooltip-arrow {
  border-bottom: 5px solid #8BC541; }

/* Tooltip on left */
.tooltip.left > .tooltip-arrow {
  border-left: 5px solid #8BC541; }

/* Tooltip on right */
.tooltip.right > .tooltip-arrow {
  border-right: 5px solid #8BC541; }

/*Tooltip for Scorecard*/
.scoretab-content .tooltip > .tooltip-inner {
  background-color: #000;
  border: 1px solid #000; }

.scoretab-content .tooltip.top > .tooltip-arrow {
  border-top: 5px solid #000; }

.top-menu .fa {
  padding-right: 3px; }

.top-menu li {
  min-width: 100px !important; }

.top-menu a {
  padding-left: 0px !important;
  padding-right: 0px !important; }

.main-menu {
  padding-top: 10px; }

@media (max-width: 1200px) {
  .carousel-inner, .w-section .container-fluid, .content2-fullwidth {
    width: 90% !important; } }

@media (max-width: 992px) {
  .carousel-inner, .w-section .container-fluid, .content2-fullwidth {
    width: 96% !important; } }

@media (max-width: 767px) {
  .carousel-inner, .w-section .container-fluid, .content2-fullwidth {
    width: 96% !important; } }

/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
.content-table table {
  color: #27255F; }

/*
Table Style 1 - Base
    Width: standard
    Titles: None
    Border lines: Full Grid
    Text Size: Normal    
    Text Align: Center
    Colors (Override in client specific. Generally): 
        standard as content-fore
*/
/*
Table Style 2
    Width: standard
    Titles: Header First Row
    Border lines: Full Grid
    Text Size: Normal    
    Text Align: Center
    Colors (Override in client specific. Generally): 
        header as content-fore-active
        standard as content-fore
*/
.content-table.content-table-style-2 table tr:first-child td {
  border-color: #27255F;
  color: #27255F; }

/*
Table Style 3 - Base
    Full width
    Titles: Header First Row
    Border lines: Horizontal only
    Text Size: Normal    
    Text Align: Left
    Generally Header text color should be content-fore-active (override in site specific)
    Generally standard text color should be content-fore
*/
.content-table.content-table-style-3 table tr:first-child td {
  color: #27255F; }
  .content-table.content-table-style-3 table tr:first-child td p {
    color: #27255F; }

/*
Table Style 4
    Width: Full Width
    Titles: First Column
    Border lines: Vertical Only
    Text Size: Normal    
    Text Align: Center
    Colors (Override in client specific. Generally): 
        first col as content-fore-active
        standard as content-fore
*/
.content-table.content-table-style-4 table tr td:first-child {
  color: #27255F; }

/* START Leaderboard Basic Styles */
.leaderboard2 table.table-leaderboard2-basic {
  width: 100%;
  border: none; }
  .leaderboard2 table.table-leaderboard2-basic th, .leaderboard2 table.table-leaderboard2-basic td {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 8px;
    padding-right: 8px;
    text-align: center;
    border: none; }
  .leaderboard2 table.table-leaderboard2-basic th {
    font-weight: bold;
    background-color: #2C3384;
    color: #FFFFFF; }
  .leaderboard2 table.table-leaderboard2-basic .current-member-highlight {
    font-weight: bold;
    color: #27255F; }

/* END Leaderboard Basic Styles */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Start Profile Page */
.profile h3 {
  color: #27255F;
  margin-left: 15px;
  float: left; }

.profile .back-nav.navbar-collapse {
  width: 20%;
  padding: 0; }
  .profile .back-nav.navbar-collapse ul {
    width: 100%;
    text-align: center; }
    .profile .back-nav.navbar-collapse ul li {
      background: #FFFFFF;
      width: 100%; }
      .profile .back-nav.navbar-collapse ul li a {
        line-height: 40px;
        color: #27255F; }

.profile .image-uploader {
  background: #FFFFFF;
  padding: 20px; }
  .profile .image-uploader .dropzone {
    border: 4px dashed #27255F;
    background: #FFFFFF;
    border-radius: 25px;
    position: relative;
    min-height: 200px !important; }
    .profile .image-uploader .dropzone .dropzone-image {
      border: 5px dashed #27255F;
      max-width: 180px;
      max-height: 180px;
      top: 5%;
      left: 8%;
      position: absolute;
      background: #FFFFFF; }
    .profile .image-uploader .dropzone .fallback #profile-image {
      position: absolute;
      right: 30px;
      top: 40px; }
    .profile .image-uploader .dropzone .fallback .btn {
      position: absolute;
      right: 30px;
      top: 100px; }
    .profile .image-uploader .dropzone .fallback #loading {
      position: absolute;
      top: 35%;
      right: 250px;
      bottom: 35%;
      border: none !important;
      display: none; }
    .profile .image-uploader .dropzone .dz-default.dz-message {
      background-image: none !important;
      left: 70% !important;
      top: 110px; }
      .profile .image-uploader .dropzone .dz-default.dz-message span {
        display: block; }
        .profile .image-uploader .dropzone .dz-default.dz-message span h3 {
          color: #27255F;
          font-size: 28px; }
          .profile .image-uploader .dropzone .dz-default.dz-message span h3:after {
            position: absolute;
            font-family: FontAwesome;
            top: -10%;
            right: 15%;
            content: "\f112";
            font-size: 4em; }
    .profile .image-uploader .dropzone .dz-preview {
      display: none; }

.profile .profile-section {
  padding: 5px 15px; }

.profile .primary-information {
  background: #FFFFFF;
  padding: 20px; }
  .profile .primary-information h1, .profile .primary-information h2, .profile .primary-information h3, .profile .primary-information h4, .profile .primary-information h5 {
    color: #27255F; }
  .profile .primary-information label {
    font-weight: normal; }
  .profile .primary-information .profile-header {
    padding: 20px 0;
    color: #27255F; }
  .profile .primary-information .profile-value {
    color: #27255F;
    font-weight: bold;
    line-height: 40px; }

.profile .secondary-information {
  padding: 20px;
  background: none; }
  .profile .secondary-information h1, .profile .secondary-information h2, .profile .secondary-information h3, .profile .secondary-information h4, .profile .secondary-information h5 {
    color: #27255F; }
  .profile .secondary-information .profile-header {
    padding: 20px 0;
    color: #27255F; }
  .profile .secondary-information .profile-value {
    color: #27255F;
    font-weight: bold;
    line-height: 40px; }

.profile .email-notifications {
  padding: 20px; }
  .profile .email-notifications h1, .profile .email-notifications h2, .profile .email-notifications h3, .profile .email-notifications h4, .profile .email-notifications h5 {
    color: #27255F; }

.profile .submit-button {
  padding: 20px; }
  .profile .submit-button .btn {
    background: #0D6FB5;
    padding: 20px 100px;
    border-radius: 8px;
    font-size: 18px;
    border: none; }
  .profile .submit-button .alert {
    margin-top: 5px; }

/* End Profile Page */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* --------------------------------------------------
-----------------------------------------------------
START MODULE LIST
-----------------------------------------------------
-------------------------------------------------- */
div.tabs.module-tabs div.tab-content {
  border: 0; }

div.tabs.module-tabs ul.nav-tabs {
  border: 0; }
  div.tabs.module-tabs ul.nav-tabs li {
    width: 33%;
    padding: 0;
    border: 0;
    text-align: center; }
    div.tabs.module-tabs ul.nav-tabs li .nav-tab-wrapper {
      height: 82px; }
      div.tabs.module-tabs ul.nav-tabs li .nav-tab-wrapper a,
      div.tabs.module-tabs ul.nav-tabs li .nav-tab-wrapper a:hover {
        font-size: 22px;
        border: 0;
        text-decoration: none; }
  div.tabs.module-tabs ul.nav-tabs li.active .nav-tab-wrapper {
    padding: 8px 0;
    background-color: #8BC541;
    color: #FFFFFF;
    border-bottom: 11px solid #0D6FB5;
    box-shadow: 2px 3px 6px 0 rgba(0, 0, 0, 0.75); }
    div.tabs.module-tabs ul.nav-tabs li.active .nav-tab-wrapper a,
    div.tabs.module-tabs ul.nav-tabs li.active .nav-tab-wrapper a:hover {
      background-color: #8BC541;
      color: #FFFFFF; }
  div.tabs.module-tabs ul.nav-tabs li:not(.active) {
    border-bottom: 1px solid #8BC541; }
    div.tabs.module-tabs ul.nav-tabs li:not(.active) .nav-tab-wrapper {
      padding-top: 8px;
      padding-bottom: 18px; }
    div.tabs.module-tabs ul.nav-tabs li:not(.active).middle-tab {
      border-left: 1px solid #8BC541;
      border-right: 1px solid #8BC541; }

body.body-master .content-body .module-list-container .module-item .w-box p {
  color: #27255F;
  padding: 10px; }

body.body-master .content-body .module-list-container .module-item.module-hidden {
  display: none; }

body.body-master .content-body .module-list-container .module-item .module-item-header {
  height: 30px;
  padding: 6px 10px 6px 10px;
  font-weight: bold;
  color: #27255F;
  font-size: 15px;
  background-color: #8BC541; }

body.body-master .content-body .module-list-container .module-item #elearnModuleBox {
  background-color: #FFFFFF;
  margin-top: 20px;
  border: 1px solid #D3EDF9;
  /*.module-title-overlay
            {
                position:absolute;
                width:100%;
                min-height:60px;
                bottom:0;
                text-align:center;          
                z-index:20;*/
  /*}*/ }
  body.body-master .content-body .module-list-container .module-item #elearnModuleBox .module-image-background {
    min-height: 250px;
    /*background-size: cover;*/
    background-repeat: no-repeat;
    display: block;
    background-position: center center; }
  body.body-master .content-body .module-list-container .module-item #elearnModuleBox #elearn-description {
    padding: 0px;
    height: 200px;
    width: 100%;
    overflow: hidden;
    position: relative; }
    body.body-master .content-body .module-list-container .module-item #elearnModuleBox #elearn-description #elearn-description-child {
      /*position: absolute;*/
      top: 0px;
      bottom: 0px;
      left: 0px;
      /*right: -12px;*/
      padding: 0px 0px 15px 0px;
      overflow: auto; }
      body.body-master .content-body .module-list-container .module-item #elearnModuleBox #elearn-description #elearn-description-child .module-name {
        margin-bottom: 10px;
        background-color: #D3EDF9;
        padding: 6px 0px 6px 0px; }
        body.body-master .content-body .module-list-container .module-item #elearnModuleBox #elearn-description #elearn-description-child .module-name a,
        body.body-master .content-body .module-list-container .module-item #elearnModuleBox #elearn-description #elearn-description-child .module-name div.module-name-title {
          text-align: center;
          display: inline-block;
          width: 100%;
          font-size: 18px; }
  body.body-master .content-body .module-list-container .module-item #elearnModuleBox h2 {
    color: #FFFFFF;
    text-transform: uppercase;
    border: 0;
    position: relative;
    margin-top: 20px; }
    body.body-master .content-body .module-list-container .module-item #elearnModuleBox h2 a {
      color: #FFFFFF;
      text-transform: uppercase; }
  body.body-master .content-body .module-list-container .module-item #elearnModuleBox .module-hover-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 20;
    text-align: center; }
    body.body-master .content-body .module-list-container .module-item #elearnModuleBox .module-hover-overlay h2 {
      position: absolute;
      bottom: 60px;
      width: 100%;
      text-align: center;
      color: #FFFFFF;
      text-transform: uppercase;
      border: 0; }
      body.body-master .content-body .module-list-container .module-item #elearnModuleBox .module-hover-overlay h2 a {
        color: #FFFFFF;
        text-transform: uppercase; }
    body.body-master .content-body .module-list-container .module-item #elearnModuleBox .module-hover-overlay .module-rating {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center; }
      body.body-master .content-body .module-list-container .module-item #elearnModuleBox .module-hover-overlay .module-rating .star-rating {
        color: #FFFFFF; }

body.body-master .content-body .module-list-container .module-item .w-box .w-footer {
  font-weight: bold;
  color: #27255F;
  padding: 10px;
  border: 1px solid #D3EDF9; }
  body.body-master .content-body .module-list-container .module-item .w-box .w-footer .module-action-btn {
    color: #FFFFFF;
    font-size: 24px; }
  body.body-master .content-body .module-list-container .module-item .w-box .w-footer a {
    margin-bottom: 10px; }

body.body-master .content-body .module-list-container .module-item.OpenNewAttempt .w-box, body.body-master .content-body .module-list-container .module-item.NotYetOpen .w-box, body.body-master .content-body .module-list-container .module-item.Locked .w-box, body.body-master .content-body .module-list-container .module-item.RequiresPriorModuleCompletion .w-box, body.body-master .content-body .module-list-container .module-item.Unset .w-box {
  border: 1px solid #D3EDF9; }

body.body-master .content-body .module-list-container .module-item.OpenNewAttempt .module-item-header,
body.body-master .content-body .module-list-container .module-item.OpenNewAttempt .w-footer, body.body-master .content-body .module-list-container .module-item.NotYetOpen .module-item-header,
body.body-master .content-body .module-list-container .module-item.NotYetOpen .w-footer, body.body-master .content-body .module-list-container .module-item.Locked .module-item-header,
body.body-master .content-body .module-list-container .module-item.Locked .w-footer, body.body-master .content-body .module-list-container .module-item.RequiresPriorModuleCompletion .module-item-header,
body.body-master .content-body .module-list-container .module-item.RequiresPriorModuleCompletion .w-footer, body.body-master .content-body .module-list-container .module-item.Unset .module-item-header,
body.body-master .content-body .module-list-container .module-item.Unset .w-footer {
  background-color: #D3EDF9; }

body.body-master .content-body .module-list-container .module-item.OpenNewAttempt .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.OpenNewAttempt .module-hover-overlay, body.body-master .content-body .module-list-container .module-item.NotYetOpen .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.NotYetOpen .module-hover-overlay, body.body-master .content-body .module-list-container .module-item.Locked .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.Locked .module-hover-overlay, body.body-master .content-body .module-list-container .module-item.RequiresPriorModuleCompletion .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.RequiresPriorModuleCompletion .module-hover-overlay, body.body-master .content-body .module-list-container .module-item.Unset .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.Unset .module-hover-overlay {
  background: rgba(211, 237, 249, 0.8); }

body.body-master .content-body .module-list-container .module-item.OpenInProgress .w-box {
  border: 1px solid #D3EDF9; }

body.body-master .content-body .module-list-container .module-item.OpenInProgress .module-item-header,
body.body-master .content-body .module-list-container .module-item.OpenInProgress .w-footer {
  background-color: #D3EDF9; }

body.body-master .content-body .module-list-container .module-item.OpenInProgress .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.OpenInProgress .module-hover-overlay {
  background: rgba(211, 237, 249, 0.8); }

body.body-master .content-body .module-list-container .module-item.CompletedSuccessfully .w-box {
  border: 1px solid #D3EDF9; }

body.body-master .content-body .module-list-container .module-item.CompletedSuccessfully .module-item-header,
body.body-master .content-body .module-list-container .module-item.CompletedSuccessfully .w-footer {
  background-color: #D3EDF9; }

body.body-master .content-body .module-list-container .module-item.CompletedSuccessfully .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.CompletedSuccessfully .module-hover-overlay {
  background: rgba(211, 237, 249, 0.8); }

body.body-master .content-body .module-list-container .module-item.Closed .w-box, body.body-master .content-body .module-list-container .module-item.Failed .w-box {
  border: 1px solid #D3EDF9; }

body.body-master .content-body .module-list-container .module-item.Closed .module-item-header,
body.body-master .content-body .module-list-container .module-item.Closed .w-footer, body.body-master .content-body .module-list-container .module-item.Failed .module-item-header,
body.body-master .content-body .module-list-container .module-item.Failed .w-footer {
  background-color: #D3EDF9; }

body.body-master .content-body .module-list-container .module-item.Closed .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.Closed .module-hover-overlay, body.body-master .content-body .module-list-container .module-item.Failed .module-title-overlay,
body.body-master .content-body .module-list-container .module-item.Failed .module-hover-overlay {
  background: rgba(211, 237, 249, 0.8); }

.module-section-intro {
  padding-bottom: 30px; }

/* --------------------------------------------------
-----------------------------------------------------
END MODULE LIST
-----------------------------------------------------
-------------------------------------------------- */
/* --------------------------------------------------
-----------------------------------------------------
START MODULE DETAILS/RESULTS
-----------------------------------------------------
-------------------------------------------------- */
.module-page-header,
.module-page-footer {
  background: #D3EDF9;
  color: #27255F;
  text-transform: uppercase;
  font-size: 22px; }
  .module-page-header .row,
  .module-page-footer .row {
    height: 76px; }

.module-page-header {
  margin-top: 5px; }
  .module-page-header .module-results-header-name {
    font-weight: bold;
    padding: 24px 15px; }
  .module-page-header .module-header-brand {
    height: 100%;
    padding: 8px; }
    .module-page-header .module-header-brand img.brand-icon {
      height: 100%; }

@media (max-width: 992px) {
  .module-page-header .module-results-header-name {
    text-align: center; } }

.module-page-footer .progress-section #but-question {
  float: left; }

.module-page-footer .progress-section #progress-bar {
  float: left;
  margin-top: 24px; }

.module-page-footer .progress-section .progress-pages-wrapper {
  float: left; }

.module-page-footer .progress-section .progress-complete, .module-page-footer .progress-section .progress-current, .module-page-footer .progress-section .progress-wait {
  width: 24px;
  height: 32px;
  float: left;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  text-align: center; }

.module-page-footer .progress-section .progress-complete .progress-icon,
.module-page-footer .progress-section .progress-current .progress-icon {
  color: #23A7DF; }

.module-page-footer .progress-section .progress-wait .progress-icon {
  color: #FFFFFF; }

.module-page-footer .module-button {
  margin-top: 24px; }

.col-centered {
  display: flex;
  justify-content: space-around; }

@media (max-width: 992px) {
  .module-page-footer.progress-section.double-row {
    height: 130px; }
    .module-page-footer.progress-section.double-row .progress-pages-wrapper {
      margin-top: 8px; }
  .module-page-footer .btn.column-button.small-long-text {
    padding-top: 12px;
    padding-bottom: 12px;
    white-space: normal; } }

@media (max-width: 765px) {
  .module-page-footer.button-section .row {
    height: 110px; }
    .module-page-footer.button-section .row .btn.column-button {
      height: 110px;
      padding-top: 40px;
      padding-bottom: 40px; }
      .module-page-footer.button-section .row .btn.column-button.small-long-text {
        padding-top: 12px;
        padding-bottom: 12px;
        white-space: normal; } }

body.body-master .content-body .module-box {
  margin: 0px;
  /*.step-header
        {
            color:$color-third-fore;
            background-color:$color-third-back;

            .step-header-content
            {
                padding:$module-padding-horizontal $module-header-padding-vert;
                font-weight:bold;
                h1:after
                {
                    content:none;
                }
            }
        }*/ }
  body.body-master .content-body .module-box .module-body {
    padding: 24px; }

.module-loading {
  margin-top: 40px;
  text-align: center; }

.module-question {
  padding: 20px 0 20px 0;
  font-size: 18px;
  color: #8BC541;
  font-weight: bold; }

.module-answer {
  font-size: 16px; }

#errormsg {
  padding: 10px; }

.question-subtext {
  padding-top: 16px; }

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }

.results-section .results-table {
  max-width: 600px; }

.results-section .custom-message-wrapper {
  border: 2px solid;
  padding: 10px;
  font-size: 22px;
  margin-bottom: 14px; }

.feedback-section .section-separator {
  border-left: 1px solid #27255F;
  padding-left: 24px; }
  .feedback-section .section-separator.rating-response-message {
    height: 400px; }
    .feedback-section .section-separator.rating-response-message h1, .feedback-section .section-separator.rating-response-message h2, .feedback-section .section-separator.rating-response-message h3, .feedback-section .section-separator.rating-response-message h4 {
      padding: 4px; }

.feedback-section .feedback-table thead th {
  text-transform: uppercase;
  background-color: #D3EDF9;
  color: #27255F; }
  .feedback-section .feedback-table thead th.feedback-item {
    padding-left: 16px; }
  .feedback-section .feedback-table thead th.feedback-response {
    text-align: center;
    vertical-align: top;
    font-weight: normal;
    width: 80px; }

.feedback-section .feedback-table tbody tr.border-bottom {
  border-bottom: 1px solid #D3EDF9; }

.feedback-section .feedback-table tbody td.feedback-item {
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 4px;
  padding-bottom: 4px; }
  .feedback-section .feedback-table tbody td.feedback-item .comments {
    width: 100%;
    height: 150px;
    border: 1px solid #27255F; }

.feedback-section .feedback-table tbody td.feedback-response {
  text-align: center; }

.feedback-section .feedback-table tbody tr.row-dark {
  background-color: #D3EDF9;
  color: #27255F; }
  .feedback-section .feedback-table tbody tr.row-dark td.feedback-item {
    padding-top: 16px;
    padding-bottom: 16px; }

/* --------------------------------------------------
-----------------------------------------------------
END MODULE DETAILS
-----------------------------------------------------
-------------------------------------------------- */
/* --------------------------------------------------
-----------------------------------------------------
START ARTICULATE MODULE
-----------------------------------------------------
-------------------------------------------------- */
.articulate-frame {
  height: 658px;
  width: 980px; }

/* --------------------------------------------------
-----------------------------------------------------
START ARTICULATE MODULE
-----------------------------------------------------
-------------------------------------------------- */
/* --------------------------------------------------
-----------------------------------------------------
MODULE LEVEL
-----------------------------------------------------
-------------------------------------------------- */
.elearn-title {
  color: #27255F;
  text-align: center;
  font-size: 18px; }

.elearn-title a {
  color: #27255F; }

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

.elearn-landing-footer {
  padding-top: 60px; }

/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Spin 2 Win styles */
.modal-backdrop.in {
  opacity: .92; }

.modal-dialog {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -60%) !important;
  text-align: center; }
  .modal-dialog .modal-content {
    background-color: #23A7DF;
    color: #FFFFFF !important; }
    .modal-dialog .modal-content h3 {
      color: #FFFFFF !important; }

.prize_image {
  max-height: 150px;
  max-width: 150px; }

.peg, .wheelSVG {
  visibility: hidden; }

.wheelContainer {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0; }

.centerCircle, .valueContainer, .wheelOutline, .wheelText {
  pointer-events: none; }

.toast, .wheelContainer {
  text-align: center; }

.wheelContainer, .spinBtn, .modal-spinBtn {
  transform: translate(-50%, 0); }

.toast, .spinBtn, .modal-spinBtn {
  position: absolute;
  background-color: #e81d62;
  color: #FFFFFF; }

body {
  /*background-color: #2d2d2d;*/
  /*overflow: hidden;*/ }

body, html {
  margin: 0;
  padding: 0; }

.wheelContainer {
  position: absolute;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  left: 50%;
  top: 100px; }

.wheelSVG {
  position: absolute;
  overflow: visible;
  width: 100%;
  height: auto; }

.wheelText {
  text-anchor: middle;
  font-family: 'Fjalla One', Arial, sans-serif;
  -webkit-user-select: none;
  user-select: none; }

.toast {
  border-radius: 12px;
  opacity: 0; }

.toast p {
  clear: both;
  font-family: 'Fjalla One', Arial, sand-serif;
  margin: 23px;
  font-size: 30px;
  color: #FFFFFF;
  letter-spacing: 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  line-height: 32px;
  -webkit-transition: line-height .2s ease;
  transition: line-height .2s ease; }

.spinBtn {
  left: 50%;
  width: 80%;
  top: 20px;
  max-width: 400px;
  padding: 20px;
  font-weight: 700;
  font-size: 32px;
  color: #FFFFFF !important;
  border-radius: 6px;
  border: none;
  box-shadow: 0 2px 0 #e81d62;
  cursor: pointer;
  font-family: "Fjalla One", Helvetica, Arial, sans-serif; }

.modal-spinBtn {
  left: 50%;
  width: 80%;
  top: 20px;
  max-width: 200px;
  padding: 20px;
  font-weight: 700;
  font-size: 32px;
  color: #FFFFFF !important;
  border-radius: 6px;
  border: none;
  box-shadow: 0 2px 0 #e81d62;
  cursor: pointer;
  font-family: "Fjalla One", Helvetica, Arial, sans-serif; }

@media only screen and (max-width: 480px) {
  .toast p, .toast span {
    font-size: 18px;
    line-height: 18px; } }

@media only screen and (min-width: 481px) and (max-width: 800px) {
  .toast p, .toast span {
    font-size: 38px;
    line-height: 38px; }
  .spin2Win-container {
    width: 100%;
    height: 600px; } }

@media only screen and (min-width: 801px) {
  .toast p, .toast span {
    font-size: 58px;
    line-height: 60px; }
  .spin2Win-container {
    width: 100%;
    height: 800px; } }

@media only screen and (max-height: 480px) {
  .toast p, .toast span {
    font-size: 33px;
    line-height: 35px; }
  .spinBtn {
    font-size: 22px;
    padding: 10px;
    width: 40%; }
  .wheelContainer {
    top: 70px; } }

.spinBtn :focus {
  outline: 0; }

/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
.recognition-banner .carousel .banner-edging {
  height: 0px; }

.recognition-banner .carousel .carousel-inner {
  height: 220px; }
  .recognition-banner .carousel .carousel-inner .item {
    height: 220px;
    width: 100%;
    background-size: 100% 100%; }

@media (max-width: 600px) {
  .recognition-banner .carousel .carousel-inner {
    height: 190px; }
    .recognition-banner .carousel .carousel-inner .item {
      height: 190px; } }

.feed-body-column {
  padding-left: 15px; }

.social-share .nomination-wrapper .btn.btn-nomination
.social-share .share-wrapper .btn.btn-share {
  float: none; }

.social-intro {
  padding: 20px 0; }
  .social-intro p {
    color: #27255F; }

.btn.btn-pr,
a.btn.btn-pr,
button.btn.btn-pr,
.social-share .social-button-wrapper button.btn.btn-pr,
.social-share .post-button-wrapper button.btn.btn-pr {
  padding: 16px 16px;
  min-width: 220px;
  color: #FFFFFF;
  background-color: #0D6FB5;
  border-color: #0D6FB5;
  border-radius: 8px;
  float: none; }
  .btn.btn-pr:hover, .btn.btn-pr:focus, .btn.btn-pr.active,
  a.btn.btn-pr:hover,
  a.btn.btn-pr:focus,
  a.btn.btn-pr.active,
  button.btn.btn-pr:hover,
  button.btn.btn-pr:focus,
  button.btn.btn-pr.active,
  .social-share .social-button-wrapper button.btn.btn-pr:hover,
  .social-share .social-button-wrapper button.btn.btn-pr:focus,
  .social-share .social-button-wrapper button.btn.btn-pr.active,
  .social-share .post-button-wrapper button.btn.btn-pr:hover,
  .social-share .post-button-wrapper button.btn.btn-pr:focus,
  .social-share .post-button-wrapper button.btn.btn-pr.active {
    color: #FFFFFF;
    background-color: #0D6FB5;
    border-color: #0D6FB5;
    transition: 0.35s; }

.btn .button-pointer {
  color: #8BC541;
  font-weight: bold;
  font-size: 120%; }

.btn.btn-pr-misc-control,
div.btn-pr-misc-control {
  color: #FFFFFF;
  background-color: #0D6FB5;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center; }
  .btn.btn-pr-misc-control:hover, .btn.btn-pr-misc-control:focus, .btn.btn-pr-misc-control.visited,
  div.btn-pr-misc-control:hover,
  div.btn-pr-misc-control:focus,
  div.btn-pr-misc-control.visited {
    color: #FFFFFF;
    background-color: #23A7DF; }

.social-share-header {
  background-color: #FFFFFF;
  height: 80px;
  display: flex;
  align-items: center; }
  .social-share-header h1, .social-share-header h2, .social-share-header h3, .social-share-header h4 {
    color: #27255F;
    font-size: 24px; }

.social-share button.btn-default {
  background: white; }

.social-share .social-button-wrapper {
  background: #FFFFFF;
  padding-top: 24px;
  padding-bottom: 24px;
  padding-left: 40px;
  padding-right: 40px; }
  .social-share .social-button-wrapper .btn.social-button {
    width: 100%; }

.social-section {
  background-color: #FFFFFF;
  /*
    .post-button-wrapper {
        // override
        padding-bottom: 15px;
    }
    */ }
  .social-section .social-option-row {
    padding-top: 16px;
    padding-bottom: 4px; }
    .social-section .social-option-row .post-type-row {
      margin-bottom: 16px; }
      .social-section .social-option-row .post-type-row .value-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding-bottom: 12px;
        /*
                .dropdown
                {
                    .ddl-post-type
                    {
                        position:relative;
                        width:$post-type-dropdown-width;
                        color:$color-fifth-fore;
                        background-color:$color-fifth-back;
                        text-align:left;
                        padding:4px;

                        .dropdown-text
                        {
                            padding-left:16px;
                        }
                        .caret
                        {
                            border-top:4px solid $color-fifth-fore;
                            position:absolute;
                            left:90%;
                            top:45%;
                        }
                    
                    }
                
                    .dropdown-menu
                    {
                        padding: 0px;
                        li
                        {
                            width:$post-type-dropdown-width;
                            padding-top:8px;
                            padding-bottom:8px;
                            color:$color-secondary-fore;
                            background-color:$color-fifth-back;
                            border-bottom:1px solid $site-background;

                            a
                            {
                                color:$color-secondary-fore;                            
                                &:hover
                                {
                                    background-color:$green;
                                }
                            }
                            &:hover
                            {
                                background-color:$green;
                            }
                        }
                    }
                }

                */ }
        .social-section .social-option-row .post-type-row .value-icon .post-type-name {
          padding-top: 8px;
          text-align: center;
          height: 80px; }
        .social-section .social-option-row .post-type-row .value-icon .value-icon-preview {
          width: 60px;
          height: 60px; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview:hover {
            transition: 0.35s; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_SHARE {
            background: url(/images/fivesteps/peer-rec/News-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_SHARE:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_SHARE.active {
              background: url(/images/fivesteps/peer-rec/News-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_PANADOL {
            background: url(/images/fivesteps/peer-rec/shelf-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_PANADOL:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_PANADOL.active {
              background: url(/images/fivesteps/peer-rec/shelf-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_GSK {
            background: url(/images/fivesteps/peer-rec/shelf-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_GSK:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_GSK.active {
              background: url(/images/fivesteps/peer-rec/shelf-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_ELEVIT {
            background: url(/images/fivesteps/peer-rec/shelf-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_ELEVIT:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_ELEVIT.active {
              background: url(/images/fivesteps/peer-rec/shelf-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_NASONEX {
            background: url(/images/fivesteps/peer-rec/shelf-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_NASONEX:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_NASONEX.active {
              background: url(/images/fivesteps/peer-rec/shelf-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_DEMAZIN {
            background: url(/images/fivesteps/peer-rec/shelf-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_DEMAZIN:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_BBD_DEMAZIN.active {
              background: url(/images/fivesteps/peer-rec/shelf-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_3M {
            background: url(/images/fivesteps/peer-rec/shelf-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_3M:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_3M.active {
              background: url(/images/fivesteps/peer-rec/shelf-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_DIARR {
            background: url(/images/fivesteps/peer-rec/mission-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_DIARR:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_DIARR.active {
              background: url(/images/fivesteps/peer-rec/mission-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_COUGH {
            background: url(/images/fivesteps/peer-rec/mission-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_COUGH:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_COUGH.active {
              background: url(/images/fivesteps/peer-rec/mission-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_RUNNY {
            background: url(/images/fivesteps/peer-rec/mission-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_RUNNY:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_MISS_RUNNY.active {
              background: url(/images/fivesteps/peer-rec/mission-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_GONDOLA {
            background: url(/images/fivesteps/peer-rec/shelf-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_GONDOLA:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_GONDOLA.active {
              background: url(/images/fivesteps/peer-rec/shelf-active.png);
              background-size: cover; }
          .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_TIPS {
            background: url(/images/fivesteps/peer-rec/helpful-tips-normal.png);
            background-size: cover; }
            .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_TIPS:hover, .social-section .social-option-row .post-type-row .value-icon .value-icon-preview.FIVESTEPS_TIPS.active {
              background: url(/images/fivesteps/peer-rec/helpful-tips-active.png);
              background-size: cover; }
  .social-section .editor {
    padding: 12px;
    background-color: #FFFFFF; }
    .social-section .editor.multi-line {
      min-height: 100px; }
    .social-section .editor:focus {
      border: solid 1px #27255F; }
  .social-section .dropzone.post-image-dz {
    width: 25%;
    height: 40px;
    min-height: 40px;
    text-align: center;
    border-radius: 0;
    border: 1px;
    border-style: solid; }
  .social-section .dropzone .dz-file-preview {
    margin-top: -30px; }
  .social-section .dropzone .file-select-pad {
    padding-top: 20px; }
  .social-section .dropzone.post-image-dz.additional-files {
    width: 80%; }

.posts {
  margin-top: 25px; }

/* Start Add Share (post) panel */
.cil-poststream-container .share-wrapper h4 {
  font-weight: bold; }

.share-wrapper {
  color: #27255F;
  background: #D3EDF9;
  padding: 16px; }
  .share-wrapper .attach-file-wrapper {
    background-color: #FFFFFF;
    border-bottom: solid 1px #ebebeb; }
  .share-wrapper .dropzone.post-image-dz {
    color: #27255F;
    background: #FFFFFF;
    border-left: none;
    border-top: none;
    border-bottom: none;
    border-right: solid 1px #ebebeb;
    padding: 10px 0 0 0; }
  .share-wrapper .dropzone.post-image-dz.primary-file {
    min-height: 40px; }
    @media (min-width: 992px) {
      .share-wrapper .dropzone.post-image-dz.primary-file {
        max-width: 25%; } }
  .share-wrapper .post-button-wrapper .btn.btn-share.btn-pr {
    color: #27255F;
    background: #FFFFFF;
    padding: 16px 20px;
    min-width: 0; }
    .share-wrapper .post-button-wrapper .btn.btn-share.btn-pr:hover {
      color: #FFFFFF;
      background: #23A7DF; }
  .share-wrapper .new-share-image {
    float: left;
    padding: 10px 15px 10px 0; }
  .share-wrapper .share-member-details {
    color: #464646; }
    .share-wrapper .share-member-details .name {
      font-size: 20px; }
  .share-wrapper .btn.btn-pr-misc-control.btn-expand-additional-files {
    margin-top: 10px; }

/* End Add Share (post) panel */
.social-feed-divider-wrapper {
  margin-top: 10px; }
  .social-feed-divider-wrapper .social-feed-divider-content {
    background: #FFFFFF;
    display: flex;
    align-items: center; }
    .social-feed-divider-wrapper .social-feed-divider-content .divider-title-wrapper {
      padding-left: 0px; }
      .social-feed-divider-wrapper .social-feed-divider-content .divider-title-wrapper h1.divider-title, .social-feed-divider-wrapper .social-feed-divider-content .divider-title-wrapper h2.divider-title, .social-feed-divider-wrapper .social-feed-divider-content .divider-title-wrapper h3.divider-title, .social-feed-divider-wrapper .social-feed-divider-content .divider-title-wrapper h4.divider-title {
        color: #27255F;
        font-size: 24px;
        margin-top: 0px;
        margin-bottom: 0px; }
    .social-feed-divider-wrapper .social-feed-divider-content .social-sort-nav.navbar-collapse {
      width: 50%; }
      .social-feed-divider-wrapper .social-feed-divider-content .social-sort-nav.navbar-collapse ul li {
        background: #FFFFFF; }
        .social-feed-divider-wrapper .social-feed-divider-content .social-sort-nav.navbar-collapse ul li a {
          color: #27255F;
          background: #FFFFFF; }
          .social-feed-divider-wrapper .social-feed-divider-content .social-sort-nav.navbar-collapse ul li a:hover {
            background: #FFFFFF; }
        .social-feed-divider-wrapper .social-feed-divider-content .social-sort-nav.navbar-collapse ul li.open {
          background: #FFFFFF; }
          .social-feed-divider-wrapper .social-feed-divider-content .social-sort-nav.navbar-collapse ul li.open a:focus {
            background: #FFFFFF; }
    @media (max-width: 768px) {
      .social-feed-divider-wrapper .social-feed-divider-content .social-sort-nav.navbar-collapse.pull-right {
        float: none !important; } }

.stream-item-container .stream-item-body .stream-item-like-controls small {
  margin-left: 0px; }

.stream-item-container .stream-item-body .stream-item-like-controls a {
  color: #8BC541; }

/* Start Shares ("post") Section */
.post-container {
  background: #FFFFFF;
  margin-bottom: 20px; }
  .post-container .post-header {
    border-top: 8px solid #0D6FB5;
    background: #FFFFFF;
    color: #3F3F3F;
    border-bottom: 1px solid #ebebeb; }
    .post-container .post-header h3, .post-container .post-header p {
      color: #3F3F3F; }
    .post-container .post-header img.img-member {
      max-width: 50px; }
    .post-container .post-header .stream-item-head-text {
      font-weight: bold;
      color: #27255F; }
    .post-container .post-header .post-type-pane {
      display: flex;
      align-items: center;
      justify-content: flex-end; }
      .post-container .post-header .post-type-pane .post-type-name {
        font-weight: bold;
        color: #27255F; }
      .post-container .post-header .post-type-pane .post-type-spacer {
        width: 20px; }
      .post-container .post-header .post-type-pane .post-type-icon {
        width: 60px;
        height: 60px; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_SHARE {
          background: url(/images/fivesteps/peer-rec/News-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_PANADOL {
          background: url(/images/fivesteps/peer-rec/shelf-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_GSK {
          background: url(/images/fivesteps/peer-rec/shelf-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_BBD_ELEVIT {
          background: url(/images/fivesteps/peer-rec/shelf-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_BBD_NASONEX {
          background: url(/images/fivesteps/peer-rec/shelf-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_BBD_DEMAZIN {
          background: url(/images/fivesteps/peer-rec/shelf-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_3M {
          background: url(/images/fivesteps/peer-rec/shelf-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_MISS_DIARR {
          background: url(/images/fivesteps/peer-rec/mission-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_MISS_COUGH {
          background: url(/images/fivesteps/peer-rec/mission-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_MISS_RUNNY {
          background: url(/images/fivesteps/peer-rec/mission-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_GONDOLA {
          background: url(/images/fivesteps/peer-rec/shelf-normal.png);
          background-size: cover; }
        .post-container .post-header .post-type-pane .post-type-icon.FIVESTEPS_TIPS {
          background: url(/images/fivesteps/peer-rec/helpful-tips-normal.png);
          background-size: cover; }
  .post-container .post-body {
    background: #FFFFFF;
    color: #3F3F3F; }
    .post-container .post-body button,
    .post-container .post-body btn {
      background: #FFFFFF; }
      .post-container .post-body button:hover,
      .post-container .post-body btn:hover {
        background: #23A7DF; }
    .post-container .post-body .post-content {
      font-size: 15px !important;
      color: #3F3F3F !important; }
      .post-container .post-body .post-content a, .post-container .post-body .post-content a span {
        background: #FFFFFF;
        color: #23A7DF; }
      .post-container .post-body .post-content .post-images {
        margin-top: 12px;
        margin-left: 25px; }
      .post-container .post-body .post-content .post-text {
        background: #FFFFFF;
        color: #3F3F3F;
        margin-left: 20px; }
        .post-container .post-body .post-content .post-text .wistia_responsive_wrapper {
          padding-right: 15px; }
      .post-container .post-body .post-content .additional-files-row .attachment-type-file {
        width: 92px;
        height: 92px; }
      .post-container .post-body .post-content .post-like-controls {
        margin-left: 0px;
        clear: none; }
        .post-container .post-body .post-content .post-like-controls a, .post-container .post-body .post-content .post-like-controls a span {
          background: #FFFFFF;
          color: #3F3F3F; }
    .post-container .post-body .comment-container {
      background-color: #23A7DF;
      margin-right: 0; }
      .post-container .post-body .comment-container .comment-header,
      .post-container .post-body .comment-container .comments h4 {
        color: #27255F;
        background-color: #D3EDF9; }
      .post-container .post-body .comment-container .comment-header.comment-like-header {
        color: #FFFFFF;
        background-color: #0D6FB5; }
        .post-container .post-body .comment-container .comment-header.comment-like-header a, .post-container .post-body .comment-container .comment-header.comment-like-header a:hover, .post-container .post-body .comment-container .comment-header.comment-like-header a:visited {
          color: #FFFFFF; }
      .post-container .post-body .comment-container .comments-list,
      .post-container .post-body .comment-container .comments,
      .post-container .post-body .comment-container .comments .comment-wrapper,
      .post-container .post-body .comment-container .comment-message {
        background-color: #eaf8ff;
        color: #3F3F3F; }
      .post-container .post-body .comment-container .comment-input-box {
        margin-top: 4px; }
      .post-container .post-body .comment-container .comment-header .show-comments-link {
        color: #27255F;
        float: right; }
        .post-container .post-body .comment-container .comment-header .show-comments-link a {
          color: #27255F; }
          .post-container .post-body .comment-container .comment-header .show-comments-link a:after {
            content: "\f107";
            margin-left: 14px;
            font-family: "FontAwesome";
            position: relative; }
          .post-container .post-body .comment-container .comment-header .show-comments-link a:hover {
            text-decoration: none;
            cursor: pointer; }
      .post-container .post-body .comment-container .more-comments {
        background-color: #eaf8ff !important;
        color: #27255F;
        margin-left: 20px;
        padding-top: 0px;
        padding-bottom: 8px; }
        .post-container .post-body .comment-container .more-comments a, .post-container .post-body .comment-container .more-comments a span, .post-container .post-body .comment-container .more-comments a:hover, .post-container .post-body .comment-container .more-comments a:visited {
          color: #27255F; }
      .post-container .post-body .comment-container .comments .commentor-name {
        color: #27255F; }
      .post-container .post-body .comment-container .comments .comment-content {
        background-color: #eaf8ff;
        color: #3F3F3F;
        border-radius: 0px;
        padding: 8px 0px 8px 0px; }
        .post-container .post-body .comment-container .comments .comment-content a, .post-container .post-body .comment-container .comments .comment-content a span {
          color: #27255F; }
      .post-container .post-body .comment-container .comment-message .btn-comment-send {
        border-radius: 6px;
        width: 100%;
        border: 0;
        transition: 0.35s;
        color: #27255F;
        background: #FFFFFF; }
        .post-container .post-body .comment-container .comment-message .btn-comment-send:hover {
          color: #FFFFFF;
          background: #23A7DF; }
  .post-container .post-body .post-content:hover .edit-panel {
    top: 0px;
    right: 0px;
    z-index: 10; }

/* End Shares ("post") Section */
/*
.container.cil-poststream-container
{
    padding-left: 0px;
    background-color: $color-content-back;
}
*/
.body-column .cil-poststream-container {
  padding-left: 0px;
  padding-right: 0px;
  background-color: #FFFFFF; }

/* --------------------------------------------------
BOOTSTRAP OVERRIDES 
-------------------------------------------------- */
.post-type-row button, .post-type-row input {
  border: 0; }

/* --------------------------------------------------
GLOBAL PEER-REC OVERRIDES 
-------------------------------------------------- */
.stream-item-container .stream-item-body {
  margin-bottom: 40px; }

.reported-content {
  margin-top: 20px; }

.sidebar-column {
  background-color: #81BD41 !important; }

.sidebar-column .sidebar .sidebar-element, .sidebar-container .sidebar .sidebar-element {
  background-color: #81BD41 !important; }

.sidebar-column .sidebar .sidebar-element .edit-button, .sidebar-container .sidebar .sidebar-element .edit-button {
  background-color: #81BD41 !important; }

@media (max-width: 768px) {
  .social-feed-divider-wrapper .social-feed-divider-content h4 {
    color: #FFFFFF; }
    .social-feed-divider-wrapper .social-feed-divider-content h4 i {
      color: #FFFFFF; } }

@media (min-width: 1900px) {
  .container {
    width: 1250px; } }

@media (min-width: 1300px) {
  .container {
    width: 1250px; }
  .col-lg-2.col-md-2.sidebar-column.hidden-xs.hidden-sm.nopadding {
    width: 20%; }
  .col-lg-7.col-md-7.col-sm-12.col-xs-12.main-container.nopadding {
    width: 60%; }
  .col-lg-3.col-md-3.sidebar-column.hidden-xs.hidden-sm.nopadding {
    width: 20%; } }

@media (max-width: 1200px) {
  .col-lg-7.col-md-7.col-sm-12.col-xs-12.main-container.nopadding {
    width: 100%; } }

@media (max-width: 768px) {
  .center {
    left: 0; }
  .stream-item-container .stream-item-body .comment-container .comment-header h4.comment-stats {
    float: initial;
    width: initial;
    text-align: initial; }
    .stream-item-container .stream-item-body .comment-container .comment-header h4.comment-stats :hover {
      cursor: pointer; }
  .stream-item-container .stream-item-body .comment-container .comment-header .comment-message {
    padding: 0; }
  .stream-item-container .stream-item-body .comment-container .comment-header .comments {
    padding: 3.75px; }
    .stream-item-container .stream-item-body .comment-container .comment-header .comments .comment-content {
      padding-top: 0;
      padding-bottom: 0; }
    .stream-item-container .stream-item-body .comment-container .comment-header .comments i {
      color: #FFFFFF; }
  .nomination-container {
    padding: 0px; } }

@media (max-width: 440px) {
  .center {
    left: 0; }
  .stream-item-container .stream-item-body .comment-container .comment-header h4.comment-stats {
    float: left;
    width: initial;
    text-align: initial; }
    .stream-item-container .stream-item-body .comment-container .comment-header h4.comment-stats :hover {
      cursor: pointer; }
  .stream-item-container .stream-item-body .comment-container .comment-header .comment-message {
    padding: 0; }
  .stream-item-container .stream-item-body .comment-container .comment-header .comments {
    padding: 3.75px; }
    .stream-item-container .stream-item-body .comment-container .comment-header .comments .comment-content {
      padding-top: 0;
      padding-bottom: 0; }
    .stream-item-container .stream-item-body .comment-container .comment-header .comments i {
      color: #FFFFFF; }
  .nomination-container {
    padding: 0px; } }

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* IE10+ CSS styles go here */ }

@media all and (-ms-high-contrast: none) and (min-width: 1024px), (-ms-high-contrast: active) and (min-width: 1024px) {
  .social-section .social-option-row .post-type-row .value-icon .post-type-name {
    max-width: 140px; } }

@media all and (-ms-high-contrast: none) and (max-width: 1023px), (-ms-high-contrast: active) and (max-width: 1023px) {
  .social-section .social-option-row .post-type-row .value-icon .post-type-name {
    max-width: 100px; } }

/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
/* Values */
/*  
Demo Test - Values
basic colors - These should be defined but we should avoid directly using these in our actual styles. These colour values can 
be easily tweaked so that all usages of that color can be shifted
*/
/* FiveSteps Site Colours */
/* Five Steps ACTUAL LOGO colours */
/* 
Color Schemes: 
Color pair sets which are paired with foreground and background colors, and additional active versions of the colors
*/
/* 
Functionality colors. 
These are the colours that will be used within the actual styles, and should be named according to their intended usage.
Generally color schemes are allocated to these but can also be directly set to colors
*/
/*
Size Values
*/
.sidebar-column,
.sidebar-container {
  background: #0D6FB5;
  height: 100%;
  min-height: 2000px;
  padding: 0px; }
  .sidebar-column .row .container .no-padding,
  .sidebar-container .row .container .no-padding {
    padding: 0; }
  .sidebar-column .sidebar .sidebar-element,
  .sidebar-container .sidebar .sidebar-element {
    color: #FFFFFF;
    background-color: #0D6FB5;
    position: relative;
    text-align: center;
    min-height: 150px;
    padding-left: 0px;
    padding-right: 0px; }
    .sidebar-column .sidebar .sidebar-element .profile-info,
    .sidebar-container .sidebar .sidebar-element .profile-info {
      margin-top: 15px; }
    .sidebar-column .sidebar .sidebar-element .profile-image,
    .sidebar-container .sidebar .sidebar-element .profile-image {
      background-color: #FFFFFF;
      margin-top: 30px;
      max-width: 60%;
      border: 6px solid #FFFFFF; }
    .sidebar-column .sidebar .sidebar-element .edit-button,
    .sidebar-container .sidebar .sidebar-element .edit-button {
      padding: 10px 14px;
      background: #0D6FB5;
      color: #FFFFFF;
      position: absolute;
      top: 0;
      right: 0; }
    .sidebar-column .sidebar .sidebar-element h2, .sidebar-column .sidebar .sidebar-element h3, .sidebar-column .sidebar .sidebar-element h4, .sidebar-column .sidebar .sidebar-element h5, .sidebar-column .sidebar .sidebar-element h6,
    .sidebar-container .sidebar .sidebar-element h2,
    .sidebar-container .sidebar .sidebar-element h3,
    .sidebar-container .sidebar .sidebar-element h4,
    .sidebar-container .sidebar .sidebar-element h5,
    .sidebar-container .sidebar .sidebar-element h6 {
      color: #0D6FB5; }
      .sidebar-column .sidebar .sidebar-element h2 a, .sidebar-column .sidebar .sidebar-element h3 a, .sidebar-column .sidebar .sidebar-element h4 a, .sidebar-column .sidebar .sidebar-element h5 a, .sidebar-column .sidebar .sidebar-element h6 a,
      .sidebar-container .sidebar .sidebar-element h2 a,
      .sidebar-container .sidebar .sidebar-element h3 a,
      .sidebar-container .sidebar .sidebar-element h4 a,
      .sidebar-container .sidebar .sidebar-element h5 a,
      .sidebar-container .sidebar .sidebar-element h6 a {
        color: #0D6FB5; }
        .sidebar-column .sidebar .sidebar-element h2 a:hover, .sidebar-column .sidebar .sidebar-element h3 a:hover, .sidebar-column .sidebar .sidebar-element h4 a:hover, .sidebar-column .sidebar .sidebar-element h5 a:hover, .sidebar-column .sidebar .sidebar-element h6 a:hover,
        .sidebar-container .sidebar .sidebar-element h2 a:hover,
        .sidebar-container .sidebar .sidebar-element h3 a:hover,
        .sidebar-container .sidebar .sidebar-element h4 a:hover,
        .sidebar-container .sidebar .sidebar-element h5 a:hover,
        .sidebar-container .sidebar .sidebar-element h6 a:hover {
          text-decoration: none; }
    .sidebar-column .sidebar .sidebar-element p,
    .sidebar-container .sidebar .sidebar-element p {
      color: #FFFFFF; }
  .sidebar-column .sidebar .sidebar-element-title h1,
  .sidebar-container .sidebar .sidebar-element-title h1 {
    color: #FFFFFF;
    background-color: #0D6FB5;
    padding: 8px;
    margin-top: 0;
    margin-bottom: 0;
    text-transform: uppercase;
    font-size: 22px; }
  .sidebar-column .sidebar .sidebar-element-title h2,
  .sidebar-container .sidebar .sidebar-element-title h2 {
    color: #27255F;
    padding: 8px;
    margin-top: 0;
    margin-bottom: 0;
    text-transform: uppercase;
    font-size: 22px; }