/* 
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
*/
/* 
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
*/
/*individual corners*/
/* 
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
*/
/* 
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
*/
/*individual corners*/
/* 
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
*/
/* 
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
*/
/*individual corners*/
/* 
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
*/
/* 
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
*/
/*individual corners*/
/******************* 
START SITE WIDE VALUES
*******************/
body {
  background: #FFFFFF;
  font-size: 16px; }

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, .home-login .btn {
  color: #FFFFFF;
  background-color: #00A64E;
  border-color: #FFFFFF;
  border-radius: 5px;
  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, .home-login .btn:hover, .home-login .btn:focus {
    color: #FFFFFF;
    background-color: #262626;
    border-color: #262626; }
  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, .home-login .btn.btn-three, .home-login .btn.btn-two {
    color: #FFFFFF;
    background-color: #00A64E;
    border-color: #FFFFFF;
    border-radius: 5px;
    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, .home-login .btn.btn-three:hover, .home-login .btn.btn-three:focus, .home-login .btn.btn-two:hover, .home-login .btn.btn-two:focus {
      color: #FFFFFF;
      background-color: #262626;
      border-color: #262626; }
  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, .home-login .btn.btn-four {
    color: #FFFFFF;
    background-color: #00A64E;
    border-color: #00A64E;
    border-radius: 5px;
    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, .home-login .btn.btn-four:hover, .home-login .btn.btn-four:focus {
      color: #FFFFFF;
      background-color: #262626;
      border-color: #262626; }
  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, .home-login .btn.btn-five {
    color: #FFFFFF;
    background-color: #00A64E;
    border-color: #00A64E;
    border-radius: 5px;
    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, .home-login .btn.btn-five:hover, .home-login .btn.btn-five:focus {
      color: #FFFFFF;
      background-color: #262626;
      border-color: #262626; }
  button.btn.btn-six,
  input.btn.btn-six,
  .btn
section.content-body button.btn.btn-six, section.content-body .btn.btn-six,
  section.content-body .btn.btn-three.btn-six, section.content-body .btn.btn-two.btn-six, .home-login .btn.btn-six {
    color: #FFFFFF;
    background-color: #262626;
    border-color: #00A64E;
    border-radius: 5px;
    padding: 6px 12px; }
    button.btn.btn-six:hover, button.btn.btn-six:focus,
    input.btn.btn-six:hover,
    input.btn.btn-six:focus,
    .btn
section.content-body button.btn.btn-six:hover,
    .btn
section.content-body button.btn.btn-six:focus, section.content-body .btn.btn-six:hover, section.content-body .btn.btn-six:focus,
    section.content-body .btn.btn-three.btn-six:hover,
    section.content-body .btn.btn-three.btn-six:focus, section.content-body .btn.btn-two.btn-six:hover, section.content-body .btn.btn-two.btn-six:focus, .home-login .btn.btn-six:hover, .home-login .btn.btn-six:focus {
      color: #FFFFFF;
      background-color: #00A64E;
      border-color: #00A64E; }
  button.btn.btn-seven,
  input.btn.btn-seven,
  .btn
section.content-body button.btn.btn-seven, section.content-body .btn.btn-seven,
  section.content-body .btn.btn-three.btn-seven, section.content-body .btn.btn-two.btn-seven, .home-login .btn.btn-seven {
    color: #FFFFFF;
    background-color: #00A64E;
    border-color: #00A64E;
    border-radius: 5px;
    padding: 6px 12px; }
    button.btn.btn-seven:hover, button.btn.btn-seven:focus,
    input.btn.btn-seven:hover,
    input.btn.btn-seven:focus,
    .btn
section.content-body button.btn.btn-seven:hover,
    .btn
section.content-body button.btn.btn-seven:focus, section.content-body .btn.btn-seven:hover, section.content-body .btn.btn-seven:focus,
    section.content-body .btn.btn-three.btn-seven:hover,
    section.content-body .btn.btn-three.btn-seven:focus, section.content-body .btn.btn-two.btn-seven:hover, section.content-body .btn.btn-two.btn-seven:focus, .home-login .btn.btn-seven:hover, .home-login .btn.btn-seven:focus {
      color: #FFFFFF;
      background-color: #262626;
      border-color: #00A64E; }

/*
.home-logins .btn-six {
    color: $button-four-fore; 
    background-color: $button-four-back;  
    border-color: $button-four-back-active;      
    border-radius: $button-corner-radius;
    padding: $button-padding;
}
*/
.btn-xlarge {
  padding: 10px 20px; }

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

input.form-control,
.login-section .form-light input.form-control {
  border-radius: 5px !important; }

section.slice {
  padding: 0; }

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

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

/* Validation */
.validation-success {
  color: #00A64E !important; }

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

.validation-warning {
  color: #FFFFFF !important; }
  .validation-warning.validation-dark {
    color: orange !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: #494949;
  background-color: #FFFFFF;
  min-height: 62px;
  border-bottom: 0px solid #FFFFFF;
  /* OVERRIDES to fill in top navigation to section height */ }
  .top-header ul.menu {
    padding-right: 15px;
    height: 62px; }
    .top-header ul.menu li a {
      color: #00A64E;
      background-color: #FFFFFF; }
      .top-header ul.menu li a:hover {
        color: #FFFFFF;
        background-color: #00A64E;
        height: 62px; }
    .top-header ul.menu li ul li a {
      height: 36px;
      padding: 8px 10px; }
    .top-header ul.menu li ul li a:hover {
      height: 36px;
      padding: 8px 10px;
      vertical-align: middle; }
    .top-header ul.menu #notification-toggle i.fa-bell {
      margin-right: 0px; }
  .top-header .top-header-menu {
    height: 62px; }
    .top-header .top-header-menu div.navbar-collapse {
      padding-left: 0px;
      padding-right: 0px; }
  .top-header .navbar-collapse.collapse {
    height: 62px; }
  .top-header .nav > li {
    height: 62px; }
  .top-header .navbar-nav > li > a {
    padding-top: 20px; }
  .top-header .navbar-collapse .navbar-nav.navbar-right:last-child {
    margin-right: 18px; }

/* END TOP NAV BAR */
/* START HEADER AND MAIN NAVBAR */
header .navbar {
  margin: 0;
  min-height: 100px;
  color: #FFFFFF;
  background: #262626;
  border: 0;
  border-radius: 0; }
  header .navbar img.main-header-logo {
    margin-top: 0px;
    height: 62px;
    width: inherit;
    height: inherit; }

@media (min-width: 768px) {
  .navbar .navbar-container-table {
    min-height: 100px;
    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 {
      margin-right: -15px; } }

.navbar .navbar-nav {
  margin-top: 0px; }
  .navbar .navbar-nav li {
    color: #FFFFFF;
    background-color: #262626;
    border-radius: 5px;
    margin-right: 4px;
    min-width: inherit; }
    .navbar .navbar-nav li a {
      color: inherit;
      background-color: inherit;
      border-radius: 5px;
      min-height: 50px;
      padding-top: 25px;
      line-height: 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: #FFFFFF;
      background-color: #00A64E; }
  .navbar .navbar-nav .active a,
  .navbar .navbar-nav .active a:hover,
  .navbar .navbar-nav .active a:focus {
    font-weight: bold;
    border-radius: 5px; }
  .navbar .navbar-nav .disabled a,
  .navbar .navbar-nav .disabled a:hover,
  .navbar .navbar-nav .disabled a:focus {
    color: #FFFFFF;
    background-color: transparent; }
  .navbar .navbar-nav .dropdown a.dropdown-toggle {
    padding-top: 23px; }
  .navbar .navbar-nav .dropdown a .caret {
    border-top-color: #FFFFFF;
    border-bottom-color: #FFFFFF; }
  .navbar .navbar-nav .dropdown a:hover .caret,
  .navbar .navbar-nav .dropdown a:focus .caret {
    border-top-color: #FFFFFF;
    border-bottom-color: #FFFFFF; }
  .navbar .navbar-nav .open {
    color: #FFFFFF;
    background-color: #00A64E; }
    .navbar .navbar-nav .open a {
      color: #FFFFFF;
      background-color: #00A64E; }
      .navbar .navbar-nav .open a .caret {
        border-top-color: #FFFFFF;
        border-bottom-color: #FFFFFF; }
    .navbar .navbar-nav .open .dropdown-menu {
      margin-top: 21px;
      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: 25px;
        color: #FFFFFF;
        background: #00A64E;
        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: #494949;
          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: #00A64E;
        border-width: 10px;
        margin-left: -10px;
        z-index: 1000; }

.navbar .navbar-toggle {
  border-color: #00A64E; }
  .navbar .navbar-toggle .icon-bar {
    background-color: #FFF; }

.navbar .navbar-toggle:hover,
.navbar .navbar-toggle:focus {
  background-color: #00A64E; }

.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: #FFFFFF;
    background: #00A64E; }

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

/* END BANNER SECTION*/
/* START CONTENT HEADER */
section.content-header {
  color: #00A64E;
  background-color: #FFFFFF;
  padding: 20px 0 20px 0;
  /*override bold font <strong> to normal. */ }
  section.content-header .cta-wr h1 {
    padding-left: 15px;
    font-size: 30px;
    font-weight: normal !important; }
  section.content-header .cta-wr strong {
    font-weight: normal !important; }

/* END CONTENT HEADER */
/* START CONTENT BODY */
section.content-body {
  color: #494949;
  background-color: #FFFFFF;
  padding: 0 0 36px 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: #00A64E; }
  section.content-body a {
    color: #00A64E; }
    section.content-body a:hover {
      color: #00A64E; }
  section.content-body table {
    width: 100%; }
    section.content-body table th,
    section.content-body table thead td {
      font-weight: bold;
      color: #FFFFFF;
      background-color: #00A64E; }
    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: #494949;
      background-color: #FFFFFF; }

section.content-body .section-title h3 {
  color: #FFFFFF; }

.indicator-down.color-one {
  border-top-color: #00A64E;
  background: none; }

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

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

.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
*/
/* 
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
*/
/*individual corners*/
/* 
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
*/
/* 
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
*/
/*individual corners*/
/* 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; }

.banner-section.full-form-background {
  color: #FFFFFF;
  background-color: #00A64E; }

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

.login-section .main-image-background {
  width: 100%;
  height: 485px;
  background-size: cover; }

.w-box.login-box {
  color: #FFFFFF;
  background-color: #00A64E;
  border: 0px solid #00A64E; }
  .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: #bca36a; }

.login-section .form-light .form-control {
  border: 0px; }

.login-section .form-control {
  height: 50px; }

.login-section input {
  border-radius: 5px; }

section.login-section .w-box p {
  font-size: 16px; }

.toggle-login {
  display: none; }

.forgotPasswordText {
  text-align: left; }

.forgotten-password-form .w-box.dark h2 {
  font-size: 30px;
  text-align: left; }

.forgotten-password-form {
  font-size: 16px;
  color: #FFF; }

/* OVERRIDES */
.w-box.dark h2 {
  border-bottom: 0; }

.login-section.pre-live-access {
  color: #494949; }
  .login-section.pre-live-access h1, .login-section.pre-live-access h2, .login-section.pre-live-access h3, .login-section.pre-live-access h4, .login-section.pre-live-access a {
    color: #494949; }
  .login-section.pre-live-access .login-option-last {
    color: #494949; }

.login-box .holding-page-content-wrapper {
  padding-left: 20px;
  padding-right: 20px; }

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

.forgotten-password-form ul {
  margin: 0; }

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

.w-box.reset-password-box {
  color: #FFFFFF;
  background-color: #00A64E;
  border: 0px solid #00A64E; }
  .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-container .form-errors {
  width: 100%;
  text-align: center;
  background: #FFFFFF;
  padding: 20px 0px;
  margin-top: 12px;
  border-radius: 5px; }
  .registration-container .form-errors ul li {
    list-style-type: none; }

.registration-container .email-challenge .email-challenge-submit {
  margin-top: 12px; }

.registration-container .registration-form {
  margin-top: 40px; }
  .registration-container .registration-form div.checkbox {
    padding-left: 50px; }
    .registration-container .registration-form div.checkbox a,
    .registration-container .registration-form div.checkbox a:hover {
      color: #FFFFFF; }

/* END User Registration Page */
/* START SOCIAL MEDIA ICONS */
.social-home-container {
  margin-left: 0px; }

.icon-social-home {
  float: left;
  width: 66px;
  margin-top: 44px;
  text-align: center; }

.icon-social-home-container {
  width: 228px;
  margin: 0 auto; }

.icon-social-home-large {
  float: left;
  width: 76px;
  text-align: center; }

.social-top-container {
  padding: 4px 0 8px 0; }

.icon-social-top {
  float: left;
  width: 66px;
  margin-top: 5px;
  text-align: left; }

/* END START SOCIAL MEDIA ICONS */
/* DISTRIBUTOR LOGO */
.distributor-logo-header {
  width: 184px;
  height: 60px;
  float: left;
  text-align: center; }

.distributor-logo-header img {
  max-height: 58px !important;
  width: auto !important; }

/* END DISTRIBUTOR LOGO */
/* START GENERIC CONTENT STYLES */
.color-three p {
  color: #494949; }

.carousel-2 .item {
  padding: 10px 0 !important; }

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

/*.container-fluid .video {
    width: 50%;
}*/
.container-fluid .fixed50percent {
  width: 50%; }

.table.table-staging-data thead th,
.table.table-registration-data thead th {
  color: #494949;
  background-color: #FFFFFF;
  font-weight: bold; }

.table.table-staging-data tbody td.validation-success,
.table.table-registration-data tbody td.validation-success {
  background-color: #00A64E;
  color: #FFFFFF !important;
  font-weight: bold; }

.table.table-staging-data tbody td.validation-error,
.table.table-registration-data tbody td.validation-error {
  background-color: red;
  color: #FFFFFF !important;
  font-weight: bold; }

.table.table-staging-data tbody td.validation-warning,
.table.table-registration-data tbody td.validation-warning {
  background-color: orange;
  color: #FFFFFF !important;
  font-weight: bold; }

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

/*OVERRIDES*/
header .navbar-brand {
  padding: 0 0 0 15px; }

/* END GENERIC CONTENT STYLES */
/* START CONTENT SECTION COLOURS */
.section-padding-top-25 {
  padding-top: 25px; }

.section-padding-top-35 {
  padding-top: 35px; }

.section-padding-top-50 {
  padding-top: 50px; }

.section-padding-top-100 {
  padding-top: 100px; }

section.section-content-home {
  background: url("/images/nafda/bg-pasta.jpg") #FFFFFF no-repeat top right;
  color: #494949;
  min-height: 510px !important; }

.section-title-2 {
  position: absolute;
  bottom: 0;
  /*padding: 0;*/ }

.section-title-2 .section-title {
  /*margin-left: 0px;*/
  /*override template so we can have 2 tab headings on the one line */ }

section.section-forth {
  background-color: #D1DFD7;
  min-height: 300px;
  color: #494949; }
  section.section-forth.section-programme-brochure {
    min-height: 0px;
    height: 63px;
    background-color: #FFFFFF; }
    section.section-forth.section-programme-brochure .section-title {
      background-color: #00A64E;
      color: #FFFFFF; }

section.section-fifth {
  background-color: #ABC0B5;
  min-height: 300px;
  color: #494949; }

.standout-text {
  font-size: 26px;
  line-height: 28px; }

.standout-text-large {
  font-size: 36px;
  line-height: 38px; }

.section-title h3 {
  color: #FFF; }

.steps-icon {
  height: 66px;
  vertical-align: middle; }

.steps {
  height: 66px;
  vertical-align: middle;
  font-size: 30px;
  padding-left: 15px; }

.nolink {
  color: #00A64E; }

/* overrides */
.color-one {
  background: #494949;
  color: #FFFFFF; }

.row.no-gutters {
  margin-right: 0;
  margin-left: 0; }

.row.no-gutters > [class^="col-"],
.row.no-gutters > [class*=" col-"] {
  padding-right: 0;
  padding-left: 0; }

/* END START CONTENT SECTION COLOURS */
/* START CUSTOM PUBLIC HEADER */
.public-header-nav {
  margin-top: 20px; }

.public-header-nav ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: center; }

.public-header-nav ul li {
  display: inline;
  padding: 0 12px 0 12px;
  font-size: 16px;
  color: #FFFFFF; }

.public-header-nav ul li a {
  color: #FFFFFF; }

.public-header-nav ul li a:hover {
  color: #00A64E;
  text-decoration: none; }

/* END CUSTOM PUBLIC HEADER */
/* START CUSTOM FOOTER*/
.footer-horizontal-nav ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: center; }

.footer-horizontal-nav ul li {
  display: inline;
  padding: 0 12px 0 12px;
  font-size: 16px;
  color: #7F7F7F; }

.footer-horizontal-nav ul li a {
  color: #7F7F7F; }

.footer-horizontal-nav ul li a:hover {
  color: #FFFFFF; }

.footer-horizontal-nav .footer-nav-divider {
  border-right: 1px solid #7F7F7F; }

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

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

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

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

/* END FORMS */
/* added for mobile */
.logo-top-best {
  display: none; }

.pad-login-sml-device {
  display: none; }

.distributor-map-mobile {
  display: none; }

.distributor-map-mobile-heading {
  display: none; }

.video-fixed iframe {
  width: 500px; }

@media (max-width: 992px) {
  section.section-content-home {
    background-image: none; }
  .section-social-mobile {
    display: none; }
  .flow-right, .flow-left {
    float: none;
    width: 100%; }
  .fixed50percent {
    width: 100%;
    clear: both; } }

@media (max-width: 767px) {
  .main-banner {
    display: none; }
  .banner-section {
    /*background-image: none !important;*/
    margin: 0 auto;
    text-align: center; }
  #logoBannerToggle img {
    width: 80% !important;
    height: auto; }
  .logo-top-nafda {
    display: none; }
  .no-mobile {
    display: none; }
  .section-social-mobile {
    display: none; }
  section.section-content-home {
    background-image: none; }
  .section-title-2 {
    left: 50%;
    margin-left: -130px; }
  .section-title-mobile {
    margin: 0 auto; }
  .flow-right, .flow-left {
    float: none;
    width: 100%;
    clear: both; }
  .fixed50percent {
    width: 100%;
    clear: both; }
  .video {
    width: 100% !important; }
  .video iframe {
    width: 100% !important; }
  .logo-top-best {
    display: block; }
  .pad-login-sml-device {
    display: block;
    height: 10px; }
  .distributor-map {
    width: 100% !important;
    height: auto !important; }
  .distributor-map-linked {
    display: none; }
  .distributor-map-mobile {
    display: block; }
  .distributor-logo-header {
    width: 100%;
    height: 60px;
    text-align: center; }
  .distributor-logo-header img {
    max-height: 58px !important;
    width: auto !important; }
  .container-fluid .fixed50percent {
    width: 100%; }
  .content-flow-item.text {
    width: 100%; }
  .steps-icon {
    text-align: left; }
  .steps-text {
    text-align: left; }
  .steps-intro {
    text-align: left; }
  .steps-container {
    padding-left: 0px; } }

/* 
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
*/
/* 
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
*/
/*individual corners*/
/* 
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
*/
/* 
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
*/
/*individual corners*/
.content-table table {
  color: #494949; }

/*
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: #494949;
  color: #494949; }

/*
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: #494949; }
  .content-table.content-table-style-3 table tr:first-child td p {
    color: #494949; }

/*
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: #494949; }

/* 
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
*/
/* 
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
*/
/*individual corners*/
/* 
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
*/
/* 
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
*/
/*individual corners*/
/* START CATALOGUE LIST */
#rewards.ui-accordion {
  /* SUB-MENU */ }
  #rewards.ui-accordion h3.ui-accordion-header {
    color: #FFFFFF;
    background-color: #262626;
    font-size: 16px; }
    #rewards.ui-accordion h3.ui-accordion-header.hover {
      color: #FFFFFF;
      background-color: #00A64E; }
  #rewards.ui-accordion h3 a {
    color: #FFFFFF; }
  #rewards.ui-accordion h3:hover {
    color: #FFFFFF;
    background-color: #00A64E; }
  #rewards.ui-accordion a {
    color: #494949; }
  #rewards.ui-accordion a:hover {
    color: #FFFFFF; }
  #rewards.ui-accordion .ui-accordion-content .catalog-item-style {
    font-size: 14px; }
    #rewards.ui-accordion .ui-accordion-content .catalog-item-style:hover {
      color: #FFFFFF; }
  #rewards.ui-accordion .ui-accordion-content li {
    display: block;
    border-bottom: 1px solid #fff; }
  #rewards.ui-accordion .ui-accordion-content li:hover {
    display: block;
    color: #FFFFFF;
    background-color: #494949; }
  #rewards.ui-accordion .ui-accordion-content li a {
    display: block;
    padding: 6px 5px 6px 35px; }
  #rewards.ui-accordion .ui-accordion-content li a:hover {
    color: #FFFFFF;
    text-decoration: none; }

/*overrides*/
.product_load i {
  margin-left: -5px; }

/* END CATALOGUE LIST */
/* START REWARD DETAILS*/
.reward-disclaimer {
  font-size: 12px;
  padding-top: 20px;
  color: #A1AFA7; }

.additional-buttons {
  padding-top: 20px; }

/* END REWARD DETAILS*/
/* START SHOPPING CART AND ORDER PROCESS */
.cart-step-current {
  color: #FFFFFF;
  background-color: #00A64E; }

.cart-step-todo {
  color: #FFFFFF;
  background-color: #262626; }

.cart-step-complete {
  color: #FFFFFF;
  background-color: #262626; }

/* END SHOPPING CART AND ORDER PROCESS */
/* START ACTIVITY STATEMENT */
section.slice.activity-statement-section {
  padding: 36px 0; }
  section.slice.activity-statement-section .section-title {
    color: #FFFFFF;
    background-color: #00A64E; }
    section.slice.activity-statement-section .section-title h3 {
      color: inherit; }
    section.slice.activity-statement-section .section-title .indicator-down {
      border-top: 13px solid #00A64E; }

/* END ACTIVITY STATEMENT */
/* START CHALLENGE ITEMS  */
.challenge-row .w-box.promotion {
  color: #494949; }
  .challenge-row .w-box.promotion h2 {
    color: #494949;
    font-weight: bold; }
  .challenge-row .w-box.promotion p {
    color: #494949; }

/* END CHALLENGE ITEMS  */
/* 
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
*/
/* 
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
*/
/*individual corners*/
/* 
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
*/
/* 
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
*/
/*individual corners*/
.item-outer-container {
  /*padding: 12px;*/
  border: 1px solid #ddd; }

.bob-items .bob-item {
  /*padding: 12px;*/
  /*border: 1px solid $brochure-item-border-color;*/
  padding-bottom: 24px;
  margin: 0 auto; }
  .bob-items .bob-item .item-image-container {
    width: 210px;
    height: 222px !important;
    margin: 0 auto;
    padding: 12px 0;
    text-align: center;
    vertical-align: middle;
    display: table; }
  .bob-items .bob-item .item-image-inner-container {
    display: table-cell;
    vertical-align: middle;
    text-align: center; }
  .bob-items .bob-item .item-image {
    max-width: 200px;
    max-height: 200px; }
  .bob-items .bob-item .item-name {
    padding: 5px 12px 0px 12px;
    border-top: 1px solid #ddd;
    font-size: 15px;
    font-weight: bold;
    color: #00A64E; }
  .bob-items .bob-item .item-desc {
    padding: 5px 12px;
    font-size: 14px;
    color: #a1a1a1;
    border-bottom: 1px solid #ddd;
    /*font-style:italic;*/ }
  .bob-items .bob-item .item-details {
    /*background-color: #EAE5F7;*/
    padding: 5px 12px;
    font-size: 13px; }
  .bob-items .bob-item .item-details .carton {
    padding-right: 12px; }
  .bob-items .bob-item .item-details .unit {
    background: url("/images/nafda/icons/brochure_dot_seperator_green.png") no-repeat left -2px;
    padding-left: 18px; }
  .bob-items .bob-item .points-text {
    color: #00A64E;
    font-weight: bold; }
  .bob-items .bob-item .carton-text {
    color: #a1a1a1; }

.brochure-loading {
  padding-bottom: 30px;
  font-size: 20px;
  color: #939598;
  text-align: center; }

.page-totals-heading {
  padding-bottom: 20px;
  color: #939598;
  text-align: right; }

/* Left Nav */
.filter-title-container {
  width: 100%;
  padding-bottom: 15px;
  text-align: center; }

.filter-title-heading {
  width: 100%;
  padding: 10px;
  background-color: #00A64E;
  text-align: center;
  color: #FFFFFF; }

.arrow-down {
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 12px solid #00A64E;
  margin: 0 auto; }

.filters-list {
  color: #939598;
  /*input {
        width: 100%;
        padding: 5px;
        border: 1px solid $color-tenth-fore; 
        color: $color-tenth-fore;
    }*/ }
  .filters-list .filter {
    padding-bottom: 5px; }
  .filters-list .filter-title {
    /*padding: 12px;
        border: 1px solid;*/
    width: 100%;
    display: block;
    padding: 5px 10px;
    background-color: #D2DFD5;
    color: #939598;
    border-radius: 5px;
    font-size: 16px;
    font-weight: normal; }
  .filters-list .filter-title a {
    display: block;
    color: #939598;
    text-decoration: none; }
  .filters-list .filter-title a:hover {
    text-decoration: none;
    cursor: default; }
  .filters-list .filter-selector {
    padding: 12px; }
  .filters-list input[type=checkbox],
  .filters-list input[type="radio"] {
    margin-left: 2px;
    margin-right: 5px; }
  .filters-list button.btn:hover {
    background-color: #FFFFFF;
    border: 1px solid #D2DFD5; }

.btn-showall {
  padding-top: 6px;
  padding-left: 10px;
  color: #939598; }

.btn-showall a {
  color: #939598;
  cursor: default; }

.btn-showall a:hover {
  color: #939598;
  text-decoration: none; }

.btn-showall-btn {
  color: #939598; }

.direction-container {
  padding-top: 30px; }

.direction-container a {
  cursor: pointer;
  color: #939598; }

.btn-direction {
  width: 25px;
  height: 30px;
  vertical-align: middle;
  text-align: center; }

.direction-text {
  height: 30px;
  display: block;
  padding: 0 10px;
  vertical-align: middle;
  font-size: 16px;
  text-align: center;
  color: #939598; }

.animate-show {
  line-height: 20px;
  opacity: 1;
  padding: 10px; }

.animate-show.ng-hide-add, .animate-show.ng-hide-remove {
  transition: all linear 0.5s; }

.animate-show.ng-hide {
  line-height: 0;
  opacity: 0; }