@import url('https://fonts.googleapis.com/css?family=PT+Sans&display=swap');
a{
    color:#108af5 !important;
}
body {
    padding-top: 25px;
  }
  #custombackground{
    background: rgb(188,226,215);
    background: linear-gradient(219deg, rgba(188,226,215,1) 0%, rgba(255,255,255,1) 50%);
    background-size: cover;
    background-position: top;
  }
  #page-header {
    padding: 7px 0px 11px 0px;
    text-align: center;
    background: rgb(251,251,251);
    background: linear-gradient(126deg, rgba(255,255,255,1) 8%, rgb(243, 243, 243,1) 100%);
    /* -webkit-box-shadow: 0px -24px 15px 23px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px -24px 15px 23px rgba(0,0,0,0.75);
    box-shadow: 0px -24px 15px 23px rgba(0,0,0,0.75); */
    /* position: fixed;
    top: 0;
    width: 100%;
    z-index:999; */
  }

  .iconpad{
      padding-right:10px;
      font-size:20px
  }
  .moreinfo{
    margin-left:10px;
    color:#2c2c2c;
  }
  .subtitle{
      margin-top:-8px;
  }
  #logo, #widget-container #promo-container {
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    display: inline-block;
    padding: 10px;
  }

  div.panel-block{
      padding: 2em 0 2em 0;
  }
  .navbar{
    display:none !important;
}
  .questions{
      font-weight:700;
      font-size:25px;
  }

  #logo-container{
      height:75px;
      margin-top:11px
  }

  #quickstart-widget-container {
    padding-left: 24px;
  }

  #quickstart-widget-container .panel.highlight {
    background-color: #09d875;
  }

  #widget-container .focus,
  #widget-container .pulse,
  #widget-container .focus .panel,
  #widget-container .pulse .panel {
    border-color: #09d875;
    opacity: 0.95;
  }

  .v-tour .v-step[data-v-aa0cbe42] {
    background-color: #2767c0;
  }

  .v-tour .v-step .v-step__arrow[data-v-aa0cbe42] {
    border-color: #2767c0;
  }

  #help-video iframe {
    height: 100%;
    width: 100%;
  }

  #contact-container {
    font-size: 20px;
    padding: 10px;
    width: 81%;
    text-align:right;
  }
  .panel-heading{
      font-size:1.45em !important;
      padding:0 !important;
  }
  .panel-heading.columnhead{
    font-weight:600;
    color:#4a4a4a;
}
  #top-container, #input-container{
    margin: -2.75rem -.75em -.75em -.75em!important;
  }
  #promo-container{
    display:none !important;
  }

  /* #widget-container #banner-container,
  #widget-container #get-more-container #get-more-content,
  #widget-container #get-more-zone-container,
  #widget-container #indicators-container,
  #widget-container #indicators-container .title,
  #widget-container #longevity-container,
  #widget-container #ss-get-more-container,
  #widget-container #sensitivity-impacts-container,
  #widget-container #learn-more-container,
  #widget-container #spending-result-container,
  #widget-container #savings-result-container,
  #widget-container #other-income-result-container,
  #widget-container #investment-risk-result-container,
  #widget-container .label,
  #widget-container .panel-heading,
  #email-form .label,
  #email-form .panel-heading,
  #widget-container strong,
  #widget-container .wizard-navigation .stepTitle {
    color: #4a4a4a;
    font-size:1.2rem;
    font-weight:500;
  } */
  .label{
    color: #4a4a4a !important;
    font-size:1.2rem !important;
    font-weight:500 !important;
  }
  #site-footer {
    color: #757575;
    background-color: #f2f2f2;
  }
  #spending-container {
    margin:0 5px 25px 0 !important;
  }
  .sectionheader{
    font-size:2em;
    color:#4d4d4d;
    font-weight:800;
    margin-bottom:25px;
  }

  #widget-container .result-chart-container {
    background-color: #ffffff;
    border-radius: 3px;
    color: #163e4a;
    height: 100%;
    margin-right: 30px;
    margin-left: 10px;
    font-size: 14px;
  }
  #get-more {
    background-position: center !important;
    background-image: url('../images/getmorebg1.gif') !important;
    background-repeat: no-repeat !important;
    background-size: 100% 100% !important;
    height: 400px !important;
    width: 300px !important;
    border-radius: 15px !important;
    -webkit-border-radius: 15px !important;
    -moz-border-radius: 15px !important;
    border: 0px solid #ffffff !important;
  }
  #get-more-spinner {
    padding-top: 60px;
    padding-left: 90px;
  }
  #widget-container .result-chart-container strong {
    color: #163e4a;
  }

  #widget-container .result-chart-container ul>li {
    margin-left: 15px;
    margin-top: 10px;
    list-style-type: disc
  }

  #widget-container .adjust-button {
    justify-content: center;
    padding-bottom: 0.5em;
    padding-left: 0.75em;
    padding-right: 0.75em;
    padding-top: 0.5em;
    font-size: 1.0rem;
    text-align: center;
  }

  #widget-container .spending-scale .scale {
    fill: #163e4a;
  }

  #widget-container .spending-scale .scale-title {
    font-size: 1.2rem;
  }

  #widget-container .button.is-primary,
  #email-form .panel .panel-block .button.is-primary
  {
    background-color: #2a97f7;
    border-color: #2a97f7;
    color: #ffffff !important;
  }
  #widget-container .button.is-link {
    background-color: #ffffff;
    border-color: #49afcf;
    color: #0f6277;
  }

  /* Slider */

  #widget-container .vue-slider-component .vue-slider-process,
  #widget-container .vue-slider-component .vue-slider-tooltip {
    background-color: #2a97f7;
    border: 1px solid #2a97f7;
  }
  .vue-slider-component .vue-slider {
    background-color: #f5f5f5 !important;
  }
  .spendingnum{
    font-weight: 800;
    font-size: larger;
    background: -webkit-linear-gradient(bottom right,rgb(20, 182, 106) -12%, rgb(50, 125, 231)100%);
    -webkit-background-clip: text;
    background-clip:text;
    -webkit-text-fill-color: transparent;
}
div.vue-slider{
    height:15px !important;
    background-color: #e8e8e8;
    border: 2px solid #dadada;
}
span.vue-slider-tooltip{
    -webkit-animation: pulsing 2s;
    animation: pulsing 2s;
    animation-iteration-count: 5;
}
span.vue-slider-tooltip:hover{
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}
.vue-slider-always.vue-slider-dot{
    width: 20px !important;
    height: 20px !important;
    top: -7px !important;
}
.vue-slider-always.vue-slider-dot:hover{
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}

  .bigbutton{
    font-size:1.4em !important;
    border-radius: 33px !important;
    padding: 30px 15px 30px 15px !important;
    line-height:0 !important;
  }
  .input, .textarea, .select select{
    background-color: #f5f5f5 !important;
    border-radius: 24px !important;
    color: #363636;
    box-shadow: none !important;
  }
  .input:focus, .taginput .taginput-container.is-focusable:focus, .textarea:focus, .select select:focus, .is-focused.input, .taginput .is-focused.taginput-container.is-focusable, .is-focused.textarea, .select select.is-focused, .input:active, .taginput .taginput-container.is-focusable:active, .textarea:active, .select select:active, .is-active.input, .taginput .is-active.taginput-container.is-focusable, .is-active.textarea, .select select.is-active{
    transition: all 0.25s ease-in-out;
    box-shadow: 0 2px 2px rgba(0,0,0,0.19), 0 3px 3px rgba(0,0,0,0.23)!important;
    border: 1px solid #2767c0 !important;
  }
  .button, .input, .taginput .taginput-container.is-focusable, .textarea, .select select, .file-cta, .file-name, .pagination-previous, .pagination-next, .pagination-link, .pagination-ellipsis{
    height:2.75em !important;
  }

  #widget-container #spending-container,
  #widget-container #input-container {
    border: 0px solid #ffffff;
  }
  #widget-container .help.is-danger  {
    color: #d80909;
    font-weight:600;
    font-size:1.15em;
  }

  #widget-container .button.is-secondary{
    background-color: #09d875;
    border-color: #09d875;
    color: #000000;
  }

  #widget-container .field.has-addons p.control .is-label{
    background-color: #dedede;
  }

  #widget-container #plan-data-card.card {
    background-color: #dedede;
    color: #363636;
  }

  #widget-container #plan-data-card.card > .card-content > .field > .label {
    background-color: #dedede;
    color: #363636;
  }

  .notices .snackbar {
    background-color: #2767c0 !important;
    color: #ffffff !important;
  }

  .notices .snackbar .action.is-success .button {
    color: #ffffff !important;
    background-color: #23d160;
  }
  .thickdivider{
    height:3px;
    width:80%;
    background-color:rgb(206, 206, 206);
    margin: 20px auto 20px auto;
  }
  @-webkit-keyframes pulse {
    0% {
      -webkit-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
    }

    70% {
      -webkit-box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
    }

    100% {
      -webkit-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
    }
  }

  @keyframes pulse {
    0% {
      -moz-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
      box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
    }

    70% {
      -moz-box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
      box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
    }

    100% {
      -moz-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
      box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
    }
  }
  /* @-webkit-keyframes pulsing {
    0% {
      box-shadow: 1px 1px 0px 0px #fff;
    }
    50% {
      box-shadow: 1px 1px 0px 20px #08af4e65;
    }
    100% {
      box-shadow: 1px 1px 0px 0px #fff;
    }
  } */

  @keyframes pulsing {
    0% {
      box-shadow: 1px 1px 0px 0px #fff;
    }
    50% {
      box-shadow: 1px 1px 10px 10px #08af4e8c;
    }
    100% {
      box-shadow: 1px 1px 0px 0px #fff;
      }
  }

  @media only screen and (max-width: 382px) {
    .bannerimage{
      display:none;
    }
    .bannertext{
      grid-column-start: 1;
      grid-column-end: 6;
    }
  }
  @media only screen and (max-width: 768px) {
  #contact-container{
    width: 100%;
    text-align: center;
  }
}
@media only screen and (max-width: 1000px) {
  #email-report-button.button.is-primary{
    width: 100%;
    font-size: 1.15em;
  }
  #get-more-container .navbar-item{
    width: 100%;
    font-size: 1.15em !important;
  }
  #get-more-container{
    display:block !important;
  }
}
@media only screen and (max-width: 1407px) {
  #email-report-button.button.is-primary{
    width: 100%;
    font-size: 1.15em;
  }
  #get-more-container .navbar-item{
    width: 100%;
    font-size: 1.15em !important;
  }
  #get-more-container{
    grid-template-columns: 324px 324px 1fr !important;
  }
}

@media only screen and (max-width:1370px){
  #get-more-container{
    grid-template-columns: 295px 295px 1fr !important;
  }
  #get-more-content.getmoretext{
    font-size:1.2em !important;
  }
}
@media only screen and (max-width:1170px){
  #get-more-container{
    grid-template-columns: 246px 316px 1fr !important;
  }
}