/* Functions & Mixins */
.gold-outline:focus {
  outline: 2px solid #fbc600 !important; }

/* Universal breakpoints */
.tippy-box {
  background-color: #fff;
  color: #3b3c43;
  padding: 1rem;
  font-size: 1rem;
  max-width: 800px !important;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.2); }
  .tippy-box a {
    color: #3b3c43; }
  .tippy-box .tippy-close {
    float: right;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
    background: transparent;
    border: none;
    padding: 0;
    font-size: 30px;
    min-width: 44px;
    min-height: 44px; }

.disclosure__hover-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
  background: transparent;
  border: none;
  padding: 0;
  font-weight: 500;
  color: inherit; }
  .disclosure__hover-button > sup {
    top: -0.65em;
    font-size: 60%; }

.breadcrumbs {
  /* margin-top: 1rem;  */
}
  @media screen and (min-width: 62rem) {
    .breadcrumbs {
      margin-top: 2.5rem;
     } }
  .breadcrumbs__list {
    list-style: none;
    margin: 0 0 2rem;
    padding: 0; }
  .breadcrumbs__li {
    display: inline; }
    .breadcrumbs__li + .breadcrumbs__li::before {
      content: '|';
      color: #3b3c43;
      margin: 0.375rem; }
  .breadcrumbs__link {
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.4;
    text-decoration: none;
    color: #3b3c43; }
    .breadcrumbs__link:not([aria-current]) {
      font-size: 16px;
      font-size: 1rem;
      text-decoration: none;
      box-shadow: inset 0 -2px 0 0 #fbc600;
      transition: box-shadow 200ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
      font-weight: 500; }
      .breadcrumbs__link:not([aria-current]):hover, .breadcrumbs__link:not([aria-current]):focus {
        box-shadow: inset 0 -7px 0 0 rgba(251, 198, 0, 0.85); }
      .breadcrumbs__link:not([aria-current]).active {
        box-shadow: inset 0 -7px 0 0 rgba(251, 198, 0, 0.85); }
    .breadcrumbs__link[aria-current] {
      font-weight: 400; }

.hero--c {
  padding-bottom: 0; }
  .hero--c::after {
    display: none; }
  .hero--c .breadcrumbs + .hero__offer-brand {
    margin-top: -1rem; }
    @media screen and (min-width: 62rem) {
      .hero--c .breadcrumbs + .hero__offer-brand + .hero__headline {
        margin-top: 1.25rem; } }
  @media screen and (min-width: 62rem) {
    .hero--c .hero__c1 {
      margin-bottom: 2rem; } }
  .hero--c .hero__offer-logo {
    width: 16.25rem;
    max-width: 16.25rem; }
  .hero--c .hero__headline { /*Added by Vignesh for changing the color of heading*/
    color: #051650; }
  .hero--c .hero__headline span { /*Added by Vignesh for changing the color of heading*/
    color: #2980B9; }
  .hero--c .hero__cta {   /*Added by Vignesh for changing the color of button CTA*/
    color: #fff;
    background: #2980B9;
    border-radius: 8px;
    text-transform: lowercase;
    font-weight: 700;
    &:first-letter {
      text-transform: uppercase;
    }
  }  
    .hero--c .hero__cta:hover {
      background-color: #3b3c43 !important;
      color: #ffffff !important; }
  .hero--c .hero__image--desktop {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top left !important; }
  .hero--c .hero__image--mobile {
    height: auto;
    padding-bottom: 66%; }
    @supports (aspect-ratio: 776/517) {
      .hero--c .hero__image--mobile {
        aspect-ratio: 776/517;
        padding-bottom: 0; } }

.cmp-savings {
  margin-top: 3rem; }
  @media screen and (min-width: 30rem) {
    .cmp-savings {
      margin-top: 5rem; } }
  .cmp-savings__container {
    box-sizing: border-box;
    max-width: 100%;
    margin: 0 auto; }
    @media screen and (min-width: 0rem) and (max-width: 47.9375rem) {
      .cmp-savings__container {
        padding-left: 1.25rem;
        padding-right: 1.25rem; } }
    @media screen and (min-width: 48rem) and (max-width: 79.9375rem) {
      .cmp-savings__container {
        padding-left: 2.5rem;
        padding-right: 2.5rem; } }
    @media screen and (min-width: 80rem) {
      .cmp-savings__container {
        padding-left: 5rem;
        padding-right: 5rem; } }
    @media screen and (min-width: 0rem) and (max-width: 47.9375rem) {
      .cmp-savings__container {
        width: 82.5rem; } }
    @media screen and (min-width: 48rem) and (max-width: 79.9375rem) {
      .cmp-savings__container {
        width: 85rem; } }
    @media screen and (min-width: 80rem) {
      .cmp-savings__container {
        width: 90rem; } }
  .cmp-savings__wrapper {
    max-width: 68.75rem;
    margin: 0 auto; }
    @media screen and (min-width: 62rem) {
      .cmp-savings__wrapper {
        position: relative;
        display: grid;
        gap: 4rem;
        grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); } }
  .cmp-savings__img-wrapper {
    margin-bottom: 1.5rem; }
    @media screen and (min-width: 62rem) {
      .cmp-savings__img-wrapper {
        margin-bottom: 0;
        align-self: center; } }
  .cmp-savings__content {
    margin: 0; }
  .cmp-savings__headline {
    font-size: 50px;
    font-size: 3.125rem;
    color: #3b3c43;
    font-weight: 500;
    margin: 3rem 0 1.5rem;
    text-transform: uppercase;
    padding-top: 0;
    text-align: left;
    font-weight: normal;
    text-transform: none; }
    @media screen and (min-width: 0rem) and (max-width: 47.9375rem) {
      .cmp-savings__headline {
        font-size: 32px;
        font-size: 2rem;
        margin: 2rem 0 1.5rem; } }
    @media screen and (min-width: 0rem) and (max-width: 61.9375rem) {
      .cmp-savings__headline {
        margin-top: 0; } }
  .cmp-savings__subhead {  /*Added by Vignesh for changing the color of heading*/
    font-size: 22px;
    font-size: 1.375rem;
    color: #051650;
    margin: 0;
    text-transform: lowercase;
    &:first-letter {
      text-transform: uppercase;
    }
  }
  .cmp-savings__subhead span {   /*Added by Vignesh for changing the color of heading*/
    font-size: 22px;
    font-size: 1.75rem;
    color: #2980B9;
    margin: 0; }
    @media screen and (min-width: 62rem) {
      .cmp-savings__subhead {
        font-size: 32px;
        font-size: 2rem; } }
  .cmp-savings__body {
    font-size: 16px;
    font-size: 1rem;
    color: #3b3c43;
    margin: 1rem 0;
    margin: 0; }
    @media screen and (min-width: 48rem) {
      .cmp-savings__body {
        font-size: 18px;
        font-size: 1.125rem; } }
    .cmp-savings__body.cmp-savings__body--large {
      font-size: 118px;
      font-size: 7.375rem;
      font-weight: 500;
      line-height: 1;
      margin: 1rem 0 0.5rem; }
      @media screen and (min-width: 80rem) {
        .cmp-savings__body.cmp-savings__body--large {
          font-size: 153px;
          font-size: 9.5625rem; } }
      .cmp-savings__body.cmp-savings__body--large > sup {
        font-weight: 400;
        font-size: 52%;
        top: -0.65em; }
  .cmp-savings__cta {     /*Added by Vignesh for changing the color of button CTA*/
    display: inline-block;
    border: 0;
    padding: 0.875rem;
    align-self: center;
    text-align: center;
    box-sizing: border-box;
    line-height: 1;
    background-color: #fbc600;
    color: #3b3c43;
    font-weight: 700;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background-color 150ms ease-in-out, color 150ms ease-in-out;
    background-color: #2980BB;   
    color: #fff;
    margin-top: 1.125rem;
    border-radius: 8px;
    text-transform: lowercase;
    &:first-letter {
      text-transform: uppercase;
    }
  }
    .cmp-savings__cta:focus {
      outline: 2px solid #3b3c43 !important; }
    .cmp-savings__cta:hover {
      background-color: #3b3c43 !important;
      color: #ffffff !important; }
    .cmp-savings__cta--home {
      background-color: #58A7AF;
      color: #ffffff; }
      .cmp-savings__cta--home:hover {
        background-color: #4e97a3 !important; }

.benefits {
  box-sizing: border-box;
  max-width: 100%;
  margin: 0 auto;
  margin: 3rem auto; }
  @media screen and (min-width: 0rem) and (max-width: 47.9375rem) {
    .benefits {
      padding-left: 1.25rem;
      padding-right: 1.25rem; } }
  @media screen and (min-width: 48rem) and (max-width: 79.9375rem) {
    .benefits {
      padding-left: 2.5rem;
      padding-right: 2.5rem; } }
  @media screen and (min-width: 80rem) {
    .benefits {
      padding-left: 5rem;
      padding-right: 5rem; } }
  @media screen and (min-width: 0rem) and (max-width: 47.9375rem) {
    .benefits {
      width: 82.5rem; } }
  @media screen and (min-width: 48rem) and (max-width: 79.9375rem) {
    .benefits {
      width: 85rem; } }
  @media screen and (min-width: 80rem) {
    .benefits {
      width: 90rem; } }
  @media screen and (min-width: 48rem) {
    .benefits {
      margin: 5rem auto; } }
  @media screen and (min-width: 62rem) {
    .benefits__container {
      position: relative;
      min-height: 400px; } }
  .benefits__image {
    display: block; }
    @media screen and (min-width: 30rem) {
      .benefits__image {
        margin: 0 auto -1rem;
        width: 70%; } }
    @media screen and (min-width: 62rem) {
      .benefits__image {
        position: absolute;
        top: 2.25rem;
        right: 0;
        max-width: 50%;
        margin-bottom: 0; } }
    @media screen and (min-width: 90rem) {
      .benefits__image {
        max-width: 42.5rem; } }
  .benefits__content {
    margin: 1rem 0; }
    @media screen and (min-width: 62rem) {
      .benefits__content {
        width: 65%;
        margin-bottom: 5rem; } }
  .benefits__headline {
    font-size: 50px;
    font-size: 3.125rem;
    color: #3b3c43;
    font-weight: 500;
    margin: 3rem 0 1.5rem;
    text-transform: uppercase;
    padding-top: 0;
    text-align: left;
    font-weight: normal;
    text-transform: none; }
    @media screen and (min-width: 0rem) and (max-width: 47.9375rem) {
      .benefits__headline {
        font-size: 32px;
        font-size: 2rem;
        margin: 2rem 0 1.5rem; } }
    @media screen and (min-width: 62rem) {
      .benefits__headline {
        width: 65%; } }
  .benefits__item {
    position: relative;
    color: #3b3c43;
    font-size: 16px;
    font-size: 1rem; }
    @media screen and (min-width: 30rem) {
      .benefits__item {
        font-size: 24px;
        font-size: 1.5rem; } }
    @media screen and (min-width: 62rem) {
      .benefits__item {
        width: 60%; } }
    .benefits__item + .benefits__item {
      margin-top: 1.5rem; }
      @media screen and (min-width: 30rem) {
        .benefits__item + .benefits__item {
          margin-top: 2rem; } }
  .benefits__box {
    border: 4px solid #fbc600;
    padding: 1.5rem; }
    @media screen and (min-width: 30rem) {
      .benefits__box {
        padding: 2rem; } }
    .benefits__box--icons {
      display: block;
      margin: 0 0 2rem 0; }
      @media screen and (min-width: 62rem) {
        .benefits__box--icons {
          width: 60%; } }
    @media screen and (min-width: 48rem) {
      .benefits__box--content {
        width: 65%; } }
    @media screen and (min-width: 80rem) {
      .benefits__box--content {
        width: 75%; } }
    .benefits__box--content h3, .benefits__box--content p {
      margin: 0; }
    .benefits__box--content + .benefits__box--content {
      margin-top: 1.5rem; }
  .benefits__button {      /*Added by Vignesh for changing the color of button CTA*/
    display: inline-block;
    border: 0;
    padding: 0.875rem;
    align-self: center;
    text-align: center;
    box-sizing: border-box;
    line-height: 1;
    background-color: #fbc600;
    color: #3b3c43;
    font-weight: 700;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background-color 150ms ease-in-out, color 150ms ease-in-out;
    background: #2980B9;
    color: #fff;
    margin: 1.5rem 0 0;
    padding: 1rem 2rem;
    border-radius: 8px;
    text-transform: lowercase;
    &:first-letter {
      text-transform: uppercase;
    }
  }
    .benefits__button:focus {
      outline: 2px solid #3b3c43 !important; }
    .benefits__button:hover {
      background-color: #3b3c43 !important;
      color: #ffffff !important; }
  .benefits__link {
    color: #3b3c43;
    display: inline-block;
    margin: 1.5rem 0 0 1rem;
    font-size: 21px;
    font-size: 1.3125rem;
    text-decoration: none;
    box-shadow: inset 0 -2px 0 0 #fbc600;
    transition: box-shadow 200ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
    font-weight: 700; }
    .benefits__link:hover, .benefits__link:focus {
      box-shadow: inset 0 -9px 0 0 rgba(251, 198, 0, 0.85); }
    .benefits__link.active {
      box-shadow: inset 0 -9px 0 0 rgba(251, 198, 0, 0.85); }
  .benefits__list {
    padding-left: 1rem;
    margin: 0; }
    .benefits__list--plain {
      list-style: none;
      padding-left: 0; }
      .benefits__list--plain .benefits__item {
        padding-left: 2rem; }
      .benefits__list--plain + * {
        margin-left: 2rem; }
  .benefits__check {
    width: 20px;
    display: block;
    position: absolute;
    top: 3px;
    left: 0; }
  .benefits:not(.benefits--needs) .benefits__container {
    display: flex;
    flex-direction: column-reverse; }
    @media screen and (min-width: 62rem) {
      .benefits:not(.benefits--needs) .benefits__container {
        display: block;
        min-height: 400px;
        max-width: 68.75rem;
        margin: 0 auto; } }
  .benefits:not(.benefits--needs) .benefits__image {
    top: 3.5rem;
    right: 0;
    max-width: 32.125rem; }
  @media screen and (min-width: 62rem) {
    .benefits:not(.benefits--needs) .benefits__content {
      width: 70%; } }

.cta {
  background: #3b3c43;
  background-size: cover;
  background-position: center;
  position: relative; }
  .cta__background {
    position: absolute;
    background-size: contain;
    background-repeat: none;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-clip-path: circle(0);
    clip-path: circle(0);
    transition: -webkit-clip-path 2s ease-in-out;
    transition: clip-path 2s ease-in-out;
    transition: clip-path 2s ease-in-out, -webkit-clip-path 2s ease-in-out; }
    .cta__background.show {
      -webkit-clip-path: circle(100%);
      clip-path: circle(100%); }
  .cta__container {
    position: relative;
    box-sizing: border-box;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    z-index: 1;
    padding-top: 30px;
    padding-bottom: 30px; }
    @media screen and (min-width: 0rem) and (max-width: 47.9375rem) {
      .cta__container {
        padding-left: 1.25rem;
        padding-right: 1.25rem; } }
    @media screen and (min-width: 48rem) and (max-width: 79.9375rem) {
      .cta__container {
        padding-left: 2.5rem;
        padding-right: 2.5rem; } }
    @media screen and (min-width: 80rem) {
      .cta__container {
        padding-left: 5rem;
        padding-right: 5rem; } }
    @media screen and (min-width: 0rem) and (max-width: 47.9375rem) {
      .cta__container {
        width: 82.5rem; } }
    @media screen and (min-width: 48rem) and (max-width: 79.9375rem) {
      .cta__container {
        width: 85rem; } }
    @media screen and (min-width: 80rem) {
      .cta__container {
        width: 90rem; } }
    @media screen and (min-width: 62rem) {
      .cta__container {
        flex-direction: row; } }
  .cta__heading {
    font-size: 32px;
    font-size: 2rem;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 1rem; }
    @media screen and (min-width: 48rem) {
      .cta__heading {
        font-size: 50px;
        font-size: 3.125rem; } }
  .cta__heading, .cta__subhead, .cta__content {
    text-align: left;
    color: #fff; }
  .cta__subhead {
    margin: 0 0 10px;
    font-weight: bold;
    font-size: 19px;
    font-size: 1.1875rem; }
    @media screen and (min-width: 30rem) {
      .cta__subhead {
        font-size: 21px;
        font-size: 1.3125rem; } }
    @media screen and (min-width: 48rem) {
      .cta__subhead {
        font-size: 25px;
        font-size: 1.5625rem; } }
  .cta__list {
    padding-left: 1.5rem;
    margin: 2rem 0 0;
    display: block; }
  .cta__content {
    margin: 0 0 1.75rem;
    font-size: 19px;
    font-size: 1.1875rem; }
    @media screen and (min-width: 30rem) {
      .cta__content {
        font-size: 21px;
        font-size: 1.3125rem; } }
    @media screen and (min-width: 48rem) {
      .cta__content {
        font-size: 25px;
        font-size: 1.5625rem; } }
  .cta__wrapper.--flex {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: column-reverse; }
    @media screen and (min-width: 30rem) {
      .cta__wrapper.--flex {
        flex-direction: row; } }
    @media screen and (min-width: 62rem) {
      .cta__wrapper.--flex {
        width: 40%; } }
  @media screen and (min-width: 62rem) {
    .cta__wrapper {
      width: 60%; } }
  @media screen and (min-width: 0rem) and (max-width: 29.9375rem) {
    .cta__links {
      margin-top: 1.5rem;
      display: grid;
      grid-template-columns: minmax(0, 90px) minmax(0, 164px);
      grid-template-rows: 1fr 1fr;
      -moz-column-gap: 1.5rem;
      column-gap: 1.5rem; }
      .cta__links > .cta__app-link--logo {
        grid-column: 1 / 2;
        grid-row: 1 / 3;
        margin: 0; }
      .cta__links > .cta__app-link:not(.cta__app-link--logo) {
        grid-column: 2 / 3; } }
  .cta__app-img {
    max-width: 14rem;
    margin-top: 1.5rem;
    margin-bottom: -30px; }
    @media screen and (min-width: 62rem) {
      .cta__app-img {
        align-self: flex-end; } }
  .cta__app-link {
    max-width: 10.25rem;
    display: block; }
    .cta__app-link--logo {
      max-width: 5.625rem;
      margin: 0 auto 1.5rem; }
    @media screen and (min-width: 30rem) {
      .cta__app-link + .cta__app-link {
        margin-top: 0.5rem; } }
  .cta__button {
    display: inline-block;
    border: 0;
    padding: 0.875rem;
    align-self: center;
    text-align: center;
    box-sizing: border-box;
    line-height: 1;
    background-color: #fbc600;
    color: #3b3c43;
    font-weight: 500;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background-color 150ms ease-in-out, color 150ms ease-in-out;
    text-transform: uppercase;
    width: 100%;
    min-width: 12.5rem; }
    .cta__button:focus {
      outline: 2px solid #3b3c43 !important; }
    .cta__button:hover {
      background-color: #3b3c43 !important;
      color: #ffffff !important; }
    .cta__button--home {
      background-color: #58A7AF;
      color: #ffffff; }
      .cta__button--home:hover {
        background-color: #4e97a3 !important; }
    @media screen and (min-width: 48rem) {
      .cta__button {
        width: auto;
        min-width: 15.625rem; } }
		
/*Added by Vinda Sawant for styling LOG IN CTA on CMP header*/
.cmp-link{
	font-weight:700 !important;
	white-space:nowrap;
	color:#3b3d49 !important;
}
/*Added by Vinda Sawant for removing underline on 1st breadcrumb*/
.breadcrumb-second{
	box-shadow:none !important;
}