/* device widths */
/* Umbraco managed */
/* replaces F5B2B2 and F7c1C1 */
/* from registration */
/*menu styles*/
/*footer styles*/
/*Side Bar*/
/*Benefit Quotation Date Picker*/
/*PWA*/
/*SIMPLE SIDEBAR ELEMENTS*/
/*EQUINITI BUTTONS (eq_btn)*/
/*DATATABLE ELEMETS*/
/* device widths */
/* from registration */
/*menu styles*/
/*footer styles*/
/*Side Bar*/
/*Benefit Quotation Date Picker*/
/*PWA*/
/*SIMPLE SIDEBAR ELEMENTS*/
/*EQUINITI BUTTONS (eq-btn)*/
/*Horizontal Menubar*/
/*Disclosure Table*/

/*Financial statement pages*/

.box-shadow {
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
}
/* Calendar */

@media only screen and (max-width: 767px) {
  .calendar {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .calendar button {
    margin-top: 10px;
  }
}
.calendar label {
  float: left;
  padding: 13px 0;
  width: 97px;
}
.calendar p.red {
  text-align: right;
}
.calendar .icon-calendar {
  border: 1px solid #f95602;
  float: left;
  font-size: 28px;
  padding: 7px 8px;
  color: #f95602;
  cursor: pointer;
  text-decoration: none;
}
.calendar .icon-calendar.error {
  border-left: none !important;
  border-color: #bac405;
}
.calendar input {
  border-bottom: 1px solid #f95602;
  border-top: 1px solid #f95602;
  border-right: none;
  border-left: 1px solid #f95602;
  float: left;
  font-weight: 100;
  margin-bottom: 20px;
  width: 253px;
}
.calendar input.error {
  border-right: none !important;
  border-color: #bac405;
}
.calendar .icon-arrow-down {
  color: #f95602;
  cursor: pointer;
  border: 1px solid #f95602;
  float: left;
  font-size: 10px;
  padding: 18px 14px 14px;
  width: auto;
}
.calendar-block-label .icon-calendar {
  border: 1px solid #f95602;
  font-size: 28px;
  padding: 7px 8px;
  color: #f95602;
  cursor: pointer;
  text-decoration: none;
  top: -59px;
  position: relative;
  float: right;
  background-color: white;
}
.calendar-block-label .icon-calendar.error {
  border-left: none !important;
}
/* Radio Buttons */

.radio {
  margin: 0 !important;
  padding: 0 !important;
}
.radio input[type="radio"] {
  margin: 0 !important;
  padding: 0 !important;
  float: left !important;
  height: 24px !important;
}
.radio label {
  display: block !important;
  float: left !important;
  font-weight: 300 !important;
  cursor: pointer !important;
}
.radio span.radio-container {
  clear: left;
  position: relative !important;
  float: left !important;
  margin: 0 25px 15px 0 !important;
}
@media only screen and (max-width: 450px) {
  .radio span.radio-container {
    margin: 0 10px 15px 0 !important;
  }
}
.radio span.radio-container span.radio {
  border: 3px solid #f95602 !important;
  border-radius: 1000px !important;
  display: block !important;
  height: 24px !important;
  width: 24px !important;
}
.radio span.radio-container span.radio.selected span {
  background: #f95602 !important;
  height: 12px !important;
  width: 12px !important;
  display: block !important;
  border-radius: 1000px !important;
  margin: 3px !important;
}
.radio span.radio-container input {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  opacity: 0 !important;
  filter: alpha(opacity=0) !important;
  z-index: 101 !important;
  cursor: pointer !important;
}
.radio span.radio-container input:focus + .radio {
  outline: #cccccc dotted 1px !important;
  outline-offset: 3px !important;
}
/* Buttons */

.close-it,
.switch-modeller,
.lines,
.close-contribution {
  border-top: 1px solid #f95602;
  border-bottom: 1px solid #f95602;
  color: #f95602;
  font-size: 13px;
  padding: 14px 0;
  text-align: center;
  width: 30px;
}
.close-contribution {
  padding-bottom: 13px;
}
.lines.darkgrey {
  border-top: 1px solid #505050;
  border-bottom: 1px solid #505050;
  color: #505050;
}
.switch-modeller {
  font-size: 18px;
  padding: 6px 0;
}
.show-help {
  margin-top: 10px;
}
.button-group button {
  background: #de0001;
  width: 100px;
}
.button-group button button.active {
  background: #de0001;
}
.button {
  background: #de0001;
  border: none;
  color: black;
  display: block;
  font-size: 14px;
  font-weight: 400;
  float: left;
  line-height: 14px;
  padding: 15px 10px;
  text-align: center;
}
.button:link,
.button:visited {
  color: black;
  text-decoration: none;
}
.button:hover,
.button:active {
  background: #de0001;
  color: white;
  text-decoration: none;
}
.button:focus {
  outline: #b2b2b2 dotted 1px;
  outline-offset: 3px;
}
.button.grey {
  background: #de0001;
}
.button.grey:hover {
  background: #de0001;
  color: white;
}
.button.darkgrey {
  background: #de0001;
}
.button.darkgrey:hover {
  background: #de0001;
}
.button.linetwo {
  padding: 8px 15px;
}
.button.long {
  width: 160px;
}
/* Spinner */

.spinner {
  float: left;
  margin-bottom: 20px;
  margin-right: 2%;
  position: relative;
  text-align: center;
  width: 120px;
}
.spinner:last-of-type {
  margin-right: 0;
}
.spinner p {
  font-size: 15px;
  margin-bottom: 5px;
}
.spinner span {
  font-size: 26px;
}
.spinner a {
  display: none;
}
.spinner a.active {
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.8);
}
/* Slider */

.slider-container > div {
  display: none;
}
.ui-slider {
  border: 3px solid rgba(255, 255, 255, 0);
  border-radius: 20px;
  float: left;
  height: 18px;
  margin: 11px 0 0 0;
  position: relative;
  text-align: left;
  width: 80%;
}
@media only screen and (max-width: 400px) {
  .ui-slider {
    width: 70%;
  }
}
.ui-slider:focus {
  outline: #cccccc dotted 1px;
  outline-offset: 10px;
}
.ui-slider .ui-slider-handle {
  -ms-touch-action: none;
  touch-action: none;
  background: white;
  border: 3px solid #de0001;
  border-radius: 100px;
  height: 28px;
  margin-left: -14px;
  position: absolute;
  width: 28px;
  top: -8px;
  z-index: 2;
}
.ui-slider .ui-slider-handle:focus {
  outline: #b2b2b2 dotted 1px;
  outline-offset: 3px;
}
.ui-slider .ui-slider-range {
  background: white;
  height: inherit;
  border-radius: inherit;
  margin-top: -1px;
  margin-left: -1px;
}
.ui-slider.darkgrey {
  border: 3px solid #505050;
}
.ui-slider.darkgrey .ui-slider-handle {
  border: 3px solid #505050;
}
.ui-slider.darkgrey .ui-slider-range {
  background: #505050;
}
.minus {
  font-size: 2px;
  margin-right: 20px;
  padding: 20px 0 19px;
}
.plus,
.minus {
  width: 5%;
}
.plus:active,
.minus:active,
.plus:focus,
.minus:focus,
.plus:hover,
.minus:hover {
  color: #f95602;
  text-decoration: none;
}
@media only screen and (max-width: 400px) {
  .plus,
  .minus {
    width: 10%;
  }
}
.minus {
  margin-right: 5%;
}
.plus {
  margin-left: 5%;
}
/* Bar Chart */

#benefit-bar,
#pension-bar {
  margin: 37px 0 0 25px;
}
#pensions-bar-mobile {
  float: left;
  padding: 10px;
  margin-left: 20px;
}
.graphLabelbenefit-bar,
.graphLabelpension-bar {
  margin-top: 20px;
  font-size: 15px;
}
.graphValuebenefit-bar,
.graphValuebenefit-bar-mobile,
.graphValuepension-bar,
.graphValuepensions-bar-mobile {
  background: #666666;
  border-radius: 5px;
  /* TODO: this is hard-coded due to bug - FIX!! */
  color: white;
  font-size: 22px;
  font-weight: 400;
  left: -12px;
  padding: 8px 16px;
  position: absolute;
  z-index: 2;
  top: -18px;
}
@media only screen and (max-width: 768px) {
  .graphValuebenefit-bar,
  .graphValuebenefit-bar-mobile,
  .graphValuepension-bar,
  .graphValuepensions-bar-mobile {
    font-size: 16px;
  }
}
.graphValuebenefit-bar:after,
.graphValuebenefit-bar-mobile:after,
.graphValuepension-bar:after,
.graphValuepensions-bar-mobile:after {
  background: #666666;
  border-radius: 5px;
  content: '';
  height: 30px;
  position: absolute;
  right: -13px;
  top: 4px;
  width: 30px;
  z-index: 1;
  -ms-transform: rotate(45deg);
  /* IE 9 */
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.graphValuepensions-bar-mobile:after {
  height: 25px;
  right: -9px;
  top: 3px;
  width: 25px;
}
.graphValuepension-bar:after {
  right: -12px;
  top: 5px;
}
.graphValuebenefit-bar span,
.graphValuebenefit-bar-mobile span,
.graphValuepension-bar span,
.graphValuepensions-bar-mobile span {
  position: relative;
  z-index: 2;
}
/* Doughnut Chart */

.doughnut-chart.left {
  margin-right: 20px;
}
.doughnut-chart {
  max-height: 300px;
  max-width: 300px;
  margin: 10px auto 10px auto;
}
@media only screen and (max-width: 768px) {
  .doughnut-chart {
    display: block;
  }
}
@media only screen and (max-width: 400px) {
  .doughnut-chart {
    width: 200px !important;
    height: 200px !important;
  }
}
/* Modal Window */

.window-mask {
  background: rgba(255, 255, 255, 0.75);
  display: none;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
}
.window-mask .window-container {
  display: table;
  height: 100%;
  margin: 0 auto;
  width: 100%;
  max-width: 800px;
}
.window-mask .window-container .close-window {
  text-decoration: none;
}
.window-mask .window-vertical {
  display: table-cell;
  vertical-align: middle;
}
.window-mask .window {
  background: white;
  padding: 15px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
}
.window-mask h3 {
  float: left;
  width: 90%;
}
.window-mask .lines {
  padding: 12px 0 13px;
}
.window-mask table {
  margin-bottom: 25px;
}
.window-mask p {
  margin: 0 0 3px 0;
}
.window-mask input {
  border-color: #f95602;
}
.window-mask small {
  margin-top: 28px;
}
.window-mask button {
  margin-left: 15px;
  width: 140px;
  background: #ce1126;
  color: black;
}
.window-mask button:hover {
  background: #ce1126;
  color: black;
}
.window table {
  font-size: 16px;
  width: 100%;
}
.window table th {
  background: #f95602;
  border-bottom: 2px solid white;
  border-right: 2px solid white;
  color: white;
  font-weight: 300;
  padding: 10px;
}
.window table th:last-child {
  border-right: none;
}
.window table tr:nth-child(odd) td {
  background: #f6f6f6;
}
.window table td {
  background: #fdfdfd;
  color: #4f2170;
}
.styled-select {
  overflow: hidden;
  position: relative;
  margin-bottom: 20px;
}
.styled-select select,
.styled-select .ui-selectmenu-button {
  width: 115%;
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 0;
  z-index: 100;
  position: relative;
  height: 40px;
  font-size: 16px;
  background: transparent;
  padding: 5px 0 5px 5px;
  color: #4f2170;
  border-width: 1px;
  border: 1px solid darkgray;
  overflow: visible;
  -ms-text-overflow: inherit;
  -o-text-overflow: inherit;
  text-overflow: inherit;
  line-height: 1.5;
}
.styled-select select[disabled],
.styled-select .ui-selectmenu-button[disabled] {
  opacity: 0.3;
}
.styled-select select[disabled] + span,
.styled-select .ui-selectmenu-button[disabled] + span {
  opacity: 0.3;
}
.styled-select select:focus,
.styled-select .ui-selectmenu-button:focus {
  border-color: #f95602;
}
.styled-select select:focus + span,
.styled-select .ui-selectmenu-button:focus + span {
  border-color: #f95602;
}
.styled-select select::-ms-expand,
.styled-select .ui-selectmenu-button::-ms-expand {
  display: none;
}
.styled-select option {
  color: #f95602;
  border-right: 1px solid #cccccc;
  -webkit-appearance: none;
}
.styled-select span {
  width: 40px;
  height: 40px;
  border: 1px solid darkgray;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  color: #f95602;
  text-align: center;
}
.styled-select span:before {
  font-size: 12px;
  display: block;
  position: absolute;
  width: 100%;
  text-align: center;
  top: 50%;
  margin-top: -6px;
}
#regLoader {
  display: none;
  position: absolute;
  background: white;
  background: rgba(255, 255, 255, 0.6);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10000;
  text-align: center;
}
#regLoader .loading {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -25px;
  margin-left: -25px;
}
.styleModellerBar {
  background-color: #f95602;
}
.styleModellerBar2 {
  background-color: #c64502;
}
.styleModellerBar3 {
  background-color: #943301;
}
.styleModellerBar4 {
  background-color: #612201;
}
.styleModellerBar5 {
  background-color: #2f1000;
}
.styleModellerBar6 {
  background-color: black;
}
/* error message for Trans History, to match Your Documents (but uses jQuery, using validation-summary-errors */

.validation-summary-errors li {
  list-style-type: none;
}
.modal-content {
  background: white;
}
.btn-default {
  background: #de0001;
  border: none;
  color: black;
  display: block;
  font-size: 14px;
  font-weight: 400;
  float: left;
  line-height: 14px;
  padding: 15px 10px;
  text-align: center;
  float: right;
  /*color: #FFF;
    background-color:   @brand-primary;
    border-color: #cccccc;*/

}
.btn-default:link,
.btn-default:visited {
  color: black;
  text-decoration: none;
}
.btn-default:hover,
.btn-default:active {
  background: #de0001;
  color: white;
  text-decoration: none;
}
.btn-default:focus {
  outline: #b2b2b2 dotted 1px;
  outline-offset: 3px;
}
.btn-default.grey {
  background: #de0001;
}
.btn-default.grey:hover {
  background: #de0001;
  color: white;
}
.btn-default.darkgrey {
  background: #de0001;
}
.btn-default.darkgrey:hover {
  background: #de0001;
}
.btn-default.linetwo {
  padding: 8px 15px;
}
.btn-default.long {
  width: 160px;
}
.btn-default:link,
.btn-default:visited {
  color: black;
  text-decoration: none;
}
.btn-default:hover,
.btn-default:active {
  background: #de0001;
  color: white;
  text-decoration: none;
}
.btn-default:focus {
  outline: #b2b2b2 dotted 1px;
  outline-offset: 3px;
}
.btn-default.grey {
  background: #de0001;
}
.btn-default.grey:hover {
  background: #de0001;
  color: white;
}
.btn-default.darkgrey {
  background: #de0001;
}
.btn-default.darkgrey:hover {
  background: #de0001;
}
.btn-default.linetwo {
  padding: 8px 15px;
}
.btn-default.long {
  width: 160px;
}
/* TODO: some colours are defined in jquery-ui-datepicker.less, those should go here */

.ui-widget-header {
  background-color: #f95602;
}
/*_reset.less*/

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
address,
big,
cite,
code,
em,
img,
small,
strike,
strong,
sub,
sup,
tt,
var,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  background: transparent;
  border: 0;
  font-size: 100%;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
:focus {
  outline: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
hgroup,
header,
section,
footer,
aside,
nav,
article,
figure {
  display: block;
}
/* Slider */

.slick-slider {
  position: relative;
  display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}
.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
}
.slick-track:before,
.slick-track:after {
  display: table;
  content: '';
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}
.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}
[dir='rtl'] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
.slick-loading .slick-list {
  background: white url('../images/ajax-loader.gif') center center no-repeat;
}
/* Arrows */

.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  display: block;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  padding: 0;
  cursor: pointer;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  color: transparent;
  outline: none;
  background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}
.slick-prev:before,
.slick-next:before {
  font-family: 'equiniti';
  font-size: 20px;
  line-height: 1;
  opacity: 0.5;
  color: black;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-prev {
  left: 10px;
}
[dir='rtl'] .slick-prev {
  right: 10px;
  left: auto;
}
.slick-prev:before {
  content: '\e602';
}
[dir='rtl'] .slick-prev:before {
  content: '\e603';
}
.slick-next {
  right: 10px;
}
[dir='rtl'] .slick-next {
  right: auto;
  left: 10px;
}
.slick-next:before {
  content: '\e603';
}
[dir='rtl'] .slick-next:before {
  content: '\e602';
}
.slick-dots {
  position: absolute;
  bottom: -45px;
  display: block;
  width: 100%;
  padding: 0;
  list-style: none;
  text-align: center;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 20px;
  height: 20px;
  padding: 5px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  font-family: 'slick';
  font-size: 6px;
  line-height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  content: '•';
  text-align: center;
  opacity: 0.25;
  color: black;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
  opacity: 0.75;
  color: black;
}
@font-face {
  font-family: "MSSCustomWebFont";
  src: url('[]') format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'equiniti';
  src: url('../fonts/equiniti.eot');
  src: url('../fonts/equiniti.eot?#iefix') format('embedded-opentype'), url('../fonts/equiniti.woff') format('woff'), url('../fonts/equiniti.ttf') format('truetype'), url('../fonts/equiniti.svg#equiniti') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"],
[class*=" icon-"] {
  font-family: 'equiniti';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: none;
}
.icon-calendar:before {
  content: "\e600";
}
.icon-chev-down:before {
  content: "\e601";
}
.icon-chev-left:before {
  content: "\e602";
}
.icon-chev-right:before {
  content: "\e603";
}
.icon-chev-up:before {
  content: "\e604";
}
.icon-contribution-increase:before {
  content: "\e605";
}
.icon-download:before {
  content: "\e606";
}
.icon-folder-closed:before {
  content: "\e619";
}
.icon-folder-open:before {
  content: "\e61a";
}
.icon-help:before {
  content: "\e61b";
}
.icon-information:before {
  content: "\e61c";
}
.icon-mobile-menu-2:before {
  content: "\e61d";
}
.icon-pdf-red .path1:before {
  content: "\e61e";
  color: #e34a47;
}
.icon-pdf-red .path2:before {
  content: "\e61f";
  margin-left: -1em;
  color: white;
}
.icon-pdf-red .path3:before {
  content: "\e620";
  margin-left: -1em;
  color: white;
}
.icon-pdf-red .path4:before {
  content: "\e621";
  margin-left: -1em;
  color: #b53b38;
}
.icon-pdf:before {
  content: "\e622";
}
.icon-records:before {
  content: "\e623";
}
.icon-caret-down:before {
  content: "\e624";
}
.icon-caret-left:before {
  content: "\e625";
}
.icon-caret-right:before {
  content: "\e626";
}
.icon-caret-up:before {
  content: "\e627";
}
.icon-documents:before {
  content: "\e628";
}
.icon-investment:before {
  content: "\e629";
}
.icon-balances:before {
  content: "\e62a";
}
.icon-details:before {
  content: "\e62b";
}
.icon-wheel:before {
  content: "\e62c";
}
.icon-history:before {
  content: "\e62d";
}
.icon-scheme:before {
  content: "\e62e";
}
.icon-news:before {
  content: "\e62f";
}
.icon-home:before {
  content: "\e630";
}
.icon-perforamance:before {
  content: "\e631";
}
.icon-feedback:before {
  content: "\e632";
}
.icon-faqs:before {
  content: "\e633";
}
.icon-contacts:before {
  content: "\e634";
}
.icon-cog:before {
  content: "\e635";
}
.icon-benefits:before {
  content: "\e637";
}
.icon-benefits2:before {
  content: "\e638";
}
.icon-arrow-up:before {
  content: "\e639";
}
.icon-arrow-right:before {
  content: "\e63a";
}
.icon-arrow-left:before {
  content: "\e63b";
}
.icon-arrow-down:before {
  content: "\e63c";
}
.icon-close:before {
  content: "\e63d";
}
.icon-minus:before {
  content: "\e63e";
}
.icon-mobile-menu:before {
  content: "\e63f";
}
.icon-plus:before {
  content: "\e640";
}
.icon-drawdown:before {
  content: "\e700";
}
.icon-drawdown2:before {
  content: "\e701";
}
.icon-dot:before {
  content: "\e702";
}
.icon-rotate:before {
  content: "\e703";
}
.icon-data-sheet:before {
  content: "\e900";
}
.icon-benefits-quotations:before {
  content: "\e901";
}
@import once 'variables-default.less';
::selection {
  background: #00b7c6;
  /* Safari */

}
::-moz-selection {
  background: #00b7c6;
  /* Firefox */

}
body {
  padding-top: 163px;
}


body {
  font-family: Arial;
}

body {
  height: 100%;
  background: white;
  font-size: 16px;
  font-weight: 300;
  margin: 0;
  padding: 0;
  text-align: left;
  min-width: 320px;
}
body.body-with-sidebar {
  background: white;
}
body.card-layout-body {
  margin-top: 0;
}
@media (min-width: 992px) {
  body {
    margin: 20px 0;
  }
  body.body-with-sidebar {
    margin: 0;
  }
}
@media only screen and (max-width: 767px) {
  body.card-layout-body {
    margin-top: 0px;
  }
}
.card-layout-body .body {
  margin-top: 64px;
}
@media (max-width: 767px) {
  .card-layout-body .body {
    margin-top: 57px;
  }
}
@media (max-width: 767px) {
  body .container {
    max-width: 100%;
  }
}
.clearfix {
  display: block;
}
.clearfix:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
html[xmlns] .clearfix {
  display: block;
}
* html .clearfix {
  height: 1%;
}
.visually-hidden {
  top: auto;
  width: 1px;
  height: 1px;
  left: -10000px;
  overflow: hidden;
  position: absolute;
}
a .visually-hidden {
  position: absolute;
  text-indent: -1000%;
}
h1 {
  border-bottom: 1px solid #f95602;
  font-size: 34px;
  padding-bottom: 6px;
}
h1 span {
  font-size: 27px;
  margin-right: 20px;
}
h1 small {
  color: #4f2170;
  font-size: 16px;
  float: right;
  font-weight: 100;
  margin-top: 22px;
}
h1.help {
  float: left;
  margin-bottom: 20px;
  width: 783px;
}
h2 {
  border-bottom: 1px solid #f95602;
  font-size: 26px;
  padding-bottom: 6px;
}
h3,
.h3 {
  border-bottom: 1px solid #f95602;
  font-size: 22px;
  padding-bottom: 6px;
}
h3 small,
.h3 small {
  color: #4f2170;
  font-size: 14px;
  float: right;
  font-weight: 100;
  text-align: right;
}
h3 div,
.h3 div {
  float: left;
  margin-bottom: -5px;
}
h3 div small,
.h3 div small {
  padding: 5px 0 0 12px;
}
h3 div small a,
.h3 div small a {
  text-decoration: none !important;
}
h3.switch,
.h3.switch {
  float: left;
  margin-bottom: 10px;
  width: 100%;
  font-size: 20px;
  padding-bottom: 8px;
}
h3.switch.extended,
.h3.switch.extended {
  width: 95%;
}
h3.contribution,
.h3.contribution {
  float: left;
  margin-bottom: 40px;
  width: 95%;
  padding-bottom: 8px;
}
@media only screen and (max-width: 768px) {
  h3.contribution,
  .h3.contribution {
    width: 88%;
  }
}
@media only screen and (max-width: 480px) {
  h3.contribution,
  .h3.contribution {
    padding-bottom: 11px;
    margin-bottom: 20px;
    width: 87%;
  }
}
h3.contribution small,
.h3.contribution small {
  margin-top: 13px;
}
h3 span,
.h3 span {
  font-size: 20px;
  margin-right: 10px;
}
h3 sup,
.h3 sup {
  color: #f95602;
  font-size: 12px;
  top: -1em;
}
h3 .right,
.h3 .right {
  margin-top: 8px;
}
h4,
.h4 {
  font-size: 20px;
}
h5,
.h5 {
  font-size: 18px;
}
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5 {
  font-weight: 300;
  line-height: normal;
  margin-bottom: 10px;
}
h1 span,
h2 span,
h3 span,
h4 span,
h5 span,
button span {
  color: #de0001;
}
.banner-heading .page-title {
  color: white;
}
.banner-heading.help {
  color: white;
  border-bottom: 0;
  float: left;
}
.banner-heading small {
  color: #4f2170;
  font-size: 16px;
  float: right;
  font-weight: 100;
  margin-top: 22px;
}
.banner-heading span.page-icon {
  color: white !important;
}
@media (max-width: 767px) {
  h1 {
    font-size: 22px;
    padding-bottom: 6px;
  }
  h1 small {
    display: none;
  }
  h1 span {
    font-size: 20px;
    margin-right: 8px;
  }
  h3,
  .h3 {
    font-size: 22px;
    padding-bottom: 6px;
  }
  h3 span,
  .h3 span {
    font-size: 20px;
    margin-right: 8px;
  }
  header h1 {
    background: no-repeat;
    background-size: cover;
    height: 16px;
    margin-top: 2px;
    width: 205px;
  }
  h1.help {
    width: 86%;
    margin-bottom: 0;
  }
  .body {
    margin: 10px 0 30px 0;
  }
  .benefit-overview .col-sm-6.dark-grey {
    margin-bottom: 20px;
    padding-left: 0;
  }
  .benefit-overview .col-sm-6.dark-grey h3,
  .benefit-overview .col-sm-6.dark-grey .h3 {
    float: left;
    font-size: 16px;
    margin: 0 20px 0 0;
    width: 50%;
  }
  .benefit-overview h3,
  .benefit-overview .h3 {
    line-height: 18px;
  }
  .benefit-overview h2.subheader {
    font-size: 30px;
  }
  .benefit-overview .col-sm-6.light-grey h3 {
    font-size: 24px;
  }
  .fund-value {
    margin-bottom: 10px;
    margin-top: -5px;
  }
  .fund-value h3,
  .fund-value .h3 {
    font-size: 16px;
    float: left;
    margin: 0 10px 0 0;
  }
  .fund-value h2.subheader {
    font-size: 22px;
    float: left;
    line-height: 19px;
  }
  .fund-performance .available-handler h5 {
    padding: 5px 0;
  }
  #all-available-performance-funds .available-handler h5 {
    padding: 5px 0;
  }
  .window-mask .window {
    margin: 0 auto;
    width: 95%;
  }
  .window-mask .window h3 {
    font-size: 15px;
    width: 85%;
  }
  .window-mask small {
    margin-top: 16px;
  }
  h3.switch,
  .h3.switch {
    width: 88%;
  }
  h3.switch.extended {
    width: 88%;
  }
  .viewpoint.model h3 small {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 992px) {
  h1.help {
    width: 680px;
  }
  .benefits-modeller-overview h3,
  .benefits-modeller-overview .h3 {
    font-size: 15px;
  }
  .benefits-modeller-overview h4,
  .benefits-modeller-overview .h4 {
    font-size: 32px;
  }
  h3.switch,
  .h3.switch {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1050px) {
  h1.help {
    width: 738px;
  }
  h2.switch,
  .h2.switch {
    width: 362px;
  }
}
@media (min-device-pixel-ratio: 2) {
  header h1 {
    background: no-repeat;
    background-size: cover;
  }
  footer h5 {
    background: no-repeat;
    background-size: cover;
    width: 84px;
  }
}
@media (min-resolution: 192dpi) {
  header h1 {
    background: no-repeat;
    background-size: cover;
  }
  footer h5 {
    background: no-repeat;
    background-size: cover;
    width: 84px;
  }
}
@media (min-device-pixel-ratio: 2) and (max-width: 767px) {
  header h1 {
    background: no-repeat;
    background-size: cover;
    height: 16px;
    margin-top: 2px;
    width: 205px;
  }
}
@media (min-resolution: 192dpi) and (max-width: 767px) {
  header h1 {
    background: no-repeat;
    background-size: cover;
    height: 16px;
    margin-top: 2px;
    width: 205px;
  }
}
@media (max-width: 760px) {
  .benefits-modeller-overview h3 {
    font-size: 12px;
  }
  .benefits-modeller-overview.help {
    color: white;
    border-bottom: 0;
    float: left;
    max-width: 750px;
  }
  .benefits-modeller-overview h4,
  .benefits-modeller-overview .h4 {
    font-size: 20px;
    line-height: 16px;
  }
}
h1 span.page-title,
.h1 span.page-title,
h2 span.page-title,
.h2 span.page-title,
h3 span.page-title,
.h3 span.page-title,
h4 span.page-title,
.h4 span.page-title,
h5 span.page-title,
.h5 span.page-title,
h6 span.page-title,
.h6 span.page-title {
  font-size: 34px;
  margin-right: 20px;
  color: #de0001;
}
@media (max-width: 767px) {
  h1 span.page-title,
  .h1 span.page-title,
  h2 span.page-title,
  .h2 span.page-title,
  h3 span.page-title,
  .h3 span.page-title,
  h4 span.page-title,
  .h4 span.page-title,
  h5 span.page-title,
  .h5 span.page-title,
  h6 span.page-title,
  .h6 span.page-title {
    font-size: 22px;
  }
}
@import once 'variables-default.less';
.p30 {
  padding: 30px;
}
.px5 {
  padding-left: 5px;
  padding-right: 5px;
}
.px15 {
  padding-left: 15px;
  padding-right: 15px;
}
.p30-xs {
  padding: 30px;
}
.px5-xs {
  padding-left: 5px;
  padding-right: 5px;
}
.px15-xs {
  padding-left: 15px;
  padding-right: 15px;
}
.p-50 {
  padding: 50px;
}
.p-50-xs {
  padding: 50px;
}
.p-100 {
  padding: 100px;
}
.p-100-xs {
  padding: 100px;
}
@media only screen and (min-width: 768px) {
  .p30-sm {
    padding: 30px;
  }
  .px5-sm {
    padding-left: 5px;
    padding-right: 5px;
  }
  .px15-sm {
    padding-left: 15px;
    padding-right: 15px;
  }
  .p-100-sm {
    padding: 100px;
  }
}
@media only screen and (min-width: 992px) {
  .p30-md {
    padding: 30px;
  }
  .px5-md {
    padding-left: 5px;
    padding-right: 5px;
  }
  .px15-md {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 1050px) {
  .p30-lg {
    padding: 30px;
  }
  .px5-lg {
    padding-left: 5px;
    padding-right: 5px;
  }
  .px15-lg {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.radio {
  margin: 0 !important;
  padding: 0 !important;
}
.radio input[type="radio"] {
  margin: 0 !important;
  padding: 0 !important;
  float: left !important;
  height: 24px !important;
}
.radio label {
  display: block !important;
  float: left !important;
  font-weight: 300 !important;
  cursor: pointer !important;
}
.radio span.radio-container {
  clear: left;
  position: relative !important;
  float: left !important;
  margin: 0 25px 15px 0 !important;
}
@media only screen and (max-width: 450px) {
  .radio span.radio-container {
    margin: 0 10px 15px 0 !important;
  }
}
.radio span.radio-container span.radio {
  border: 3px solid #f95602 !important;
  border-radius: 1000px !important;
  display: block !important;
  height: 24px !important;
  width: 24px !important;
}
.radio span.radio-container span.radio.selected span {
  background: #ce1126 !important;
  height: 12px !important;
  width: 12px !important;
  display: block !important;
  border-radius: 1000px !important;
  margin: 3px !important;
}
.radio span.radio-container input {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  opacity: 0 !important;
  filter: alpha(opacity=0) !important;
  z-index: 101 !important;
  cursor: pointer !important;
}
.radio span.radio-container input:focus + .radio {
  outline: #cccccc dotted 1px !important;
  outline-offset: 3px !important;
}
input.radio-check {
  display: none;
}
input.radio-check:empty {
  margin-left: -1000px;
}
input.radio-check:empty + label {
  position: relative;
  line-height: 34px;
  text-indent: 3.25em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin-right: 15px;
}
input.radio-check:empty + label:before {
  position: absolute;
  display: inline-block;
  top: 0;
  bottom: 0;
  left: 0;
  content: '';
  width: 34px;
  height: 100%;
  background: #d1d3d4;
}
input.radio-check:checked + label:before {
  content: '\2714';
  text-indent: 0px;
  position: absolute;
  left: 0;
  color: black;
  background-color: #ce1126;
}
input.radio-check:hover:not(:checked) + label:before {
  content: '\2714';
  text-indent: 0px;
  color: #c2c2c2;
}
input.radio-check:focus + label:before {
  box-shadow: 0 0 0 3px #999999;
}
.no-border {
  border: none;
}
@import once 'variables-default.less';
a {
  color: #f95602;
  outline: 0;
}
a img {
  border: 0;
  text-decoration: none;
}
a:hover,
a.active,
a:focus {
  color: #f95602;
  text-decoration: underline;
}
a.close-it:hover,
a.add-fund:hover,
a.remove-fund:hover,
a.show-help:hover,
a.year-control-prev:hover,
a.year-control-next:hover,
a.close-contribution:hover {
  text-decoration: none;
  color: #f95602;
}
a.close-it:focus,
a.add-fund:focus,
a.remove-fund:focus,
a.show-help:focus,
a.year-control-prev:hover,
a.year-control-next:hover,
a.close-contribution:focus {
  text-decoration: none;
  color: #f95602;
}
@import once 'variables-default.less';
p {
  line-height: 22px;
  margin-bottom: 15px;
}
p strong {
  font-weight: 700;
}
p small {
  font-size: 12px;
}
p em,
p i {
  font-style: italic;
}
p sup {
  top: -8px !important;
  color: black;
  font-size: 12px;
}
sup {
  top: -8px !important;
  color: black;
  font-size: 12px;
}
@import once 'variables-default.less';
ul {
  list-style: outside disc;
  margin: 5px 0 10px 20px;
}
ol {
  list-style: outside decimal;
  margin: 5px 0 10px 20px;
}
li {
  color: #f95602;
  line-height: 18px;
  margin-bottom: 12px;
}
li:last-child {
  margin-bottom: 0;
}
li span {
  color: #4f2170;
}
li a {
  color: black;
  text-decoration: underline;
}
li sup {
  color: #f95602;
  top: -8px;
  font-size: 12px;
}
form {
  width: 100%;
}
.box {
  position: relative;
  padding: 0;
}
.box i {
  display: block;
  text-align: center;
}
.box .box__input {
  text-align: center;
  color: rgba(0, 0, 0, 0.5);
}
.box .btn {
  margin-top: 40px;
  display: none;
}
.box.is-uploading,
.box.is-success,
.box.is-error {
  padding: 0;
  outline: 0;
  outline-offset: 0;
}
.box .box__dragndrop {
  display: none;
}
.box.has-advanced-upload {
  position: relative;
  padding: 100px 20px 60px;
  outline: 2px dashed rgba(0, 0, 0, 0.5);
  outline-offset: -20px;
  transition: outline-offset ease 0.3s;
}
.box.has-advanced-upload.is-dragover {
  color: #0099ff;
  outline: 2px solid #0099ff;
  outline-offset: 0;
  box-shadow: 0 0 10px;
  transition: outline-offset 0.3s ease 0s, box-shadow 0s ease 0.2s;
}
.box.has-advanced-upload.is-dragover .box__input {
  color: #0099ff;
}
.box.has-advanced-upload i {
  display: block;
  text-align: center;
}
.box.has-advanced-upload .box__input {
  text-align: center;
  color: rgba(0, 0, 0, 0.5);
}
.box.has-advanced-upload .btn {
  margin-top: 40px;
  display: none;
}
.box.has-advanced-upload.is-uploading,
.box.has-advanced-upload.is-success,
.box.has-advanced-upload.is-error {
  padding: 0;
  outline: 0;
  outline-offset: 0;
}
.box.has-advanced-upload .box__dragndrop {
  display: inline-block;
}
.box__file {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}
.box__file + .h1 + label {
  cursor: pointer;
  display: block;
}
.box__file + .h1 + label:hover {
  text-decoration: underline;
}
.box__dragndrop,
.box__uploading,
.box__success,
.box__error {
  display: none;
}
.box.is-uploading .box__input,
.box.is-success .box__input,
.box.is-error .box__input {
  display: none;
}
.box.is-uploading .box__uploading,
.box.is-success .box__success,
.box.is-error .box__error,
#data-updated.is-uploading .box__uploading,
#data-updated.is-success .box__success,
#data-updated.is-error .box__error {
  display: block !important;
}
.is-uploading #loader {
  margin-top: 50px;
}
.is-success .checkmark {
  box-shadow: inset 0px 0px 0px #7ac142;
  animation: fill-success 0.4s ease-in-out 0.4s forwards, scale 0.3s ease-in-out 0.9s both;
}
.is-success .checkmark__circle {
  stroke: #7ac142;
}
.is-error .checkmark {
  box-shadow: inset 0px 0px 0px red;
  animation: fill-error 0.4s ease-in-out 0.4s forwards, scale 0.3s ease-in-out 0.9s both;
}
.is-error .checkmark__circle {
  stroke: red;
}
.checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  fill: none;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}
.checkmark {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: white;
  stroke-miterlimit: 10;
  margin: auto;
}
.checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .checkmark__check {
    stroke-dashoffset: 0;
  }
}
@keyframes stroke {
  100% {
    stroke-dashoffset: 0px;
  }
}
@keyframes scale {
  0%, 100% {
    transform: none;
  }
  50% {
    transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill-success {
  100% {
    box-shadow: inset 0px 0px 0px 30px #7ac142;
  }
}
@keyframes fill-error {
  100% {
    box-shadow: inset 0px 0px 0px 30px red;
  }
}
#fancyTabWidget .container {
  margin-top: 160px;
}
#fancyTabWidget h1,
#fancyTabWidget .h1,
#fancyTabWidget h2,
#fancyTabWidget .h2,
#fancyTabWidget h3,
#fancyTabWidget .h3,
#fancyTabWidget h4,
#fancyTabWidget .h4,
#fancyTabWidget h5,
#fancyTabWidget .h5,
#fancyTabWidget h6,
#fancyTabWidget .h6 {
  font-weight: 700;
}
#fancyTabWidget .fancyTab {
  text-align: center;
  padding: 0 0 20px 0;
  background-color: #eeeeee;
  box-shadow: 0 0 0 1px #dddddd;
  top: 15px;
  transition: top 0.2s;
  transition: all 200ms;
  width: 50%;
}
#fancyTabWidget .fancyTab.active {
  top: 0;
  transition: top 0.2s;
  padding: 7px 0 15px 0;
}
#fancyTabWidget .whiteBlock {
  display: none;
}
#fancyTabWidget .fancyTab.active .whiteBlock {
  display: block;
  height: 2px;
  bottom: -2px;
  background-color: white;
  width: 99%;
  position: absolute;
  z-index: 1;
}
#fancyTabWidget .fancyTab a {
  font-size: 1.25em;
  font-weight: 300;
  transition: 0.2s;
  color: #333333;
  text-decoration: none;
}
#fancyTabWidget .fancyTabs {
  border-bottom: 2px solid #dddddd;
  margin: 0px 0 0px;
}
#fancyTabWidget li.fancyTab a {
  padding-top: 15px;
  top: -15px;
  padding-bottom: 0;
}
#fancyTabWidget li.fancyTab.active a {
  padding-top: inherit;
}
#fancyTabWidget .fancyTab .fa {
  font-size: 40px;
  width: 100%;
  padding: 15px 0 5px;
  color: #666666;
}
#fancyTabWidget .fancyTab.active .fa {
  color: #ce1126;
}
#fancyTabWidget .fancyTab a:focus {
  outline: none;
}
#fancyTabWidget ul {
  margin: 0;
}
#fancyTabWidget ul > li {
  position: relative;
}
#fancyTabWidget .fancyTabContent {
  border-color: transparent;
  box-shadow: 0 -2px 0 -1px white, 0 0 0 1px #dddddd;
  padding: 0px 10px 15px;
  position: relative;
  background-color: white;
  font-family: unset !important;
  transition: all 300ms ease-in-out;
}
#fancyTabWidget .nav-tabs > li.fancyTab.active > a,
#fancyTabWidget .nav-tabs > li.fancyTab.active > a:focus,
#fancyTabWidget .nav-tabs > li.fancyTab.active > a:hover {
  border-width: 0;
}
#fancyTabWidget .nav-tabs > li.fancyTab:hover {
  background-color: #f9f9f9;
  box-shadow: 0 0 0 1px #dddddd;
  cursor: pointer;
}
#fancyTabWidget .nav-tabs > li.fancyTab.active:hover {
  background-color: white;
  box-shadow: 1px 0px 0 1px white, 0 0px 0 1px #dddddd, -1px 1px 0 0px #dddddd inset;
  cursor: default;
}
#fancyTabWidget .nav-tabs > li.fancyTab:hover a {
  border-color: transparent;
}
#fancyTabWidget .nav.nav-tabs .fancyTab a[data-toggle="tab"] {
  background-color: transparent;
  border-bottom: 0;
}
#fancyTabWidget .nav-tabs > li.fancyTab:hover a {
  border-right: 1px solid transparent;
}
#fancyTabWidget .nav-tabs > li.fancyTab > a {
  margin-right: 0;
  border-top: 0;
  padding-bottom: 30px;
  margin-bottom: -30px;
}
#fancyTabWidget .nav-tabs > li.fancyTab {
  margin-right: 0;
  margin-bottom: 0;
}
#fancyTabWidget .nav-tabs > li.fancyTab:last-child a {
  border-right: 1px solid transparent;
}
#fancyTabWidget .nav-tabs > li.fancyTab.active:last-child {
  border-right: 0px solid #dddddd;
  box-shadow: 0px 2px 0 0px white, 0px 0px 0 1px #dddddd;
}
#fancyTabWidget .fancyTab:last-child {
  box-shadow: 0 0 0 1px #dddddd;
}
#fancyTabWidget .tabs .nav-tabs li.fancyTab.active a {
  box-shadow: none;
  top: 0;
}
#fancyTabWidget .tab-pane.active {
  opacity: 1;
  -webkit-animation: fadeinout 300ms linear;
  animation: fadeinout 300ms linear;
}
@-webkit-keyframes fadeinout {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeinout {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
#fancyTabWidget .fancyTab.active {
  background: white;
  box-shadow: 1px 0px 0 1px white, 0 0px 0 1px #dddddd, -1px 1px 0 0px #dddddd inset;
  padding-bottom: 30px;
  margin-top: -15px;
  transition: all 200ms;
}
#fancyTabWidget .arrow-down {
  display: none;
  width: 0;
  height: 0;
  border-left: 18px solid transparent;
  border-right: 18px solid transparent;
  border-top: 21px solid #dddddd;
  position: absolute;
  top: -1px;
  left: calc(45%);
}
#fancyTabWidget .arrow-down-inner {
  width: 0;
  height: 0;
  border-left: 18px solid transparent;
  border-right: 18px solid transparent;
  border-top: 12px solid white;
  position: absolute;
  top: -22px;
  left: -18px;
}
#fancyTabWidget .fancyTab.active .arrow-down {
  display: block;
}
#fancyTabWidget .tab-text {
  font-size: 1.65em;
  font-weight: 300;
}
@media (max-width: 768px) {
  #fancyTabWidget .tab-text {
    display: inline-block;
    font-size: 0.65em;
  }
  #fancyTabWidget .fancyTab {
    padding: 0 0 35px 0;
  }
}
@media (max-width: 1200px) {
  #fancyTabWidget .fancyTab .fa {
    font-size: 25px;
  }
  #fancyTabWidget .fancyTab .hidden-xs {
    font-size: 16px;
  }
}
@media screen and (min-width: 0px) and (max-width: 640px) {
  #fancyTabWidget .fancyTabs {
    margin: 25px 0 0;
  }
  #fancyTabWidget .fancyTab .fa,
  #fancyTabWidget .fa span {
    font-size: 17px !important;
  }
  #fancyTabWidget .arrow-down {
    left: calc(40%);
  }
}
@media (max-width: 992px) {
  #fancyTabWidget .fancyTab .fa {
    font-size: 25px;
  }
  #fancyTabWidget .fancyTab .hidden-xs {
    font-size: 18px;
    font-weight: normal;
  }
}
@media (max-width: 575.98px) {
  #fancyTabWidget .container {
    margin-top: 10px;
  }
}
@media (max-width: 768px) {
  #fancyTabWidget .fancyTab > a {
    font-size: 18px;
  }
  #fancyTabWidget .nav > li.fancyTab > a {
    padding: 10px 0 0 0;
    margin-bottom: inherit;
  }
  #fancyTabWidget .fancyTab .fa,
  #fancyTabWidget .fa span {
    font-size: 16px;
  }
  #fancyTabWidget .nav-tabs > li.fancyTab > a {
    border-right: 1px solid transparent;
    padding-bottom: 0;
  }
  #fancyTabWidget .fancyTab.active .fa {
    color: #ce1126;
  }
  #fancyTabWidget .container {
    margin-top: 10px;
  }
}
@media (max-width: 1025px) {
  #fancyTabWidget .fancyTab.active {
    margin-top: 0px;
  }
}
#fancyTabWidget .wrapper {
  position: relative;
  margin: 0 auto;
  overflow: hidden;
  padding: 5px;
  height: 50px;
}
#fancyTabWidget .list {
  position: absolute;
  left: 0px;
  top: 0px;
  min-width: 3500px;
  margin-top: 0px;
}
#fancyTabWidget .list li {
  display: table-cell;
  position: relative;
  text-align: center;
  cursor: grab;
  cursor: -webkit-grab;
  color: #efefef;
  vertical-align: middle;
}
#fancyTabWidget .scroller {
  text-align: center;
  cursor: pointer;
  display: none;
  padding: 7px;
  padding-top: 13px;
  white-space: no-wrap;
  vertical-align: middle;
  background-color: white;
}
@media (max-width: 320px) {
  .benefit-modeller-container {
    margin-left: -10px;
    margin-right: -10px;
  }
}
/* Colours
-----------------------------------------------*/

.red,
.red h1,
.red h2,
.red h3,
.red h4,
.red h5,
.red p,
.red li,
.red li span {
  color: #bac405;
}
label {
  font-weight: 100;
  margin-bottom: 10px;
}
@import once 'variables-default.less';
@import once '_mixins.less';
input[type=text],
input[type=email],
input[type=password],
input[type=tel],
input[type=number],
input[type=date],
textarea {
  border: 1px solid #f95602;
  border-radius: 0;
  font-weight: 100;
  line-height: 22px;
  margin-bottom: 15px;
  padding: 10px;
  resize: none;
  width: 100%;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input[type=radio] {
  border: 1px solid #f95602;
  border-radius: 0;
  font-weight: 100;
  line-height: 22px;
  margin-right: 10px;
  padding: 10px;
  resize: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  top: -7px;
}
textarea {
  height: 200px;
}
.form-group select {
  line-height: 32px;
}
.form-check-input:checked {
  background-color: #f95602;
  border-color: #f95602;
}
@import once 'variables-default.less';
@import once '_mixins.less';
select,
.ui-selectmenu-button {
  cursor: pointer;
  width: 100%;
  border: 1px solid #f95602;
  border-radius: 0;
  font-weight: 100;
  line-height: 22px;
  margin-bottom: 15px;
  padding: 10px;
  background: transparent;
}
.ui-selectmenu-button {
  margin-bottom: 5px;
}
.ui-selectmenu-button .ui-icon {
  background: #fd7631;
  border-left: 1px solid #f95602;
  top: 0;
  width: 40px;
  height: 50px;
  right: 0;
}
.ui-selectmenu-button span.ui-selectmenu-text {
  padding: 0px;
  width: 80%;
}
.ui-selectmenu-button:after {
  content: '\e624';
  font-family: 'equiniti';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  font-size: 12px;
  right: 14px;
  top: 16px;
}
.ui-widget {
  font-size: 16px;
  font-family: Arial;
}
.ui-menu-item {
  color: black;
  padding: 10px;
  border-bottom: 1px solid #f95602;
}
.ui-menu-item.ui-state-focus {
  background: #f95602;
  color: white;
}
@import once 'variables-default.less';
table#contribution-table {
  width: 100%;
}
table#contribution-table tr {
  border: 1px solid #eaeaea;
  border-bottom: none;
}
table#contribution-table tr:nth-child(odd) {
  background: #f6f6f6;
}
table#contribution-table tr.red {
  background: #fbe6e6;
  border: 1px solid #f8d2d3;
  border-top: 1px solid #f95602;
  font-weight: 400;
}
table#contribution-table tr.red td:nth-child(1) {
  border-right: 1px solid #f8d2d3;
}
table#contribution-table tr td {
  padding: 10px;
  width: 50%;
}
table#contribution-table tr td:nth-child(1) {
  border-right: 1px solid #eaeaea;
}
table.minimal {
  width: 100%;
  margin-bottom: 40px;
}
@media screen and (max-width: 480px) {
  table.minimal {
    width: 700px;
  }
}
table.minimal th {
  color: black;
  font-size: 12px;
  padding: 14px 0;
}
table.minimal th.col-1,
table.minimal th.col-2,
table.minimal th.col-4 {
  width: 16%;
}
table.minimal th.col-3 {
  width: 32%;
}
table.minimal th.col-5 {
  width: 20%;
}
@media screen and (max-width: 480px) {
  table.minimal th.col-5 {
    width: 13%;
  }
  table.minimal th.col-4 {
    width: 23%;
  }
}
table.minimal tr {
  border-bottom: 1px solid #f95602;
}
table.minimal td {
  font-size: 16px;
  padding: 10px 0;
}
table.minimal .icon-arrow-right {
  color: #505050;
  font-family: Arial;
  font-weight: 300;
}
table.minimal .icon-arrow-right:before {
  color: #f95602;
  float: right;
  font-family: 'equiniti';
  font-size: 13px;
  font-weight: normal;
  margin: 2px 0 0 10px;
}
@media screen and (max-width: 480px) {
  table.minimal .icon-arrow-right:before {
    content: "";
  }
}
@media screen and (max-width: 480px) {
  table.minimal .icon-arrow-right:after {
    content: "\e63a";
    color: #f95602;
    font-family: 'equiniti';
    font-size: 13px;
    font-weight: normal;
    margin: 2px 0 0 10px;
  }
}
table.minimal .icon-arrow-right:hover {
  color: #f95602;
  text-decoration: none;
}
table.minimal span.icon-arrow-right:before,
table.minimal span.icon-arrow-right:after {
  color: #b2b2b2;
}
table.minimal span.icon-arrow-right:hover {
  color: #505050;
}
/* Calendar */

@media only screen and (max-width: 767px) {
  .calendar {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .calendar button {
    margin-top: 10px;
  }
}
.calendar label {
  float: left;
  padding: 13px 0;
  width: 97px;
}
.calendar p.red {
  text-align: right;
}
.calendar .icon-calendar {
  border: 1px solid #f95602;
  float: left;
  font-size: 28px;
  padding: 7px 8px;
  color: #f95602;
  cursor: pointer;
  text-decoration: none;
}
.calendar .icon-calendar.error {
  border-left: none !important;
  border-color: #bac405;
}
.calendar input {
  border-bottom: 1px solid #f95602;
  border-top: 1px solid #f95602;
  border-right: none;
  border-left: 1px solid #f95602;
  float: left;
  font-weight: 100;
  margin-bottom: 20px;
  width: 253px;
}
.calendar input.error {
  border-right: none !important;
  border-color: #bac405;
}
.calendar .icon-arrow-down {
  color: #f95602;
  cursor: pointer;
  border: 1px solid #f95602;
  float: left;
  font-size: 10px;
  padding: 18px 14px 14px;
  width: auto;
}
.calendar-block-label .icon-calendar {
  border: 1px solid #f95602;
  font-size: 28px;
  padding: 7px 8px;
  color: #f95602;
  cursor: pointer;
  text-decoration: none;
  top: -59px;
  position: relative;
  float: right;
  background-color: white;
}
.calendar-block-label .icon-calendar.error {
  border-left: none !important;
}
/* Radio Buttons */

.radio {
  margin: 0 !important;
  padding: 0 !important;
}
.radio input[type="radio"] {
  margin: 0 !important;
  padding: 0 !important;
  float: left !important;
  height: 24px !important;
}
.radio label {
  display: block !important;
  float: left !important;
  font-weight: 300 !important;
  cursor: pointer !important;
}
.radio span.radio-container {
  clear: left;
  position: relative !important;
  float: left !important;
  margin: 0 25px 15px 0 !important;
}
@media only screen and (max-width: 450px) {
  .radio span.radio-container {
    margin: 0 10px 15px 0 !important;
  }
}
.radio span.radio-container span.radio {
  border: 3px solid #f95602 !important;
  border-radius: 1000px !important;
  display: block !important;
  height: 24px !important;
  width: 24px !important;
}
.radio span.radio-container span.radio.selected span {
  background: #f95602 !important;
  height: 12px !important;
  width: 12px !important;
  display: block !important;
  border-radius: 1000px !important;
  margin: 3px !important;
}
.radio span.radio-container input {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  opacity: 0 !important;
  filter: alpha(opacity=0) !important;
  z-index: 101 !important;
  cursor: pointer !important;
}
.radio span.radio-container input:focus + .radio {
  outline: #cccccc dotted 1px !important;
  outline-offset: 3px !important;
}
/* Buttons */

.close-it,
.switch-modeller,
.lines,
.close-contribution {
  border-top: 1px solid #f95602;
  border-bottom: 1px solid #f95602;
  color: #f95602;
  font-size: 13px;
  padding: 14px 0;
  text-align: center;
  width: 30px;
}
.close-contribution {
  padding-bottom: 13px;
}
.lines.darkgrey {
  border-top: 1px solid #505050;
  border-bottom: 1px solid #505050;
  color: #505050;
}
.switch-modeller {
  font-size: 18px;
  padding: 6px 0;
}
.show-help {
  margin-top: 10px;
}
.button-group button {
  background: #de0001;
  width: 100px;
}
.button-group button button.active {
  background: #de0001;
}
.button {
  background: #de0001;
  border: none;
  color: black;
  display: block;
  font-size: 14px;
  font-weight: 400;
  float: left;
  line-height: 14px;
  padding: 15px 10px;
  text-align: center;
}
.button:link,
.button:visited {
  color: black;
  text-decoration: none;
}
.button:hover,
.button:active {
  background: #de0001;
  color: white;
  text-decoration: none;
}
.button:focus {
  outline: #b2b2b2 dotted 1px;
  outline-offset: 3px;
}
.button.grey {
  background: #de0001;
}
.button.grey:hover {
  background: #de0001;
  color: white;
}
.button.darkgrey {
  background: #de0001;
}
.button.darkgrey:hover {
  background: #de0001;
}
.button.linetwo {
  padding: 8px 15px;
}
.button.long {
  width: 160px;
}
/* Spinner */

.spinner {
  float: left;
  margin-bottom: 20px;
  margin-right: 2%;
  position: relative;
  text-align: center;
  width: 120px;
}
.spinner:last-of-type {
  margin-right: 0;
}
.spinner p {
  font-size: 15px;
  margin-bottom: 5px;
}
.spinner span {
  font-size: 26px;
}
.spinner a {
  display: none;
}
.spinner a.active {
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.8);
}
/* Slider */

.slider-container > div {
  display: none;
}
.ui-slider {
  border: 3px solid rgba(255, 255, 255, 0);
  border-radius: 20px;
  float: left;
  height: 18px;
  margin: 11px 0 0 0;
  position: relative;
  text-align: left;
  width: 80%;
}
@media only screen and (max-width: 400px) {
  .ui-slider {
    width: 70%;
  }
}
.ui-slider:focus {
  outline: #cccccc dotted 1px;
  outline-offset: 10px;
}
.ui-slider .ui-slider-handle {
  -ms-touch-action: none;
  touch-action: none;
  background: white;
  border: 3px solid #de0001;
  border-radius: 100px;
  height: 28px;
  margin-left: -14px;
  position: absolute;
  width: 28px;
  top: -8px;
  z-index: 2;
}
.ui-slider .ui-slider-handle:focus {
  outline: #b2b2b2 dotted 1px;
  outline-offset: 3px;
}
.ui-slider .ui-slider-range {
  background: white;
  height: inherit;
  border-radius: inherit;
  margin-top: -1px;
  margin-left: -1px;
}
.ui-slider.darkgrey {
  border: 3px solid #505050;
}
.ui-slider.darkgrey .ui-slider-handle {
  border: 3px solid #505050;
}
.ui-slider.darkgrey .ui-slider-range {
  background: #505050;
}
.minus {
  font-size: 2px;
  margin-right: 20px;
  padding: 20px 0 19px;
}
.plus,
.minus {
  width: 5%;
}
.plus:active,
.minus:active,
.plus:focus,
.minus:focus,
.plus:hover,
.minus:hover {
  color: #f95602;
  text-decoration: none;
}
@media only screen and (max-width: 400px) {
  .plus,
  .minus {
    width: 10%;
  }
}
.minus {
  margin-right: 5%;
}
.plus {
  margin-left: 5%;
}
/* Bar Chart */

#benefit-bar,
#pension-bar {
  margin: 37px 0 0 25px;
}
#pensions-bar-mobile {
  float: left;
  padding: 10px;
  margin-left: 20px;
}
.graphLabelbenefit-bar,
.graphLabelpension-bar {
  margin-top: 20px;
  font-size: 15px;
}
.graphValuebenefit-bar,
.graphValuebenefit-bar-mobile,
.graphValuepension-bar,
.graphValuepensions-bar-mobile {
  background: #666666;
  border-radius: 5px;
  /* TODO: this is hard-coded due to bug - FIX!! */
  color: white;
  font-size: 22px;
  font-weight: 400;
  left: -12px;
  padding: 8px 16px;
  position: absolute;
  z-index: 2;
  top: -18px;
}
@media only screen and (max-width: 768px) {
  .graphValuebenefit-bar,
  .graphValuebenefit-bar-mobile,
  .graphValuepension-bar,
  .graphValuepensions-bar-mobile {
    font-size: 16px;
  }
}
.graphValuebenefit-bar:after,
.graphValuebenefit-bar-mobile:after,
.graphValuepension-bar:after,
.graphValuepensions-bar-mobile:after {
  background: #666666;
  border-radius: 5px;
  content: '';
  height: 30px;
  position: absolute;
  right: -13px;
  top: 4px;
  width: 30px;
  z-index: 1;
  -ms-transform: rotate(45deg);
  /* IE 9 */
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.graphValuepensions-bar-mobile:after {
  height: 25px;
  right: -9px;
  top: 3px;
  width: 25px;
}
.graphValuepension-bar:after {
  right: -12px;
  top: 5px;
}
.graphValuebenefit-bar span,
.graphValuebenefit-bar-mobile span,
.graphValuepension-bar span,
.graphValuepensions-bar-mobile span {
  position: relative;
  z-index: 2;
}
/* Doughnut Chart */

.doughnut-chart.left {
  margin-right: 20px;
}
.doughnut-chart {
  max-height: 300px;
  max-width: 300px;
  margin: 10px auto 10px auto;
}
@media only screen and (max-width: 768px) {
  .doughnut-chart {
    display: block;
  }
}
@media only screen and (max-width: 400px) {
  .doughnut-chart {
    width: 200px !important;
    height: 200px !important;
  }
}
/* Modal Window */

.window-mask {
  background: rgba(255, 255, 255, 0.75);
  display: none;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
}
.window-mask .window-container {
  display: table;
  height: 100%;
  margin: 0 auto;
  width: 100%;
  max-width: 800px;
}
.window-mask .window-container .close-window {
  text-decoration: none;
}
.window-mask .window-vertical {
  display: table-cell;
  vertical-align: middle;
}
.window-mask .window {
  background: white;
  padding: 15px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
}
.window-mask h3 {
  float: left;
  width: 90%;
}
.window-mask .lines {
  padding: 12px 0 13px;
}
.window-mask table {
  margin-bottom: 25px;
}
.window-mask p {
  margin: 0 0 3px 0;
}
.window-mask input {
  border-color: #f95602;
}
.window-mask small {
  margin-top: 28px;
}
.window-mask button {
  margin-left: 15px;
  width: 140px;
  background: #ce1126;
  color: black;
}
.window-mask button:hover {
  background: #ce1126;
  color: black;
}
.window table {
  font-size: 16px;
  width: 100%;
}
.window table th {
  background: #f95602;
  border-bottom: 2px solid white;
  border-right: 2px solid white;
  color: white;
  font-weight: 300;
  padding: 10px;
}
.window table th:last-child {
  border-right: none;
}
.window table tr:nth-child(odd) td {
  background: #f6f6f6;
}
.window table td {
  background: #fdfdfd;
  color: #4f2170;
}
.styled-select {
  overflow: hidden;
  position: relative;
  margin-bottom: 20px;
}
.styled-select select,
.styled-select .ui-selectmenu-button {
  width: 115%;
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 0;
  z-index: 100;
  position: relative;
  height: 40px;
  font-size: 16px;
  background: transparent;
  padding: 5px 0 5px 5px;
  color: #4f2170;
  border-width: 1px;
  border: 1px solid darkgray;
  overflow: visible;
  -ms-text-overflow: inherit;
  -o-text-overflow: inherit;
  text-overflow: inherit;
  line-height: 1.5;
}
.styled-select select[disabled],
.styled-select .ui-selectmenu-button[disabled] {
  opacity: 0.3;
}
.styled-select select[disabled] + span,
.styled-select .ui-selectmenu-button[disabled] + span {
  opacity: 0.3;
}
.styled-select select:focus,
.styled-select .ui-selectmenu-button:focus {
  border-color: #f95602;
}
.styled-select select:focus + span,
.styled-select .ui-selectmenu-button:focus + span {
  border-color: #f95602;
}
.styled-select select::-ms-expand,
.styled-select .ui-selectmenu-button::-ms-expand {
  display: none;
}
.styled-select option {
  color: #f95602;
  border-right: 1px solid #cccccc;
  -webkit-appearance: none;
}
.styled-select span {
  width: 40px;
  height: 40px;
  border: 1px solid darkgray;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  color: #f95602;
  text-align: center;
}
.styled-select span:before {
  font-size: 12px;
  display: block;
  position: absolute;
  width: 100%;
  text-align: center;
  top: 50%;
  margin-top: -6px;
}
#regLoader {
  display: none;
  position: absolute;
  background: white;
  background: rgba(255, 255, 255, 0.6);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10000;
  text-align: center;
}
#regLoader .loading {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -25px;
  margin-left: -25px;
}
.styleModellerBar {
  background-color: #f95602;
}
.styleModellerBar2 {
  background-color: #c64502;
}
.styleModellerBar3 {
  background-color: #943301;
}
.styleModellerBar4 {
  background-color: #612201;
}
.styleModellerBar5 {
  background-color: #2f1000;
}
.styleModellerBar6 {
  background-color: black;
}
/* error message for Trans History, to match Your Documents (but uses jQuery, using validation-summary-errors */

.validation-summary-errors li {
  list-style-type: none;
}
/* Colors
-----------------------------------------------*/

.light-grey {
  background: #f6f6f6;
}
span.light-grey {
  background: none;
  color: #b2b2b2;
}
.dark-grey {
  background: #eaeaea;
}
/* Layout
===============================================*/

.contents {
  margin: 0 auto;
  width: 960px;
}
.contents:after {
  clear: both;
  content: "";
  display: block;
  height: 0;
  visibility: hidden;
}
.clear {
  clear: both;
}
.right {
  float: right !important;
}
.left {
  float: left !important;
}
.center {
  display: block;
  margin: 0 auto;
  text-align: center;
}
.inline-center {
  display: block;
  text-align: center;
}
.inline-center > div {
  display: inline-block;
}
hr {
  height: 1px;
  background: #f95602;
  border: none;
  clear: both;
  display: block;
  margin: 0;
  width: 100%;
}
.full {
  display: block;
  text-align: center;
  width: 100%;
}
@import once 'variables-default.less';
.no-margin {
  margin: 0 0 0 0 !important;
}
.mt4 {
  margin-top: 4px !important;
}
.mt10 {
  margin-top: 10px !important;
}
.mt20 {
  margin-top: 20px !important;
}
.mt30 {
  margin-top: 30px !important;
}
.mt40 {
  margin-top: 40px !important;
}
.mt40-xs {
  margin-top: 40px !important;
}
.mt45 {
  margin-top: 45px !important;
}
.mt50 {
  margin-top: 50px !important;
}
.mt50-xs {
  margin-top: 50px !important;
}
@media only screen and (min-width: 768px) {
  .mt40-sm {
    margin-top: 40px !important;
  }
  .mt50-sm {
    margin-top: 50px !important;
  }
}
@media only screen and (min-width: 992px) {
  .mt40-md {
    margin-top: 40px !important;
  }
  .mt50-md {
    margin-top: 50px !important;
  }
}
@media only screen and (min-width: 1050px) {
  .mt40-lg {
    margin-top: 40px !important;
  }
  .mt50-lg {
    margin-top: 50px !important;
  }
}
.mr10 {
  margin-right: 10px !important;
}
.mr20 {
  margin-right: 20px !important;
}
.mr30 {
  margin-right: 30px !important;
}
.mr40 {
  margin-right: 40px !important;
}
.mr50 {
  margin-right: 50px !important;
}
.mr60 {
  margin-right: 60px !important;
}
.mb10 {
  margin-bottom: 10px !important;
}
.mb20 {
  margin-bottom: 20px !important;
}
.mb30 {
  margin-bottom: 30px !important;
}
.mb40 {
  margin-bottom: 40px !important;
}
.mb50 {
  margin-bottom: 50px !important;
}
.ml5 {
  margin-left: 5px;
}
.ml10 {
  margin-left: 10px !important;
}
.ml20 {
  margin-left: 20px !important;
}
.ml30 {
  margin-left: 30px !important;
}
.ml40 {
  margin-left: 40px !important;
}
.ml50 {
  margin-left: 50px !important;
}
.ml5-xs {
  margin-left: 5px;
}
.ml5-sm {
  margin-left: 0;
}
.ml5-md {
  margin-left: 0;
}
.ml5-lg {
  margin-left: 0;
}
@media only screen and (min-width: 768px) {
  .ml5-sm {
    margin-left: 5%;
  }
}
@media only screen and (min-width: 992px) {
  .ml5-md {
    margin-left: 5%;
  }
}
@media only screen and (min-width: 1050px) {
  .ml5-lg {
    margin-left: 5%;
  }
}
.m-row-5 {
  margin-left: -5px;
  margin-right: -5px;
}
.m-row-10 {
  margin-left: -5px;
  margin-right: -5px;
}
.m-row-5-xs {
  margin-left: -5px;
  margin-right: -5px;
}
.m-row-5-sm {
  margin-left: -15px;
  margin-right: -15px;
}
.m-row-5-md {
  margin-left: -15px;
  margin-right: -15px;
}
.m-row-5-lg {
  margin-left: -15px;
  margin-right: -15px;
}
.m-row-10-xs {
  margin-left: -5px;
  margin-right: -5px;
}
.m-row-10-sm {
  margin-left: -15px;
  margin-right: -15px;
}
.m-row-10-md {
  margin-left: -15px;
  margin-right: -15px;
}
.m-row-10-lg {
  margin-left: -15px;
  margin-right: -15px;
}
@media only screen and (min-width: 768px) {
  .m-row-5-sm {
    margin-left: -5px;
    margin-right: -5px;
  }
  .m-row-10-sm {
    margin-left: -5px;
    margin-right: -5px;
  }
}
@media only screen and (min-width: 992px) {
  .m-row-5-md {
    margin-left: -5px;
    margin-right: -5px;
  }
  .m-row-10-md {
    margin-left: -5px;
    margin-right: -5px;
  }
}
@media only screen and (min-width: 1050px) {
  .m-row-5-lg {
    margin-left: -5px;
    margin-right: -5px;
  }
  .m-row-10-lg {
    margin-left: -5px;
    margin-right: -5px;
  }
}
.no-padding {
  padding: 0 0 0 0;
}
.first {
  margin-left: 0 !important;
  padding-left: 0 !important;
}
.last {
  border: none !important;
  margin-right: 0 !important;
  padding-right: 0 !important;
}
.canvas-container {
  clear: both;
  padding-top: 50%;
  position: relative;
  width: 100%;
}
.canvas-container .canvas-wrapper {
  position: absolute;
  top: 0;
  width: 100%;
}
.canvas-container .canvas-wrapper canvas.full {
  position: absolute;
  width: 100% !important;
}
/* Header
-----------------------------------------------*/

header {
  border-top: 4px solid #f95602;
}
header .container {
  border-bottom: 1px solid #f95602;
  padding: 30px 15px 18px;
}
header .logo {
  /*background: url('/Images/logo.png') no-repeat;*/
  background-position: center;
  background-size: 100%;
  border: none;
  display: block;
  height: 63px;
  margin: 0;
  text-indent: -9999px;
  /*width: 400px;*/
  width: 168px;
}
/* Cookie/Privacy Notification */

.cookies {
  background: #f8ffbb;
  border-bottom: 1px solid #bac405;
  padding: 10px 0;
}
.cookies .content {
  float: left;
}
.cookies .content p {
  font-size: 14px;
  line-height: 17px;
  margin: 0;
}
.cookies .content strong {
  font-weight: 800;
  margin-bottom: 10px;
}
.cookies .close-it {
  float: right;
  margin-top: 5px;
}
.download-warning-message,
.consent-required-message,
#nomination-prompt-message {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9998;
  overflow: scroll;
}
@media screen and (max-width: 768px) {
  .cookies .content {
    padding: 0px;
  }
}
/* Navigation */

.menu-item-label {
  display: inline-block;
  line-height: normal;
  border-bottom: 2px solid white;
}
.collapsible-menu::before {
  content: '';
  position: absolute;
  width: 100vw;
  top: 0;
  bottom: 0;
  left: 50%;
  background: white;
  transform: translate(-50%);
}
.collapsible-menu {
  position: relative;
}

.collapsible-menu .card {
  background: transparent;
}
#mobile-view-navbar-collapse {
  border-color: white;
}
@media (max-width: 768px) {
  .navbar-nav {
    padding: 7.5px 0;
    background: white;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .navbar-nav {
    margin-top: -1px;
  }
  .navbar-nav {
    padding: 7.5px 0;
    background: white;
  }
}
.navbar-default {
  background-color: white;
  border-color: none;
  padding: 0px;
}
.navbar-default.fixed-top-after-cookie {
  margin-top: 73px;
}
.navbar-default.fixed-top-after-employer {
  margin-top: 36px;
}
.navbar-default .navbar-content .navbar-menu > * {
  width: auto;
}
@media screen and (max-width: 992px) {
  .navbar-default .navbar-menu {
    justify-content: flex-end;
  }
}
.cookie-section-fixed-top,
.employernotification,
.emailverificationnotification {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1030;
  top: 0;
  border-width: 0 0 1px;
}
.navbar {
  margin-bottom: 20px;
  margin-top: 0px;
  border-bottom: 1px solid black;
}
.card-layout-body .navbar {
  margin-bottom: 0px;
}
.collapse.in {
  border-top: 0px solid black;
}
.navbar-default .navbar-toggler {
  border-color: black;
  float: right;
}
.navbar-default .navbar-toggler:hover {
  background-color: white;
}
.navbar-default .navbar-toggler:focus {
  background-color: white;
}
.navbar-default .navbar-toggler .icon-bar {
  background-color: black;
}
.navbar-toggler {
  margin-right: 10px;
  margin-bottom: 8px;
  margin-top: 12px;
}
.navbar-toggler .toggler-icon {
  color: black;
}
.navbar-default .navbar-nav {
  margin-top: 13px;
}
.navbar-default .navbar-nav > li {
  margin-bottom: 0px;
  border-bottom: 0px;
  -webkit-column-break-inside: avoid;
}
.navbar-default .navbar-nav > li.nav-item:hover {
  border-bottom: 3px solid black;
}
.navbar-default .navbar-nav > li.active,
.navbar-default .navbar-nav > li > a.active {
  border-bottom: 3px solid black;
}
.navbar-default .navbar-nav > li.active:hover,
.navbar-default .navbar-nav > li > a.active:hover {
  border-bottom: 0px solid black;
}
.navbar-default .navbar-nav > li > a {
  color: black !important;
  font-size: 90%;
  text-decoration: none;
  outline: none;
}
.navbar-default .navbar-nav > li > a:hover {
  color: black;
  background-color: white;
}
.navbar-default .navbar-nav > li > a:focus {
  color: black;
  background-color: white;
  font-weight: bold;
  outline: 1px dashed;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: black;
  background-color: white;
}
@media (max-width: 767px) {
  .navbar-default .navbar-nav {
    margin-top: 0;
  }
  .navbar-default .navbar-nav > li > a:hover {
    background-color: white;
  }
  .navbar-default .navbar-nav > li > a:focus {
    background-color: white;
  }
  .navbar-default .navbar-nav > .active > a,
  .navbar-default .navbar-nav > .active > a:hover,
  .navbar-default .navbar-nav > .active > a:focus {
    background-color: white;
  }
  .navbar-default .container {
    max-width: 100%;
  }
}
.divider-vertical {
  height: 30px;
  margin-top: 4px;
  margin-bottom: 13px !important;
  border-right: 1px solid black;
}
.col-2 > h2 {
  color: black;
  border-bottom: none;
  font-size: 24px;
  margin-bottom: 0px;
  padding-bottom: 0px;
}
.col-2 {
  padding-top: 14px;
  padding-bottom: 14px;
}
.collapsible-menu .collapsible-menu-title {
  position: absolute;
}
.collapsible-menu .card {
  background-color: white;
  border: none;
  margin-bottom: 1px;
  width: 100%;
  margin-right: 0%;
}
.collapsible-menu .card ul {
  column-count: 5;
  list-style: none;
}
.collapsible-menu .card a {
  color: black;
  font-size: 90%;
  text-decoration: none;
  outline: none;
}
.collapsible-menu .card a:focus {
  color: black;
}
.collapsible-menu .card a:focus > span {
  font-weight: bold;
  border: 1px dashed;
  padding-left: 3px;
  padding-right: 3px;
}
.collapsible-menu .card a.active {
  color: black;
}
.navbar .col-3,
.navbar .col-4,
.navbar .col-6 {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 0px;
  /*float: right !important;*/
  text-align: right;
  white-space: nowrap;
}
.navbar .col-3 > a.active span.menu-item-label,
.navbar .col-4 > a.active span.menu-item-label,
.navbar .col-6 > a.active span.menu-item-label {
  border-bottom: 2px solid black;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: black;
  background-color: white;
}
/*CARET*/

.navbar-default .navbar-nav > .dropdown > a .caret {
  border-top-color: black;
  border-bottom-color: black;
}
/*ACTIVE CARET*/

.navbar-default .navbar-nav > .active > a .caret {
  border-top-color: black;
  border-bottom-color: black;
}
.navbar-default .navbar-nav > .open > a .caret,
.navbar-default .navbar-nav > .open > a:hover .caret,
.navbar-default .navbar-nav > .open > a:focus .caret {
  border-top-color: black;
  border-bottom-color: black;
}
.navbar-default .navbar-brand {
  color: black;
  padding: 0 0;
}
nav .logo {
  background-image: url("[]");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  border: none;
  display: block;
  height: 26px;
  margin: 15px 2px 15px 15px;
  text-indent: -9999px;
  width: 140px;
}
@media only screen and (min-width: 768px) {
  nav .logo {
    background-image: url("/media/xsbnywk3/mdlz-logo-dec-2025.png");
    height: 63px;
    margin: 2px;
    width: 168px;
  }
}
@media (max-width: 767px) {
  /*MOBILE MENU*/
  
  li.mobSubMenu {
    display: block;
  }
  li.divider-vertical {
    display: none;
  }
  li.dropdown {
    display: none;
  }
  div.collapsible-menu {
    display: none;
  }
  .navbar-nav {
    column-count: 2;
    -moz-column-count: 2;
    -webkit-column-count: 2;
    display: block;
    padding-left: 10px;
    padding-right: 10px;
  }
  .navbar-default .navbar-nav > li:hover {
    border-bottom: 0px solid black;
  }
  .navbar-default .navbar-nav > li.active,
  .navbar-default .navbar-nav > li > a.active {
    border-bottom: 0px solid black;
  }
  .navbar-default .navbar-nav > li.active:hover,
  .navbar-default .navbar-nav > li > a.active:hover {
    border-bottom: 0px solid black;
  }
}
@media (min-width: 768px) {
  /*FULL SCREEN MENU*/
  
  li.mobSubMenu {
    display: none;
  }
  li.divider-vertical {
    display: block;
  }
  li.dropdown {
    display: block;
  }
  div.collapsible-menu {
    display: block;
  }
}
/* Account Navigation */

.account-navigation {
  border-bottom: 1px solid #f95602;
  font-size: 14px;
  list-style-type: none;
  margin: 0;
  text-align: center;
  font-size: 13px;
}
@media screen and (min-width: 992px) and (max-width: 1050px) {
  .account-navigation {
    font-size: 12px;
  }
}
.account-navigation li {
  height: 70px;
  margin: 0 auto;
  padding: 0 10px;
  display: inline-block;
}
.account-navigation li.active {
  background: #f6f6f6;
}
.account-navigation li.active a {
  color: #f95602;
  margin: -1px 0 0 0;
}
.account-navigation li a {
  display: block;
  padding: 26px 0;
  position: relative;
  text-decoration: none;
}
.account-navigation li a:hover {
  color: #de0001;
  margin: -1px 0 0 0;
}
.account-navigation .active a:after {
  bottom: 20px;
  content: '';
  font-size: 48px;
  left: 50%;
  margin-left: -6px;
  position: absolute;
  font-family: 'Times New Roman';
}
.account-navigation.fund-navigation {
  border: 0;
  margin-bottom: -2px;
  display: block;
}
.account-navigation.fund-navigation li {
  padding: 0;
  position: relative;
  text-align: center;
  width: 25%;
  display: block;
  float: left;
}
.account-navigation.fund-navigation li:first-child,
.account-navigation.fund-navigation li:last-child {
  margin: 0;
}
.account-navigation.fund-navigation li a {
  padding: 15px 0;
  display: block;
  width: 100%;
  height: 100%;
}
.account-navigation.fund-navigation li span {
  border-right: 1px solid #f95602;
  height: 100%;
  display: block;
  position: relative;
}
.account-navigation.fund-navigation li:last-child span {
  border: none;
}
.account-navigation.fund-navigation li .icon-arrow-down {
  border: none;
  color: #f95602;
  font-size: 11px;
  line-height: normal;
  padding: 0 15px;
  position: absolute;
  right: 0;
  top: 15px;
}
.account-navigation.fund-navigation li.active a:after {
  bottom: 15px;
  content: '';
  font-size: 48px;
  left: 50%;
  margin-left: -6px;
  position: absolute;
  font-family: 'Times New Roman';
}
@media screen and (max-width: 768px) {
  .account-navigation.fund-navigation li {
    width: 100%;
    height: auto;
    border-top: 1px solid #d1d1d1;
  }
  .account-navigation.fund-navigation li:first-child {
    border-top: 0;
  }
  .account-navigation.fund-navigation li span {
    border-right: 0;
  }
}
.border-top {
  border-top: 1px solid #f95602;
}
.border-bottom {
  border-bottom: 1px solid #f95602;
  margin-bottom: 20px;
}
.show-sub-menu {
  float: left;
  margin-right: 15px;
  text-decoration: none;
}
.show-sub-menu:before {
  font-size: 14px;
  color: #949494;
}
.sub-menu {
  padding: 5px 10px;
  background-color: #f6f6f6;
}
@media (min-width: 767px) {
  #login {
    color: black !important;
    background-color: #bac405;
    border-color: #bac405;
  }
  #logout {
    color: black !important;
    background-color: #bac405;
    border-color: #bac405;
  }
}
.nav-link {
  color: black;
}
.screenreader-text {
  position: absolute;
  left: -999px;
}
.screenreader-text:focus {
  position: static;
}
.switch-membership {
  margin: 0.5rem 0.25rem 0.5rem 0.25rem;
}
.horizontal-menubar {
  background-color: #4f2170;
  width: 100% !important;
  border-color: #f95602;
  border: 1px solid;
  border-radius: 4px;
  padding: 0px;
}
.horizontal-menubar .navbar-collapse {
  justify-content: center;
}
.horizontal-menubar .navbar-brand {
  color: black;
}
.horizontal-menubar .navbar-nav {
  list-style: none;
  text-align: center;
  padding: 0;
  margin: 0;
  background: transparent;
}
.horizontal-menubar .navbar-nav .nav-item {
  min-width: 100px;
  margin: 0px 3px 0px 3px;
}
.horizontal-menubar .navbar-nav .nav-link {
  text-decoration: none !important;
  color: black;
  line-height: 30px;
}
.horizontal-menubar .navbar-nav .nav-link:hover {
  background-color: #de0001;
  color: #f95602;
}
.horizontal-menubar .navbar-nav .nav-link.active {
  background-color: #de0001;
  color: #f95602;
}
.nav-pills .nav-item {
  padding-right: 10px;
}
.nav-pills .nav-link.active {
  background-color: #bac405;
  color: white;
}
.nav-pills .nav-link.hover,
.nav-pills .nav-link:hover {
  background-color: #bac405;
  color: white;
}
.help-info {
  display: none;
}
/* Footer
-----------------------------------------------*/

footer .container {
  border-top: 1px solid #f95602;
  font-size: 12px;
  line-height: 20px;
  padding: 20px 15px;
}
footer .container .logo {
  /*background: url('../Images/logo.png') no-repeat;*/
  display: block;
  height: 14px;
  margin: 0 0 18px 0;
  text-indent: -9999px;
  width: 84px;
}
footer .container small {
  font-weight: 400;
}
footer .container p,
footer .container a {
  color: #f95602;
  font-weight: 400;
  margin-bottom: 0;
}
/* Sections
===============================================*/

/* Home
	-----------------------------------------------*/

.intro .row {
  margin-bottom: 30px;
}
.intro hr {
  float: right;
  margin: 0 0 30px;
  width: 773px;
}
.intro h1,
.intro h2 {
  color: black;
}
.content-info {
  clear: both;
}
.viewpoint {
  overflow: hidden;
  position: relative;
  width: 100%;
}
.credentials {
  background: #4f2170;
  position: relative;
}
.credentials article {
  float: left;
}
.credentials h2 {
  color: white;
  margin-bottom: 15px;
}
.credentials input {
  border: none;
}
.credentials p {
  color: white;
  margin: 0 0 5px 0;
}
.credentials a {
  color: white;
  display: block;
  float: right;
  margin-top: 14px;
  text-decoration: underline;
}
.credentials a.slide-left {
  float: left;
}
.credentials .button {
  float: right;
  width: 115px;
}
/* Latest News */

.post {
  border-bottom: 1px solid #f95602;
  margin-bottom: 20px;
  padding-bottom: 10px;
}
.post:last-child {
  border: none;
  margin: 0;
  padding: 0;
}
.post p.title {
  font-size: 16px;
  margin-bottom: 0;
  font-family: Arial;
  font-weight: 300;
  line-height: normal;
}
.post p {
  margin-bottom: 8px;
  color: white;
}
.post a {
  text-decoration: underline;
}
/* Benefits
	-----------------------------------------------*/

.benefit-overview {
  margin-left: 0;
  margin-right: 0;
}
.benefit-overview .col-sm-6 {
  margin: 5px 0 40px;
  padding: 20px 0;
}
.benefit-overview .col-sm-6.dark-grey {
  padding-left: 30px;
}
.benefit-overview .col-sm-6 > section {
  height: 62px;
  position: relative;
  width: 410px;
}
.benefit-overview .col-sm-6 > section.left {
  width: 382px;
}
.benefit-overview .col-sm-6.light-grey {
  border-right: 2px solid #b2b2b2;
}
.benefit-overview .col-sm-6.light-grey h3 {
  font-size: 28px;
}
.benefit-overview .col-sm-6 .close-it {
  right: 0;
  position: absolute;
  top: 10px;
}
.benefit-overview .col-sm-6 .hide-value {
  display: none;
}
.benefit-overview .col-sm-6 .hide-span {
  right: 40px;
  position: absolute;
  top: 22px;
}
.benefit-overview h3 {
  border: none;
  line-height: 20px;
  margin: 0 0 10px 0;
  padding: 0;
}
.benefit-overview h3 small {
  color: #4f2170;
  font-size: 16px;
  font-weight: 300;
  float: none;
}
.benefit-overview h2.subheader {
  font-size: 39px;
  font-weight: 400;
  line-height: 32px;
  margin: 0;
}
.benefit-overview p {
  margin: 0 0 4px;
}
.benefit-overview p span {
  font-size: 24px;
  font-weight: 400;
  margin-left: 5px;
}
.sidenote {
  float: left;
  font-size: 14px;
  margin-left: 2%;
  width: 50%;
}
.sidenote span {
  color: #f95602;
  display: block;
  float: left;
  margin: 0 5px 40px 0;
}
/* Benefits Quotation
	-----------------------------------------------*/

.benefit-quotation-section .calculation-description-desktop {
  margin-top: 40px;
}
.benefit-quotation-section .field-set-target .field-set .ui-selectmenu-text {
  color: black;
}
.benefit-quotation-section .field-set {
  clear: both;
  margin-bottom: 15px;
}
.benefit-quotation-section .field-set input {
  margin-bottom: 15px;
}
.benefit-quotation-section .field-set .number span {
  margin-right: 10px;
}
.benefit-quotation-section .field-set .number input {
  width: calc(100% - 20px);
}
.benefit-quotation-section .field-set .calendar input {
  width: calc(100% - 46px);
}
@media only screen and (max-width: 767px) {
  .benefit-quotation-section .field-set .calendar {
    margin-top: 0;
  }
}
.benefit-quotation-section .field-set .ui-selectmenu-button {
  margin-bottom: 15px;
}
.benefit-quotation-section .field-set .errorMsg {
  float: left;
  display: block;
  color: #f95602;
}
.benefit-quotation-section .field-set .calender-group-input {
  border: 1px solid #f95602;
  margin: 1px 0px 15px 1px;
  overflow: hidden;
}
.benefit-quotation-section .field-set .calender-group-input input {
  width: 85%;
  border: none;
  margin: 1px;
}
.benefit-quotation-section .field-set .calender-group-input .icon-calendar {
  width: 10%;
  border: none;
  top: 0px;
  position: unset;
  margin: 7px 3px 0px 0px;
  padding: 0px;
  background: transparent;
}
@media (min-width: 768px) and (max-width: 992px) {
  .benefit-quotation-section .field-set .calender-group-input input {
    width: 80%;
  }
  .benefit-quotation-section .field-set .calender-group-input .icon-calendar {
    width: 15%;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .benefit-quotation-section .field-set .calender-group-input .icon-calendar {
    margin: 5px 2px 0px 0px;
  }
}
.benefit-quotation-section .viewQuote {
  min-width: 150px;
  margin-top: 10px;
}
.benefit-quotation-section .supportingTextContainer.mobile {
  height: 100px;
  display: none;
  cursor: pointer;
  overflow: hidden;
  position: relative;
}
.benefit-quotation-section .supportingTextContainer.mobile h4 {
  position: relative;
}
.benefit-quotation-section .supportingTextContainer.mobile h4:after {
  content: '\e601';
  font-family: 'equiniti';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  right: 0;
  top: 5px;
  width: 20px;
  height: 20px;
  position: absolute;
  color: #f95602;
}
.benefit-quotation-section .supportingTextContainer.mobile:after {
  content: '';
  top: 80px;
  width: 100%;
  height: 20px;
  position: absolute;
  background: rgba(255, 255, 255, 0.8);
}
.benefit-quotation-section .supportingTextContainer.mobile.open {
  height: auto;
}
.benefit-quotation-section .supportingTextContainer.mobile.open h4:after {
  _: ; -webkit-transform: rotate(180deg);
  _: ; -khtml-transform: rotate(180deg);
  _: ; -moz-transform: rotate(180deg);
  _: ; transform: rotate(180deg);
}
.benefit-quotation-section .supportingTextContainer.mobile.open:after {
  height: 0;
}
@media only screen and (max-width: 767px) {
  .benefit-quotation-section .supportingTextContainer.mobile {
    display: block;
  }
}
.benefit-quotation-section .supportingTextContainer.desktop {
  display: block;
}
@media only screen and (max-width: 767px) {
  .benefit-quotation-section .supportingTextContainer.desktop {
    display: none;
  }
}
.benefit-quotation-section .errorMsg {
  color: #f95602;
}
.benefit-quotation-section .singleQuote-calculation-description {
  margin-bottom: 20px;
}
/* Benefits Modeller
	-----------------------------------------------*/

.benefits-modeller-overview {
  margin-bottom: 20px;
  padding: 15px 0 25px;
}
@media only screen and (max-width: 1050px) {
  .benefits-modeller-overview {
    font-size: 20px;
  }
}
@media only screen and (max-width: 768px) {
  .benefits-modeller-overview.drawdown-benefits-overview {
    padding-bottom: 0;
  }
}
.benefits-modeller-overview .col-sm-3 {
  border-right: 1px solid #b2b2b2;
}
.benefits-modeller-overview h3 {
  border: none;
  margin-bottom: 0;
  font-size: 18px;
}
@media only screen and (max-width: 1050px) {
  .benefits-modeller-overview h3 {
    font-size: 15px;
  }
}
.benefits-modeller-overview h4 {
  font-size: 36px;
  font-weight: 400;
  line-height: 32px;
  margin: 0;
}
.benefits-modeller-overview .col-sm-4 {
  border-right: 1px solid #b2b2b2;
}
.benefits-modeller-overview .col-sm-8 {
  border-right: 1px solid #b2b2b2;
}
.notification {
  background: #f95602;
  color: white;
  display: none;
  margin-bottom: 30px;
  padding: 15px;
  position: relative;
}
.notification p {
  margin: 0;
  width: calc(100% - 25px);
}
.notification p.uncrystalised-content {
  display: none;
}
.notification .icon-close {
  color: white;
  font-size: 12px;
  position: absolute;
  right: 20px;
  top: 20px;
}
.notification .icon-close:hover {
  text-decoration: none;
}
.inflation {
  margin: 0 0 0 42px;
}
@media only screen and (max-width: 992px) {
  .inflation {
    margin: 0;
  }
}
.inflation label {
  line-height: 19px;
  width: 128px;
}
@media only screen and (max-width: 768px) {
  .inflation label {
    width: 116px;
  }
}
.inflation span.radio-container {
  clear: none !important;
  margin-right: 5px;
}
.modeller-left-arrow,
.modeller-right-arrow {
  font-size: 30px;
  top: 45%;
  z-index: 10;
  cursor: pointer;
}
.modeller-left-arrow {
  position: absolute;
  left: 0;
}
@media only screen and (max-width: 992px) {
  .modeller-left-arrow {
    left: -10px;
  }
}
.modeller-left-arrow:hover {
  color: #f95602;
}
.modeller-left-arrow.icon-arrow-left {
  color: #f95602;
  font-size: 20px;
  padding: 20px;
  left: -20px;
  top: 85px;
}
.modeller-right-arrow {
  position: absolute;
  right: 0;
}
.modeller-right-arrow:hover {
  color: #f95602;
}
.modeller-bar-chart-outer {
  overflow: hidden;
}
.modeller-bar-chart-outer .benfit-slider {
  width: 200%;
  font-size: 0;
  position: relative;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.modeller-bar-chart-outer .benfit-slider.slideLeft {
  margin-left: -100%;
}
@media only screen and (max-width: 1050px) {
  .modeller-bar-chart-outer .benfit-slider.slideLeft {
    margin-left: -110%;
  }
}
.modeller-bar-chart-outer .benfit-slider .modeller-bar-chart-wrapper {
  width: 50%;
  vertical-align: top;
  display: inline-block;
}
.modeller-bar-chart-outer .benfit-slider .modeller-bar-chart-wrapper .graphLabelpensions-bar-mobile {
  font-size: 14px;
  background: white;
}
.modeller-bar-chart-outer .benfit-slider .slick-prev,
.modeller-bar-chart-outer .benfit-slider .slick-next {
  height: 30px;
  width: 22px;
}
.modeller-bar-chart-outer .benfit-slider .slick-prev:before,
.modeller-bar-chart-outer .benfit-slider .slick-next:before {
  color: #b2b2b2;
  font-size: 30px;
}
.modeller-bar-chart-outer .benfit-slider .slick-prev:hover:before,
.modeller-bar-chart-outer .benfit-slider .slick-next:hover:before {
  color: #f95602;
}
.modeller-bar-chart-outer .benfit-slider .slick-next {
  right: -4px;
}
.icon-information {
  color: #949494;
  display: block;
  font-size: 18px;
}
.icon-information:hover,
.icon-information:focus,
.icon-information:active {
  text-decoration: none;
  color: #f95602;
}
#pension-bar {
  float: left;
  margin-right: 20px !important;
}
#pension-keys {
  border: none;
  float: left;
  margin-top: 35px;
  padding: 0;
  width: 35%;
}
#pension-keys p {
  margin-bottom: 20px;
  width: 80%;
}
.switch-modeller-section {
  height: 100%;
}
.switch-modeller-section .button.full {
  margin-bottom: 10px;
}
.modeller-slider > article,
.modeller-slider-mobile > article {
  float: left;
  width: 397px;
}
.modeller-other-fund-value-error,
.drawdown-other-fund-value-error {
  margin-bottom: 20px;
  color: #f95602;
  display: none;
}
#switch-assumptions form .h3 {
  font-size: 16px;
  margin-bottom: 15px;
}
#annuity-options .radio-container,
#growth-assumption .radio-container {
  margin-right: 10px;
}
.calculate-benefits {
  width: 49%;
  margin: 0 0 0 1%;
}
.reset-adjustments {
  width: 49%;
  margin: 0 1% 0 0;
  white-space: nowrap;
}
@media only screen and (max-width: 768px) {
  .reset-adjustments.drawdown-one,
  .reset-adjustments.drawdown-two {
    margin-bottom: 20px;
  }
}
.view-modeller-notes {
  width: 49%;
}
.projection-cog:hover,
.projection-cog:active,
.projection-cog:focus {
  text-decoration: none;
  color: #f95602;
}
#switch-assumptions {
  margin-top: 10px;
  /* TODO: was 35px (is it an Umbraco change?) */

}
.switch-title-main {
  display: block;
}
.switch-title-main.hidden {
  display: none;
}
.modeller-slider {
  margin-left: 0;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.modeller-slider.left-slide {
  margin-left: -100%;
}
.modeller-slider-mobile {
  width: 200%;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.modeller-graph-wrapper-mobile {
  width: 50% !important;
}
.modeller-graph-wrapper-mobile .icon-arrow-right {
  display: block;
  height: 60px;
  top: 105px;
  font-size: 20px;
  padding: 20px;
  right: 0;
}
.modeller-graph-wrapper-mobile .icon-arrow-right:before {
  position: absolute;
  left: 20px;
}
.modeller-graph-wrapper-mobile .icon-arrow-left {
  display: block;
  height: 60px;
  top: 40px;
  font-size: 20px;
  padding: 20px;
  left: 0;
  width: 40px;
}
.modeller-graph-wrapper-mobile .icon-arrow-left:before {
  position: absolute;
  left: 0;
}
.drawdown-graph-orientation-icon {
  position: absolute;
  right: 60px;
  top: 25px;
  display: none;
  font-size: 25px;
  color: #f95602;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 400px) {
  .drawdown-graph-orientation-icon {
    display: block;
  }
}
.slide-stats-left {
  margin-left: -100%;
}
.drawdown-other-fund-value-error {
  color: #f95602;
  display: none;
}
#drawdown-other-fund-value {
  width: 99%;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#drawdown-other-fund-value.fade-out {
  visibility: hidden;
  opacity: 0;
}
.drawdown-other-fund-thank-you {
  background: #f6f6f6;
  padding: 38px;
  text-align: center;
  margin-bottom: 7px;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  bottom: -60px;
  width: 100%;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.drawdown-other-fund-thank-you p {
  margin-bottom: 0;
  width: 90%;
}
.drawdown-other-fund-thank-you.fade-in {
  visibility: visible;
  opacity: 1;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type=number] {
  -moz-appearance: textfield;
}
div#equinitiModal input[type=number]::-webkit-inner-spin-button,
div#equinitiModal input[type=number]::-webkit-outer-spin-button {
  -moz-appearance: spinner-textfield;
  -webkit-appearance: inner-spin-button;
  opacity: 1;
}
div#equinitiModal input[type="number"] {
  margin-bottom: 0 !important;
}
/* Benefits Modeller Tabs
	-----------------------------------------------*/

.modeller-tab-content {
  position: absolute;
  top: -9999px;
  left: -9999px;
}
.modeller-tab-content.active {
  position: relative;
  top: 0;
  left: 0;
}
.subtab-content.hidden {
  display: none;
}
/* Income drawdown
	-----------------------------------------------*/

@media only screen and (max-width: 768px) {
  .incomedrawdown-annual-income {
    margin-bottom: 25px;
  }
}
.drawdown-assumptions {
  border-bottom: 1px solid #f95602;
  padding-bottom: 15px;
}
.input-section h3,
.input-section .h3 {
  font-size: 16px;
  padding-bottom: 15px;
  margin-bottom: 20px;
}
.help-info-drawdown-help {
  display: none;
}
@media only screen and (max-width: 400px) {
  h3.switch,
  .h3.switch {
    font-size: 18px;
  }
}
.switch-title-main .icon-drawdown2 {
  border-top: 1px solid #f95602;
  border-bottom: 1px solid #f95602;
  color: #f95602;
  padding: 5px;
}
.drawdown-slider-wrapper {
  overflow: hidden;
}
.drawdown-slider-outer {
  overflow: hidden;
  width: 100%;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 976px) {
  .drawdown-slider-outer {
    width: auto;
  }
}
.drawdown-slider-outer.expanded {
  width: 208%;
}
.modeller-slider {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.modeller-slider.slide-right {
  -ms-transform: translate(500px, 0);
  -webkit-transform: translate(500px, 0);
  -moz-transform: translate(500px, 0);
  -o-transform: translate(500px, 0);
  transform: translate(500px, 0);
}
.switch-modeller.icon-close {
  display: none;
  font-size: 13px;
  padding: 8px 0px;
}
.switch-modeller.icon-close:hover,
.switch-modeller.icon-close:focus,
.switch-modeller.icon-close:active {
  text-decoration: none;
  color: #f95602;
}
.switch-modeller.icon-close.shown {
  display: block !important;
}
.h3.switch-title-main {
  display: block;
}
.h3.switch-title-main.close {
  display: none;
}
.h3.switch-title-main .close-copy {
  color: #4f2170;
  font-size: 14px;
  float: right;
  font-weight: 100;
  margin-top: 4px;
  text-align: right;
  padding: 4px 0 5px 0;
}
@media only screen and (max-width: 992px) {
  .h3.switch-title-main .close-copy {
    padding: 0;
    margin-top: 0;
  }
}
@media only screen and (max-width: 400px) {
  .h3.switch-title-main .icon-drawdown2 {
    display: none;
  }
}
/* Drawdown graphs & sliders
	-----------------------------------------------*/

.assumptions-slider-container {
  height: 100%;
  margin-bottom: 60px;
}
.spinner-outer {
  text-align: center;
}
.spinner-outer div {
  display: inline-block;
  vertical-align: top;
}
.drawdown-spinner-wrapper {
  position: relative;
  width: 130px;
  height: 200px;
  margin: 5px 15px;
}
.drawdown-spinner-wrapper.disabled .drawdown-spinner-graph-overlay {
  cursor: default;
}
@media only screen and (max-width: 450px) {
  .drawdown-spinner-wrapper {
    width: 100px !important;
    height: 150px !important;
    margin: 0;
  }
}
.drawdown-spinner-wrapper .drawdown-spinner-graph-overlay {
  height: 140px;
  position: absolute;
  display: block;
  width: 140px;
  cursor: pointer;
  zoom: 1;
  filter: alpha(opacity=0);
  opacity: 0;
}
@media only screen and (max-width: 450px) {
  .drawdown-spinner-wrapper .drawdown-spinner-graph-overlay {
    width: 100px;
    height: 100px;
  }
}
.drawdown-spinner-wrapper .drawdown-spinner-graph-overlay.inactive {
  background: rgba(255, 255, 255, 0.8);
  z-index: 10;
  opacity: 1;
}
.drawdown-spinner-wrapper .drawdown-spinner-graph {
  width: 130px !important;
  height: 130px !important;
  cursor: pointer;
}
@media only screen and (max-width: 450px) {
  .drawdown-spinner-wrapper .drawdown-spinner-graph {
    width: 100px !important;
    height: 100px !important;
  }
}
.drawdown-spinner-wrapper .spinner-value.annual-income,
.drawdown-spinner-wrapper .spinner-value.your-cash,
.drawdown-spinner-wrapper .spinner-value.income-period {
  position: absolute;
  top: 0;
  height: 120px;
}
.drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.your-cash-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.your-cash-text,
.drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.your-cash-text,
.drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.income-period-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.income-period-text,
.drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.income-period-text,
.drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.your-cash-two-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.your-cash-two-text,
.drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.your-cash-two-text {
  height: 35px;
  top: 45px;
}
@media only screen and (max-width: 450px) {
  .drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.your-cash-text,
  .drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.your-cash-text,
  .drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.your-cash-text,
  .drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.income-period-text,
  .drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.income-period-text,
  .drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.income-period-text,
  .drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.your-cash-two-text,
  .drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.your-cash-two-text,
  .drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.your-cash-two-text {
    top: 35px;
  }
}
.drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.annual-income-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.annual-income-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.annual-income-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.your-cash-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.your-cash-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.your-cash-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.income-period-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.income-period-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.income-period-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.your-cash-two-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.your-cash-two-text.annual-income-text,
.drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.your-cash-two-text.annual-income-text {
  font-size: 16px;
  top: 53px;
}
@media only screen and (max-width: 450px) {
  .drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.annual-income-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.annual-income-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.annual-income-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.your-cash-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.your-cash-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.your-cash-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.income-period-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.income-period-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.income-period-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.annual-income .spinner-value.your-cash-two-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.your-cash .spinner-value.your-cash-two-text.annual-income-text,
  .drawdown-spinner-wrapper .spinner-value.income-period .spinner-value.your-cash-two-text.annual-income-text {
    font-size: 12px;
    top: 40px;
  }
}
.drawdown-spinner-wrapper .spinner-value.annual-income .annual-income-min-max-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .annual-income-min-max-text,
.drawdown-spinner-wrapper .spinner-value.income-period .annual-income-min-max-text,
.drawdown-spinner-wrapper .spinner-value.annual-income .your-cash-fixed-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .your-cash-fixed-text,
.drawdown-spinner-wrapper .spinner-value.income-period .your-cash-fixed-text {
  left: 0;
  right: 0;
  bottom: 35px;
  font-size: 9px;
  position: absolute;
}
.drawdown-spinner-wrapper .spinner-value.annual-income .your-cash-fixed-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .your-cash-fixed-text,
.drawdown-spinner-wrapper .spinner-value.income-period .your-cash-fixed-text {
  display: none;
}
.drawdown-spinner-wrapper .spinner-value.annual-income .annual-income-min-max-text,
.drawdown-spinner-wrapper .spinner-value.your-cash .annual-income-min-max-text,
.drawdown-spinner-wrapper .spinner-value.income-period .annual-income-min-max-text {
  left: 0;
  right: 0;
  top: 76px;
  /* TODO: fixed font size */
  font-size: 10px;
  position: absolute;
}
.drawdown-spinner-wrapper p {
  font-size: 15px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 450px) {
  .drawdown-spinner-wrapper p {
    font-size: 13px;
    line-height: 15px;
  }
}
.anual-income-spinner-graph-input,
.your-cash-spinner-graph-input,
.your-years-spinner-graph-input,
.your-cash-two-spinner-graph-input {
  visibility: hidden;
  opacity: 0;
  font-size: 0;
}
.annual-income-value-minus,
.income-period-value-minus,
.your-cash-value-minus,
.annual-income-value-plus,
.income-period-value-plus,
.your-cash-value-plus {
  text-decoration: none;
}
.annual-income-value-minus:hover,
.income-period-value-minus:hover,
.your-cash-value-minus:hover,
.annual-income-value-plus:hover,
.income-period-value-plus:hover,
.your-cash-value-plus:hover,
.annual-income-value-minus:focus,
.income-period-value-minus:focus,
.your-cash-value-minus:focus,
.annual-income-value-plus:focus,
.income-period-value-plus:focus,
.your-cash-value-plus:focus,
.annual-income-value-minus:active,
.income-period-value-minus:active,
.your-cash-value-minus:active,
.annual-income-value-plus:active,
.income-period-value-plus:active,
.your-cash-value-plus:active {
  text-decoration: none;
  color: #f95602;
}
.slider-outer {
  display: block;
}
.slider-outer.hidden-slider {
  display: none;
}
.drawdown-graph-container-overlay {
  width: 50%;
  height: 100%;
  position: absolute;
  cursor: pointer;
  z-index: 999;
}
.drawdown-bar-graph-wrapper-mobile,
.drawdown-bar-graph-wrapper-desktop {
  margin: 20px 0 0 0;
  width: 90%;
  position: relative;
  text-align: center;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.drawdown-bar-graph-wrapper-desktop {
  margin: 37px 0;
}
.drawdown-bar-graph-canvas {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.radio-section.drawdown-radio-buttons span {
  display: inline-block !important;
  margin: 0 15px 15px 0;
  width: 25px;
  height: 25px;
}
.radio-section.drawdown-radio-buttons label {
  display: inline-block !important;
  width: 70%;
}
.radio-section.drawdown-radio-buttons label.last-label {
  margin: 0 0 20px 0;
}
.input-section h3,
.input-section .h3 {
  clear: both;
}
#pension-keys-mobile {
  width: 15%;
}
@media screen and (max-width: 640px) and (orientation: portrait) {
  #pension-keys-mobile {
    width: auto;
  }
}
/* Your fund balances
	-----------------------------------------------*/

.contributions-container {
  border-right: 1px solid #f95602;
}
.contributions span.radio-container,
.time-period span.radio-container {
  clear: none !important;
  margin-right: 10px;
}
.contributions label {
  margin-right: 15px;
}
.time-period label {
  margin-right: 20px;
}
#chart-section {
  width: 100%;
  margin-top: 50px;
  text-align: center;
}
#chartjs-tooltip {
  opacity: 0;
  position: absolute;
  background: rgba(0, 0, 0, 0.7);
  color: white;
  padding: 10px;
  border-radius: 3px;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
  pointer-events: none;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  width: 132px;
}
#chartjs-tooltip.below {
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
#chartjs-tooltip.below:before {
  border: solid;
  /* TODO: brand - new colours */
  border-color: #111111 transparent;
  border-color: rgba(0, 0, 0, 0.8) transparent;
  border-width: 0 8px 8px 8px;
  bottom: 1em;
  content: "";
  display: block;
  left: 50%;
  position: absolute;
  z-index: 99;
  -webkit-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
}
#chartjs-tooltip.above {
  -webkit-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
}
#chartjs-tooltip.above:before {
  border: solid;
  /* TODO: brand - new colours */
  border-color: #111111 transparent;
  border-color: rgba(0, 0, 0, 0.8) transparent;
  border-width: 8px 8px 0 8px;
  bottom: 1em;
  content: "";
  display: block;
  left: 50%;
  top: 100%;
  position: absolute;
  z-index: 99;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
#chartjs-tooltip p {
  line-height: 18px;
}
#chartjs-tooltip p:last-child {
  margin-bottom: 0;
}
.fund-value {
  margin: 0 0 20px 0;
  padding: 15px 25px;
}
.fund-value h2.subheader {
  font-size: 35px;
}
.contribution-list,
.fund-list,
.portfolio-fund-list {
  list-style-type: none;
  margin: 0;
}
.contribution-list,
.fund-list {
  font-size: 13px;
  max-height: 356px;
  padding: 10px;
  border-top: 1px solid #eaeaea;
}
.contribution-list.mobile,
.fund-list.mobile {
  display: inline-block;
  max-height: none;
  border-top: none;
  margin-left: 10px;
  position: absolute;
}
.fund-list {
  display: none;
}
.contribution-list span,
.fund-list span,
.portfolio-fund-list span {
  border-radius: 3px;
  float: left;
  height: 12px;
  margin: 6px 12px 0 0;
  width: 12px;
  display: inline-block;
}
.contribution-list h5,
.contribution-list .h5,
.contribution-list p,
.fund-list h5,
.fund-list p {
  color: #505050;
  display: inline-block;
  font-size: 15px;
  margin-bottom: 0;
}
.contribution-list.mobile h5,
.contribution-list.mobile .h5 {
  color: #505050;
  display: inline-block;
  font-size: 12px;
  margin-bottom: 0;
}
.contribution-list.mobile p {
  font-size: 12px;
}
.contribution-list.mobile span {
  border-radius: 3px;
  float: left;
  height: 12px;
  margin: 3px 3px 6px 0;
  width: 12px;
  display: inline-block;
}
.contribution-list h5,
.contribution-list .h5,
.fund-list h5 {
  margin-bottom: 5px;
  clear: left;
  display: block;
}
.contribution-list p,
.fund-list p {
  float: left;
  width: 90%;
}
@media only screen and (max-width: 768px) {
  .contribution-list p,
  .fund-list p {
    display: inline-block;
  }
}
.contribution-list a,
.fund-list a,
.portfolio-fund-list a {
  text-decoration: none;
}
.contribution-list,
.fund-list {
  font-size: 12px;
}
@media only screen and (max-width: 480px) {
  .contribution-list li,
  .fund-list li {
    width: 100%;
    float: none;
  }
}
.contribution-info {
  display: none;
  margin-bottom: 40px;
}
.remember-this {
  display: none;
  font-size: 14px;
  line-height: 18px;
  margin-top: 20px;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .remember-this {
    font-size: 11px;
    line-height: 1.1;
  }
}
.remember-this sup {
  display: inline-block;
  vertical-align: super;
  margin-top: 2px;
  line-height: 1;
}
.disabled h4 {
  color: #eaeaea;
}
.disabled .available-funds {
  border-top: 1px solid #b2b2b2;
  border-bottom: none;
  margin-bottom: 0;
}
.disabled .available-funds > div {
  display: none;
}
.disabled .available-funds:before,
.disabled .available-funds:after {
  background: #f6f6f6;
}
.available-funds {
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  border: 1px solid #eaeaea;
  border-left: none;
  border-right: none;
  margin-bottom: 20px;
}
.available-handler,
.all-available-handler {
  cursor: pointer;
  border-bottom: 1px solid #f95602;
  padding: 5px 0 5px 20px;
  width: 100%;
  /* JF 18506, 23904 removed width to stop new line */

}
.available-handler .add-fund,
.all-available-handler .add-fund,
.available-handler .remove-fund,
.all-available-handler .remove-fund {
  background: #f95602;
  color: white;
  float: left;
  text-decoration: none;
}
.available-handler .add-fund:hover,
.all-available-handler .add-fund:hover,
.available-handler .remove-fund:hover,
.all-available-handler .remove-fund:hover,
.available-handler .add-fund:focus,
.all-available-handler .add-fund:focus,
.available-handler .remove-fund:focus,
.all-available-handler .remove-fund:focus,
.available-handler .add-fund:active,
.all-available-handler .add-fund:active,
.available-handler .remove-fund:active,
.all-available-handler .remove-fund:active {
  color: white;
}
.available-handler .remove-fund,
.all-available-handler .remove-fund {
  border-right: 2px solid white;
  font-size: 3px;
}
.available-handler p.percentage-label,
.all-available-handler p.percentage-label {
  text-align: right;
  padding-top: 3px;
}
.available-handler p.text-label,
.all-available-handler p.text-label {
  width: auto;
  text-align: right;
}
.grey .all-available-handler {
  background: #949494;
  border-color: white;
  color: white;
}
.grey .all-available-handler .icon-arrow-down {
  /* TODO: brand - new colour (?) */
  color: white;
}
.available-handler:last-child,
.all-available-handler:last-child {
  border: none;
}
.available-handler.active,
.all-available-handler.active {
  background: #4f2170;
}
.all-available-handler.active {
  border: none;
}
.available-funds:before,
.available-funds:after {
  background: #f6f6f6;
  content: '';
  display: block;
  height: 8px;
}
.available-handler h3,
.available-funds p,
.all-available-handler h3,
.all-available-funds p {
  font-size: 14px;
  float: left;
  margin: 0;
  padding: 5px 0;
}
.available-handler p,
.all-available-handler p {
  float: right;
}
.available-handler.active h3,
.available-handler.active p,
.all-available-handler.active h3,
.all-available-handler.active p {
  color: white;
}
.available-handler h3,
.all-available-handler h3 {
  width: calc(80% - 115px);
}
.toggle-performance {
  color: #505050 !important;
}
.available-handler .toggle,
.all-available-handler .toggle {
  border-left: 1px solid #f95602;
  color: #f95602;
  float: right;
  font-size: 11px;
  margin-left: 20px;
  padding: 10px 20px;
}
.available-handler .toggle.fund-fact-sheet,
.all-available-handler .toggle.fund-fact-sheet {
  font-size: 20px;
  padding: 5px 20px;
  text-decoration: none;
}
.available-handler .toggle.fund-fact-sheet.white,
.all-available-handler .toggle.fund-fact-sheet.white {
  color: white;
}
.available-handler .toggle.fund-fact-sheet.hover,
.all-available-handler .toggle.fund-fact-sheet.hover,
.available-handler .toggle.fund-fact-sheet:active,
.all-available-handler .toggle.fund-fact-sheet:active,
.available-handler .toggle.fund-fact-sheet:focus,
.all-available-handler .toggle.fund-fact-sheet:focus {
  text-decoration: none;
}
.available-handler .toggle.lastIcon,
.all-available-handler .toggle.lastIcon {
  margin-left: 0;
  text-decoration: none;
}
.available-handler.no-fund {
  border-left: 2px solid #f6f6f6;
  color: #b2b2b2;
  margin-left: 40px;
  padding-left: 14px;
}
.available-handler.active .toggle,
.all-available-handler.active .toggle {
  border-bottom: none;
  color: white;
  text-decoration: none;
}
.available-handler.active .toggle:hover .all-available-handler.active .toggle:hover {
  text-decoration: none;
}
.available-buttons {
  float: right;
  display: none;
}
@media (max-width: 767px) {
  .available-buttons {
    float: none;
  }
}
.available-buttons button {
  margin-left: 20px;
}
@media screen and (min-width: 768px) {
  .available-buttons button {
    margin-left: 5px;
  }
}
.available-content,
.all-available-content {
  display: none;
  padding: 10px 0 0;
}
.all-available-content {
  background: white;
  border-bottom: 1px solid #f95602;
}
.all-available-content:last-of-type {
  border: none;
}
.available-content .slide,
.all-available-content .slide {
  padding: 0 20px;
}
.available-content .slide .minus,
.all-available-content .slide .minus,
.available-content .slide .plus,
.all-available-content .slide .plus {
  text-decoration: none;
}
.available-content p,
.all-available-content p {
  display: block;
  float: none;
  padding: 0 20px 10px;
}
.available-content h3,
.all-available-content h3 {
  padding-left: 20px;
}
.available-content .grey {
  background: #f6f6f6;
  border-top: 1px solid #eaeaea;
  font-size: 14px;
  padding: 18px 0 20px;
}
.slide .spinner {
  margin-right: 29px !important;
}
.view-performance,
.back-to-fund {
  border-left: 1px solid #eaeaea;
  color: #4f2170;
  display: inline-block;
  float: left;
  font-size: 14px;
  line-height: 16px;
  padding: 50px 0 50px 18px;
  position: relative;
  width: 198px;
  text-decoration: none;
}
.view-performance:hover,
.back-to-fund:hover {
  text-decoration: inherit;
}
.view-performance:active,
.back-to-fund:active {
  color: #4f2170;
}
.view-performance:focus,
.back-to-fund:focus {
  outline: 0;
  color: #f95602;
}
.view-performance.full {
  margin-bottom: 20px;
  padding: 91px 0 91px 10px;
  text-align: left;
}
.back-to-fund {
  border: none;
  border-right: 1px solid #f6f6f6;
  padding: 99px 18px 99px 0;
  text-align: right;
}
.view-performance:after,
.back-to-fund:after {
  font-family: 'equiniti';
  content: "\e603";
  color: #f95602;
  font-size: 20px;
  margin-top: -8px;
  position: absolute;
  right: 0;
  top: 50%;
}
.all-available-content .view-performance:after,
.back-to-fund:after {
  color: #f95602;
}
.back-to-fund:after {
  content: "\e602";
  left: 0;
  right: auto;
}
.fund-slider > div {
  float: left;
}
.fund-graph {
  float: left;
  margin: 0 23px;
}
.fund-graph.full-width {
  float: none;
  margin: 0;
}
@media screen and (max-width: 400px) {
  .fund-graph.full-width canvas {
    width: 225px !important;
    height: 112px !important;
  }
}
.add-fund,
.remove-fund {
  background: #f95602;
  color: white;
  float: left;
  margin: -5px 15px -5px -20px;
  padding: 12px;
  padding-bottom: 13px;
  position: relative;
}
.add-fund:hover {
  color: white;
  /* TODO: brand - new colour */
  background: #cc4a40;
}
.remove-fund {
  border-right: 2px solid white;
  font-size: 3px;
  padding: 19px 14px;
  padding-bottom: 19px;
}
.total-height-parent {
  overflow: hidden;
  position: relative;
}
.total-height,
.total-height-left,
.total-height-right {
  height: 100%;
  position: absolute;
  top: 0;
  margin: 0;
}
.total-height-left {
  left: 0;
}
.total-height-right {
  right: 0;
}
/* Documents
	-----------------------------------------------*/

#browse-documents {
  margin-top: 50px;
}
.document-header {
  /* TODO: brand - new colour */
  border: 1px solid #f6f6f6;
  border-bottom: none;
}
.document-header h5 {
  /* TODO: brand - new colour */
  color: #949494;
  float: left;
  font-size: 16px;
  line-height: 34px;
  margin: 0 0 0 10px;
}
.document-header .icon-chev-down,
.document-header .icon-chev-up {
  color: #505050;
  float: right;
  line-height: 34px;
  margin: 0 15px 0 0;
  text-decoration: none;
}
.document-header .icon-chev-down:hover,
.document-header .icon-chev-up:hover {
  color: #f95602;
  text-decoration: none;
}
.document-header .icon-chev-down:focus,
.document-header .icon-chev-up:focus {
  outline: none;
  text-decoration: none;
}
#documents-container {
  /* TODO: brand - new colour */
  border: 1px solid #eaeaea;
  border-top: none;
  width: 100%;
  overflow-x: auto;
}
.jstree-container-ul {
  /* TODO: brand - new colour */
  border: 1px solid #eaeaea;
}
.jstree-container-ul .h5 {
  margin: 0;
  padding: 4px 0;
  text-align: center;
}
#documents-container .icon-records {
  color: #f95602;
  font-size: 16px;
}
#documents-container .icon-folder-closed {
  color: #b2b2b2;
}
#documents-container .icon-folder-open {
  color: #252525;
}
#document-filter-container {
  position: relative;
}
#document-filter {
  width: 100%;
}
#document-filter.headroom--not-top.slideDown {
  /* TODO: brand - new colour */
  background: rgba(255, 255, 255, 0.9);
  border-top: 4px solid #f95602;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
  left: 0;
  padding: 25px 0 30px;
  position: fixed;
  top: 0;
  z-index: 10;
}
.animated {
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  -o-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
}
@-webkit-keyframes slideDown {
  0% {
    -webkit-transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes slideDown {
  0% {
    -moz-transform: translateY(-100%);
  }
  100% {
    -moz-transform: translateY(0);
  }
}
@-o-keyframes slideDown {
  0% {
    -o-transform: translateY(-100%);
  }
  100% {
    -o-transform: translateY(0);
  }
}
@keyframes slideDown {
  0% {
    transform: translateY(-100%);
  }
  100% {
    transform: translateY(0);
  }
}
.animated.slideDown {
  -webkit-animation-name: slideDown;
  -moz-animation-name: slideDown;
  -o-animation-name: slideDown;
  animation-name: slideDown;
}
@-webkit-keyframes slideUp {
  0% {
    -webkit-transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-100%);
  }
}
@-moz-keyframes slideUp {
  0% {
    -moz-transform: translateY(0);
  }
  100% {
    -moz-transform: translateY(-100%);
  }
}
@-o-keyframes slideUp {
  0% {
    -o-transform: translateY(0);
  }
  100% {
    -o-transform: translateY(-100%);
  }
}
@keyframes slideUp {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-100%);
  }
}
.animated.slideUp {
  -webkit-animation-name: slideUp;
  -moz-animation-name: slideUp;
  -o-animation-name: slideUp;
  animation-name: slideUp;
}
/* FAQs
	-----------------------------------------------*/

#faqs span.red,
#accordions span.red,
.sidebar-accordion span.red {
  float: left;
}
p.accordion-text {
  margin-top: 30px;
  margin-bottom: 15px;
  line-height: 22px;
}
@media (min-width: 768px) {
  #faqs.ui-helper-reset {
    padding: 0 15px;
  }
}
.accordion-content p a {
  color: #f95602;
  text-decoration: underline;
}
.accordion-content p a:hover {
  color: #f95602;
}
.accordion-content ol li a,
.accordion-content ul li a {
  color: #f95602;
  text-decoration: underline;
}
.accordion-content ol li a:hover,
.accordion-content ul li a:hover {
  color: #f95602;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .accordion-content p a {
    color: #f95602;
    text-decoration: none;
    border-bottom: 1px solid #f95602;
  }
  .accordion-content p a:hover {
    color: #f95602;
    border-bottom: 1px solid #f95602;
  }
  .accordion-content ol li a,
  .accordion-content ul li a {
    color: #f95602;
    text-decoration: none;
    border-bottom: 1px solid #f95602;
  }
  .accordion-content ol li a:hover,
  .accordion-content ul li a:hover {
    color: #f95602;
    border-bottom: 1px solid #f95602;
  }
}
@media (hover: none), (hover: on-demand) {
  .accordion-content p a:hover {
    color: #f95602;
    text-decoration: underline;
  }
  .accordion-content ol li a:hover,
  .accordion-content ul li a:hover {
    color: #f95602;
    text-decoration: underline;
  }
}
@media (hover: none), (hover: on-demand) and (-webkit-min-device-pixel-ratio: 0) {
  .accordion-content p a:hover {
    color: #f95602;
    border-bottom: 1px solid #f95602;
    text-decoration: none;
  }
  .accordion-content ol li a:hover,
  .accordion-content ul li a:hover {
    color: #f95602;
    border-bottom: 1px solid #f95602;
    text-decoration: none;
  }
}
.ui-accordion.ui-helper-reset {
  padding: 0px 15px;
}
.ui-accordion .ui-accordion-header {
  border: 1px solid #eeeeee;
  cursor: pointer;
  font-size: 16px;
  line-height: 16px;
  margin-bottom: 0;
  padding: 15px 40px 15px 15px;
  position: relative;
  background: #4f2170;
}
.ui-accordion .ui-accordion-header span {
  color: white;
  float: left;
  font-size: 16px;
  line-height: 16px;
}
.ui-accordion .ui-accordion-header .title {
  float: left;
  width: 85%;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  color: white;
  font-size: 18px;
  right: 5px;
  position: absolute;
  top: 14px;
  text-indent: 0;
  background-image: none;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon.ui-icon-triangle-1-e {
  width: 20px;
  margin-top: 3px;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon.ui-icon-triangle-1-e:before {
  content: "\e601";
  font-family: 'equiniti';
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon.ui-icon-triangle-1-s:before {
  content: "\e604";
  font-family: 'equiniti';
}
.ui-accordion .ui-accordion-header.ui-accordion-header-active {
  background: #f95602;
  color: white;
}
.ui-accordion .ui-accordion-header.ui-accordion-header-active span {
  color: white;
  line-height: 20px;
  text-indent: 0;
  background-image: none;
}
.ui-accordion .ui-accordion-header.ui-accordion-header-active span.ui-icon-triangle-1-s {
  width: 20px;
}
.ui-accordion .ui-state-hover {
  background: #f95602;
}
.ui-accordion .ui-state-hover span {
  color: white;
}
.ui-accordion .ui-state-hover .ui-accordion-header-icon {
  color: white;
  font-size: 18px;
  right: 5px;
  position: absolute;
  top: 14px;
  text-indent: 0;
  background-image: none;
}
.ui-accordion .ui-state-hover .ui-accordion-header-icon.ui-icon-triangle-1-e {
  width: 20px;
}
.ui-accordion .ui-state-hover .ui-accordion-header-icon.ui-icon-triangle-1-e:before {
  content: "\e601";
  font-family: 'equiniti';
}
.ui-accordion .ui-state-hover .ui-accordion-header-icon.ui-icon-triangle-1-s:before {
  content: "\e604";
  font-family: 'equiniti';
}
.accordion-container section.ui-helper-reset {
  padding: 0;
}
.accordion-header {
  padding: 0px !important;
}
.ui-accordion .ui-accordion .ui-accordion-header {
  background: #331549;
}
.ui-accordion .ui-accordion .ui-accordion .ui-accordion-header {
  background: #170a21;
}
.ui-accordion .ui-accordion .ui-accordion .ui-accordion .ui-accordion-header {
  background: black;
}
.ui-accordion .ui-accordion .ui-accordion .ui-accordion .ui-accordion .ui-accordion-header {
  background: black;
}
.ui-accordion article {
  padding: 15px;
}
.ui-accordion article span {
  margin-right: 10px;
}
.ui-accordion article p {
  width: 95%;
  color: black;
}
.ui-accordion article p.salary-tablet,
.ui-accordion article p .salary-desktop {
  display: none;
}
@media screen and (max-width: 992px) {
  .ui-accordion article p.salary-tablet {
    display: block;
  }
}
@media screen and (max-width: 992px) {
  .ui-accordion article p.salary-desktop {
    display: none;
  }
}
.ui-accordion article p a {
  color: #f95602;
  text-decoration: underline;
}
.ui-accordion article p a:hover {
  text-decoration: underline !important;
  color: #f95602;
}
.ui-accordion article p sup {
  top: -8px;
  color: black;
  font-size: 12px;
}
.ui-accordion article ol li a,
.ui-accordion article ul li a {
  color: #f95602;
  text-decoration: underline;
}
.ui-accordion article ol li a:hover,
.ui-accordion article ul li a:hover {
  text-decoration: underline !important;
  color: #f95602;
}
.ui-accordion article ol li sup,
.ui-accordion article ul li sup {
  top: -8px;
  color: #f95602;
  font-size: 12px;
}
.ui-accordion .contacts br {
  display: none;
}
.ui-accordion .info {
  clear: both;
  display: block;
  margin: 0 0 10px 26px;
}
.accordion-container article.ui-accordion-content {
  padding: 15px;
}
@media (max-width: 667px) {
  .accordion-container > p {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.ui-accordion_table table th,
.ui-accordion_table table td {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 5px;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .ui-accordion article p a {
    text-decoration: none !important;
    border-bottom: 1px solid #f95602;
  }
  .ui-accordion article p a:hover {
    text-decoration: none !important;
    border-bottom: 1px solid #f95602;
  }
  .ui-accordion article ol li a,
  .ui-accordion article ul li a {
    text-decoration: none !important;
    border-bottom: 1px solid #f95602;
  }
  .ui-accordion article ol li a:hover,
  .ui-accordion article ul li a:hover {
    text-decoration: none !important;
    border-bottom: 1px solid #f95602;
  }
}
@media (hover: none), (hover: on-demand) {
  .ui-accordion article p a:hover {
    color: #f95602;
    text-decoration: underline;
  }
  .ui-accordion article ol li a:hover,
  .ui-accordion article ul li a:hover {
    color: #f95602;
    text-decoration: underline;
  }
}
@media (hover: none), (hover: on-demand) and (-webkit-min-device-pixel-ratio: 0) {
  .ui-accordion article p a:hover {
    color: #f95602;
    border-bottom: 1px solid #f95602;
  }
  .ui-accordion article ol li a:hover,
  .ui-accordion article ul li a:hover {
    color: #f95602;
    border-bottom: 1px solid #f95602;
  }
}
.accordion-content {
  padding: 15px !important;
}
.benefit-statement-main .ui-accordion-header-icon.ui-icon-triangle-1-s:before {
  content: "\2212";
  font-family: Arial;
  font-size: 30px;
}
.benefit-statement-main .ui-icon-triangle-1-s {
  text-align: center;
}
#account-details article,
.benefit-statement-main article {
  font-size: 15px;
  padding: 15px 15px;
}
#account-details article .account-col-1,
.benefit-statement-main article .account-col-1 {
  float: left;
  padding: 0 30px 0 15px;
  width: 50%;
}
#account-details article .account-col-2,
.benefit-statement-main article .account-col-2 {
  float: right;
  padding: 0 0 0 30px;
  width: 50%;
}
#account-details article .table-wrapper,
.benefit-statement-main article .table-wrapper {
  width: 100%;
  overflow-x: auto;
}
#account-details article p,
.benefit-statement-main article p {
  margin-bottom: 8px;
  width: 100%;
}
#account-details article p strong,
.benefit-statement-main article p strong {
  font-weight: 300;
  width: 50%;
  display: block;
  float: left;
}
#account-details article p span,
.benefit-statement-main article p span {
  display: block;
  float: left;
  margin: 0;
  width: 100px;
  width: 50%;
}
#account-details article label,
.benefit-statement-main article label {
  font-size: 15px;
}
@media screen and (max-width: 480px) {
  #account-details article label,
  .benefit-statement-main article label {
    font-size: 14px;
  }
}
#account-details article table,
.benefit-statement-main article table {
  width: 49%;
  float: left;
  margin-left: 2%;
  font-size: 15px;
}
@media screen and (max-width: 480px) {
  #account-details article table,
  .benefit-statement-main article table {
    font-size: 14px;
  }
}
#account-details article table.minimal,
.benefit-statement-main article table.minimal {
  width: 100%;
}
#account-details article table.minimal th,
.benefit-statement-main article table.minimal th {
  padding: 14px 10px;
}
#account-details article table.minimal th.col-1,
.benefit-statement-main article table.minimal th.col-1,
#account-details article table.minimal th.col-2,
.benefit-statement-main article table.minimal th.col-2 {
  width: 20%;
}
#account-details article table.minimal th.col-3,
.benefit-statement-main article table.minimal th.col-3,
#account-details article table.minimal th.col-4,
.benefit-statement-main article table.minimal th.col-4 {
  width: 30%;
}
@media screen and (max-width: 480px) {
  #account-details article table.minimal th.col-1,
  .benefit-statement-main article table.minimal th.col-1,
  #account-details article table.minimal th.col-2,
  .benefit-statement-main article table.minimal th.col-2,
  #account-details article table.minimal th.col-3,
  .benefit-statement-main article table.minimal th.col-3 {
    width: 40%;
  }
}
#account-details article table.minimal th:first-child,
.benefit-statement-main article table.minimal th:first-child {
  padding: 14px 10px 10px 0;
}
#account-details article table.minimal th:last-child,
.benefit-statement-main article table.minimal th:last-child {
  padding: 14px 0 10px 10px;
}
#account-details article table.minimal td,
.benefit-statement-main article table.minimal td {
  padding: 10px;
  text-align: left;
  width: auto;
  font-size: 15px;
  white-space: nowrap;
  color: black;
}
#account-details article table.minimal td:first-child,
.benefit-statement-main article table.minimal td:first-child {
  padding: 10px 10px 10px 0;
}
#account-details article table.minimal td:last-child,
.benefit-statement-main article table.minimal td:last-child {
  padding: 10px 0 10px 10px;
}
@media screen and (max-width: 480px) {
  #account-details article table.minimal td,
  .benefit-statement-main article table.minimal td {
    font-size: 14px;
  }
}
#account-details article table:first-child,
.benefit-statement-main article table:first-child {
  margin-left: 0;
}
#account-details article table td,
.benefit-statement-main article table td {
  width: 50%;
  padding: 5px;
}
#account-details article table td.data-label,
.benefit-statement-main article table td.data-label {
  color: black;
}
#account-details article table td.data-label a,
.benefit-statement-main article table td.data-label a {
  color: black;
}
#account-details article table td.dataField,
.benefit-statement-main article table td.dataField {
  color: black;
}
#account-details article table tr,
.benefit-statement-main article table tr {
  border-bottom: 1px solid #dddddd;
}
#account-details article table .salary-tablet,
.benefit-statement-main article table .salary-tablet {
  display: none;
}
#account-details article table .hold-to-show:hover,
.benefit-statement-main article table .hold-to-show:hover {
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  #account-details article table .salary-tablet,
  .benefit-statement-main article table .salary-tablet {
    display: table-row;
  }
  #account-details article table .salary-desktop,
  .benefit-statement-main article table .salary-desktop {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  #account-details article table,
  .benefit-statement-main article table {
    width: 100%;
    margin-left: 0;
  }
  #account-details article table td,
  .benefit-statement-main article table td {
    padding-right: 15px;
  }
}
@media (max-width: 767px) {
  .h3 span {
    font-size: 20px;
    margin-right: 8px;
  }
}
/* Full fund performance
	-----------------------------------------------*/

.full-line-graph,
.performance-line-graph,
#graph-holder {
  margin-bottom: 20px;
}
#graph-holder {
  margin-bottom: 40px;
  clear: both;
}
#graph-holder #placeholder {
  min-height: 400px;
  max-height: 400px;
  width: 100%;
}
@media screen and (max-width: 550px) {
  #graph-holder #placeholder {
    min-height: 350px;
    max-height: 350px;
  }
}
@media screen and (max-width: 500px) {
  #graph-holder #placeholder {
    min-height: 300px;
    max-height: 300px;
  }
}
@media screen and (max-width: 450px) {
  #graph-holder #placeholder {
    min-height: 200px;
    max-height: 200px;
  }
}
@media screen and (max-width: 768px) {
  .flot-x-axis .flot-tick-label {
    font-size: 11px;
  }
}
@media screen and (max-width: 600px) {
  .flot-x-axis .flot-tick-label {
    font-size: 9px;
  }
}
@media screen and (max-width: 550px) {
  
}
.fund-performance > div {
  border-bottom: none;
  margin-bottom: 2px;
}
.fund-performance > div:last-child {
  margin-bottom: 0;
}
.fund-performance > div a {
  border-right: 2px solid white;
}
/* Your portfolio
	-----------------------------------------------*/

.full-height {
  height: 100%;
  left: 335px;
}
.full-height .vertical-align {
  display: table;
  width: 100%;
  height: 100%;
}
.full-height .vertical-align .center-me {
  display: table-cell;
  vertical-align: middle;
}
#portfolio-contributions {
  display: none;
}
.disable-available-funds {
  pointer-events: none;
  opacity: 0.3;
}
.subheader {
  font-family: 'Open Sans', Calibri, arial, sans-serif;
  font-size: 20px;
  font-weight: 300;
  line-height: normal;
  margin-bottom: 10px;
  border-bottom: none;
}
/* Transaction history
	-----------------------------------------------*/

.timeframe {
  margin-bottom: 10px !important;
}
.timeframe span.radio-container {
  clear: none !important;
}
.timeframe span.radio-container:nth-of-type(odd) {
  clear: left !important;
}
.timeframe label:nth-of-type(odd) {
  width: 150px !important;
}
.remove-cancel::-ms-clear {
  display: none;
  width: 0;
  height: 0;
}
#errorAppendedModal {
  display: none;
}
#loginErrorMessage {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #de0001;
  z-index: 10000;
  padding: 20px;
  text-align: center;
}
#loginErrorMessage button {
  float: none;
  margin: 20px auto;
}
#scheme-pdf,
.scheme-pdf {
  margin: 10px 20px 10px 0;
}
#tsAndCsModal .legal-lines {
  max-height: 300px;
  overflow: auto;
  margin-bottom: 0;
  -webkit-overflow-scrolling: touch;
  font-size: 14px;
  line-height: 1.4;
}
@media screen and (max-width: 500px) {
  #tsAndCsModal .legal-lines {
    max-height: 200px;
    padding: 10px;
  }
}
#tsAndCsModal .modal-body {
  padding: 5px;
}
#tsAndCsModal .modal-footer {
  margin-top: 0;
}
#tsAndCsModal h4 {
  font-size: 18px;
}
#credential-slider {
  width: 500%;
}
#credential-slider label {
  color: white;
}
#credential-slider .cred-slide {
  width: 20%;
  padding: 10px;
}
#credential-slider .remember-me {
  text-align: left;
}
#credential-slider .accept-ts-and-cs {
  text-align: left;
  padding-left: 15px;
}
#credential-slider .accept-ts-and-cs a {
  display: inline;
  float: none;
  font-size: 16px;
}
#credential-slider .accept-ts-and-cs label {
  line-height: 1.2;
  font-size: 16px;
}
#credential-slider .accept-ts-and-cs #AcceptTsAndCs {
  position: absolute;
}
#credential-slider input[type=checkbox] {
  visibility: hidden;
}
#credential-slider label[for=RememberMe],
#credential-slider label[for=AcceptTsAndCs] {
  position: relative;
  padding-left: 10px;
  cursor: pointer;
}
#credential-slider label[for=RememberMe]:before,
#credential-slider label[for=AcceptTsAndCs]:before {
  content: "";
  display: block;
  position: absolute;
  background-color: white;
  width: 17px;
  height: 17px;
  border: 3px solid white;
  left: -15px;
  top: 0;
}
#credential-slider label[for=RememberMe].checked:before,
#credential-slider label[for=AcceptTsAndCs].checked:before {
  background-color: #de0001;
}
.fund-slider {
  width: 200%;
}
.fund-changer {
  width: 100%;
  margin-top: 20px;
  margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
  .fund-changer {
    width: 50%;
    margin-top: 45px;
  }
}
.slide {
  width: 50%;
}
.mobile-slider-buttons a {
  width: 50%;
  padding: 20px;
  margin: 0;
}
.fund-graph {
  max-width: 340px;
}
@media screen and (max-width: 767px) {
  .fund-graph {
    width: 100%;
    margin: 0;
    float: none;
    max-width: 100%;
  }
}
.cont-type {
  text-transform: capitalize;
}
.buy-message {
  text-align: center;
  display: block;
}
.portfolio-fund-list {
  overflow: auto;
  display: block;
  padding: 10px 30px 10px 0px;
}
@media only screen and (max-width: 767px) {
  .portfolio-fund-list {
    max-height: 150px;
  }
}
.portfolio-fund-list li {
  font-size: 12px;
  padding: 5px 10px 5px 10px;
  margin-bottom: 0;
  line-height: 1.4;
}
@media only screen and (max-width: 767px) {
  .portfolio-fund-list li {
    display: block;
    width: 50%;
    float: left;
  }
}
@media screen and (max-width: 380px) {
  .portfolio-fund-list li {
    width: 100%;
    float: none;
  }
}
.portfolio-fund-list li p {
  margin-bottom: 0;
  width: 90%;
}
.amended {
  display: none;
}
@media screen and (min-width: 768px) {
  .amended {
    display: inline;
    position: relative;
    /* JF - 17/02/16 - 18325 - removed fix gap, coz we don't want it. */
  
    /*right: 25px;*/
  
  }
}
#checkout-feedback-area {
  clear: both;
  padding: 20px;
}
#checkout-feedback-area .error {
  padding: 10px;
  background-color: #ffcccc;
}
.individual-all-funds-holder {
  margin-top: 20px;
  margin-bottom: 20px;
  /* TODO: brand - new colour */
  border-bottom: 5px solid #d0d0d0;
  padding: 10px;
  background-color: #f6f6f6;
}
.individual-all-funds-holder h2.subheader {
  /* TODO: brand - new colour */
  border-bottom: 1px solid #d0d0d0;
  font-size: 20px;
  margin-bottom: 10px;
  line-height: normal;
}
.individual-all-funds-holder .all-available-container {
  background-color: white;
}
@media screen and (min-width: 768px) {
  .individual-all-funds-holder {
    padding: 20px;
  }
}
.individual-all-funds-holder.disabledOverlay,
.all-available-performance-funds.disabledOverlay {
  position: relative;
}
.individual-all-funds-holder.disabledOverlay:after,
.all-available-performance-funds.disabledOverlay:after {
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 105%;
  position: absolute;
  background: rgba(255, 255, 255, 0.8);
}
.icon-arrow-down:hover,
.icon-arrow-up:hover,
.icon-arrow-down:focus,
.icon-arrow-up:focus,
.icon-arrow-down:active,
.icon-arrow-up:active {
  text-decoration: none;
}
.add-container .percentage-label {
  float: right;
  padding: 5px 0;
}
.add-container .text-label {
  float: right;
  padding: 5px 0;
}
#checkout-table {
  margin-bottom: auto;
}
#checkout-table .selling {
  border-top: 3px solid #f95602;
}
#checkout-table .selling td {
  /* TODO: brand - new colour */
  border-bottom: 3px solid #d0d0d0;
}
#checkout-table .selling td:first-child {
  border-bottom: 0;
}
.pending-changes-message {
  padding: 20px;
  color: white;
  background-color: #3c9ddc;
  margin-bottom: 20px;
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  .pending-changes-message {
    font-size: 12px;
    padding: 10px;
  }
}
#checkout-table-container {
  max-height: 350px;
  overflow: auto;
  width: 100%;
}
@media screen and (max-width: 768px) {
  #checkout-table-container {
    max-height: 200px;
  }
}
@media screen and (max-width: 768px) {
  .benefit-overview {
    width: 100%;
    margin: 0;
  }
}
#all-available-performance-funds {
  margin-top: 20px;
}
#right-slider {
  overflow: hidden;
}
#right-slider .modeller-slider {
  width: 200%;
}
#right-slider .modeller-slider > article {
  width: 50%;
}
.right-slider {
  overflow: hidden;
}
.right-slider .modeller-slider {
  width: 200%;
}
.right-slider .modeller-slider > article {
  width: 50%;
}
#top-slider {
  overflow: hidden;
  padding-top: 10px;
}
#top-slider .modeller-slider-mobile {
  width: 200%;
}
#top-slider .modeller-slider-mobile > article {
  width: 50%;
}
#benefit-graph,
#benefit-info {
  position: relative;
}
#benefit-graph .icon-arrow-right {
  display: block;
  height: 60px;
  font-size: 20px;
  padding: 20px;
  right: 0;
  top: 95px;
}
#benefit-graph .icon-arrow-right:before {
  font-size: 20px;
  top: 50%;
  left: 20px;
  margin-top: -10px;
  display: block;
  position: absolute;
}
#benefit-info .icon-arrow-left {
  height: 50px;
  top: 45px;
  font-size: 20px;
  padding: 20px;
  right: 30px;
  width: 30px;
}
#benefit-info .icon-arrow-left:before {
  font-size: 20px;
  top: 50%;
  left: 0;
  margin-top: -10px;
  display: block;
  position: absolute;
}
#switch-assumptions .radio label {
  width: 70%;
  font-size: 0.9em;
  margin-bottom: 10px;
}
#switch-assumptions .select-message {
  clear: both;
}
#switch-assumptions form .row {
  margin-bottom: 20px;
}
.spinner-container {
  max-width: 400px;
  margin: 10px auto 0 auto;
}
@media screen and (max-width: 450px) {
  .spinner-container {
    margin-bottom: 60px;
    max-width: 300px;
  }
}
@media screen and (max-width: 350px) {
  .spinner-container {
    max-width: 270px;
  }
}
.spinner-container .spinner a {
  height: 127px;
}
@media screen and (max-width: 450px) {
  .spinner-container .spinner {
    width: 95px;
    height: 95px;
  }
  .spinner-container .spinner p {
    margin-top: -20px;
    font-size: 13px;
    line-height: 15px;
  }
  .spinner-container .spinner a {
    height: 100px;
  }
  .spinner-container .spinner a.active {
    width: 120%;
    left: -1px;
  }
}
@media screen and (max-width: 350px) {
  .spinner-container .spinner {
    width: 85px;
    height: 85px;
    margin-right: 1%;
  }
  .spinner-container .spinner p {
    margin-top: -20px;
    font-size: 12px;
    line-height: 12px;
  }
  .spinner-container .spinner a {
    height: 90px;
  }
}
#benefit-bar-mobile {
  height: 150px;
  width: 100%;
}
#mobile-graph-holder {
  max-width: 400px;
  margin: 0 auto;
  padding-top: 10px;
}
@media screen and (max-width: 450px) {
  #mobile-graph-holder {
    max-width: 300px;
  }
}
@media screen and (max-width: 350px) {
  #mobile-graph-holder {
    max-width: 270px;
  }
}
@media screen and (max-width: 768px) {
  #growth-assumption {
    width: 50%;
    float: left;
  }
}
@media screen and (max-width: 768px) {
  #annuity-options {
    width: 50%;
    float: left;
  }
}
.no-knob .fund-graph {
  width: 60%;
  text-align: center;
  max-width: 100%;
}
@media screen and (max-width: 768px) and (min-width: 567px) {
  .no-knob .fund-graph {
    width: 60%;
  }
}
@media screen and (max-width: 567px) {
  .no-knob .fund-graph {
    width: 100%;
  }
}
.no-knob .mobile-slider-buttons a {
  width: 80%;
  display: block;
  margin: 0 auto 10px auto;
  float: none;
  border-left: 0;
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #eaeaea;
}
#cancel-changes {
  margin-top: 20px;
}
@media screen and (min-width: 768px) {
  #cancel-changes {
    margin-right: 20px;
    margin-top: 0;
  }
}
.ui-widget-header {
  border: 0;
}
.homepage h3 {
  color: black;
}
.homepage h3 a {
  text-decoration: none;
  color: black;
}
.homepage h3 a:hover {
  text-decoration: none;
  color: #de0001;
}
#scheme-name-mobile {
  display: none;
}
@media screen and (max-width: 767px) {
  #scheme-name-mobile {
    display: block;
    margin-top: 5px;
  }
}
.your-benefits .button {
  font-size: 13px;
}
#projection-basis {
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}
#projection-basis a,
#switch-assumptions a {
  text-decoration: none;
}
.projection-basis-intro {
  margin-top: 35px;
}
.caveat {
  font-size: 14px;
  margin-top: 20px;
}
.caveat sup {
  font-size: 12px;
  display: inline-block;
  vertical-align: super;
}
#change-contact-details .fa-2x {
  font-size: 1.5em;
}
#change-contact-details .col-2 {
  padding-top: 0;
  padding-bottom: 0;
}
#change-contact-details .accept-contact {
  color: green;
}
#change-contact-details .cancel-contact {
  color: red;
}
#change-contact-details .contact-details-icon {
  color: #de0001;
}
#change-contact-details label {
  font-weight: 600;
  color: black;
}
#change-contact-details input[disabled] {
  border: 0;
  background: white;
  padding: 0;
  margin: 0;
  color: black;
  -webkit-text-fill-color: black;
  -webkit-opacity: 1;
}
#change-contact-details input[type=text],
#change-contact-details input[type=email],
#change-contact-details input[type=password],
#change-contact-details input[type=radio],
#change-contact-details input[type=tel],
#change-contact-details input[type=number],
#change-contact-details input[type=date],
#change-contact-details textarea,
#change-contact-details select {
  color: black;
}
#change-contact-details .disable {
  color: lightgray;
}
#change-contact-details .disable label {
  font-weight: 600;
  color: lightgray;
}
#change-contact-details .disable input[disabled] {
  color: lightgray;
  -webkit-text-fill-color: lightgray;
  -webkit-opacity: 1;
}
#change-contact-details .disable input[type=text],
#change-contact-details .disable input[type=email],
#change-contact-details .disable input[type=password],
#change-contact-details .disable input[type=radio],
#change-contact-details .disable input[type=tel],
#change-contact-details .disable input[type=number],
#change-contact-details .disable input[type=date],
#change-contact-details .disable textarea,
#change-contact-details .disable select {
  color: lightgray;
}
#change-contact-details .disable .red {
  color: lightgray;
  pointer-events: none;
}
#change-contact-details .disable .red:hover,
#change-contact-details .disable .red:focus {
  color: lightgray;
  cursor: default;
}
@media (min-width: 768px) {
  #change-contact-details .address-vertical-divider {
    border-right: 2px solid lightgray;
  }
}
@media (max-width: 767px) {
  #change-contact-details .address-horizontal-divider {
    border-bottom: 2px solid lightgray;
  }
}
.pca .pcaitem {
  white-space: normal !important;
}
.card-layout #change-contact-details label {
  color: black;
}
.card-layout #change-contact-details input[disabled] {
  color: black;
}
.card-layout #change-contact-details input[type=text],
.card-layout #change-contact-details input[type=email],
.card-layout #change-contact-details input[type=password],
.card-layout #change-contact-details input[type=radio],
.card-layout #change-contact-details input[type=tel],
.card-layout #change-contact-details input[type=number],
.card-layout #change-contact-details input[type=date],
.card-layout #change-contact-details textarea,
.card-layout #change-contact-details select {
  color: black;
  -webkit-text-fill-color: black;
}
.card-layout #change-contact-details input[type=text] ::-webkit-input-placeholder,
.card-layout #change-contact-details input[type=email] ::-webkit-input-placeholder,
.card-layout #change-contact-details input[type=password] ::-webkit-input-placeholder,
.card-layout #change-contact-details input[type=radio] ::-webkit-input-placeholder,
.card-layout #change-contact-details input[type=tel] ::-webkit-input-placeholder,
.card-layout #change-contact-details input[type=number] ::-webkit-input-placeholder,
.card-layout #change-contact-details input[type=date] ::-webkit-input-placeholder,
.card-layout #change-contact-details textarea ::-webkit-input-placeholder,
.card-layout #change-contact-details select ::-webkit-input-placeholder {
  color: black;
}
.card-layout #change-contact-details input[type=text] ::-moz-placeholder,
.card-layout #change-contact-details input[type=email] ::-moz-placeholder,
.card-layout #change-contact-details input[type=password] ::-moz-placeholder,
.card-layout #change-contact-details input[type=radio] ::-moz-placeholder,
.card-layout #change-contact-details input[type=tel] ::-moz-placeholder,
.card-layout #change-contact-details input[type=number] ::-moz-placeholder,
.card-layout #change-contact-details input[type=date] ::-moz-placeholder,
.card-layout #change-contact-details textarea ::-moz-placeholder,
.card-layout #change-contact-details select ::-moz-placeholder {
  color: black;
}
.card-layout #change-contact-details div.address-string {
  color: black;
}
.card-layout p.contacts span {
  color: black;
}
#contact-details p a > span {
  margin-right: 0px;
}
#my-funds {
  margin-bottom: 30px;
  margin-top: 30px;
}
.spinner-value {
  background: transparent;
  position: absolute;
  width: 100%;
  font-size: 20px;
  padding: 5px 0 5px 0;
  top: 26px;
  left: 0;
  font-weight: 400;
  color: #bac405;
}
.spinner-value.grey {
  /* TODO: brand - new colour */
  color: #aaaaaa;
}
.spinner-value .mini-values {
  font-size: 11px;
  vertical-align: super;
}
@media screen and (min-width: 350px) {
  .spinner-value {
    top: 32px;
  }
}
@media screen and (min-width: 451px) {
  .spinner-value {
    top: 40px;
    font-size: 26px;
  }
}
@media screen and (min-width: 768px) {
  .spinner-value {
    top: 36px;
    font-size: 25px;
  }
}
@media screen and (min-width: 992px) {
  .spinner-value {
    top: 40px;
  }
}
.line-graph {
  width: 100%;
  height: 180px;
}
.line-graph .flot-x-axis {
  margin-top: -30px;
}
#p60s.section-selects {
  visibility: hidden;
}
#payslips.section-selects,
.displaying-payslip.p60,
.displaying-payslip.p60s {
  visibility: hidden;
}
#p60-details,
#payslip-details,
#p60s-view-all,
#payslips-viewall {
  display: none;
}
.p60-landing-subsection .button {
  width: 48%;
  margin-right: 4%;
}
.p60-landing-subsection .button:nth-child(2n) {
  margin-right: 0;
}
.p60-landing-subsection .button.full-width {
  width: 100%;
  margin-right: 0;
}
.p60-landing-subsection p {
  min-height: 90px;
}
.p60-landing-subsection .expand-control {
  display: none;
}
@media screen and (max-width: 480px) {
  .p60-landing-subsection .button {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }
  .p60-landing-subsection h3 {
    width: 80%;
    width: calc(100% - 40px);
    margin-right: 10px;
    float: left;
  }
  .p60-landing-subsection p {
    height: 0;
    min-height: 0;
    overflow: hidden;
    clear: both;
    -webkit-transition: min-height 0.3s ease-out;
    -moz-transition: min-height 0.3s ease-out;
    -ms-transition: min-height 0.3s ease-out;
    -o-transition: min-height 0.3s ease-out;
    transition: min-height 0.3s ease-out;
  }
  .p60-landing-subsection p.show {
    min-height: 90px;
  }
  .p60-landing-subsection .expand-control {
    display: block;
    height: 37px;
    border-top: 1px solid #f95602;
    border-bottom: 1px solid #f95602;
    width: 30px;
    float: left;
    position: relative;
    text-align: center;
  }
  .p60-landing-subsection .expand-control:before {
    display: block;
    width: 100%;
    position: absolute;
    top: 50%;
    text-align: center;
    font-size: 12px;
    margin-top: -6px;
  }
}
.p60-landing-subsection .section-selects {
  margin-top: 20px;
  clear: both;
  display: block;
}
.p60-landing-subsection .section-selects label {
  display: block;
}
.p60-landing-subsection .section-selects.view-all-p60 {
  width: 100%;
  float: left;
  clear: none;
  margin-top: 0;
}
.p60-landing-subsection .section-selects.view-all-p60 .styled-select {
  width: 100%;
}
@media screen and (min-width: 480px) {
  .p60-landing-subsection .section-selects.view-all-p60 {
    width: 48%;
    margin-top: -24px;
  }
}
@media screen and (min-width: 480px) {
  .p60-landing-subsection .styled-select {
    width: 48%;
    margin-right: 4%;
    float: left;
  }
  .p60-landing-subsection .styled-select:nth-child(3n) {
    margin-right: 0;
  }
}
.displaying-payslip {
  padding-left: 0;
  padding-right: 0;
}
.displaying-payslip .styled-select {
  margin-bottom: 10px;
}
.displaying-payslip.p60s label {
  display: block;
}
.displaying-payslip.p60s .styled-select {
  width: 50%;
  float: left;
}
@media screen and (min-width: 480px) {
  .displaying-payslip label {
    display: inline-block;
    width: 100%;
  }
  .displaying-payslip .styled-select {
    width: 48%;
    float: left;
    margin-right: 4%;
  }
  .displaying-payslip .styled-select:nth-child(3n) {
    margin-right: 0;
  }
}
@media screen and (min-width: 768px) {
  .displaying-payslip {
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 10px;
  }
  .displaying-payslip label {
    width: 20%;
    float: left;
    margin-top: 10px;
  }
  .displaying-payslip .styled-select {
    width: 30%;
    max-width: 200px;
    margin-right: 20px;
  }
}
@media screen and (min-width: 768px) {
  div.payslip-column-container {
    display: flex;
  }
}
@media screen and (min-width: 768px) {
  table.payslip-table-sm {
    display: none;
  }
  table.payslip-table-lg {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  table.payslip-table-sm {
    display: table;
  }
  table.payslip-table-lg {
    display: none;
  }
}
.payslip-column {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 0;
  padding-right: 0;
}
@media screen and (max-width: 768px) {
  .payslip-column {
    padding-left: 5px;
    padding-right: 5px;
  }
}
.payslip-column h5 {
  border-bottom: 1px solid #cccccc;
  padding-bottom: 5px;
  font-weight: bold;
  font-size: 15px;
}
.payslip-column table {
  width: 100%;
  font-size: 14px;
}
.payslip-column table .right-cell {
  text-align: right;
}
.payslip-column table td {
  padding: 5px 0;
}
@media screen and (min-width: 768px) {
  .payslip-column {
    padding: 0;
    border: 1px solid #cccccc;
    border-right: 0;
    position: relative;
    flex: 1 1 0;
  }
  .payslip-column.payments {
    width: 30%;
    float: left;
    /*height: 100%*/
  
  }
  .payslip-column.deductions {
    width: 25%;
    float: left;
    /*height: 100%*/
  
  }
  .payslip-column.payment-frequency {
    width: 45%;
    float: left;
    border-right: 1px solid #cccccc;
    /*height: 100%*/
  
  }
  .payslip-column.pay-to-date {
    width: 52%;
    float: left;
    min-height: 250px;
  }
  .payslip-column.tax-to-date {
    width: 48%;
    float: left;
    border-right: 1px solid #cccccc;
    min-height: 250px;
  }
  .payslip-column h5 {
    padding: 10px;
    margin-bottom: 0;
  }
  .payslip-column table {
    padding: 10px;
    margin-bottom: 40px;
    width: 100%;
  }
  .payslip-column table tr,
  .payslip-column table tbody {
    width: 100%;
  }
  .payslip-column table td {
    padding: 10px;
    width: 45%;
  }
  .payslip-column tr.last-row {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
  }
  .payslip-column tr.last-row td {
    width: 100%;
  }
}
@media screen and (min-width: 992px) {
  .payslip-column.payments {
    width: 33.33333333%;
  }
  .payslip-column.deductions {
    width: 33.33333333%;
  }
  .payslip-column.payment-frequency {
    width: 33.33333333%;
  }
}
.payslip-column tr.payslip-bottom-row table {
  padding: 0;
}
.payslip-column tr.payslip-bottom-row td {
  vertical-align: top;
  border-right: 1px solid white;
}
.payslip-column tr.payslip-bottom-row td:last-of-type {
  border-right: none;
}
@media screen and (max-width: 768px) {
  .payslip-column tr.payslip-bottom-row td {
    border-right: none;
  }
}
.payslip-column tr.payslip-bottom-row span.net-pay {
  float: right;
}
.payslip-column tr.payslip-bottom-row div.payment-type-title,
.payslip-column tr.payslip-bottom-row div.tax-code-title {
  width: 50%;
  float: left;
}
@media screen and (max-width: 768px) {
  .payslip-column tr.payslip-bottom-row div.payment-type-title,
  .payslip-column tr.payslip-bottom-row div.tax-code-title {
    width: 30%;
  }
}
.payslip-column tr.payslip-bottom-row div.payment-type-content,
.payslip-column tr.payslip-bottom-row div.tax-code-content {
  width: 50%;
  float: right;
}
@media screen and (max-width: 768px) {
  .payslip-column tr.payslip-bottom-row div.payment-type-content,
  .payslip-column tr.payslip-bottom-row div.tax-code-content {
    width: 70%;
    text-align: right;
  }
}
.payslip-column td.tax-code-label {
  width: 33.33333333%;
  font-weight: normal;
}
.payslip-column td.tax-code-label span {
  font-weight: bold;
}
.payslip-column td.payment-type-label {
  width: 33.33333333%;
  font-weight: normal;
}
.payslip-column td.payment-type-label span {
  font-weight: bold;
}
.payslip-column td.total-label {
  width: 33.33333333%;
  font-weight: normal;
  border-right: none;
}
.payslip-column td.total-label span {
  font-weight: bold;
}
.total-net-pay {
  background-color: #252525;
  color: white;
  font-weight: bold;
  clear: both;
  border: 0;
}
@media screen and (min-width: 768px) {
  .total-net-pay {
    float: right;
    width: 100%;
  }
  .total-net-pay table {
    display: table;
    margin-bottom: 0;
    width: 100%;
  }
  .total-net-pay table tbody {
    display: table;
  }
  .total-net-pay table tr {
    display: table-row;
  }
  .total-net-pay table tr td.right-cell {
    float: none;
  }
  .total-net-pay.final-tax-code {
    width: 48%;
  }
}
@media screen and (min-width: 992px) {
  .total-net-pay {
    width: 100%;
  }
}
.payslip-detail-container {
  margin-bottom: 20px;
}
@media screen and (min-width: 991px) {
  .payslip-detail-container {
    width: 1024px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .payslip-detail-section {
    width: 720px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 992px) {
  .payslip-detail-section {
    width: 83.333333333%;
    margin-left: 8.333333333%;
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
  }
}
@media screen and (max-width: 768px) {
  .payslip-detail-section {
    margin-bottom: 10px;
    margin-top: 10px;
  }
}
.view-all-section {
  margin-bottom: 20px;
}
.view-all-section.p60s .month-marker {
  font-size: 14px;
}
.view-all-section.p60s .view-all-table a {
  font-size: 14px;
  padding-right: 10px;
  padding-left: 10px;
}
.year-controls .year-control-prev,
.year-controls .year-control-next {
  display: block;
  height: 40px;
  width: 40px;
  float: left;
  text-align: center;
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  position: relative;
}
.year-controls .year-control-prev:link,
.year-controls .year-control-next:link,
.year-controls .year-control-prev:visited,
.year-controls .year-control-next:visited {
  color: #f95602;
  text-decoration: none;
}
.year-controls .year-control-prev:hover,
.year-controls .year-control-next:hover,
.year-controls .year-control-prev:active,
.year-controls .year-control-next:active {
  color: #f95602;
  text-decoration: none;
}
.year-controls .year-control-prev:before,
.year-controls .year-control-next:before {
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -9px;
  font-size: 18px;
  width: 100%;
  text-align: center;
}
.year-controls .year-control-prev:after {
  content: '';
  position: absolute;
  display: block;
  width: 1px;
  height: 30px;
  right: 0;
  top: 50%;
  margin-top: -15px;
  background: #cccccc;
}
.year-controls .year-control-next:after {
  content: '';
  position: absolute;
  display: block;
  width: 1px;
  height: 30px;
  left: 0;
  top: 50%;
  margin-top: -15px;
  background: #cccccc;
}
.year-controls .year-list-wrapper {
  overflow: hidden;
  width: 70%;
  width: calc(100% - 80px);
  float: left;
  height: 40px;
  margin-bottom: 20px;
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
}
.year-controls .year-list-viewport {
  -webkit-overflow-scrolling: touch;
  overflow-x: scroll;
  overflow-y: hidden;
  height: 70px;
}
.year-controls .year-list {
  float: left;
  list-style: none;
  white-space: nowrap;
  margin: 0;
  padding-left: 10px;
  padding-right: 10px;
}
.year-controls .year-list li {
  display: inline-block;
  width: 80px;
  height: 40px;
  position: relative;
  margin-bottom: 0;
  margin-left: -3px;
  margin-right: -3px;
}
.year-controls .year-list li:hover a {
  color: #f95602;
}
.year-controls .year-list li:hover:before {
  content: '';
  width: 100%;
  display: block;
  height: 1px;
  background: #f95602;
  position: absolute;
  top: 1px;
  z-index: 1000;
}
.year-controls .year-list li:hover:after {
  content: '';
  width: 100%;
  display: block;
  height: 1px;
  background: #f95602;
  position: absolute;
  bottom: 3px;
  z-index: 1000;
}
.year-controls .year-list li a {
  position: absolute;
  display: block;
  width: 100%;
  top: 50%;
  font-size: 16px;
  margin-top: -10px;
  text-align: center;
  text-decoration: none;
}
.year-controls .year-list li a:hover {
  text-decoration: none;
}
.year-controls .year-list li.active:before {
  content: '';
  width: 100%;
  display: block;
  height: 1px;
  background: #f95602;
  position: absolute;
  top: 1px;
  z-index: 1000;
}
.year-controls .year-list li.active:after {
  content: '';
  width: 100%;
  display: block;
  height: 1px;
  background: #f95602;
  position: absolute;
  bottom: 3px;
  z-index: 1000;
}
.year-controls .year-list li.active a {
  color: #f95602;
}
.year-controls .year-list li.active a:after {
  content: '.';
  display: block;
  bottom: 0;
  position: absolute;
  text-align: center;
  font-size: 36px;
  width: 100%;
}
.view-all-table {
  width: 100%;
}
.view-all-table .month-marker {
  font-size: 11px;
  width: 75%;
  text-align: left;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .view-all-table .month-marker {
    font-size: 12px;
  }
}
.view-all-table tr {
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  padding: 2px 0 2px 0;
}
.view-all-table td {
  border-right: 1px solid #cccccc;
  text-align: center;
}
.view-all-table td:last-child {
  border-right: 0;
}
.view-all-table a {
  font-size: 10px;
  padding: 10px 4px;
  display: inline-block;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .view-all-table a {
    font-size: 12px;
  }
}
@media screen and (min-width: 480px) {
  .view-all-table .month-marker {
    padding-left: 5px;
  }
}
@media screen and (min-width: 992px) {
  .view-all-table a,
  .view-all-table .month-marker {
    font-size: 14px;
  }
}
.view-all-table.monthly {
  font-size: 14px;
}
.view-all-table.monthly a,
.view-all-table.monthly .month-marker {
  font-size: 14px;
}
@media screen and (min-width: 768px) {
  .column1 {
    width: 48%;
    float: left;
    margin-right: 4%;
  }
}
.column2 .view-all-table tr:first-child {
  border-top: 0;
}
@media screen and (min-width: 768px) {
  .column2 {
    width: 48%;
    float: left;
  }
  .column2 .view-all-table tr:first-child {
    border-top: 1px solid #cccccc;
  }
}
.view-controls {
  float: right;
  display: none;
}
.view-controls button {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: none;
  color: #f95602;
  border: 1px solid #cccccc;
  width: 40px;
  height: 40px;
  display: block;
  float: left;
  font-size: 20px;
}
.view-controls button:first-child {
  border-right: 0;
}
.validation-summary-errors li {
  color: red;
}
.user-management-lg,
.user-management-sm {
  color: black;
  float: right;
  outline: 0;
}
.user-management-lg:hover,
.user-management-sm:hover,
.user-management-lg:active,
.user-management-sm:active,
.user-management-lg:focus,
.user-management-sm:focus {
  color: black;
  outline: 0;
}
.user-management-lg:active,
.user-management-sm:active {
  color: black;
}
.user-management-current {
  text-align: center;
}
.user-management-current .fa {
  font-size: 1.5em;
}
.user-management-lg {
  padding-top: 15px;
  padding-left: 15px;
}
.user-management-lg .fa-2x {
  font-size: 1.3em;
}
.user-management-sm {
  padding-top: 12px;
  padding-right: 15px;
}
.user-management-sm .fa-2x {
  font-size: 1.8em;
}
/* ---------Footer style start---------------- */

html,
body {
  height: 100%;
}
#wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
}
.vsmall-vertical-divider {
  height: 14px;
  margin: 0 9px;
  border-left: 1px solid white;
  border-right: 1px solid white;
  display: inline-block;
}
.primary-footer {
  color: white;
  background-color: #4f2170;
  position: relative;
  border-top: 0px solid #4f2170;
  bottom: 0;
  left: 0;
  right: 0;
}
.fw-container {
  width: 100%;
  /*max-width: 2560px;*/
  /*max-width: 1024px;*/
  margin: auto;
  height: auto;
  overflow: hidden;
}
.primary-footer__inner {
  padding-top: 15px;
  padding-bottom: 0px;
  text-align: left;
  margin-right: -15px;
}
.constrain--always {
  width: 90%;
  margin: auto;
}
.copyright-area {
  margin-top: 10px;
  padding-bottom: 10px;
}
@media (min-width: 30em) {
  .constrain {
    width: 90%;
    max-width: 1024px;
    margin: auto;
  }
}
@media (min-width: 64em) {
  .footer-area--top ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
  }
}
@media (min-width: 61.25em) {
  .footer-area--top {
    margin-bottom: 0;
    padding-top: 10px;
  }
  .footer-area--top ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
  }
}
@media (min-width: 61.25em) {
  .footer-area {
    display: inline-block;
  }
}
li.footer-nav__list-item {
  display: inline-block;
  margin-bottom: 5px;
}
li.footer-nav__list-item .footer-nav__list-link {
  text-decoration: none;
  color: white;
}
.footer-area--top {
  margin-bottom: 20px;
}
/* Tablet styles  */

@media screen and (min-width: 501px) and (max-width: 1024px) {
  .vsmall-vertical-divider {
    height: 14px;
    margin: 0 4px;
    border-left: 1px solid white;
    border-right: 1px solid white;
    display: inline-block;
  }
  .footer-area--top {
    margin-bottom: 10px;
  }
  .copyright-area {
    margin-top: 1px;
    padding-bottom: 10px;
  }
  .primary-footer {
    position: static;
    margin-top: 50px;
  }
  li.footer-nav__list-item {
    display: inline-block;
    margin-right: 0px;
    margin-bottom: 1px;
  }
  li.footer-nav__list-item .footer-nav__list-link {
    text-decoration: none;
    color: white;
  }
  ul.footer-social {
    margin: 5px 0 3px 0px;
  }
}
.unadjusted-for-inflation-notification {
  display: none;
}
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .footer-area--top {
    margin-bottom: 20px;
  }
  .copyright-area {
    margin-top: 10px;
    padding-bottom: 10px;
  }
}
/*Mobile screen*/

@media screen and (max-width: 500px) {
  .copyright-area {
    margin-top: 1px;
    padding-bottom: 10px;
  }
  .vsmall-vertical-divider {
    height: 0;
    border-left: 0;
    border-right: 0;
    display: none;
  }
  .primary-footer {
    position: static;
  }
  .footer-area {
    display: block;
  }
  .footer-area--top {
    max-width: 80%;
  }
  .footer-area--bottom ul {
    list-style: none;
    margin: 0;
  }
  li.footer-nav__list-item {
    display: block;
    margin-right: 0px;
    margin-bottom: 10px;
  }
  li.footer-nav__list-item .footer-nav__list-link {
    text-decoration: none;
    color: white;
  }
}
@media screen and (min-width: 61.25em) and (max-width: 75em) {
  .footer-area--bottom {
    width: 50%;
  }
  .copyright-area {
    margin-top: 0px;
  }
  .footer-area-bottom-rightside-content {
    flex-direction: column;
    display: flex !important;
    padding-top: 10px;
  }
  .footer-area-bottom-rightside-content .social-icons-content {
    order: 2;
  }
  .footer-area-bottom-rightside-content .copyright-content {
    order: 1;
    text-align: right;
    margin-right: 0px;
  }
}
@media screen and (max-width: 500px) and (orientation: landscape) {
  .copyright-area {
    margin-top: 1px;
    padding-bottom: 10px;
  }
}
@media (min-width: 64em) {
  .footer-area--bottom {
    width: 620px;
  }
  .footer-area--bottom ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
  }
}
@media (min-width: 61.25em) {
  .footer-area--bottom {
    float: right;
    width: 520px;
  }
}
@media (min-width: 61.25em) {
  .footer-area {
    display: inline-block;
  }
}
.footer-social__item {
  margin-left: 1px;
}
@media (min-width: 61.25em) {
  .copyright-area {
    float: right;
    margin-bottom: 0;
    text-align: left;
    margin-right: 20px;
  }
}
ul.footer-social,
.footer-social__item {
  display: inline-block;
  margin-bottom: 0px !important;
  margin-left: -7px;
  margin-top: -4px;
}
@media (min-width: 61.25em) {
  ul.footer-social {
    float: right;
    text-align: right;
  }
}
.footer-nav {
  display: block;
}
.footer-nav ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}
@media (min-width: 30em) {
  .footer-nav__list-item {
    display: inline-block;
    margin-right: 0px;
    margin-bottom: 0;
  }
}
.social-border {
  font-size: 20px;
  color: white;
}
.social-icons {
  font-size: 20px;
  color: white;
}
.footer-social-item-square {
  color: white;
  border-radius: 4px;
  width: 40px;
  height: 39px;
  display: block;
  box-sizing: border-box;
  position: relative;
}
@media screen and (min-width: 980px) and (max-width: 1200px) {
  .footer-area--bottom {
    width: 40%;
  }
  .footer-area--top {
    width: 60%;
  }
}
@media screen and (min-width: 1201px) {
  .footer-area--bottom {
    width: 45%;
  }
  .footer-area--top {
    width: 55%;
  }
}
@media only screen and (max-width: 767px) {
  .currentpensionvalue-sm-height {
    display: block;
    height: 60px;
  }
}
.loading-box {
  width: 100%;
  max-width: 900px;
  padding-top: 50px;
  margin: 0 auto 50px auto;
  text-align: center;
  background: rgba(255, 255, 255, 0.8);
}
.loading-box span {
  display: block;
  margin-bottom: 20px;
  font-size: 15px;
}
.cssanimations .loading {
  margin: 0 auto;
  border-bottom: 6px solid ligther(#f95602, 50%);
  border-left: 6px solid ligther(#f95602, 50%);
  border-right: 6px solid #f95602;
  border-top: 6px solid #f95602;
  border-radius: 100%;
  height: 50px;
  width: 50px;
  -webkit-animation: spin 0.6s infinite linear;
  -moz-animation: spin 0.6s infinite linear;
  -o-animation: spin 0.6s infinite linear;
  animation: spin 0.6s infinite linear;
  background-image: none;
}
.loading {
  margin: 0 auto;
  border-radius: 100%;
  height: 50px;
  width: 50px;
  background: transparent url('/images/ajax-loader.gif') no-repeat 50% 50%;
}
@keyframes spin {
  from {
    background: none;
    transform: rotate(0);
  }
  to {
    background: none;
    transform: rotate(359deg);
  }
}
@-moz-keyframes spin {
  from {
    background: none;
    -moz-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    background: none;
    -moz-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  from {
    background: none;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    background: none;
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  from {
    background: none;
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    background: none;
    -o-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
/* Employer Notification */

.employernotification,
.emailverificationnotification {
  background: #f8ffbb;
  padding: 10px 0;
}
.employernotification .content,
.emailverificationnotification .content {
  float: left;
}
.employernotification .content p,
.emailverificationnotification .content p {
  font-size: 14px;
  line-height: 17px;
  margin: 0;
}
.employernotification .content strong,
.emailverificationnotification .content strong {
  font-weight: 400;
}
.truncate-ellipsis-menu,
.truncate-ellipsis-header {
  display: table;
  table-layout: fixed;
  white-space: nowrap;
}
.truncate-ellipsis-menu > *,
.truncate-ellipsis-header > * {
  display: table-cell;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Side Bar Layout */

.body-with-sidebar {
  padding-top: 64px;
}
.body-with-sidebar.employer {
  padding-top: 0;
}
.break-word {
  word-break: break-word;
}
.no-underline {
  text-decoration: none !important;
}
#ui-datepicker-div.benefit-quotation-datepicker {
  border: 1px solid #eeeeee;
  background: white;
  color: black;
}
#ui-datepicker-div.benefit-quotation-datepicker .ui-widget-header {
  background: #de0001;
  color: black;
}
#ui-datepicker-div.benefit-quotation-datepicker .ui-state-default {
  color: #de0001;
}
#ui-datepicker-div.benefit-quotation-datepicker .ui-state-highlight {
  color: black;
  border: 1px solid black;
}
.transition-delay {
  transition-delay: 1.2s;
  -webkit-transition-delay: 1.2s;
  -moz-transition-delay: 1.2s;
  -o-transition-delay: 1.2s;
}
.transition-duration {
  transition-duration: 0.5s;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px white inset !important;
}
#lifecare-menu-button,
#healthcare-excess-menu-button,
#healthcare-rate-menu-button {
  width: 100% !important;
}
#healthcare p.red {
  color: #de0001;
}
.btn.eq-btn.eq-btn-primary.edit-income-deduction {
  font-size: 0.75em;
}
.body-with-sidebar .content-with-sidebar {
  min-height: 100%;
  height: auto !important;
  display: inline;
}
.body-with-sidebar #sidebar-layout {
  height: 100%;
}
.body-with-sidebar .nav.navbar-nav.navbar-right {
  margin-right: -15px;
}
.body-with-sidebar #header-section .img-container {
  position: absolute;
  overflow: hidden;
  height: 300px;
  width: 100%;
}
.body-with-sidebar #header-section .img-container img {
  width: 100%;
}
.body-with-sidebar #header-section .sidebar-header {
  position: relative;
}
@media (orientation: landscape) {
  .body-with-sidebar #header-section .img-container {
    height: 300px;
  }
}
@media (max-width: 991px) and (orientation: portrait) {
  .body-with-sidebar #header-section .img-container {
    height: 300px;
  }
}
.body-with-sidebar #header-section .hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgba(38, 48, 57, 0) 0%, transparent 60%);
}
.body-with-sidebar #header-section #header-title {
  color: white;
}
.body-with-sidebar #header-section #header-title #hero-title {
  position: absolute;
  bottom: 10%;
  left: 15px;
  right: 15px;
}
.body-with-sidebar #header-section #header-title h1 {
  border-bottom: 0;
}
.body-with-sidebar #header-section #header-title h1:after {
  content: '';
  display: block;
  width: 70px;
  border-bottom: 2px solid rgba(255, 255, 255, 0);
  padding-top: 16px;
}
.body-with-sidebar #quick-links {
  background-color: rgba(0, 0, 0, 0.5);
  margin-right: -15px;
  opacity: 100;
}
.body-with-sidebar #quick-links .list-group {
  padding-top: 20px;
  margin-bottom: 0;
}
.body-with-sidebar #quick-links .list-group-item {
  background-color: transparent;
  color: white;
  border-radius: 0;
  border-left: 0;
  border-right: 0;
}
.body-with-sidebar #quick-links .list-group-item:hover {
  background-color: rgba(0, 0, 0, 0.5);
}
.body-with-sidebar #quick-links a {
  color: white !important;
}
.body-with-sidebar #quick-links a:hover {
  color: #f95602 !important;
}
.body-with-sidebar #side-bar {
  background-color: #4f2170;
  padding-bottom: 20px;
  margin-right: -15px;
}
.body-with-sidebar #side-bar .sidebar-title {
  background-color: #4f2170;
  color: white;
  padding: 10px 15px;
}
.body-with-sidebar #side-bar .sidebar-title p {
  font-size: 18px;
  font-family: Arial;
  font-weight: 300;
  line-height: normal;
  margin-bottom: 10px;
}
.body-with-sidebar #side-bar .sidebar-content {
  margin-bottom: 20px;
  background-color: #4f2170;
}
.body-with-sidebar #side-bar .sidebar-content .list-group a.list-group-item {
  background-color: transparent;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid #4f2170;
}
.body-with-sidebar #side-bar .sidebar-content::after {
  clear: both;
  content: '';
  display: block;
}
.body-with-sidebar #side-bar .quick-contacts {
  margin: 0;
}
.body-with-sidebar #side-bar .quick-contacts .list-group-item {
  background-color: transparent;
  color: white;
  border-radius: 0;
  border: 0;
}
.body-with-sidebar #side-bar .quick-contacts .list-group-item p {
  margin-bottom: 0;
}
.body-with-sidebar #side-bar .quick-contacts .list-group-item .contact-name {
  font-weight: bold;
  text-decoration: underline;
  margin-bottom: 5px;
}
.body-with-sidebar #side-bar .quick-contacts .list-group-item .contact-info-header {
  margin-top: 3px;
  font-weight: bold;
}
.body-with-sidebar #side-bar .quick-contacts .list-group-item .email-font-size-80 {
  font-size: 80%;
}
.body-with-sidebar #side-bar .quick-contacts .list-group-item .email-font-size-90 {
  font-size: 90%;
}
.body-with-sidebar #side-bar .quick-contacts a,
.body-with-sidebar #side-bar .sidebar-content a {
  color: white !important;
}
.body-with-sidebar #side-bar .quick-contacts a:hover,
.body-with-sidebar #side-bar .sidebar-content a:hover {
  color: #f95602 !important;
}
.body-with-sidebar #side-bar .sidebar-Twitter-content {
  height: 100%;
}
.body-with-sidebar #side-bar #twitterContent iframe {
  width: 100% !important;
}
.body-with-sidebar #side-bar #news-section {
  background-color: transparent;
  padding-top: 10px;
  padding-bottom: 10px;
}
.body-with-sidebar #side-bar #news-section .carousel-indicators {
  bottom: 0;
}
.body-with-sidebar #side-bar #news-section .carousel-indicators li {
  margin: 0;
  border: 1px solid #f95602;
}
.body-with-sidebar #side-bar #news-section .carousel-indicators li.active {
  width: 10px;
  height: 10px;
  background-color: #f95602;
}
.body-with-sidebar #side-bar #news-section #social-carousel {
  height: 300px;
  width: 100%;
}
.body-with-sidebar #side-bar #news-section #social-carousel .carousel-inner {
  height: 300px;
}
@media (max-width: 991px) {
  .body-with-sidebar #side-bar #news-section #social-carousel {
    height: 200px;
    width: 100%;
  }
  .body-with-sidebar #side-bar #news-section #social-carousel .carousel-inner {
    height: 200px;
  }
}
@media (max-width: 991px) {
  .body-with-sidebar #side-bar {
    margin-bottom: 20px;
    margin-right: 0;
  }
}
.body-with-sidebar #body-section .body-sidebar {
  padding-top: 20px;
}
.body-with-sidebar #body-section .card-area {
  /*flex: 30%;
            margin-right: 5% !important;
            padding: 0;*/
  margin-bottom: 20px;
}
.body-with-sidebar #body-section .card-area:nth-child(3n) {
  margin-right: 0 !important;
}
@media only screen and (max-width: 600px) {
  .body-with-sidebar #body-section .card-area {
    flex: 47%;
    margin-right: 6% !important;
    margin-bottom: 20px;
  }
  .body-with-sidebar #body-section .card-area:nth-child(2n) {
    margin-right: 0 !important;
  }
  .body-with-sidebar #body-section .card-area:nth-child(3n) {
    margin-right: 6% !important;
  }
}
@media only screen and (max-width: 480px) {
  .body-with-sidebar #body-section .card-area {
    flex: 100%;
    margin-right: 0 !important;
    margin-bottom: 30px;
  }
  .body-with-sidebar #body-section .card-area:nth-child(2n) {
    margin-right: 0 !important;
  }
  .body-with-sidebar #body-section .card-area:nth-child(3n) {
    margin-right: 0 !important;
  }
}
.body-with-sidebar #body-section .box-img img {
  transition: all 0.3s ease-in-out;
}
.body-with-sidebar #body-section .box-img:hover {
  box-shadow: rgba(0, 0, 0, 0.25) 1px 1px 30px;
  transition: 0.2s;
}
.body-with-sidebar #body-section .box-img:hover img {
  transform: translateX(-50%) scale(1.1) !important;
}
.body-with-sidebar #body-section .box-img:hover img[src=""] {
  transform: translateX(-50%) !important;
}
.body-with-sidebar #body-section .box-img .card-footer {
  background-color: white;
}
.body-with-sidebar #body-section .box-img .card-footer p {
  margin: 0;
  color: black;
}
.body-with-sidebar #body-section .box-img .card-footer p:hover {
  color: #f95602;
}
.body-with-sidebar #body-section .box-img-head {
  padding: 0;
  height: 200px;
  background-color: transparent;
  overflow: hidden;
  position: relative;
}
.body-with-sidebar #body-section .box-img-head img[src=""] {
  padding: 75px 0;
}
.body-with-sidebar #body-section .box-img-head img.card-img {
  max-height: 100%;
  min-width: 100%;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  object-fit: cover;
  height: 100%;
}
@media only screen and (max-width: 480px) {
  .body-with-sidebar #body-section .box-img-head {
    height: 200px;
  }
}
.body-with-sidebar #body-section #contacts-container .contact-info-header,
.body-with-sidebar #body-section #contact-details .contact-info-header {
  margin-top: 10px;
  text-decoration: underline;
  font-weight: bold;
}
.body-with-sidebar #body-section #contacts-container .letter,
.body-with-sidebar #body-section #contact-details .letter {
  color: #f95602;
  display: inline-block;
  margin-right: 10px;
}
.body-with-sidebar #body-section #contacts-container > .row {
  margin-bottom: 10px;
}
.body-with-sidebar .primary-footer {
  margin-top: 0;
}
.full-width-banner {
  width: 100%;
  height: 131px;
  background: #4f2170;
  z-index: -1;
}
.full-width-banner + .container {
  margin-top: -100px;
}
.full-width-banner {
  height: 176px;
}
@media (max-width: 992px) and (min-width: 768px) {
  .card-layout-body .full-width-banner-250 {
    height: 250px;
  }
  .card-layout-body .full-width-banner-200 {
    height: 200px;
  }
}
@media (max-width: 767px) {
  .full-width-banner {
    height: 86px;
  }
  .full-width-banner + .container {
    margin-top: -65px;
  }
}
.w90 {
  width: 90%;
}
.w90-xs {
  width: 90%;
}
.w100 {
  width: 100%;
}
.w100-xs {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .w90-sm {
    width: 90%;
  }
  .w100-sm {
    width: 90%;
  }
}
@media only screen and (min-width: 992px) {
  .w90-md {
    width: 90%;
  }
  .w100-md {
    width: 90%;
  }
}
@media only screen and (min-width: 1050px) {
  .w90-lg {
    width: 90%;
  }
  .w100-lg {
    width: 90%;
  }
}
@media (max-width: 667px) {
  .card-layout > p {
    padding-left: 15px;
    padding-right: 15px;
  }
}
span.radio-container + label {
  padding-top: 4px;
}
.benefit-statement-main p.year-label {
  font-weight: 300;
  margin-bottom: 10px;
  font-size: 200%;
  display: inline;
}
.benefit-statement-main p.section-header {
  font-weight: bold;
  padding-left: 15px;
  margin: 0;
}
.benefit-statement-main button.download-pdf-button:before {
  font-family: "Font Awesome 5 Free";
  content: "\f019";
  display: inline-block;
  padding-right: 5px;
  font-weight: 900;
}
.benefit-statement-main #benefit-statement-year-label,
.benefit-statement-main #benefit-statement-year-label-mobile {
  padding: 0;
}
body.card-layout-body {
  overflow: auto !important;
}
@media (max-width: 992px) {
  .benefit-statement-main p.year-label {
    font-size: 150%;
  }
}
.card-header {
  border-radius: 10px 10px 0 0 !important;
}
#welcome-line {
  text-transform: capitalize;
  color: inherit;
  font-size: inherit;
  margin-right: 0;
}
.chartjs-tooltip {
  opacity: 0;
  position: absolute;
  background: rgba(0, 0, 0, 0.7);
  color: white;
  padding: 10px;
  border-radius: 3px;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
  pointer-events: none;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  width: 132px;
  z-index: 99;
}
.chartjs-tooltip.below {
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
.chartjs-tooltip.below:before {
  border: solid;
  border-color: #111111 transparent;
  border-color: rgba(0, 0, 0, 0.8) transparent;
  border-width: 0 8px 8px 8px;
  bottom: 1em;
  content: "";
  display: block;
  left: 50%;
  position: absolute;
  z-index: 99;
  -webkit-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
}
.chartjs-tooltip.above {
  -webkit-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
}
.chartjs-tooltip.above:before {
  border: solid;
  border-color: #111111 transparent;
  border-color: rgba(0, 0, 0, 0.8) transparent;
  border-width: 8px 8px 0 8px;
  bottom: 1em;
  content: "";
  display: block;
  left: 50%;
  top: 100%;
  position: absolute;
  z-index: 99;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
.chartjs-tooltip p {
  line-height: 18px;
}
.chartjs-tooltip p:last-child {
  margin-bottom: 0;
}
#documents-list {
  margin: 0;
}
#documents-list li {
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  color: #f95602;
}
#documents-list li:hover {
  color: white;
  background-color: #f95602;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  cursor: pointer;
}
#messages .carousel-control {
  top: 50%;
  background-image: none !important;
  font-size: 50px;
  color: transparent;
  text-shadow: none;
}
#messages .carousel-control:hover {
  color: #f95602;
}
#message-carousel {
  width: 100%;
}
.retirement-benefits {
  padding: 0.75em;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  color: white;
}
.retirement-benefits.retirement-benefits-pension {
  background-color: #1f4e79;
}
.retirement-benefits.retirement-benefits-pension span {
  color: white;
}
.retirement-benefits.retirement-benefits-lump-sum {
  background-color: #de0001;
}
.retirement-benefits.retirement-benefits-lump-sum span {
  color: white;
}
.calc-card-row:first-child {
  margin: 0 !important;
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes arrows-down {
  0% {
    opacity: 0;
    transform: translateY(-100%) rotate(-45deg);
    -webkit-transform: translateY(-100%) rotate(-45deg);
    -moz-transform: translateY(-100%) rotate(-45deg);
    -o-transform: translateY(-100%) rotate(-45deg);
  }
  100% {
    opacity: 1;
    transform: translateY(-51%) rotate(-45deg);
    -webkit-transform: translateY(-51%) rotate(-45deg);
    -moz-transform: translateY(-51%) rotate(-45deg);
    -o-transform: translateY(-51%) rotate(-45deg);
  }
}
@keyframes arrows-up {
  0% {
    opacity: 0;
    transform: translateY(100%) rotate(135deg);
    -webkit-transform: translateY(100%) rotate(135deg);
    -moz-transform: translateY(100%) rotate(135deg);
    -o-transform: translateY(100%) rotate(135deg);
  }
  100% {
    opacity: 1;
    transform: translateY(51%) rotate(135deg);
    -webkit-transform: translateY(51%) rotate(135deg);
    -moz-transform: translateY(51%) rotate(135deg);
    -o-transform: translateY(51%) rotate(135deg);
  }
}
.arrow-container .arrow-body {
  height: 15px;
  width: 45px;
  border: 0;
  margin: 0 auto;
  opacity: 0;
  animation: fade-in 1.5s ease forwards 0.25s;
  -webkit-animation: fade-in 1.5s ease forwards 0.25s;
  -moz-animation: fade-in 1.5s ease forwards 0.25s;
  -o-animation: fade-in 1.5s ease forwards 0.25s;
}
.arrow-container .arrow-head {
  width: 40px;
  height: 40px;
  border-top: 40px solid transparent;
  border-right: 40px solid transparent;
  margin: 0 auto;
  opacity: 0;
}
.arrow-container.down {
  margin-top: 55px;
}
.arrow-container.down .arrow-body {
  background: red;
}
.arrow-container.down .arrow-head {
  border-bottom: 40px solid red;
  border-left: 40px solid red;
  animation: arrows-down 1s ease forwards;
  -webkit-animation: arrows-down 1s ease forwards;
  -moz-animation: arrows-down 1s ease forwards;
  -o-animation: arrows-down 1s ease forwards;
}
.arrow-container.up .arrow-body {
  background: green;
}
.arrow-container.up .arrow-head {
  border-bottom: 40px solid green;
  border-left: 40px solid green;
  animation: arrows-up 1s ease forwards;
  -webkit-animation: arrows-up 1s ease forwards;
  -moz-animation: arrows-up 1s ease forwards;
  -o-animation: arrows-up 1s ease forwards;
}
.arrow-container.equal i {
  color: #0084b4;
  font-size: 5em;
  height: 35px;
  margin: 0 auto;
  display: block;
  text-align: center;
}
@media (min-width: 667px) and (max-width: 767px) {
  .last-login {
    width: 100%;
  }
  .benefits-data-item {
    width: 100%;
  }
}
@media (max-width: 666px) {
  .last-login {
    width: 100%;
  }
  .arrow-container {
    margin-top: 0;
  }
}
.benefits-dashboard-card .full-width-banner {
  height: 146px;
}
.benefits-dashboard-card .full-width-banner + .container {
  margin-top: -130px;
}
.benefits-dashboard-card .card-header {
  border-radius: 0;
}
.benefits-dashboard-card .card-footer {
  background-color: transparent;
  border-radius: 0;
  padding: 1.25rem;
  border: 0;
}
.benefits-dashboard-card h1 {
  margin-bottom: 0;
}
.benefits-dashboard-card .h4 {
  font-size: 1.125rem;
  line-height: 1.1;
}
.benefits-dashboard-card .full-width-banner {
  height: 176px;
}
.benefits-dashboard-card span.subheader {
  color: white;
}
.benefits-dashboard-card .card-img-top {
  border-radius: 0;
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 100%;
  overflow: hidden;
}
.benefits-dashboard-card .card-layout {
  background: 0;
  border: 0;
  box-shadow: none;
  padding: 0;
}
.benefits-dashboard-card .card-layout .d-flex {
  display: flex;
}
.benefits-dashboard-card .card-layout .slick-list {
  margin: 0;
  width: 100%;
  padding-bottom: 20px;
}
.benefits-dashboard-card .card-layout .card-header {
  background: #f7f7f7 !important;
}
.benefits-dashboard-card .card-layout .card-layout {
  color: black;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 0 !important;
}
.benefits-dashboard-card .card-layout .card-layout a {
  color: black;
}
.benefits-dashboard-card .card-layout .card-layout a:hover {
  color: black;
}
.benefits-dashboard-card .card-layout .card-layout .h3 {
  color: black;
  border-bottom: 0;
  margin: 0;
  padding: 0;
}
.benefits-dashboard-card .card-layout .card-layout .data-group .data-label {
  color: #505050;
}
.benefits-dashboard-card .card-layout .card-layout .h4 {
  color: black;
}
@media (max-width: 992px) {
  h1.subheader,
  .subheader {
    font-size: 16px;
  }
  .benefits-dashboard-card .card-header .h3 {
    font-size: 18px;
  }
  .h4 {
    font-size: 1rem;
  }
}
@media (max-width: 992px) and (min-width: 768px) {
  .benefits-dashboard-card .full-width-banner-280 {
    height: 280px;
  }
  .benefits-dashboard-card .full-width-banner-240 {
    height: 240px;
  }
}
@media (max-width: 767px) {
  .benefits-dashboard-card .full-width-banner {
    height: 161px;
  }
  .benefits-dashboard-card .full-width-banner + .container {
    margin-top: -135px;
  }
}
@media (min-width: 667px) and (max-width: 767px) {
  .benefits-dashboard-card .card-layout .third-width-landscape {
    width: 33.333333333% !important;
  }
}
@media (max-width: 666px) {
  .benefits-dashboard-card .d-flex {
    display: block;
  }
}
.card-layout,
.benefits-dashboard-card .card-layout .card-layout {
  border-radius: 0.75em;
}
.card-layout .card-header {
  border-top-left-radius: 0.75em;
  border-top-right-radius: 0.75em;
}
.card-layout .card-footer {
  border-bottom-left-radius: 0.75em;
  border-bottom-right-radius: 0.75em;
}
.card-layout .card-img-top {
  border-top-left-radius: 0.75em;
  border-top-right-radius: 0.75em;
}

.card-layout,
.benefits-dashboard-card .card-layout .card-layout {
  box-shadow: 0 1rem 19px -10px rgba(0, 0, 0, 0.4);
}





.card-layout,
.benefits-dashboard-card .card-layout .card-layout {
  background-color: #f0f5f8;
  border-color: #505050;
  border-style: solid;
  padding: 30px;
  width: 100%;
}
.card-layout > .title {
  color: black;
}
.card-layout > .value {
  color: black;
}
.card-layout > .label {
  color: #505050;
}
.card-layout > .text {
  color: black;
}
.card-layout > p {
  color: black;
}
body.benefits-dashboard-card div.card-layout {
  background-color: transparent;
}
body.benefits-dashboard-card div.card-layout div.card {
  background-color: white;
}
.main-benefits-image-card-wrapper {
  display: flex;
  align-items: stretch;
  height: 100%;
}
.main-benefits-image-card-wrapper .card-footer {
  height: 100%;
  position: relative;
}
@media (max-width: 767px) {
  .card-layout,
  .benefits-dashboard-card .card-layout .card-layout {
    padding: 20px;
  }
}
@import once 'variables-default.less';
.banner-title {
  float: left;
  width: 75%;
}
.banner-icons {
  float: left;
  width: 25%;
}
@media only screen and (min-width: 768px) {
  .banner-title {
    float: left;
    width: 85%;
  }
  .banner-icons {
    float: left;
    width: 15%;
  }
}
@media only screen and (min-width: 992px) {
  .banner-title {
    float: left;
    width: 90%;
  }
  .banner-icons {
    float: left;
    width: 10%;
  }
}
.banner-heading {
  width: 100% !important;
}
.show-help-span {
  width: 1.25em;
  height: 1em;
}
.show-help {
  border: 0;
  width: 30px;
  height: 30px;
  text-align: center;
  margin-left: 10px;
  color: white !important;
  font-size: 24px;
  outline: none;
}
.show-help.active {
  margin-top: 5px;
  font-size: 35px;
  color: white;
  text-decoration: none;
}
.show-help.active .help-read-span {
  margin-top: -30px;
}
.show-help:focus {
  outline: none;
}
.help-read-span {
  width: 30px;
  height: 30px;
  position: absolute;
}
#download-pdf-icon {
  border: 0;
  width: 30px;
  height: 30px;
  text-align: center;
  margin-left: 10px;
  color: white !important;
  font-size: 24px;
  margin-top: 10px;
  cursor: pointer;
  outline: none;
}
#download-pdf-icon:focus {
  outline: none;
}
@media (max-width: 767px) {
  .show-help,
  .show-help-span {
    margin-top: 0px !important;
    padding: 0;
  }
  .show-help.active,
  .show-help-span.active {
    margin-top: -5px !important;
  }
  #download-pdf-icon {
    margin-top: 0px !important;
    padding: 0;
  }
}
/** OVERRIDES OF MAIN.LESS FOR THE NEW PAYSLIPSINGLEPAGE*/

@media (min-width: 668px) {
  .card-layout section.payslip-mobile {
    display: none;
  }
  .card-layout section.payslip-nonmobile {
    display: block;
  }
}
.card-layout .displaying-payslip {
  padding-right: 0;
}
.card-layout .displaying-payslip .styled-select {
  float: right;
  margin-right: 0;
  margin-left: 20px;
}
.card-layout .displaying-payslip label.float-right {
  float: right;
}
.card-layout .payslip-detail-container {
  width: auto;
}
.card-layout .payslip-detail-section {
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
}
.card-layout .displaying-payslip {
  margin-bottom: 0;
}
.card-layout .displaying-payslip label {
  color: #505050;
}
.card-layout .payslip-column .column-header {
  width: 100%;
  margin-bottom: 0px;
  display: inline-block;
  border-bottom: 1px solid #cccccc;
  padding: 10px 10px 10px 10px;
  font-weight: bold;
  font-size: 15px;
  color: #505050;
}
.card-layout .payslip-column .left-label {
  width: 60%;
}
.card-layout .payslip-column .right-label {
  width: 40%;
  text-align: right;
}
.card-layout .payslip-column-container table td,
.card-layout .pay-to-date table td,
.card-layout .tax-to-date table td {
  color: black;
}
.card-layout .styled-select {
  margin-bottom: 0;
}
.card-layout .styled-select .icon-arrow-down {
  color: black;
}
.card-layout .styled-select select {
  margin-bottom: 0;
  color: black;
}
.card-layout .styled-select select:focus {
  border-color: #4f2170;
}
.card-layout .styled-select select:focus + span {
  border-color: #4f2170;
}
.card-layout .styled-select option {
  color: black;
}
.card-layout .total-net-pay {
  background-color: #4f2170;
  color: white;
}
.card-layout tr.payslip-bottom-row td,
.card-layout tr.payslip-bottom-row span {
  color: white;
}
.card-layout tr.payslip-bottom-row div.tax-code-content,
.card-layout tr.payslip-bottom-row div.payment-type-content {
  text-align: right;
}
.card-layout .no-data-message {
  min-height: 12vh;
}
@media (max-width: 667px) {
  .card-layout,
  .benefits-dashboard-card .card-layout .card-layout {
    padding-left: 0;
    padding-right: 0;
  }
  .card-layout section.payslip-mobile {
    display: block;
    padding-left: 0;
    padding-right: 0;
  }
  .card-layout section.payslip-nonmobile {
    display: none;
  }
  .card-layout .total-net-pay {
    margin-bottom: 5px;
  }
  .card-layout .payslip-column table td,
  .card-layout .payslip-column .column-header {
    padding-left: 10px;
    padding-right: 10px;
  }
  .card-layout .displaying-payslip .styled-select {
    margin-left: 0;
  }
  .card-layout .displaying-payslip .styled-select select {
    padding-top: 0;
    padding-bottom: 0;
    height: 30px;
    font-size: 75%;
  }
  .card-layout .displaying-payslip span {
    height: 30px;
    font-size: 75%;
  }
  .card-layout .displaying-payslip .styled-label {
    padding-top: 5px;
    padding-bottom: 0;
  }
  .card-layout .displaying-payslip label {
    font-size: 75%;
    padding-left: 0;
    height: 30px;
    padding-top: 5px;
    margin-bottom: 0;
  }
}
@media screen and (min-width: 767px) {
  .card-layout .payslip-column tr.payslip-bottom-row td {
    border-right: 1px solid white;
  }
  .card-layout .payslip-column tr.payslip-bottom-row td:last-of-type {
    border-right: none;
  }
}
@media (max-width: 667px) {
  .simple-content-page-content {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.card-layout .simple-content-page-content p,
.card-layout .simple-content-page-content span {
  color: black;
}
@media screen and (max-width: 450px) {
  .simple-content-page-content p iframe {
    width: 100%;
  }
}
.card-layout #account-details td {
  color: black !important;
}
.card-layout #account-details td.data-label {
  color: #505050 !important;
}
.card-layout label#lbl-ccd-address {
  width: 50%;
}
.card-layout label#lbl-ccd-postcode {
  width: 100%;
}
.card-layout section#contact-not-shown {
  display: inline;
}
.card-layout section#contact-not-shown strong {
  float: none;
  font-weight: bold;
  display: inline;
}
@media (max-width: 767px) {
  .card-layout #account-details .ui-accordion-content {
    padding: 0.5em;
  }
  .card-layout .ui-helper-reset {
    padding: 0px;
  }
}
.personal-table-content {
  padding: 0 !important;
}
.contact-table-content {
  padding: 15px 15px !important;
}
.details-table-content {
  padding: 15px 15px !important;
}
.no-data-text {
  text-align: left !important;
}
.card-layout .transaction-history .icon-calendar {
  color: #ce1126;
  width: 20%;
  border-left: none;
  text-align: right;
}
.card-layout .transaction-history .date-time-range {
  width: 55%;
}
.card-layout .transaction-history .radio-container span.radio.selected span.red {
  background: #ce1126 !important;
}
.card-layout .transaction-history label {
  color: black;
  width: 25%;
}
.card-layout .transaction-history h3 {
  color: black;
}
.card-layout .transaction-history .error-message {
  padding: 0px;
  margin: 0px 0px 10px 0px;
}
.card-layout .transaction-history .validation-summary ul {
  padding: 0px;
  margin: 0px;
}
.card-layout .transaction-history #date-range-error {
  text-align: left;
}
.card-layout .transaction-history #validation-summary-errors {
  color: #e41312;
}
@media (max-width: 767px) {
  #timeframe-container,
  form.transaction {
    padding-left: 15px;
    padding-right: 15px;
  }
  #timeframe-container button,
  form.transaction button {
    padding-right: 15px;
  }
  #timeframe-container label,
  form.transaction label {
    line-height: 16px;
  }
}
@media (min-width: 768px) and (max-width: 992px) {
  .card-layout .timeframe span.radio-container {
    clear: left !important;
  }
  .card-layout .timeframe label {
    width: 75%;
  }
}
@media screen and (max-width: 450px) {
  .card-layout .timeframe label:nth-of-type(odd) {
    width: 110px !important;
  }
}
@media screen and (max-width: 768px) {
  .card-layout div#timeframe-container {
    padding-left: 0;
    padding-right: 0;
  }
  .card-layout div.timeframe-text-non-mobile {
    display: none;
  }
}
@media screen and (min-width: 769px) and (max-width: 992px) {
  .card-layout div.timeframe,
  .card-layout div.input-container {
    height: 250px;
    margin-bottom: 0 !important;
  }
  .card-layout section.select-date-range {
    border-left: 1px solid lightgray;
  }
  .card-layout div.timeframe-text-non-mobile {
    display: none;
  }
}
@media screen and (min-width: 993px) {
  .card-layout div.timeframe,
  .card-layout div.input-container,
  .card-layout div.daterange {
    height: 200px;
    margin-bottom: 0 !important;
  }
  .card-layout section.select-date-range {
    border-left: 1px solid lightgray;
  }
  .card-layout div.timeframe-text-mobile {
    display: none;
  }
}
@media (max-width: 767px) {
  .card-layout #section-graph,
  .card-layout #all-available-performance-funds {
    padding-left: 30px;
    padding-right: 30px;
  }
  .card-layout .button-group {
    padding-right: 15px;
  }
  .card-layout .all-available-performance-funds {
    padding-left: 0px;
    padding-right: 0px;
  }
}
.card-layout .button-group .right-radius-0 {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.card-layout .button-group .left-radius-0 {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.card-layout .button-group .btn {
  background: #ce1126;
  color: black;
}
.card-layout .button-group .btn.active {
  background: #ce1126;
  color: black;
}
.card-layout .toggle-label {
  height: 24px !important;
}
.card-layout .remove-fund,
.card-layout .add-fund {
  background: #ce1126;
  color: black;
}
.card-layout label {
  color: black;
}
.card-layout h2,
.card-layout .tickLabel {
  color: #505050;
}
.card-layout .time-period .col-xs-12 span.radio-container:nth-of-type(odd) {
  clear: none !important;
}
.card-layout .time-period .col-xs-12 label {
  width: 15%;
}
.card-layout .time-period span.radio-container:nth-of-type(odd) {
  clear: left !important;
}
.card-layout #active-funds .remove-fund,
.card-layout #all-available-performance-funds .remove-fund,
.card-layout #active-funds .add-fund,
.card-layout #all-available-performance-funds .add-fund {
  width: 100%;
  max-width: 40px;
}
.card-layout #active-funds .fund-performance-title,
.card-layout #all-available-performance-funds .fund-performance-title {
  position: relative;
  left: 40px;
}
.card-layout .period-select-panel {
  padding: 15px;
}
.card-layout .period-select-panel > div {
  padding: 0px;
}
.card-layout .period-select-panel > div span.radio-container + label {
  margin-right: 0px;
}
.card-layout .switch-modeller-section {
  margin-left: 0;
  width: 100%;
}
.card-layout .fund-value .subheader {
  color: #de0001;
}
.card-layout h3,
.card-layout h2,
.card-layout span {
  color: black;
}
.card-layout p,
.card-layout h5,
.card-layout .h5,
.card-layout label {
  color: black;
}
.card-layout .contributions-container span.radio-container {
  margin-right: 10px !important;
}
.card-layout .contributions-container label {
  width: 30%;
}
.card-layout .fund-value h4.subheader {
  font-size: 35px;
  font-weight: 400;
  line-height: 32px;
  margin: 0;
  border: none;
  padding-bottom: 6px;
}
.card-layout .popover {
  z-index: 1;
}
.card-layout .popover-dismiss-header {
  text-align: right;
}
.card-layout .popover-noshow-header {
  text-align: center;
}
.card-layout .popover-dismiss,
.card-layout .popover-icon {
  color: #ce1126;
}
.card-layout div.arrow {
  display: none;
}
.card-layout .canvas-popover {
  position: relative;
}
.card-layout .available-handler,
.card-layout .all-available-handler {
  background-color: #4f2170;
  padding: 5px 0 5px 10px;
}
.card-layout .available-handler span.amended,
.card-layout .all-available-handler span.amended {
  font-size: 14px;
}
.card-layout .available-handler h3,
.card-layout .all-available-handler h3,
.card-layout .available-handler .fund-fact-sheet,
.card-layout .all-available-handler .fund-fact-sheet,
.card-layout .available-handler .icon-arrow-down,
.card-layout .all-available-handler .icon-arrow-down,
.card-layout .available-handler p,
.card-layout .all-available-handler p,
.card-layout .available-handler span.amended,
.card-layout .all-available-handler span.amended {
  color: white;
}
.card-layout .available-handler.active,
.card-layout .all-available-handler.active {
  background-color: #f95602;
}
.card-layout .available-handler.active h3,
.card-layout .all-available-handler.active h3,
.card-layout .available-handler.active .fund-fact-sheet,
.card-layout .all-available-handler.active .fund-fact-sheet,
.card-layout .available-handler.active .icon-arrow-up,
.card-layout .all-available-handler.active .icon-arrow-up,
.card-layout .available-handler.active p,
.card-layout .all-available-handler.active p,
.card-layout .available-handler.active span.amended,
.card-layout .all-available-handler.active span.amended {
  color: white;
}
.card-layout .available-handler .available-fund-title,
.card-layout .all-available-handler .available-fund-title {
  margin-top: 0px;
}
.card-layout .available-handler .expand-items,
.card-layout .all-available-handler .expand-items {
  float: right;
}
.card-layout .available-handler .text-label,
.card-layout .all-available-handler .text-label {
  padding-top: 2px;
}
.card-layout .available-handler h3,
.card-layout .all-available-handler h3 {
  border: none;
}
.card-layout .switch-modeller-section .benefit-overview {
  background-color: white;
}
.card-layout .fund-navigation li {
  background-color: white;
}
.card-layout .fund-navigation li.active {
  background-color: #949494;
}
.card-layout .fund-navigation li.active:after {
  background-color: #949494;
  content: '';
  position: absolute;
  top: 100%;
  right: 0;
  width: 50%;
  height: 20%;
  bottom: 0;
  background: linear-gradient(to bottom right, #949494 50%, transparent 51%);
  z-index: 1;
}
.card-layout .fund-navigation li.active:before {
  background-color: #949494;
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  width: 50%;
  height: 20%;
  bottom: 0;
  background: linear-gradient(to bottom left, #949494 50%, transparent 51%);
  z-index: 1;
}
.card-layout .your-funds span {
  font-size: 20px;
}
.card-layout .line-graph .tickLabel {
  color: #ce1126;
}
@media (max-width: 767px) {
  .card-layout,
  .benefits-dashboard-card .card-layout .card-layout {
    padding-left: 15px;
    padding-right: 15px;
  }
  .card-layout .benefit-overview {
    margin-bottom: 10px;
  }
  .card-layout .benefit-overview h2.subheader {
    font-size: 22px;
    line-height: 19px;
  }
  .card-layout .benefit-overview h3 {
    margin-right: 10px;
  }
  .card-layout .contributions-container canvas {
    margin: 0 auto 20px auto;
  }
  .card-layout span.radio-container + label {
    width: auto;
  }
}
@media (min-width: 768px) and (max-width: 992px) {
  .contributions-container {
    border: none;
  }
  .fund-changer {
    margin-right: 10px;
  }
  .fund-changer .slider-outer .slider-padding {
    padding-left: 45px;
    padding-right: 45px;
  }
}
@media (min-width: 992px) and (max-width: 1200px) {
  .fund-changer .slider-outer .slider-padding {
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media (min-width: 1200px) {
  .fund-changer {
    width: 60%;
  }
  .fund-changer .slider-outer .slider-padding {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media (max-width: 992px) {
  .card-layout .all-available-handler .toggle.lastIcon,
  .card-layout .available-handler .toggle.lastIcon {
    margin-left: 0px;
    padding: 10px 10px;
  }
  .card-layout .all-available-handler .toggle.fund-fact-sheet,
  .card-layout .available-handler .toggle.fund-fact-sheet {
    padding: 5px 10px;
    margin-left: 10px;
  }
}
@media (max-width: 1200px) and (min-width: 1050px) {
  .card-layout .fund-slider .back-to-fund {
    width: 20%;
  }
}
.card-layout .portfolio-fund-list li {
  color: black;
}
.card-layout .all-available-handler .add-fund,
.card-layout .all-available-handler .remove-fund {
  background: #ce1126;
  color: black;
}
.card-layout .all-available-handler .add-fund.hover,
.card-layout .all-available-handler .remove-fund.hover,
.card-layout .all-available-handler .add-fund:hover,
.card-layout .all-available-handler .remove-fund:hover {
  background: #ce1126;
  color: black;
}
.card-layout .all-available-handler .fund-title-after-icon,
.card-layout .available-handler .fund-title-after-icon {
  margin-left: 40px;
}
.card-layout .account-navigation.fund-navigation li span {
  border-right: none;
}
.card-layout .popover {
  z-index: 1;
}
.card-layout .ui-slider-range {
  background: #ce1126;
}
.card-layout .ui-slider.darkgrey .ui-slider-range {
  background: #ce1126;
}
.card-layout .ui-slider,
.card-layout .ui-slider-handle {
  border-color: #ce1126;
}
.card-layout .ui-slider.darkgrey .ui-slider-handle {
  border-color: #ce1126;
}
.card-layout .lines {
  color: #ce1126;
  border-top-color: #ce1126;
  border-bottom-color: #ce1126;
}
.card-layout .view-performance,
.card-layout .back-to-fund {
  color: #ce1126;
}
.card-layout .view-performance:after,
.card-layout .back-to-fund:after {
  color: #ce1126;
}
.card-layout .line-graph .tickLabel {
  color: #ce1126;
}
.card-layout #chartjs-tooltip p {
  color: white;
}
@media (max-width: 767px) {
  .doughnut-chart.left {
    margin: 0 auto 20px auto;
  }
  .full-height {
    position: static;
  }
  .view-performance,
  .back-to-fund,
  view.performance.full {
    width: 50% !important;
    padding-top: 20px;
    padding-bottom: 20px;
  }
}
@media (max-width: 992px) {
  .full-height {
    position: static;
  }
  .full-height .vertical-align {
    display: flex;
  }
}
@media (max-width: 992px) and (min-width: 768px) {
  .view-performance,
  .back-to-fund,
  view.performance.full {
    width: 114px !important;
  }
  .fund-graph {
    width: 250px;
  }
}
@media (max-width: 1050px) and (min-width: 993px) {
  .view-performance,
  .back-to-fund {
    width: 150px;
  }
}
.card-layout #documents-section > .row {
  margin-left: 0;
  margin-right: 0;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .card-layout .transaction a.icon-calendar {
    line-height: 25px !important;
  }
}
.card-layout #select-date-range label,
.card-layout .select-date-range label {
  color: black;
  width: 25%;
}
.card-layout #select-date-range .date-time-range,
.card-layout .select-date-range .date-time-range {
  width: 80%;
}
.card-layout #select-date-range .icon-calendar,
.card-layout .select-date-range .icon-calendar {
  color: #ce1126;
  width: 18%;
  border: none;
  text-align: right;
}
.card-layout #select-date-range .calendar .input-group,
.card-layout .select-date-range .calendar .input-group {
  border: 1px solid #f95602;
  margin-bottom: 20px;
  width: 75%;
}
.card-layout #select-date-range .calendar .input-group.error,
.card-layout .select-date-range .calendar .input-group.error {
  border-color: #bac405;
}
.card-layout #select-date-range .calendar .input-group input,
.card-layout .select-date-range .calendar .input-group input {
  border: none;
  margin: 2px 2px;
  height: 38px;
}
.card-layout p#dateRangeError > p {
  color: #bac405;
}
@media (max-width: 767px) {
  .card-layout form.transaction {
    padding-left: 0;
    padding-right: 0;
  }
}
@media (min-width: 768px) and (max-width: 992px) {
  .card-layout #select-date-range .date-time-range {
    width: 78%;
  }
}
.card-layout .benefit-modeller-container a {
  color: #ce1126;
}
.card-layout .benefit-modeller-container a:hover,
.card-layout .benefit-modeller-container a:focus,
.card-layout .benefit-modeller-container a:active {
  color: #ce1126;
  text-decoration: none;
}
.card-layout .benefit-modeller-container .icon-cog,
.card-layout .benefit-modeller-container .projection-cog {
  color: #ce1126;
  border-color: #ce1126;
}
.card-layout .benefit-modeller-container .benefitmodeller-value {
  color: #de0001;
  border-right: 1px solid #de0001;
  padding-right: 3px;
}
.card-layout .benefit-modeller-container .benefitmodeller-value .h3,
.card-layout .benefit-modeller-container .benefitmodeller-value sup {
  color: #de0001;
}
.card-layout .benefit-modeller-container .modeller-slider .button {
  background-color: #ce1126;
  color: black;
}
.card-layout .benefit-modeller-container .modeller-slider .button:hover,
.card-layout .benefit-modeller-container .modeller-slider .button:active {
  background-color: #ce1126;
  color: black;
}
.card-layout .benefit-modeller-container .switch-title-main {
  color: black;
}
.card-layout .benefit-modeller-container .switch-title-main small,
.card-layout .benefit-modeller-container .switch-title-main .icon-drawdown2 {
  color: black;
  border-color: black;
}
.card-layout .benefit-modeller-container .switch-title-main.extended {
  padding-bottom: 10px;
}
.card-layout .benefit-modeller-container .spinner-value {
  color: #de0001;
}
.card-layout .benefit-modeller-container #contribution-increase,
.card-layout .benefit-modeller-container #reset-all-mobile,
.card-layout .benefit-modeller-container .show-lta-overlay {
  color: #ce1126;
}
.card-layout .benefit-modeller-container .notification {
  background-color: #4f2170;
}
.card-layout .benefit-modeller-container .notification * {
  color: white;
}
.card-layout .benefit-modeller-container .modeller-bar-chart-wrapper {
  color: black;
}
.card-layout .benefit-modeller-container .caveat span,
.card-layout .benefit-modeller-container .caveat sup {
  color: black;
}
.card-layout .benefit-modeller-container .benefits-modeller-overview {
  margin-left: 0;
  margin-right: 0;
  border-right: #de0001;
  margin-bottom: 20px;
  padding: 15px 0 25px;
}
@media only screen and (max-width: 1050px) {
  .card-layout .benefit-modeller-container .benefits-modeller-overview {
    font-size: 20px;
  }
}
@media only screen and (max-width: 768px) {
  .card-layout .benefit-modeller-container .benefits-modeller-overview.drawdown-benefits-overview {
    padding-bottom: 0;
  }
}
.card-layout .benefit-modeller-container .benefits-modeller-overview .col-sm-3 {
  border-right: 1px solid #b2b2b2;
}
.card-layout .benefit-modeller-container .benefits-modeller-overview .h3 {
  border: none;
  margin-bottom: 0;
  font-size: 100%;
}
@media only screen and (max-width: 1050px) {
  .card-layout .benefit-modeller-container .benefits-modeller-overview .h3 {
    font-size: 15px;
  }
}
.card-layout .benefit-modeller-container .benefits-modeller-overview .h4 {
  font-size: 36px;
  font-weight: 400;
  line-height: 32px;
  margin: 0;
}
.card-layout .benefit-modeller-container .benefits-modeller-overview .col-sm-4 {
  border-right: 1px solid #b2b2b2;
}
.card-layout .benefit-modeller-container .benefits-modeller-overview .col-sm-8 {
  border-right: 1px solid #b2b2b2;
}
.card-layout .benefit-modeller-container .income-drawdown-sub-tabs {
  padding-left: 15px;
  padding-right: 0;
  padding-top: 10px;
  margin-top: -13px;
}
.card-layout .benefit-modeller-container .income-drawdown-sub-tabs .inflation label {
  padding-right: 10px;
}
.card-layout .benefit-modeller-container .icon-drawdown2 {
  display: none;
}
.card-layout .benefit-modeller-container .switch-modeller-section-drawdown {
  padding-left: 0;
  padding-right: 0;
}
.card-layout .benefit-modeller-container .drawdown-benefits-overview {
  margin-top: 0;
}
.card-layout .benefit-modeller-container .graphValuebenefit-bar,
.card-layout .benefit-modeller-container .graphValuepension-bar,
.card-layout .benefit-modeller-container .graphValuebenefit-bar-mobile,
.card-layout .benefit-modeller-container .graphValuepensions-bar-mobile {
  background-color: white;
}
.card-layout .benefit-modeller-container .graphValuebenefit-bar:after,
.card-layout .benefit-modeller-container .graphValuepension-bar:after,
.card-layout .benefit-modeller-container .graphValuebenefit-bar-mobile:after,
.card-layout .benefit-modeller-container .graphValuepensions-bar-mobile:after {
  background-color: white;
}
.card-layout .benefit-modeller-container .graphValuebenefit-bar span,
.card-layout .benefit-modeller-container .graphValuepension-bar span,
.card-layout .benefit-modeller-container .graphValuebenefit-bar-mobile span,
.card-layout .benefit-modeller-container .graphValuepensions-bar-mobile span {
  color: #de0001;
}
.card-layout .benefit-modeller-container .styleModellerBar {
  background-color: #ce1126;
}
.card-layout .benefit-modeller-container .styleModellerBar2 {
  background-color: #9f0d1d;
}
.card-layout .benefit-modeller-container .styleModellerBar3 {
  background-color: #700915;
}
.card-layout .benefit-modeller-container .styleModellerBar4 {
  background-color: #41050c;
}
.card-layout .benefit-modeller-container .styleModellerBar5 {
  background-color: #120103;
}
.card-layout .benefit-modeller-container .styleModellerBar6 {
  background-color: black;
}
.card-layout .benefit-modeller-container .icon-chev-down,
.card-layout .benefit-modeller-container .icon-chev-up,
.card-layout .benefit-modeller-container .icon-chev-left,
.card-layout .benefit-modeller-container .icon-chev-right,
.card-layout .benefit-modeller-container .icon-arrow-left,
.card-layout .benefit-modeller-container .icon-arrow-right {
  color: #ce1126;
}
.card-layout .benefit-modeller-container #switch-assumptions h3,
.card-layout .benefit-modeller-container #projection-basis h3 {
  color: black;
}
.card-layout .benefit-modeller-container .assumption-section-header {
  font-weight: bold;
}
.card-layout .benefit-modeller-container .input-section h3,
.card-layout .benefit-modeller-container .input-section .h3,
.card-layout .benefit-modeller-container .assumptions-slider-container span {
  color: black;
}
.card-layout .benefit-modeller-container .loading-box {
  color: #ce1126;
}
.card-layout .benefit-modeller-container .loading-box span {
  color: #ce1126;
}
.card-layout .benefit-modeller-container #reset-all-mobile,
.card-layout .benefit-modeller-container #reset-adjustments-mobile,
.card-layout .benefit-modeller-container .show-lta-overlay {
  display: none;
}
.card-layout .benefit-modeller-container .benefit-modeller-overview-container {
  display: table;
  width: 100%;
}
.card-layout .benefit-modeller-container .benefit-modeller-overview-content,
.card-layout .benefit-modeller-container .benefit-modeller-overview-content-without-lta {
  display: table-cell;
  padding-left: 1em;
  width: 100%;
  line-height: 100%;
  vertical-align: middle;
  height: 100%;
}
.card-layout .benefit-modeller-container .benefit-modeller-overview-content section {
  display: inline-block;
  min-width: 23%;
}
.card-layout .benefit-modeller-container .benefit-modeller-overview-content-without-lta section {
  display: inline-block;
  min-width: 30%;
}
.card-layout .benefit-modeller-container div.radio.inflation span.radio-container {
  margin: 0 15px 15px 0 !important;
}
.card-layout .benefit-modeller-container div.radio.inflation span.radio-container + label {
  padding-top: 3px;
}
.card-layout .benefit-modeller-container .incomedrawdown-income-period {
  min-width: 21% !important;
}
.card-layout .benefit-modeller-container .drawdown-benefits-overview .benefitmodeller-value > .h3 {
  width: 100%;
}
.card-layout .benefit-modeller-container .avc-fund .h3,
.card-layout .benefit-modeller-container .avc-fund-mobile .h3 {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 5px;
}
@media (max-width: 767px) {
  .card-layout,
  .benefits-dashboard-card .card-layout .card-layout {
    padding-top: 5px;
  }
  .card-layout .modeller-tab-content .caveat {
    display: none;
  }
  .card-layout #switch-assumptions {
    margin-top: 0;
  }
  .card-layout #switch-assumptions .radio label,
  .card-layout #switch-assumptions h3,
  .card-layout #switch-assumptions .h3 {
    font-size: 14px;
  }
  .card-layout #switch-assumptions .row {
    margin-bottom: 0;
  }
  .card-layout .avc-fund h3,
  .card-layout .avc-fund-mobile h3,
  .card-layout .avc-fund .h3,
  .card-layout .avc-fund-mobile .h3 {
    font-size: 13px;
  }
  .card-layout .switch-basis-button {
    display: none;
  }
  .card-layout .switch-title-main {
    width: 100%;
  }
  .card-layout .switch-title-main.extended {
    width: 100%;
  }
  .card-layout .switch-title-main > small {
    display: none;
  }
  .card-layout .switch-title-main div {
    width: 100%;
  }
  .card-layout .switch-title-main div small {
    width: 30%;
  }
  .card-layout .switch-title-main #reset-all-mobile,
  .card-layout .switch-title-main #contribution-increase,
  .card-layout .switch-title-main #reset-adjustments-mobile,
  .card-layout .switch-title-main .show-lta-overlay {
    float: right;
    display: block;
    font-size: 18px;
    width: 18px;
    margin-left: 10px;
    text-align: center;
  }
  .card-layout div.radio.inflation label {
    width: 30%;
  }
  .card-layout #projection-basis .icon-chev-down {
    display: none;
  }
  .card-layout #projection-basis .slider-container {
    padding: 0px 15px 0px 15px;
  }
  .card-layout .projection-basis-intro {
    margin-top: 10px;
    padding-bottom: 5px;
    margin-bottom: 10px;
  }
  .card-layout .modelmobile,
  .card-layout .modeller-tab-content {
    margin-bottom: 10px;
  }
  .card-layout .modelmobile .icon-cog,
  .card-layout .modeller-tab-content .icon-cog,
  .card-layout .modelmobile .icon-wheel,
  .card-layout .modeller-tab-content .icon-wheel {
    border: none;
    height: auto;
    right: 0;
    margin-top: -4px;
  }
  .card-layout .modelmobile .icon-cog:before,
  .card-layout .modeller-tab-content .icon-cog:before,
  .card-layout .modelmobile .icon-wheel:before,
  .card-layout .modeller-tab-content .icon-wheel:before {
    float: right;
  }
  .card-layout .modelmobile .benefitmodeller-pension,
  .card-layout .modeller-tab-content .benefitmodeller-pension,
  .card-layout .modelmobile .benefitmodeller-lta,
  .card-layout .modeller-tab-content .benefitmodeller-lta,
  .card-layout .modelmobile .incomedrawdown-annual-income,
  .card-layout .modeller-tab-content .incomedrawdown-annual-income,
  .card-layout .modelmobile .incomedrawdown-income-period,
  .card-layout .modeller-tab-content .incomedrawdown-income-period {
    border: none;
  }
  .card-layout .drawdown-section .icon-cog,
  .card-layout .drawdown-section .icon-wheel {
    display: none;
  }
  .card-layout .spinner-container {
    margin-bottom: 20px;
  }
  .card-layout .slider-container .icon-minus,
  .card-layout .slider-outer .icon-minus,
  .card-layout #drawdown-switch-assumptions-fund-length-first .icon-minus,
  .card-layout .slider-container .icon-plus,
  .card-layout .slider-outer .icon-plus,
  .card-layout #drawdown-switch-assumptions-fund-length-first .icon-plus {
    display: none;
  }
  .card-layout .slider-container .ui-slider,
  .card-layout .slider-outer .ui-slider,
  .card-layout #drawdown-switch-assumptions-fund-length-first .ui-slider {
    width: 100%;
    margin-left: 0px;
  }
  .card-layout .modeller-button {
    display: none;
  }
  .card-layout .btn.calculate-benefits-mobile {
    display: block;
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .card-layout .slider-outer .drawdown-slider-container {
    padding: 0px 15px 0px 15px;
  }
  .card-layout .assumptions-slider-wrapper {
    padding-left: 15px;
    padding-right: 15px;
  }
  .card-layout #drawdown-switch-assumptions-fund-length-first .ui-slider {
    width: 100%;
  }
  .card-layout #drawdown-switch-assumptions-fund-length-first .radio-label {
    width: 80%;
  }
  .card-layout #calculate-benefits,
  .card-layout .calculate-benefits {
    display: none;
  }
  .card-layout .switch-modeller-section .icon-cog,
  .card-layout .switch-modeller-section .icon-wheel {
    display: none;
  }
  .card-layout .modeller-slider .reset-adjustments,
  .card-layout .modeller-slider .calculate-benefits {
    display: none;
  }
  .card-layout #switch-assumptions .input-section h3,
  .card-layout #switch-assumptions .input-section .h3 {
    border: none;
    margin-bottom: 0;
    padding-bottom: 5px;
  }
  .card-layout #annual-income-slider-wrapper,
  .card-layout #your-cash-slider-wrapper {
    padding-left: 15px;
    padding-right: 15px;
  }
  .income-drawdown-sub-tabs {
    display: none;
  }
  .income-drawdown-sub-tabs-mobile {
    display: block;
    padding-top: 10px;
  }
  #benefit-info h4,
  #drawdown-graph-info-container-first-mobile-version h4,
  #benefit-info .h4,
  #drawdown-graph-info-container-first-mobile-version .h4 {
    font-size: 20px;
  }
  #benefit-info h3,
  #drawdown-graph-info-container-first-mobile-version h3,
  #benefit-info .h3,
  #drawdown-graph-info-container-first-mobile-version .h3 {
    font-size: 12px;
  }
  #benefit-info .h4 {
    line-height: 16px;
  }
}
@media (min-width: 768px) {
  .card-layout .income-drawdown-sub-tabs-mobile {
    display: none;
  }
  .card-layout .btn.calculate-benefits-mobile {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 992px) {
  .card-layout #benefit-info h4,
  .card-layout #drawdown-graph-info-container-first-mobile-version h4,
  .card-layout .benefits-modeller-overview h4,
  .card-layout #benefit-info .h4,
  .card-layout #drawdown-graph-info-container-first-mobile-version .h4,
  .card-layout .benefits-modeller-overview .h4 {
    font-size: 30px;
  }
  .card-layout #benefit-info h3,
  .card-layout #drawdown-graph-info-container-first-mobile-version h3,
  .card-layout .benefits-modeller-overview h3,
  .card-layout #benefit-info .h3,
  .card-layout #drawdown-graph-info-container-first-mobile-version .h3,
  .card-layout .benefits-modeller-overview .h3 {
    font-size: 14px;
  }
  .card-layout .drawdown-section .h3.switch.switch-title-main {
    width: 85%;
  }
  .card-layout #pension-bar {
    width: 125px !important;
  }
  .card-layout #pension-bar .graphFiller,
  .card-layout #pension-bar .graphBarpension-bar {
    width: 100px;
  }
  .card-layout .spinner-container .spinner {
    width: 100px;
  }
  .card-layout .spinner-value {
    top: 32px;
  }
  .card-layout .spinner-outer .drawdown-spinner-wrapper {
    width: 124px !important;
    margin-left: 10px;
  }
  .card-layout .spinner-outer .drawdown-spinner-wrapper .spinner-value {
    width: 110px;
    margin-left: 5px;
  }
  .card-layout #growth-assumption .radio span.radio-container,
  .card-layout #annuity-options .radio span.radio-container {
    margin-right: 10px !important;
  }
  .card-layout .graphValuebenefit-bar::after,
  .card-layout .graphValuepension-bar::after {
    height: 28px;
    width: 28px;
    top: 3px;
  }
  .card-layout #benefit-bar {
    width: 270px !important;
  }
  .card-layout #graphFiller0benefit-bar,
  .card-layout #graphField0benefit-bar,
  .card-layout #graphFiller1benefit-bar,
  .card-layout #graphField1benefit-bar,
  .card-layout #graphField0pension-bar,
  .card-layout #graphFiller0pension-bar {
    width: 105px !important;
  }
  .card-layout #graphFiller1benefit-bar,
  .card-layout #graphField1benefit-bar {
    left: 135px !important;
  }
  .card-layout .inflation label {
    width: 110px;
  }
  .card-layout .graphValuebenefit-bar span,
  .card-layout .graphValuepension-bar span {
    font-size: 80%;
  }
  .card-layout .modeller-slider .decrease-btn-container {
    margin-right: 10px;
  }
  .card-layout .modeller-slider .increase-btn-container {
    margin-left: 10px;
  }
}
@media (min-width: 768px) and (max-width: 1050px) {
  .card-layout .drawdown-benefits-overview .benefitmodeller-value > .h3 {
    height: 50px;
    margin-right: -60px;
  }
}
@media (max-width: 400px) {
  .card-layout .switch-title-main div {
    width: 100%;
  }
  .card-layout .switch-title-main div small {
    width: 40%;
  }
}
@media (min-width: 992px) {
  .card-layout .drawdown-benefits-overview .col-md-12 {
    padding-top: 10px;
  }
  .card-layout #benefit-bar {
    width: 350px !important;
  }
  .card-layout #pension-bar {
    width: 175px !important;
  }
  .card-layout #graphFiller0benefit-bar,
  .card-layout #graphField0benefit-bar,
  .card-layout #graphFiller1benefit-bar,
  .card-layout #graphField1benefit-bar,
  .card-layout #graphField0pension-bar,
  .card-layout #graphFiller0pension-bar {
    width: 155px !important;
  }
  .card-layout #graphFiller1benefit-bar,
  .card-layout #graphField1benefit-bar {
    left: 175px !important;
  }
  .card-layout .drawdown-section .h3.switch.switch-title-main {
    width: 90%;
  }
  .card-layout .modeller-slider .decrease-btn-container {
    margin-right: 15px;
  }
  .card-layout .modeller-slider .increase-btn-container {
    margin-left: 15px;
  }
}
@media (min-width: 768px) and (max-width: 992px) {
  .card-layout .benefit-modeller-container .slider-container .slider-padding,
  .card-layout .benefit-modeller-container .slider-outer .slider-padding {
    padding-left: 35px;
    padding-right: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1200px) {
  .card-layout .benefit-modeller-container .slider-container .slider-padding,
  .card-layout .benefit-modeller-container .slider-outer .slider-padding {
    padding-left: 30px;
    padding-right: 30px;
  }
  .card-layout .benefit-modeller-container #growth-assumption .radio span.radio-container,
  .card-layout .benefit-modeller-container #annuity-options .radio span.radio-container {
    margin: 0 15px 15px 0 !important;
  }
}
@media (min-width: 1200px) {
  .card-layout .benefit-modeller-container .slider-container .slider-padding,
  .card-layout .benefit-modeller-container .slider-outer .slider-padding {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.card-layout #faqs article span,
.card-layout #faqs article p {
  color: black;
}
.card-layout #faqs article span.faq-label {
  color: black;
  float: left;
}
section.sidebar-children .sidebar-accordion {
  margin-bottom: 20px;
}
section.sidebar-children .accordioncontainer {
  padding: 0;
}
section.sidebar-children .ui-accordion .ui-accordion-header {
  border: none;
  background: #eeeeee;
}
section.sidebar-children .ui-accordion .ui-accordion-header span {
  color: #505050;
}
section.sidebar-children .ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  color: #505050;
}
section.sidebar-children .ui-accordion .ui-accordion-header-active {
  background: white;
}
section.sidebar-children .ui-accordion .ui-accordion-header-active span {
  color: white;
}
section.sidebar-children .ui-accordion .ui-accordion-header-active .ui-accordion-header-icon {
  color: white;
}
section.sidebar-children .ui-accordion .ui-accordion-content {
  padding: 15px;
}
section.sidebar-children .ui-accordion article p {
  color: black;
}
.body-with-sidebar #body-section section.sidebar-children a:hover,
.body-with-sidebar #body-section section.sidebar-children a.active,
.body-with-sidebar #body-section section.sidebar-children a:focus {
  text-decoration: none;
}
.body-with-sidebar #body-section section.sidebar-children .panel-body {
  background-color: white;
}
.body-with-sidebar #body-section section.sidebar-children section.panel-area.third {
  margin-right: 0 !important;
}
.body-with-sidebar #body-section section.sidebar-children .box-img .panel-body p {
  color: black;
  text-decoration: none !important;
}
.body-with-sidebar #body-section section.sidebar-children .box-img:hover .panel-body p {
  color: #f95602;
  text-decoration: none !important;
}
section.sidebar-children .sidebar-text {
  float: left;
  color: #f95602;
}
section.sidebar-children .sidebar-text p {
  word-wrap: break-word;
}
@media screen and (max-width: 450px) {
  .sidebar-main-content p iframe {
    width: 100%;
  }
  .sidebar-text {
    padding: 15px;
  }
  .sidebar-accordion {
    padding: 15px;
  }
}
@media screen and (max-width: 600px) {
  section.sidebar-children {
    padding: 0px;
  }
}
.sidebar-main-content p a,
.simple-content-page-content p a {
  color: #f95602;
  text-decoration: underline;
}
.sidebar-main-content p a:hover,
.simple-content-page-content p a:hover {
  text-decoration: underline !important;
  color: #f95602;
}
.sidebar-main-content ol li a,
.simple-content-page-content ol li a,
.sidebar-main-content ul li a,
.simple-content-page-content ul li a {
  color: #f95602;
  text-decoration: underline;
}
.sidebar-main-content ol li a:hover,
.simple-content-page-content ol li a:hover,
.sidebar-main-content ul li a:hover,
.simple-content-page-content ul li a:hover {
  text-decoration: underline !important;
  color: #f95602;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .sidebar-main-content p a,
  .simple-content-page-content p a {
    text-decoration: none;
    border-bottom: 1px solid #f95602;
  }
  .sidebar-main-content p a:hover,
  .simple-content-page-content p a:hover {
    text-decoration: none !important;
    border-bottom: 1px solid #f95602;
  }
  .sidebar-main-content ol li a,
  .simple-content-page-content ol li a,
  .sidebar-main-content ul li a,
  .simple-content-page-content ul li a {
    text-decoration: none;
    border-bottom: 1px solid #f95602;
  }
  .sidebar-main-content ol li a:hover,
  .simple-content-page-content ol li a:hover,
  .sidebar-main-content ul li a:hover,
  .simple-content-page-content ul li a:hover {
    text-decoration: none !important;
    border-bottom: 1px solid #f95602;
  }
}
@media (hover: none), (hover: on-demand) {
  .sidebar-main-content p a:hover,
  .simple-content-page-content p a:hover {
    color: #f95602;
    text-decoration: underline;
  }
  .sidebar-main-content ol li a:hover,
  .simple-content-page-content ol li a:hover,
  .sidebar-main-content ul li a:hover,
  .simple-content-page-content ul li a:hover {
    color: #f95602;
    text-decoration: underline;
  }
}
@media (hover: none), (hover: on-demand) and (-webkit-min-device-pixel-ratio: 0) {
  .sidebar-main-content p a:hover,
  .simple-content-page-content p a:hover {
    color: #f95602;
    border-bottom: 1px solid #f95602;
    text-decoration: none;
  }
  .sidebar-main-content ol li a:hover,
  .simple-content-page-content ol li a:hover,
  .sidebar-main-content ul li a:hover,
  .simple-content-page-content ul li a:hover {
    color: #f95602;
    border-bottom: 1px solid #f95602;
    text-decoration: none;
  }
}
#wealth-modeller .list-group .list-group-item {
  border-radius: 0;
  margin-bottom: 5px;
  padding: 15px;
}
#wealth-modeller .list-group .list-group-item span {
  display: inline-block;
  max-width: 80%;
  color: inherit;
}
#wealth-modeller .list-group .list-group-item i {
  max-width: 20%;
}
#wealth-modeller .list-group .list-group-item .caret-right {
  display: none;
}
#wealth-modeller .list-group .list-group-item:hover {
  cursor: pointer;
}
#wealth-modeller .list-group .list-group-item .fas,
#wealth-modeller .list-group .list-group-item .fab {
  color: #ce1126;
}
#wealth-modeller .list-group .list-group-item.active {
  background: #ce1126;
  color: black;
  border-color: #ce1126;
}
#wealth-modeller .list-group .list-group-item.active .caret-right {
  display: block;
  content: '';
  position: absolute;
  right: -20px;
  top: -1px;
  width: 0;
  height: 0;
  border-top: solid transparent;
  border-bottom: solid transparent;
  border-left: solid #ce1126;
  border-width: 19px;
}
#wealth-modeller .list-group .list-group-item.active p {
  color: black;
}
#wealth-modeller .list-group .list-group-item.active .fas,
#wealth-modeller .list-group .list-group-item.active .fab {
  color: black;
}
#wealth-modeller #calculate-button {
  width: 100%;
}
#wealth-modeller #asset-section .row {
  margin-top: 5px;
}
#wealth-modeller .save-button {
  float: none !important;
  display: inline-block;
}
#wealth-modeller .input-group {
  border: 1px solid #d1d1d1;
}
#wealth-modeller .input-group .input[type='text'],
#wealth-modeller .input-group input[type='number'] {
  box-shadow: none;
  line-height: 1;
}
#wealth-modeller .input-group .input-group-text,
#wealth-modeller .input-group input {
  border: none;
  background-color: white;
}
#wealth-modeller .input-group .input-group-addon {
  font-size: 16px;
  border-radius: 0;
  background: 0;
  transition: border-color ease-in-out 0.15s;
  -webkit-transition: border-color ease-in-out 0.15s;
  -moz-transition: border-color ease-in-out 0.15s;
}
#wealth-modeller .input-group .input-group-addon:first-child {
  border: 1px solid #d1d1d1;
  border-right: 0;
}
#wealth-modeller .input-group .input-group-addon:last-child {
  border: 1px solid #d1d1d1;
  border-left: 0;
}
#wealth-modeller .input-group .input-group-addon.focus {
  border-color: #66afe9;
}
#wealth-modeller .input-group.error .input[type='text'],
#wealth-modeller .input-group.error input[type='number'],
#wealth-modeller .input-group.error .input-group-addon {
  border-color: red;
}
#wealth-modeller .input-group.valid {
  border-color: green;
}
#wealth-modeller .ui-accordion .ui-accordion-header {
  color: white;
  background-color: #4f2170;
}
#wealth-modeller .ui-accordion .ui-accordion-header .fas,
#wealth-modeller .ui-accordion .ui-accordion-header .fab {
  color: #ce1126;
}
#wealth-modeller .ui-accordion .ui-accordion-header.ui-accordion-header-active,
#wealth-modeller .ui-accordion .ui-accordion-header.ui-state-hover {
  color: white;
  background-color: #f95602;
}
#wealth-modeller .ui-accordion .ui-accordion-header.ui-accordion-header-active .fas,
#wealth-modeller .ui-accordion .ui-accordion-header.ui-state-hover .fas,
#wealth-modeller .ui-accordion .ui-accordion-header.ui-accordion-header-active fab,
#wealth-modeller .ui-accordion .ui-accordion-header.ui-state-hover fab {
  color: white;
}
#wealth-modeller .ui-accordion .ui-accordion-header.ui-accordion-header-active .input-wrapper input[type='text'],
#wealth-modeller .ui-accordion .ui-accordion-header.ui-state-hover .input-wrapper input[type='text'] {
  color: white;
}
#wealth-modeller .ui-accordion .ui-accordion-header.ui-accordion-header-active .input-wrapper input[type='text'] + label,
#wealth-modeller .ui-accordion .ui-accordion-header.ui-state-hover .input-wrapper input[type='text'] + label {
  width: 100%;
}
#wealth-modeller .ui-accordion .ui-accordion-header .ui-accordion-header-icon.ui-icon-triangle-1-s:before {
  content: "\2212";
  font-family: 'PT Sans', 'Foundry Sterling', Minion, Arial;
  font-size: 30px;
}
#wealth-modeller .ui-accordion .ui-accordion-header .input-wrapper {
  width: 70%;
  line-height: 1;
  margin: 0;
  position: relative;
}
#wealth-modeller .ui-accordion .ui-accordion-header .input-wrapper input[type='text'] {
  width: 100%;
  line-height: 1;
  background: 0;
  border: 0;
  color: white;
  border-bottom: 1px solid white;
  margin: 0;
  padding: 0;
}
#wealth-modeller .ui-accordion .ui-accordion-header .input-wrapper input[type='text'] + label {
  position: absolute;
  display: inline;
  left: 0;
  right: 0;
  top: 125%;
  height: 1px;
  background: white;
  transition: width 0.3s linear;
}
#wealth-modeller .ui-accordion .ui-accordion-header .input-wrapper input[type='text'][readonly] {
  border: 0;
}
#wealth-modeller .ui-accordion .ui-accordion-header .input-wrapper input[type='text'][readonly] + label {
  width: 0%;
}
#wealth-modeller .ui-accordion article {
  padding: 15px;
}
#wealth-modeller p.error {
  display: block;
  float: left;
  margin-top: 10px;
  margin-bottom: 0;
  color: red;
}
#wealth-modeller .clearfix {
  width: 100%;
}
#wealth-modeller-results .year-controls .year-list {
  width: 100%;
}
#wealth-modeller-results .year-controls .year-list li {
  margin-left: 0;
  margin-right: 0;
  width: 40px;
}
#wealth-modeller-results .wealth-modeller-toggle-button {
  border: 1px solid black;
  color: black;
  background: #ce1126;
}
#wealth-modeller-results .wealth-modeller-toggle-button:active,
#wealth-modeller-results .wealth-modeller-toggle-button:hover,
#wealth-modeller-results .wealth-modeller-toggle-button.active,
#wealth-modeller-results .wealth-modeller-toggle-button.hover {
  background: #ce1126;
  color: black;
}
#wealth-modeller-results .wealth-modeller-results-action-buttons {
  padding-top: 15px;
  padding-bottom: 15px;
  font-size: 1.3em;
}
#wealth-modeller-results .wealth-modeller-results-action-buttons a {
  color: #ce1126;
}
#wealth-modeller-results .wealth-modeller-results-action-buttons i {
  margin-right: 20px;
}
#wealth-modeller-results .wealth-modeller-results-action-buttons i:first-child {
  margin-right: 0;
}
#wealth-modeller-results #recalculate {
  float: none;
  margin: auto;
}
#wealth-modeller-results .legend-color-line {
  width: 10px;
  height: 3px;
  margin-bottom: 12px;
  margin-top: 17px;
  display: inline-block;
}
#wealth-modeller-results .legend-color {
  width: 10px;
  height: 32px;
  display: inline-block;
}
#wealth-modeller-results #chart-legend {
  border-top: 1px solid lightgray;
  padding-top: 20px;
}
#wealth-modeller-results #chart-legend .col-sm-6,
#wealth-modeller-results #chart-legend .col-md-4,
#wealth-modeller-results #chart-legend .col-lg-3 {
  padding: 0;
}
#wealth-modeller-results #chart-legend #selected-age {
  background: #ce1126;
  color: black;
  margin-bottom: 15px;
}
#wealth-modeller-results .chart-legend-values {
  width: 150px;
  display: inline-block;
  margin-left: 10px;
  font-size: 0.75em;
}
#wealth-modeller-results .chart-legend-values .value {
  font-weight: 600;
}
#wealth-modeller-results #chart-controls {
  text-align: center;
}
#wealth-modeller-results #chart-controls #chart-controls-icons {
  margin: 20px 0 20px 0;
}
#wealth-modeller-results #chart-controls #chart-controls-icons .chart-icon {
  padding-left: 10px;
  padding-right: 10px;
  color: #ce1126;
}
#wealth-modeller-results #chart-controls #chart-controls-icons .chart-icon:hover,
#wealth-modeller-results #chart-controls #chart-controls-icons .chart-icon:visited {
  color: #ce1126;
}
#wealth-modeller-results #chart-controls #chart-controls-icons #chartPanLeft {
  margin-right: 40px;
}
#wealth-modeller-results #chart-controls #chart-controls-icons #chartPanRight {
  margin-left: 40px;
}
#wealth-modeller-results #chart-controls #chart-controls-icons .disabled {
  opacity: 0.1;
}
#wealth-modeller-results .wealth-modeller-switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}
#wealth-modeller-results .wealth-modeller-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
#wealth-modeller-results .wealth-modeller-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  background-color: #ce1126;
}
#wealth-modeller-results .wealth-modeller-slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
#wealth-modeller-results input:checked + .wealth-modeller-slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
#wealth-modeller-results .wealth-modeller-slider.round {
  border-radius: 34px;
}
#wealth-modeller-results .wealth-modeller-slider.round:before {
  border-radius: 50%;
}
#wealth-modeller-results .toggle {
  align-self: center;
}
#wealth-modeller-chart-area,
#wealth-modeller-results {
  padding: 0;
}
#wealth-modeller-chart-area .popover-dismiss-header,
#wealth-modeller-results .popover-dismiss-header {
  text-align: right;
}
#wealth-modeller-chart-area .popover-noshow-header,
#wealth-modeller-results .popover-noshow-header {
  text-align: center;
}
#wealth-modeller-chart-area .popover-dismiss,
#wealth-modeller-results .popover-dismiss,
#wealth-modeller-chart-area .popover-icon,
#wealth-modeller-results .popover-icon {
  color: #ce1126;
}
#wealth-modeller .assumptions-modal .modal-dialog .modal-header,
#wealth-modeller-results .assumptions-modal .modal-dialog .modal-header,
#wealth-modeller #assumptions-modal .modal-dialog .modal-header,
#wealth-modeller-results #assumptions-modal .modal-dialog .modal-header {
  display: block;
  padding: 15px;
}
#wealth-modeller .assumptions-modal .modal-dialog .modal-footer,
#wealth-modeller-results .assumptions-modal .modal-dialog .modal-footer,
#wealth-modeller #assumptions-modal .modal-dialog .modal-footer,
#wealth-modeller-results #assumptions-modal .modal-dialog .modal-footer {
  border-top: 0;
  margin: 0 !important;
}
#wealth-modeller .assumptions-modal .modal-dialog button.close,
#wealth-modeller-results .assumptions-modal .modal-dialog button.close,
#wealth-modeller #assumptions-modal .modal-dialog button.close,
#wealth-modeller-results #assumptions-modal .modal-dialog button.close {
  filter: invert(11%) sepia(80%) saturate(6380%) hue-rotate(355deg) brightness(91%) contrast(109%);
  opacity: 0.6;
}
#wealth-modeller .assumptions-modal .modal-dialog button.close:hover,
#wealth-modeller-results .assumptions-modal .modal-dialog button.close:hover,
#wealth-modeller #assumptions-modal .modal-dialog button.close:hover,
#wealth-modeller-results #assumptions-modal .modal-dialog button.close:hover {
  opacity: 0.75;
}
#wealth-modeller .assumptions-modal .modal-dialog button.close:focus,
#wealth-modeller-results .assumptions-modal .modal-dialog button.close:focus,
#wealth-modeller #assumptions-modal .modal-dialog button.close:focus,
#wealth-modeller-results #assumptions-modal .modal-dialog button.close:focus {
  box-shadow: none;
}
#wealth-modeller ul.assumptions-list,
#wealth-modeller-results ul.assumptions-list {
  margin: 0;
}
#wealth-modeller ul.assumptions-list li.assumptions-list-item,
#wealth-modeller-results ul.assumptions-list li.assumptions-list-item {
  list-style: none;
  display: inline-block;
  width: 60px;
  height: 60px;
  padding: 20px 0px;
  margin: 0;
  border: 1px solid;
  color: inherit;
  margin-right: 12px;
  margin-left: 12px;
  position: relative;
}
#wealth-modeller ul.assumptions-list li.assumptions-list-item span,
#wealth-modeller-results ul.assumptions-list li.assumptions-list-item span {
  position: absolute;
  left: 0;
  right: 0;
  top: 60px;
  font-size: 0.75em;
  font-weight: 600;
}
#wealth-modeller-results .assumptions-list .assumptions-list-item:hover,
#wealth-modeller-results .assumptions-list .assumptions-list-item:active,
#wealth-modeller-results .assumptions-list .assumptions-list-item.hover,
#wealth-modeller-results .assumptions-list .assumptions-list-item.active {
  background-color: #ce1126;
  color: black;
  cursor: pointer;
}
.assumption-header {
  font-size: 1rem;
  color: black !important;
  padding-bottom: 0px;
  border-bottom: none;
}
.assets-list-header {
  color: black !important;
  margin-bottom: 0px;
  font-size: 18px;
  border-bottom: none;
}
.asset-header {
  border-bottom: 1px solid #f95602;
  font-size: 22px;
  padding-bottom: 6px;
}
.product-heading {
  font-size: 22px;
  padding-bottom: 6px;
  color: black;
}
.no-padding {
  padding: 0 !important;
}
@media only screen and (max-width: 767px) {
  #wealth-modeller ul.assumptions-list li.assumptions-list-item,
  #wealth-modeller-results ul.assumptions-list li.assumptions-list-item {
    margin-right: 20px;
    margin-left: 20px;
  }
  #wealth-modeller .wealth-modeller-toggle-button,
  #wealth-modeller-results .wealth-modeller-toggle-button {
    width: 50%;
  }
  #wealth-modeller-results .wealth-modeller-results-action-buttons {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-around;
  }
  #wealth-modeller-results .wealth-modeller-results-action-buttons i {
    margin-right: 0;
  }
  #wealth-modeller-results .row {
    padding: 8px 0px;
  }
  #wealth-modeller-results .chart-legend-values {
    width: 95px;
  }
  #wealth-modeller .button-area {
    display: flex;
    flex-direction: column-reverse;
  }
  #wealth-modeller .button-area button[type="submit"] {
    width: 100%;
    margin-bottom: 20px;
  }
  #wealth-modeller .button-area button[type="reset"] {
    width: 100%;
    margin-bottom: 0px;
    margin-right: 0px;
  }
  #chart-controls {
    visibility: hidden;
    display: none;
  }
}
@media only screen and (min-width: 400px) {
  #wealth-modeller-results .chart-legend-values {
    width: 120px;
  }
}
@media only screen and (min-width: 1050px) {
  #wealth-modeller #assumptions-modal .modal-dialog,
  #wealth-modeller-results #assumptions-modal .modal-dialog {
    width: auto;
    max-width: none;
  }
  #wealth-modeller .assumptions-modal .modal-dialog,
  #wealth-modeller-results .assumptions-modal .modal-dialog {
    width: auto;
    max-width: 600px;
  }
}
@media only screen and (min-width: 768px) {
  #wealth-modeller .assumptions-modal .modal-dialog,
  #wealth-modeller-results .assumptions-modal .modal-dialog,
  #wealth-modeller #assumptions-modal .modal-dialog,
  #wealth-modeller-results #assumptions-modal .modal-dialog {
    width: 600px;
    max-width: 600px;
  }
  #wealth-modeller .ui-accordion .ui-accordion-header .input-wrapper {
    width: 80%;
  }
  #wealth-modeller-results .chart-legend-values {
    width: 145px;
  }
}
@media only screen and (min-width: 992px) {
  #wealth-modeller .assumptions-modal .modal-dialog,
  #wealth-modeller-results .assumptions-modal .modal-dialog,
  #wealth-modeller #assumptions-modal .modal-dialog,
  #wealth-modeller-results #assumptions-modal .modal-dialog {
    width: 800px;
    max-width: 800px;
  }
  #wealth-modeller .ui-accordion .ui-accordion-header .input-wrapper {
    width: 85%;
  }
}
iframe#external-modeller-iframe {
  width: 100%;
  min-height: 70vh;
}
div#external-modeller-error-message,
div#external-modeller-terms,
div#external-modeller-eligibility {
  min-height: 30vh;
}
div.button-container {
  display: flex;
  justify-content: center;
}
button#external-modeller-terms-accept {
  margin-right: 5px;
}
button#external-modeller-terms-decline {
  margin-left: 5px;
}
ul.contribution-list,
ul.fund-list,
ul.portfolio-fund-list {
  
}
ul.contribution-list li,
ul.fund-list li,
ul.portfolio-fund-list li {
  transition: all 0.5s ease;
  color: #f95602;
  cursor: pointer;
}
ul.contribution-list li.active-legend,
ul.fund-list li.active-legend,
ul.portfolio-fund-list li.active-legend {
  background: white;
  padding: 10px;
  border: 1px solid #f95602;
}
ul.contribution-list li.active-legend,
ul.fund-list li.active-legend,
ul.portfolio-fund-list li.active-legend {
  border-radius: 15px;
}
ul.contribution-list li.active-legend,
ul.fund-list li.active-legend,
ul.portfolio-fund-list li.active-legend {
  box-shadow: 0 1rem 19px -10px rgba(0, 0, 0, 0.4);
}
.card-layout section#cookie-confirmation-message {
  padding: 20px;
  border: 3px solid #505050;
  width: 50%;
  margin: auto;
}
.card-layout section#cookie-confirmation-message p {
  text-align: center;
}
.card-layout section#cookie-confirmation-message p .text-bold {
  font-weight: bold;
}
.card-layout .cookie-section {
  margin-top: 15px;
  margin-bottom: 15px;
}
#cookie-banner-buttons {
  padding-right: 0;
}
.card-layout section.touch-workflow .faded {
  pointer-events: none;
  opacity: 0.4;
}
.card-layout section.touch-workflow .form h4 {
  color: black;
  border-bottom: 1px solid #f95602;
  font-size: 24px;
  padding-bottom: 6px;
}
.card-layout section.touch-workflow .form .formRow {
  margin-left: 0;
  margin-right: 0;
}
.card-layout section.touch-workflow input {
  border-radius: 0.25rem;
}
.card-layout section.touch-workflow input.read-only {
  border: none;
  padding-left: 0;
  padding-top: 0;
}
.card-layout section.touch-workflow .hyperlink {
  overflow-wrap: break-word;
}
.card-layout section.touch-workflow div.multiple {
  margin-bottom: 1rem;
}
.card-layout section.touch-workflow div.multiple select {
  overflow: hidden;
  height: 100%;
}
.card-layout section.touch-workflow .loading-container .progress {
  height: 2rem;
  background-color: #e9f606;
}
.card-layout section.touch-workflow .loading-container .progress .progress-bar {
  background-color: #bac405;
  font-size: 16px;
  color: black;
}
.card-layout section.touch-workflow div.radio span.radio-container span.radio.selected span.selected-option {
  background: #ce1126 !important;
}
.card-layout section.touch-workflow .touch-mandatory:after {
  content: " *";
}
.card-layout section.touch-workflow .touch-case-card {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  background-color: black;
}
.card-layout section.touch-workflow .touch-case-card .card-title {
  font-weight: bold;
}
.card-layout section.touch-workflow .touch-case-card:hover {
  -webkit-transform: scale(1.03);
  -moz-transform: scale(1.03);
  -ms-transform: scale(1.03);
  -o-transform: scale(1.03);
  transform: scale(1.03);
}
.card-layout section.touch-workflow .touch-case-card .fas {
  color: #bac405;
}
.card-layout section.touch-workflow .touch-case-card .card-notification {
  background-color: transparent;
  color: red;
  padding: 5px;
  width: 20px;
  height: 20px;
  position: absolute;
  right: -5px;
  top: -10px;
}
.card-layout section.touch-workflow .touch-case-card.active {
  background-color: #bac405;
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
}
.card-layout section.touch-workflow .touch-case-card.active p,
.card-layout section.touch-workflow .touch-case-card.active .card-title,
.card-layout section.touch-workflow .touch-case-card.active .fas {
  color: black;
}
.card-layout section.touch-workflow .touch-case-card.active .text-muted {
  color: black !important;
}
@media (min-width: 576px) {
  .card-layout section.touch-workflow .touch-case-card.active .card-title {
    color: #bac405;
  }
}
.card-layout section.touch-workflow .touch-case-card.active .card-notification {
  color: red;
}
@media (min-width: 576px) {
  .card-layout section.touch-workflow .touch-case-card .case-list-container {
    border-right: 1px solid #f95602;
  }
  .card-layout section.touch-workflow .touch-case-card .right-arrow {
    line-height: 38px;
    margin: 15px 0;
    margin-left: -20px;
    margin-bottom: 0;
    padding-left: 20px;
    position: relative;
    width: 120%;
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.3);
  }
  .card-layout section.touch-workflow .touch-case-card .right-arrow:before,
  .card-layout section.touch-workflow .touch-case-card .right-arrow:after {
    content: "";
    border-style: solid;
    border-width: 0;
    height: 0;
    position: absolute;
    width: 0;
  }
  .card-layout section.touch-workflow .touch-case-card .right-arrow {
    background-color: black;
  }
  .card-layout section.touch-workflow .touch-case-card .right-arrow:after,
  .card-layout section.touch-workflow .touch-case-card .right-arrow:before {
    border-width: 19px 0 19px 19px;
  }
  .card-layout section.touch-workflow .touch-case-card .right-arrow:before {
    border-color: black;
    left: -18px;
  }
  .card-layout section.touch-workflow .touch-case-card .right-arrow:after {
    border-color: transparent black;
    right: -18px;
  }
  .card-layout section.touch-workflow .touch-case-card .ribbon-triangle {
    border-style: solid;
    border-color: #006666 #006666 transparent transparent;
    border-width: 0.25em 0.5em 0.25em 0.5em;
    width: 1em;
    height: 0.5em;
    margin-left: -38px;
  }
}
@media (min-width: 576px) {
  .card-layout section.touch-workflow .case-list-container {
    border-right: 1px solid #f95602;
  }
}
.card-layout .nominations-page-container p.modal-title {
  font-size: 120%;
}
.card-layout .nominations-page-container #btnDone {
  float: right;
  margin-right: 0;
}
.card-layout .nominations-page-container .nominations-center {
  align-items: center;
  justify-content: center;
  text-align: center;
}
.card-layout .nominations-page-container .nominations-center p strong {
  font-weight: bold;
}
.card-layout .nominations-page-container .nominations-center p span {
  color: black;
}
.card-layout .nominations-page-container .nominations-center li {
  color: black;
  font-weight: bold;
  list-style: inside;
}
.card-layout .nominations-page-container #address-read-only i.fas,
.card-layout .nominations-page-container #address-inputs i.fas,
.card-layout .nominations-page-container #comment-header i.fas {
  margin-left: 20px;
  margin-right: 0;
  color: #ce1126;
  font-size: 130%;
  cursor: pointer;
}
.card-layout .nominations-page-container #use-my-address {
  margin-top: 25px;
}
.card-layout .nominations-page-container #percentage-input .input-group,
.card-layout .nominations-page-container #amount-input .input-group {
  width: 25%;
}
.card-layout .nominations-page-container label {
  color: black;
}
.card-layout .nominations-page-container .radio label {
  width: 28%;
}
.card-layout .nominations-page-container span.input-group-text {
  color: black;
  line-height: 30px;
}
.card-layout .nominations-page-container .radio label:last-of-type {
  width: auto;
}
.card-layout .nominations-page-container h3 {
  color: black;
}
.card-layout .nominations-page-container .allocation-text {
  color: black;
  font-weight: 700;
  width: 100%;
}
.card-layout .nominations-page-container .allocation-header {
  text-align: right;
  padding-top: 90px;
  font-size: larger;
}
.card-layout .nominations-page-container .nomination-section {
  margin-top: 0;
  margin-bottom: 15px;
}
.card-layout .nominations-page-container .nominations-chart {
  width: 120px;
  height: 120px;
}
.card-layout .nominations-page-container .col-sm-6 {
  text-align: left;
}
.card-layout .nominations-page-container .allocation-value {
  color: #de0001;
  top: 88px;
  width: 50%;
  text-align: center;
  margin-left: 5px;
}
.card-layout .nominations-page-container .icon-title {
  width: 100%;
}
.card-layout .nominations-page-container .nominee-add {
  border: none;
}
.card-layout .nominations-page-container .div-button {
  text-align: center;
  padding-top: 40px;
}
.card-layout .nominations-page-container .no-nominations {
  padding-bottom: 7px;
}
.card-layout .nominations-page-container .allocation-label-sm {
  vertical-align: 40px;
}
.card-layout .nominations-page-container .div-center {
  text-align: center;
  width: 100%;
}
.card-layout .nominations-page-container #account-details article {
  font-size: 15px;
  padding: 15px 0px;
}
.card-layout .nominations-page-container .mat-icon-sm {
  font-size: 25px;
  cursor: pointer;
}
.card-layout .nominations-page-container .mat-personicon-sm {
  font-size: 25px;
  cursor: none;
}
.card-layout .nominations-page-container .nominee-list-p {
  font-size: smaller;
  line-height: 0px;
}
.card-layout .nominations-page-container .nominee-list-name {
  margin-bottom: 5px;
}
.card-layout .nominations-page-container .nominee-list-allocation {
  font-weight: bold;
}
.card-layout .nominations-page-container .nominee-list-comment {
  margin-left: 20px;
}
.card-layout .nominations-page-container .nominee-allocation {
  color: red;
}
.card-layout .nominations-page-container label.required:after,
.card-layout .nominations-page-container p.required:after {
  content: ' *';
}
.card-layout .nominations-page-container .nominee-row div {
  margin-bottom: 10px;
  border-bottom: 1px solid #f95602;
}
.card-layout .nominations-page-container #nominee-details-percent .nominee-row:last-child div,
.card-layout .nominations-page-container #nominee-details-amount .nominee-row:last-child div {
  border-bottom: none;
}
.card-layout .nominations-page-container .nominee-details-title {
  margin-top: 20px;
  margin-bottom: 20px;
}
.card-layout .nominations-page-container .nominee-details-title p {
  font-weight: bold;
  font-size: 140%;
}
.card-layout .nominations-page-container p#input-form-title {
  font-weight: bold;
  font-size: 140%;
}
.card-layout .nominations-page-container .confirmation-message {
  margin-top: 25px;
}
.card-layout .nominations-page-container i.fas.warning {
  color: red;
}
.card-layout .nominations-page-container i.fas.success {
  color: green;
}
.card-layout .nominations-page-container i.fas.info {
  color: blue;
}
.card-layout .nominations-page-container .nomination-summary-buttons {
  margin-bottom: 20px;
}
.card-layout .nominations-page-container .nomination-summary-buttons button {
  min-width: 200px;
  margin-right: 5px;
}
.card-layout .nominations-page-container .nomination-summary-buttons button.split-evenly {
  margin-bottom: 20px;
}
.card-layout .nominations-page-container .nominee-icon {
  float: right;
}
.card-layout .nominations-page-container .nominee-details {
  margin-bottom: 10px;
}
.card-layout .nominations-page-container .nominee-details i.fas {
  font-size: 130%;
  margin-top: 10px;
  color: #ce1126;
  cursor: pointer;
}
.card-layout .nominations-page-container .nominee-details .fa-user-circle {
  cursor: unset !important;
}
.card-layout .nominations-page-container .nominee-details .fa-handshake {
  cursor: unset !important;
}
.card-layout .nominations-page-container .existing-address {
  width: 100%;
}
.card-layout .nominations-page-container .nomination-action-buttons {
  margin-top: 30px;
  padding-left: 0;
}
.card-layout .nominations-page-container .nomination-action-buttons button {
  min-width: 200px;
  margin-right: 5px;
}
.card-layout .nominations-page-container .nomination-action-buttons button.button-sm {
  max-height: 45px;
}
.card-layout .nominations-page-container .nomination-action-buttons button.nominee-add {
  position: absolute;
  right: 0;
  bottom: 0;
  min-width: 0;
}
.card-layout .nominations-page-container .nomination-action-buttons.back-to-dashboard-container {
  margin-top: 0;
  margin-left: 0;
}
.card-layout .nominations-page-container .disabled {
  opacity: 0.5;
  pointer-events: none;
}
@media screen and (max-width: 450px) {
  .card-layout .nominations-page-container .allocation-header {
    text-align: center;
    padding-top: 20px;
    font-size: large;
  }
  .card-layout .nominations-page-container .material-icons {
    font-size: 40px;
  }
  .card-layout .nominations-page-container .mat-icon-sm {
    font-size: 25px;
    cursor: pointer;
  }
  .card-layout .nominations-page-container .mat-personicon-sm {
    font-size: 25px;
    cursor: none;
  }
  .card-layout .nominations-page-container .add-person-button {
    height: 65px;
  }
  .card-layout .nominations-page-container .col-sm-6 .div-center {
    text-align: center;
  }
  .card-layout .nominations-page-container .allocation-value {
    width: 100%;
    top: 63px;
  }
  .card-layout .nominations-page-container .allocation-chart {
    width: 100%;
  }
  .card-layout .nominations-page-container .div-button {
    padding-top: 30px;
  }
  .card-layout .nominations-page-container .allocation-label-sm {
    vertical-align: 60px;
  }
  .card-layout .nominations-page-container .button-sm {
    width: 65px;
  }
  .card-layout .nominations-page-container #address-lookup {
    margin-bottom: 2.5rem;
  }
}
@media (min-width: 767px) {
  .card-layout .nominations-page-container .allocation-value {
    width: 65%;
  }
}
@media (min-width: 1200px) {
  .card-layout .nominations-page-container .allocation-value {
    width: 50%;
  }
}
@media (max-width: 768px) {
  .card-layout .nominations-page-container .nomination-summary-buttons button,
  .card-layout .nominations-page-container .nomination-action-buttons button {
    width: 100%;
    margin: 0 0 10px 0;
  }
  .card-layout .nominations-page-container .nomination-summary-buttons button.nominee-add,
  .card-layout .nominations-page-container .nomination-action-buttons button.nominee-add {
    position: relative;
  }
  .card-layout .nominations-page-container .nomination-summary-buttons .back-to-dashboard,
  .card-layout .nominations-page-container .nomination-action-buttons .back-to-dashboard {
    position: relative;
  }
  .card-layout .nominations-page-container label {
    width: 75%;
  }
  .card-layout .nominations-page-container #percentage-input .input-group,
  .card-layout .nominations-page-container #amount-input .input-group {
    width: 50%;
  }
  .card-layout .nominations-page-container #btnBack {
    margin-bottom: 10px;
  }
  .card-layout .nominations-page-container .nominee-details-title p {
    font-size: 100%;
  }
  .card-layout .nominations-page-container .nominee-details-list .confirmation-message,
  .card-layout .nominations-page-container .nominee-details-list .nomination-action-buttons {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .card-layout .nominations-page-container .toggle-switch {
    min-width: 60px;
  }
}
.card-layout .nominations-page-container #comment #nomineeComment {
  text-align: center;
  font-style: italic;
}
.card-layout .nominations-page-container #comment #add-comment {
  margin-bottom: 1.5rem;
}
.card-layout .nominations-page-container #comment i.fas.fa-quote-left {
  margin-right: 5px;
  font-size: 80%;
  color: black;
}
.card-layout .nominations-page-container #comment i.fas.fa-quote-right {
  margin-left: 5px;
  font-size: 80%;
  color: black;
}
.card-layout .nominations-page-container hr {
  margin-bottom: 1.5rem;
}
@media (max-width: 320px) {
  .nomination-info-container {
    padding: 0;
  }
}
@media (max-width: 375px) {
  .nomination-section .container {
    padding: 0;
  }
}
.commentTextArea {
  margin-top: 5px;
}
#existing-comment-section {
  margin-top: 3rem;
}
#existing-comment-section #existing-comment-label {
  margin-top: 1.5rem;
}
#existing-comment-section .existing-comment-name {
  font-size: 110%;
}
#existing-comment-section .existing-nominee-comment-clone {
  border-radius: inherit;
  border-width: 1px;
}
@media (max-width: 576px) {
  .nomination-method {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: space-evenly;
  }
  .nomination-method .benefit-allocation-method {
    min-width: 75%;
    margin-bottom: 10px;
  }
  .nomination-method .benefit-allocation-method:last-child {
    margin-bottom: 0;
  }
}
@media (min-width: 576px) {
  .nominee-add {
    align-self: auto;
  }
}
button.btn.eq-btn {
  transition: all 0.3s;
}
button.btn.eq-btn i.fas {
  padding-right: 6px;
}
button.btn.eq-btn-icon-only i.fas {
  padding: 0;
}
button.btn:disabled {
  pointer-events: none !important;
  cursor: default;
}
button.btn:disabled.hover,
button.btn:disabled:hover {
  background-color: #bac405;
}
button.btn.eq-btn-banner {
  margin: 0 0.25rem 0.25rem 0.25rem;
}
button.btn.eq-btn-small-60 {
  font-size: 60%;
}
button.btn.eq-btn-primary {
  color: black;
  background-color: #bac405;
  border-color: #bac405;
}
button.btn.eq-btn-primary.hover,
button.btn.eq-btn-primary:hover,
button.btn.eq-btn-primary.focus,
button.btn.eq-btn-primary:focus {
  background-color: #8b9204;
  outline: none;
  box-shadow: none;
}
button.btn.eq-btn-cancel,
button.btn.eq-btn-info {
  color: #bac405;
  background-color: black;
  border-color: #bac405;
}
button.btn.eq-btn-cancel.hover,
button.btn.eq-btn-info.hover,
button.btn.eq-btn-cancel:hover,
button.btn.eq-btn-info:hover,
button.btn.eq-btn-cancel.focus,
button.btn.eq-btn-info.focus,
button.btn.eq-btn-cancel:focus,
button.btn.eq-btn-info:focus {
  background-color: #1a1a1a;
  outline: none;
  box-shadow: none;
}
button.btn.btn-link,
button.btn.btn-link:active,
button.btn.btn-link[disabled] {
  background-color: transparent;
  background-image: none;
}
button.btn.btn-link {
  border-color: transparent;
  cursor: pointer;
  color: #bac405;
  text-decoration: none;
}
button.btn.btn-link:hover,
button.btn.btn-link:focus {
  text-decoration: underline;
  background-color: transparent;
  border: 1;
}
button.btn.btn-link[disabled]:hover,
button.btn.btn-link[disabled]:focus {
  color: #bac405;
  text-decoration: none;
}
@media (min-width: 576px) {
  button.btn.eq-btn-large {
    width: 170px;
    margin-right: 10px;
  }
  button.btn.eq-btn-large i {
    width: 100%;
  }
}
@media (max-width: 576px) {
  button.btn.eq-btn-large {
    width: 100%;
    margin-bottom: 10px;
  }
  button.btn.eq-btn-large i {
    vertical-align: middle;
  }
}
@media (max-width: 463px) {
  button.btn.eq-btn-small {
    padding: 0.25rem 0.5rem;
    font-size: 0.8rem;
  }
}
@media (max-width: 767px) {
  button.btn.eq-btn-banner {
    float: left !important;
    margin-top: 0.5rem;
    margin-left: 0;
  }
  button.btn.eq-btn-767-w100 {
    width: 100%;
  }
}
@media (max-width: 1199px) and (min-width: 767px) {
  button.btn.eq-btn-767-1199-w100 {
    width: 100%;
    margin-top: 0.5rem;
  }
}
#complete-button i {
  display: inline;
}
.modal-header button.close {
  color: #bac405;
  border: none;
  background-color: transparent;
}
.modal-header button.close span {
  color: #bac405;
  font-size: initial;
}
.modal-header button.close span:hover {
  color: #8b9204;
}
.modal-header button.close:hover {
  background-color: transparent;
}
.modal-title {
  font-size: 110%;
  font-weight: bold;
  color: #bac405;
}
.modal-body strong {
  font-weight: bold;
}
.modal-body table.expandable-content-child {
  width: 100%;
}
.modal-body td.expandable-content-child-label {
  width: 30%;
  text-align: left;
  vertical-align: top;
  font-weight: bold;
}
.modal-body td.expandable-content-child-data {
  width: 70%;
  text-align: left;
  vertical-align: top;
}
.modal-body .active-row {
  font-weight: bold;
  height: 45px;
}
.modal-body table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child:before,
.modal-body table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child:before {
  margin-top: auto;
  transform: translateY(-50%);
  background-color: #bac405;
  color: black;
  border: 2px solid black;
}
.modal-body table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before,
.modal-body table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
  background-color: #bac405;
  color: black;
  border: 2px solid black;
}
.modal-body table.dataTable thead th {
  font-size: 14px;
  font-weight: normal;
  vertical-align: top;
  padding-right: 10px;
  padding-left: 10px;
  border-bottom: none;
  color: black;
  background-color: #bac405;
}
@media (max-width: 768px) {
  .modal-body table.dataTable thead th {
    font-size: 12px;
  }
}
.modal-body table.dataTable td {
  text-align: left;
  font-size: 14px;
  vertical-align: middle;
}
@media (max-width: 768px) {
  .modal-body table.dataTable td {
    font-size: 12px;
  }
}
.modal-body table.dataTable td.child {
  padding: 0px;
}
.modal-body table.dataTable.no-footer {
  border-bottom: 1px solid #dee2e6;
}
.modal-body .input-group-text {
  padding: 10px 15px;
}
.card-layout .toggle-switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
  margin: 0px 15px;
}
.card-layout .toggle-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.card-layout .toggle-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #cccccc;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.card-layout .toggle-slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.card-layout input:checked + .toggle-slider {
  background-color: #ce1126;
}
.card-layout input:focus + .toggle-slider {
  box-shadow: 0 0 1px #ce1126;
}
.card-layout input:checked + .toggle-slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
.card-layout .toggle-slider.round {
  border-radius: 34px;
}
.card-layout .toggle-slider.round:before {
  border-radius: 50%;
}
.toggle-label {
  height: 34px;
  align-self: center;
  font-weight: bold;
  width: auto;
  padding: 0px;
}
.toggle-label p {
  color: #ce1126;
  margin-bottom: 0px;
}
.toggle {
  margin-left: 10px;
  margin-right: 10px;
  width: auto;
  padding: 0px;
}
.video-container {
  margin-bottom: 20px;
}
.simple-video-title {
  font-size: 22px;
  margin: 5px 0;
}
.simple-video-text {
  font-size: 0.875rem;
}
.simple-video {
  width: 100%;
  margin: 15px 0 10px 0;
}
.vjs-icon-placeholder {
  color: white;
}
.vjs-button:hover,
.vjs-button:focus,
.vjs-button:active {
  background: none;
  color: white;
}
.bank-details-container .available-details {
  position: relative;
  padding: 0 20px;
  margin: 50px 0 0 0;
}
.bank-details-container .data-points {
  display: flex;
  justify-content: space-between;
  margin-bottom: 15px;
}
.bank-details-container .data-points.bold {
  font-weight: bold;
}
.bank-details-container #confirm-details-data {
  display: flex;
}
.bank-details-container label {
  margin: 0;
}
.bank-details-container label.bold {
  font-weight: bold;
}
.bank-details-container label.bank-input-labels {
  white-space: nowrap;
}
.bank-details-container label.bank-input-labels-subtext {
  font-size: 0.7rem;
  white-space: nowrap;
}
.bank-details-container .underlined {
  border-bottom: 1px solid black;
}
.bank-details-container #change-details-form {
  display: none;
}
.bank-details-container #change-details-form .stage {
  display: none;
}
.bank-details-container #change-details-form button {
  float: right;
}
.bank-details-container .stage-title {
  font-size: 2rem;
  margin-bottom: 20px 0;
}
.bank-details-container .stage-subtext {
  margin: 30px 0;
}
.bank-details-container #sort-code-input {
  display: block;
}
.bank-details-container #account-number-input {
  display: block;
}
.bank-details-container #buildingSoc-number-input {
  display: block;
}
.bank-details-container #upcoming-payment-dates {
  display: flex;
  justify-content: space-evenly;
  margin: 50px 0 100px 0;
}
.bank-details-container #change-details-payment-date {
  color: black;
}
.bank-details-container .bank-details-error {
  margin: 30px 0;
  color: #d40c0c;
  display: none;
}
.bank-details-container .bank-confirmation-message {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}
.bank-details-container .bank-center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.bank-details-container .bank-center p strong {
  font-weight: bold;
}
.bank-details-container .bank-center p span {
  color: black;
}
.bank-details-container .bank-center li {
  color: black;
  font-weight: bold;
  list-style: inside;
}
.bank-details-container .bank-details-buttons {
  margin-right: 1em;
}
.bank-details-container .branch-address {
  color: black;
}
.bank-details-container #future-details {
  position: relative;
}
.bank-details-container #future-details .banner-outer {
  position: absolute;
  left: 45%;
  height: 100%;
  top: 28%;
  display: table;
  border-left: 1px solid lightgray;
  border-right: 1px solid lightgray;
  box-shadow: 12px 0 15px -10px rgba(0, 0, 0, 0.4), -12px 0 15px -10px rgba(0, 0, 0, 0.4);
}
.bank-details-container #future-details .banner-inner {
  display: table-cell;
  vertical-align: middle;
}
.bank-details-container #future-details table.future-details-table {
  width: 40%;
  margin-left: 0;
}
.bank-details-container #future-details table.future-details-table.future {
  float: right;
}
.bank-details-container #future-details div#future-details-banner-mobile {
  display: none;
}
@media (max-width: 995px) {
  .bank-details-container #upcoming-payment-dates {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: space-evenly;
  }
  .bank-details-container #upcoming-payment-dates .payment-date-pills {
    min-width: 75%;
    margin-bottom: 10px;
  }
  .bank-details-container #upcoming-payment-dates .payment-date-pills:last-child {
    margin-bottom: 0;
  }
  .bank-details-container .bank-details-buttons {
    margin: 0.6rem;
  }
}
@media (max-width: 767px) {
  .bank-details-container #upcoming-payment-dates {
    display: flex;
    justify-content: space-evenly;
    margin: 50px 0;
  }
  .bank-details-container .bank-details-buttons {
    margin: 0.6rem 0;
  }
  .bank-details-container #future-details #future-details-banner {
    display: none;
  }
  .bank-details-container #future-details table.future-details-table {
    width: 100%;
    margin-left: 0;
  }
  .bank-details-container #future-details div#future-details-banner-mobile {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 992px) {
  .bank-details-container #future-details .banner-outer {
    left: 40%;
    top: 25%;
  }
  .bank-details-container #future-details table.future-details-table {
    width: 30%;
  }
}
.circle {
  border-radius: 50%;
  background: #505050;
  height: 3.4rem;
  width: 3.4rem;
  margin-bottom: 10px;
  background-color: #dadada;
  z-index: 100;
  color: #787878;
}
.circle.active {
  padding: 1rem;
  background-color: white;
  box-shadow: 0 0 0 4px white, 0 0 0 6px #5cb85c;
}
.circle.completed {
  background-color: #5cb85c;
  color: white;
  z-index: 100;
  height: 3.4rem;
  width: 3.4rem;
}
.circle.step-icon {
  font-size: 1.6rem;
}
.progress-bar-container {
  position: relative;
}
.progress-bar-background {
  background-color: #dadada;
  position: absolute;
  left: 0;
  width: 100%;
  height: 10px;
  top: 3.5rem;
  z-index: 1;
}
#progress-bar {
  position: absolute;
  left: 0;
  background: #5cb85c;
  height: 10px;
  top: 3.5rem;
  transition: 0.4s ease;
  z-index: 2;
}
.card-layout .dependants-page-container p.modal-title {
  font-size: 120%;
}
.card-layout .dependants-page-container #btnDone {
  margin-right: 0;
}
.card-layout .dependants-page-container .dependants-center {
  align-items: center;
  justify-content: center;
  text-align: center;
}
.card-layout .dependants-page-container .dependants-center p strong {
  font-weight: bold;
}
.card-layout .dependants-page-container .dependants-center p span {
  color: black;
}
.card-layout .dependants-page-container .dependants-center li {
  color: black;
  font-weight: bold;
  list-style: inside;
}
.card-layout .dependants-page-container #address-read-only i.fas,
.card-layout .dependants-page-container #address-inputs i.fas {
  margin-left: 20px;
  margin-right: 0;
  color: #ce1126;
  font-size: 130%;
  cursor: pointer;
}
.card-layout .dependants-page-container #use-my-address {
  margin-top: 25px;
}
.card-layout .dependants-page-container label {
  color: black;
}
.card-layout .dependants-page-container .radio label {
  width: 28%;
}
.card-layout .dependants-page-container span.input-group-text {
  color: black;
}
.card-layout .dependants-page-container .radio label:last-of-type {
  width: auto;
}
.card-layout .dependants-page-container h3 {
  color: black;
}
.card-layout .dependants-page-container .dependant-section {
  margin-top: 0;
  margin-bottom: 15px;
}
.card-layout .dependants-page-container .col-sm-6 {
  text-align: left;
}
.card-layout .dependants-page-container .icon-title {
  width: 100%;
}
.card-layout .dependants-page-container .dependant-add {
  border: none;
}
.card-layout .dependants-page-container .div-button {
  text-align: center;
  padding-top: 40px;
}
.card-layout .dependants-page-container .no-dependants {
  padding-bottom: 7px;
}
.card-layout .dependants-page-container .div-center {
  text-align: center;
  width: 100%;
}
.card-layout .dependants-page-container .dependant-list-p {
  font-size: smaller;
  line-height: 0px;
}
.card-layout .dependants-page-container .dependant-list-name {
  margin-bottom: 5px;
}
.card-layout .dependants-page-container label.required:after,
.card-layout .dependants-page-container p.required:after {
  content: ' *';
}
.card-layout .dependants-page-container .dependant-row div {
  margin-bottom: 10px;
  border-bottom: 1px solid #f95602;
}
.card-layout .dependants-page-container #dependant-details .dependant-row:last-child div {
  border-bottom: none;
}
.card-layout .dependants-page-container .dependant-details-title {
  margin-top: 25px;
  margin-bottom: 25px;
}
.card-layout .dependants-page-container .dependant-details-title p {
  font-weight: bold;
  font-size: 140%;
}
.card-layout .dependants-page-container p#input-form-title {
  font-weight: bold;
  font-size: 140%;
}
.card-layout .dependants-page-container .confirmation-message {
  margin-top: 25px;
}
.card-layout .dependants-page-container i.fas.warning {
  color: red;
}
.card-layout .dependants-page-container i.fas.success {
  color: green;
}
.card-layout .dependants-page-container i.fas.info {
  color: blue;
}
.card-layout .dependants-page-container .dependant-icon {
  float: right;
}
.card-layout .dependants-page-container .dependant-details {
  margin-bottom: 10px;
}
.card-layout .dependants-page-container .dependant-details i.fas {
  font-size: 130%;
  margin-top: 10px;
  color: #ce1126;
  cursor: pointer;
}
.card-layout .dependants-page-container .dependant-details .fa-user-circle {
  cursor: unset !important;
}
.card-layout .dependants-page-container .dependant-details .fa-handshake {
  cursor: unset !important;
}
.card-layout .dependants-page-container .existing-address {
  width: 100%;
}
.card-layout .dependants-page-container .dependant-action-buttons {
  margin-top: 30px;
  padding-left: 0;
}
.card-layout .dependants-page-container .dependant-action-buttons button {
  min-width: 200px;
  margin-right: 5px;
}
.card-layout .dependants-page-container .dependant-action-buttons button.button-sm {
  max-height: 45px;
}
.card-layout .dependants-page-container .dependant-action-buttons button.dependant-add {
  position: absolute;
  right: 0;
  bottom: 0;
  min-width: 0;
}
.card-layout .dependants-page-container .dependant-action-buttons.back-to-dashboard-container {
  margin-top: 0;
  margin-left: 0;
}
.card-layout .dependants-page-container .edit-dependant-details button {
  min-width: 180px;
  margin-right: 5px;
}
.card-layout .dependants-page-container .disabled {
  opacity: 0.5;
  pointer-events: none;
}
.card-layout .dependants-page-container #select-date-range label,
.card-layout .dependants-page-container .select-date-range label {
  color: black;
  width: 25%;
}
.card-layout .dependants-page-container #select-date-range .calendar .input-group,
.card-layout .dependants-page-container .select-date-range .calendar .input-group {
  border: 1px solid #f95602;
  margin-bottom: 20px;
  width: 75%;
}
.card-layout .dependants-page-container #select-date-range .calendar .input-group.error,
.card-layout .dependants-page-container .select-date-range .calendar .input-group.error {
  border-color: #bac405;
}
.card-layout .dependants-page-container #select-date-range .calendar .input-group input,
.card-layout .dependants-page-container .select-date-range .calendar .input-group input {
  border: none;
  margin: 2px 2px;
  height: 38px;
}
@media screen and (max-width: 450px) {
  .card-layout .dependants-page-container .add-button {
    height: 65px;
  }
  .card-layout .dependants-page-container .col-sm-6 .div-center {
    text-align: center;
  }
  .card-layout .dependants-page-container .div-button {
    padding-top: 30px;
  }
  .card-layout .dependants-page-container .button-sm {
    width: 65px;
  }
  .card-layout .dependants-page-container #address-lookup {
    margin-bottom: 2.5rem;
  }
}
@media (min-width: 767px) {
  .card-layout .dependants-page-container .date-time-range {
    width: 90% !important;
  }
  .card-layout .dependants-page-container .icon-calendar {
    color: #ce1126;
    width: 10% !important;
    border: none;
    text-align: right;
  }
}
@media (max-width: 768px) {
  .card-layout .dependants-page-container .dependant-summary-buttons button,
  .card-layout .dependants-page-container .dependant-action-buttons button {
    width: 100%;
    margin: 0 0 10px 0;
  }
  .card-layout .dependants-page-container .dependant-summary-buttons button.dependant-add,
  .card-layout .dependants-page-container .dependant-action-buttons button.dependant-add {
    position: relative;
  }
  .card-layout .dependants-page-container .dependant-summary-buttons .back-to-dashboard,
  .card-layout .dependants-page-container .dependant-action-buttons .back-to-dashboard {
    position: relative;
  }
  .card-layout .dependants-page-container label {
    width: 75%;
  }
  .card-layout .dependants-page-container #btnBack {
    margin-bottom: 10px;
  }
  .card-layout .dependants-page-container .dependant-details-title p {
    font-size: 100%;
  }
  .card-layout .dependants-page-container .dependant-details-list {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .card-layout .dependants-page-container .dependant-details-list .confirmation-message,
  .card-layout .dependants-page-container .dependant-details-list .dependant-action-buttons {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .card-layout .dependants-page-container .toggle-switch {
    min-width: 60px;
  }
  .card-layout .dependants-page-container .date-time-range {
    width: 85% !important;
  }
  .card-layout .dependants-page-container .icon-calendar {
    color: #ce1126;
    width: 15% !important;
    border: none;
    text-align: right;
  }
  .card-layout .dependants-page-container .calendar {
    margin-top: 0px;
  }
}
.card-layout .dependants-page-container hr {
  margin-bottom: 1.5rem;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .transaction a.icon-calendar {
    line-height: 25px !important;
  }
}
@media (max-width: 375px) {
  .dependant-section .container {
    padding: 0;
  }
  .date-time-range {
    width: 80% !important;
  }
  .icon-calendar {
    color: #ce1126;
    width: 10% !important;
    border: none;
    text-align: right;
  }
}
@media (max-width: 576px) {
  #add-dependant-container {
    margin-top: 5px;
  }
}
.sidebar-panel .header-image {
  width: 100%;
}
.sidebar-panel .header-text {
  font-weight: bold;
  text-align: center;
}
.sidebar-panel .header-text:after {
  content: '';
  display: block;
  width: 50%;
  border-bottom: 2px solid rgba(255, 255, 255, 0);
  transform: translate(45%);
}
.sidebar-panel .item-image {
  width: 100%;
  padding-bottom: 10px;
}
.sidebar-panel .item-text {
  padding: 0.75rem 0.75rem 0 0.75rem;
  margin-bottom: 0px;
}
.announcement-container {
  margin-bottom: 20px;
}
.announcement-container .tagline {
  font-weight: bold;
  font-size: 1.3rem;
  cursor: pointer;
}
.announcement-container .tagline.collapsed::after {
  content: "Read more...";
  margin-left: 15px;
  font-weight: normal;
  font-size: 75%;
  text-decoration: underline;
}
.announcement-container .tagline:not(.collapsed)::after {
  content: "Collapse";
  margin-left: 15px;
  font-weight: normal;
  font-size: 75%;
  text-decoration: underline;
}
.announcement-container .main-text {
  padding-top: 1.25rem;
  overflow-y: hidden;
  transition: all ease 0.1s;
}
@media (max-width: 510px) {
  .announcement-container .tagline.collapsed::after {
    position: initial;
    display: block;
    margin: 10px 0;
  }
  .announcement-container .tagline:not(.collapsed)::after {
    position: initial;
    display: block;
    margin: 10px 0;
  }
}
.dashboard-card {
  color: #6c757d;
}
.dashboard-card p {
  color: #6c757d;
}
.dashboard-card .chartjs-tooltip p {
  color: white;
}
.dashboard-card {
  min-height: 250px;
}
.dashboard-card canvas {
  max-width: 15em;
  max-height: 15em;
  margin: 0.5em auto;
}
.dashboard-calc-card canvas {
  height: 100%;
  width: 100%;
  margin: 10px 0 0 0;
}
.dashboard-calc-card,
.dashboard-card {
  max-width: 33%;
  margin-right: 0.5rem;
}
.dashboard-calc-card:last-child,
.dashboard-card:last-child {
  margin-right: 0;
}
.dashboard-calc-card p.chart-tooltip,
.dashboard-card p.chart-tooltip {
  color: white;
}
.dashboard-calc-card .card-header,
.dashboard-card .card-header {
  margin: 0;
}
.dashboard-calc-card .card-info,
.dashboard-card .card-info {
  margin: 10px 0;
}
.dashboard-calc-card .legend-key,
.dashboard-card .legend-key {
  position: relative;
  float: right;
  height: 0;
  cursor: pointer;
}
.dashboard-calc-card .legend-key i.fas,
.dashboard-card .legend-key i.fas {
  color: #686b73;
  padding: 10px;
  margin-top: -1rem;
  margin-right: -1rem;
}
.dashboard-calc-card.double-card,
.dashboard-card.double-card {
  flex-grow: 2;
  max-width: 67%;
}
@media (min-width: 768px) {
  .dashboard-calc-card .card,
  .dashboard-card .card {
    min-height: 100%;
    min-width: 100%;
  }
  .dashboard-calc-card .middle-border,
  .dashboard-card .middle-border {
    border-right: 1px solid lightgray;
  }
  .dashboard-calc-card .card-row,
  .dashboard-card .card-row {
    margin: 15px 0;
    min-height: 250px;
  }
}
@media (max-width: 767px) {
  .dashboard-calc-card,
  .dashboard-card {
    width: 360px;
  }
  .dashboard-calc-card .middle-border,
  .dashboard-card .middle-border {
    border-bottom: 1px solid lightgray;
  }
  .dashboard-calc-card .card-row,
  .dashboard-card .card-row {
    margin: 0 7px;
  }
  .dashboard-calc-card .card-group,
  .dashboard-card .card-group {
    align-items: center !important;
  }
}
.dashboard-calc-card,
.dashboard-card {
  border-bottom-left-radius: 0.75em !important;
  border-bottom-right-radius: 0.75em !important;
  border-top-left-radius: 0.75em !important;
  border-top-right-radius: 0.75em !important;
}

.dashboard-calc-card,
.dashboard-card {
  box-shadow: 0 1rem 19px -10px rgba(0, 0, 0, 0.4);
}



@media (max-width: 767px) {
  section.row {
    justify-content: space-evenly;
  }
}
@media (max-width: 666px) {
  .dashboard-calc-card,
  .dashboard-calc-card.double-card,
  .dashboard-card {
    max-width: 100%;
    width: 100%;
    min-height: 250px;
  }
}
@media (min-width: 576px) and (max-width: 666px) {
  .card-group > .card.dashboard-calc-card,
  .card-group > .card.dashboard-calc-card.double-card,
  .card-group > .card.dashboard-card {
    flex: 1 0 100%;
    margin-bottom: 0.75rem;
  }
}
.dashboard-calc-card .card-footer {
  padding: 0;
}
.dashboard-card .card-footer {
  padding: 1.25rem;
}
span.eq-input-error-label,
#address-lookup-error {
  color: red !important;
  font-size: 90%;
}
ul.eq-input-error-label-list li {
  color: red !important;
  font-size: 90%;
}
.eq-input-error-field {
  border: 1px solid red !important;
}
div.eq-card-group div.eq-data-card {
  background-color: #ce1126;
}
div.eq-card-group div.eq-data-card .card-title,
div.eq-card-group div.eq-data-card .card-text {
  color: black;
}
div.eq-card-group div.eq-data-card .card-value {
  font-size: 125%;
}
div.eq-card-group div.eq-help-card {
  background-color: black;
}
div.eq-card-group div.eq-help-card .card-title,
div.eq-card-group div.eq-help-card p,
div.eq-card-group div.eq-help-card span {
  color: #ce1126;
}
.financial-statement .accordioncontainer {
  padding: 0px;
}
.financial-statement .accordioncontainer .title {
  width: auto;
}
.financial-statement .accordioncontainer .ui-accordion_table .table-content,
.financial-statement .accordioncontainer .ui-accordion_table .table td {
  border: 0;
  border-top: 1px solid #dddddd;
  margin: 0px;
}
.financial-statement .accordioncontainer .ui-accordion_table .table-content button.view-accordion-notes,
.financial-statement .accordioncontainer .ui-accordion_table .table td button.view-accordion-notes {
  padding-top: 0px;
  padding-bottom: 0px;
}
.financial-statement .accordioncontainer .ui-accordion_table .table-content > div {
  padding: 5px;
}
.financial-statement .accordioncontainer.disabled > .ui-accordion-header {
  pointer-events: none;
}
.financial-statement .accordioncontainer.disabled > .ui-accordion-header .ui-accordion-header-icon {
  display: none;
}
.financial-statement .monthly-data-table tr:nth-child(1) {
  color: #bac405;
  font-weight: 600;
}
.financial-statement .year-controls .year-selector-filler:hover:before,
.financial-statement .year-controls .year-selector-filler:hover:after {
  background: transparent !important;
}
.financial-statement .selection-banner {
  background: #006bdd;
  color: white;
  border: #006bdd;
  padding: 10px 10px 6px;
  width: 100%;
  white-space: normal;
  font-size: 14px;
}
.financial-statement #call-option-selection {
  height: 75px;
}
.financial-statement .radio-wrapper {
  display: inline-block;
}
.financial-statement .radio-wrapper label {
  width: 300px !important;
}
.financial-statement .red-text {
  color: red;
}
.financial-statement .green-text {
  color: green;
}
.financial-statement #month-list {
  text-align: center;
}
.financial-statement #year-pills > li > a:hover {
  color: #f95602;
  background-color: #eaeaea;
}
.financial-statement #year-pills > li > a {
  color: #505050;
  line-height: 15px;
  height: 48px;
  text-decoration: none;
}
.financial-statement #year-pills > li.active:before {
  content: '';
  width: 100%;
  display: block;
  height: 1px;
  background: #f95602;
  position: relative;
  top: 1px;
  z-index: 1000;
}
.financial-statement #year-pills > li.active:after {
  content: '';
  width: 100%;
  display: block;
  height: 1px;
  background: #f95602;
  position: relative;
  bottom: 0;
  z-index: 1000;
}
.financial-statement #year-pills > li.active > a {
  background-color: transparent;
  color: #f95602;
}
.financial-statement #year-pills > li.active > a:after {
  content: '.';
  font-size: 36px;
  width: 100%;
  position: relative;
  right: 50%;
  bottom: 3px;
  text-align: center;
  top: 30%;
}
.financial-statement #year-pills > li:before {
  content: '';
  position: relative;
  top: 1px;
}
.financial-statement #year-pills > li:after {
  content: '';
  position: relative;
  bottom: 0;
}
.financial-statement #year-pills > li > a:after {
  content: '';
  position: relative;
  font-size: 36px;
}
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
  background-image: none;
}
.numericField {
  text-align: right;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  padding: 0.5px;
  margin-left: 0px !important;
}
table.dataTable thead .sorting:after {
  opacity: 0.5;
}
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
  opacity: 0.9;
}
table.dataTable thead > tr > th.sorting_asc,
table.dataTable thead > tr > th.sorting_desc,
table.dataTable thead > tr > th.sorting,
table.dataTable thead > tr > td.sorting_asc,
table.dataTable thead > tr > td.sorting_desc,
table.dataTable thead > tr > td.sorting {
  background-color: #666666;
  color: white;
}
table.dataTable thead > tr > th.sorting_asc,
table.dataTable thead > tr > th.sorting_desc {
  background-color: #de0001;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  z-index: 3;
  color: white;
  cursor: default;
  background-color: #de0001 !important;
  border-color: #de0001 !important;
}
.pagination > li > a,
.pagination > li > a:hover,
.pagination > li > a:focus {
  color: #4f2170;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  padding: 0 0.5em !important;
}
.dataTables_length .form-select {
  width: 50% !important;
}
#reviewee-list-content li {
  color: black;
  line-height: 30px;
}