.btn.btn-flat.btn-primary {
  background-color: #009DE0;
  border-color: #003865;
}
.btn.btn-flat.btn-primary:hover {
  background-color: #76D3FF;
  border-color: #009DE0;
}
.btn.btn-flat.btn-primary:active {
  background-color: #003865;
  border-color: #003865;
}
@font-face {
  font-family: "GrifoSBold";
  src: url("fonts/GrifoS-Bold.woff") format('woff');
}
@font-face {
  font-family: "MuteRegular";
  src: url("fonts/Mute-Regular.woff") format('woff');
}
@font-face {
  font-family: "MuteLight";
  src: url("fonts/Mute-Light.woff") format('woff');
}
.noUi-handle {
  
}
.noUi-handle {
  background-color: #888888;
}
.noUi-handle {
  background: linear-gradient(#bbbbbb, #7b7b7b);
}
.noUi-handle:before,
.noUi-handle:after {
  background-color: #EEEEEE;
}
.MoreInformation h1,
#PrintPreviewScreenDiv h1,
#BudgetPlannerScreenDiv h1,
.ScreenDescription h1,
.MoreInformation h2,
#PrintPreviewScreenDiv h2,
#BudgetPlannerScreenDiv h2,
.ScreenDescription h2,
.MoreInformation h3,
#PrintPreviewScreenDiv h3,
#BudgetPlannerScreenDiv h3,
.ScreenDescription h3,
.MoreInformation h4,
#PrintPreviewScreenDiv h4,
#BudgetPlannerScreenDiv h4,
.ScreenDescription h4 {
  
}
.MoreInformation h1,
#PrintPreviewScreenDiv h1,
#BudgetPlannerScreenDiv h1,
.ScreenDescription h1,
.MoreInformation h2,
#PrintPreviewScreenDiv h2,
#BudgetPlannerScreenDiv h2,
.ScreenDescription h2,
.MoreInformation h3,
#PrintPreviewScreenDiv h3,
#BudgetPlannerScreenDiv h3,
.ScreenDescription h3,
.MoreInformation h4,
#PrintPreviewScreenDiv h4,
#BudgetPlannerScreenDiv h4,
.ScreenDescription h4 {
  color: #0080B4;
}
.banner {
  
}
.banner {
  background-color: white;
}
.banner {
  color: #3e4e6b;
}
.banner {
  height: 60px;
}
.banner {
  padding: 15px 34px 20px 34px;
}
.banner .appname {
  
}
.banner .appname {
  margin: 0;
}
.banner #BannerImage {
  
}
@media (max-width: 767px) {
  #MainNavDiv .navbar-header {
    
  }
  #MainNavDiv .navbar-header {
    background-color: white;
  }
  #MainNavDiv .navbar-header {
    color: #3e4e6b;
  }
}
#MainNavDiv .navbar-toggle .icon-bar {
  background-color: #FFFFFF;
}
#MainNavDiv .navbar-toggle:hover,
#MainNavDiv .navbar-toggle:active,
#MainNavDiv .navbar-toggle:focus {
  background-color: #546375;
}
#MainNavDiv .navbar-toggle:hover .icon-bar,
#MainNavDiv .navbar-toggle:active .icon-bar,
#MainNavDiv .navbar-toggle:focus .icon-bar {
  background-color: #FFFFFF;
}
/* Custom MST welcome page */

/* Content displayed above the 'Important Information' section */

#WelcomeBody h1,
#WelcomeBody .WelcomeAppName,
#WelcomeIntroductionText,
#WelcomeImportantInformationText,
#WelcomeImportantInformationLink {
  padding-left: 90px;
  padding-right: 90px;
}
#WelcomeBackgroundGradient {
  position: fixed;
  width: 100%;
  height: 100%;
  background-image: -webkit-linear-gradient(-135deg, #8146AF 0, #009de0 100%);
  background-image: -moz-linear-gradient(-135deg, #8146AF 0, #009de0 100%);
  background-image: -ms-linear-gradient(-135deg, #8146AF 0, #009de0 100%);
  background-image: -o-linear-gradient(-135deg, #8146AF 0, #009de0 100%);
  background-image: linear-gradient(225deg, #8146AF 0, #009de0 100%);
  background-color: #8146AF;
  top: 0;
  z-index: -5;
}
#WelcomeScreenDiv {
  margin: 0;
  min-height: 0;
}
#WelcomeContent {
  position: relative;
}
#WelcomeBody h1 {
  color: white;
  font-size: 72pt;
  padding-top: 60px;
  padding-bottom: 40px;
  max-width: 800px;
  font-family: GrifoSBold;
}
#WelcomeBody .WelcomeAppName {
  font-size: 24pt;
  margin: 0;
  font-weight: 400;
  color: #004280;
  height: 0;
}
/* 'find out how much you need to retire' subheading */

#WelcomeIntroductionText {
  font-size: 18pt;
  max-width: 800px;
  color: white;
  font-family: MuteLight;
}
/* Hide the legal text images */

.LegalTextImage,
.LegalTextHeading {
  display: none;
}
#WelcomeBackground {
  background-size: cover;
  background-image: url("img/brand/mst/welcomebackground4.png");
  width: 100%;
  height: 100%;
  position: absolute;
}
#WelcomeImportantInformationLink {
  font-size: 24px;
  font-family: MuteLight;
  background-color: #FFFFFF;
  padding-top: 10px;
  padding-bottom: 10px;
}
#WelcomeImportantInformationLink.Closed {
  background-color: transparent;
  transition: background-color 0s linear 1s, color 0s linear 1s;
}
#WelcomeImportantInformationLinkText {
  cursor: pointer;
  text-decoration: underline;
  font-family: MuteLight;
}
#AcceptButton {
  background-color: #005a8e;
  border-radius: 5px;
  border: none;
  font-size: 24px;
  padding: 14px 20px 10px 20px;
  text-transform: unset;
  margin-top: 20px;
}
#AcceptButton:hover,
#AcceptButton:active {
  background-color: #007aae;
}
#WelcomeImportantInformationText {
  overflow: hidden;
  transition: max-height 1s ease-out;
  max-height: 1000px;
  background-color: #FFFFFF;
  position: relative;
}
#WelcomeImportantInformationText.Closed {
  max-height: 0;
  transition: max-height 1s ease-in;
}
.banner img {
  margin-bottom: 3px;
  position: static;
  float: left;
}
.banner .appname {
  position: static;
  float: right;
  text-transform: uppercase;
  font-size: 18pt;
  font-weight: 400;
}
/* 'Mercer: Make tomorrow, today' logo in the mobile banner */

#MobileBannerImage {
  height: 48px;
  display: table-cell;
  vertical-align: middle;
}
#MobileBannerImage img {
  width: 95%;
  margin-left: 15px;
}
#WelcomeImportantInformationLink.Closed {
  color: #FFFFFF;
}
@media (max-width: 1199px) {
  #WelcomeBody h1,
  #WelcomeBody .WelcomeAppName,
  #WelcomeIntroductionText,
  #WelcomeImportantInformationText,
  #WelcomeImportantInformationLink {
    padding-left: 34px;
    padding-right: 34px;
  }
  #WelcomeIntroductionText {
    width: 700px;
  }
  /* Hide the 'Retirement Income Simulator' text from the banner when screen size is less than large */
  
  .banner .appname {
    display: none;
  }
}
@media (max-width: 991px) {
  #WelcomeBody h1 {
    font-size: 48pt;
  }
  #WelcomeIntroductionText {
    font-size: 12pt;
    width: 500px;
  }
  #WelcomeBody h1,
  #WelcomeBody .WelcomeAppName,
  #WelcomeIntroductionText,
  #WelcomeImportantInformationText,
  #WelcomeImportantInformationLink {
    padding-left: 15px;
    padding-right: 15px;
  }
  #WelcomeHeader {
    padding-left: 15px;
  }
  .banner {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (max-width: 767px) {
  #WelcomeBackground {
    display: none;
  }
  #WelcomeScreenDiv {
    padding-left: 0;
    background-color: #1490D8;
    min-height: 100%;
    padding-top: 50px;
  }
  #WelcomeHeader {
    padding: 5px 15px 10px 15px;
  }
  #WelcomeHeader img {
    width: 275px;
  }
  #WelcomeTitle .WelcomeAppName,
  #WelcomeImportantInformationLink {
    font-size: 12pt;
  }
  #WelcomeTitle h1 {
    font-size: 20pt;
    margin-bottom: 15px;
    padding-bottom: 80px;
    padding-top: 20px;
  }
  #WelcomeIntroductionText {
    width: 100%;
    font-size: 14px;
  }
  #WelcomeTextContent {
    color: #FFFFFF;
  }
}
@media (min-width: 416px) and (max-width: 767px) {
  #WelcomeScreenDiv {
    margin-top: -20px;
    padding-top: 0;
  }
}
.navbar {
  background-color: #D5D9E0;
}
.SummaryBoxNow,
#NowTab.active:hover {
  background-color: #76D3FF;
}
.SummaryBoxRetirement,
#RetirementTab.active:hover {
  background-color: #009DE0;
}
.SummaryBoxBeyond,
#BeyondTab.active:hover {
  background-color: #003865;
}
.SummaryBoxCompare,
#CompareTab.active:hover {
  background-color: #00AC41;
}
.SummaryBoxBeyond .CounterLabel {
  color: #003865;
}
#NowTab:hover {
  background-color: #43c3ff;
}
#RetirementTab:hover {
  background-color: #0079ad;
}
#BeyondTab:hover {
  background-color: #001c32;
}
#CompareTab:hover {
  background-color: #00792e;
}
.SummaryBoxNow,
#NowTab.active:hover {
  background-color: ;
}
.SummaryBoxRetirement,
#RetirementTab.active:hover {
  background: ;
}
.infobox {
  margin-top: 40px;
  margin-bottom: 40px;
  padding-right: 60px;
  padding-left: 0;
}
.infoboximage {
  margin-bottom: 10px;
}
.PillButton.active {
  background: #009DE0;
}
.mercerlogosvg {
  width: 150px;
  height: 30px;
}

#gradient0 stop[offset="0"] { stop-color: #84A7E0; }
#gradient0 stop[offset="1"] { stop-color: #708FC1; }
#gradient1 stop[offset="0"] { stop-color: #357F4B; }
#gradient1 stop[offset="1"] { stop-color: #275D38; }
#gradient2 stop[offset="0"] { stop-color: #00AC41; }
#gradient2 stop[offset="1"] { stop-color: #00AC41; }
#gradient3 stop[offset="0"] { stop-color: #76D3FF; }
#gradient3 stop[offset="1"] { stop-color: #589DBC; }
#gradient4 stop[offset="0"] { stop-color: #00968F; }
#gradient4 stop[offset="1"] { stop-color: #00968F; }
#gradient5 stop[offset="0"] { stop-color: #005699; }
#gradient5 stop[offset="1"] { stop-color: #003865; }
#gradient6 stop[offset="0"] { stop-color: #7B00B5; }
#gradient6 stop[offset="1"] { stop-color: #B200FF; }
#gradient7 stop[offset="0"] { stop-color: #B896D4 ; }
#gradient7 stop[offset="1"] { stop-color: #9177A8; }
#gradient8 stop[offset="0"] { stop-color: #452F4B; }
#gradient8 stop[offset="1"] { stop-color: #342338; }
#gradient9 stop[offset="0"] { stop-color: #ff0000; }
#gradient9 stop[offset="1"] { stop-color: #ff0000; }
#gradient10 stop[offset="0"] { stop-color: #003865; }
#gradient10 stop[offset="1"] { stop-color: #003865; }
#gradient11 stop[offset="0"] { stop-color: #B896D4; }
#gradient11 stop[offset="1"] { stop-color: #B896D4; }
#gradient12 stop[offset="0"] { stop-color: #76D3FF; }
#gradient12 stop[offset="1"] { stop-color: #76D3FF; }
#gradient13 stop[offset="0"] { stop-color: #CFCFCF; }
#gradient13 stop[offset="1"] { stop-color: #5F5F5F; }