/*Start wf165927 Adonus - Comment out*/
.ui.dimmer {
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: rgba(193, 199, 205, 0.7);
  backdrop-filter: blur(1px); }

/*End wf165927 Adonus*/
.ui.legacy.modal,
.ui.legacy.page.dimmer > .ui.modal {
  top: 6.5%; }
@media screen and (min-width: 480px) {
  .ui.legacy.modal,
  .ui.legacy.page.dimmer > .ui.modal {
    top: 10%; } }
@media screen and (min-width: 1024px) {
  .ui.legacy.modal,
  .ui.legacy.page.dimmer > .ui.modal {
    top: 15%; } }
@media screen and (min-width: 1440px) {
  .ui.legacy.modal,
  .ui.legacy.page.dimmer > .ui.modal {
    top: 20%; } }

/*EVX-7651 Megan D: Updating the modal padding */
.modal {
  padding: 25px;
}
@media screen and (max-width: 767px) {
  .modal {
    padding: 15px !important;
  }
}

/*START EVX-6024 rsuazo - Update for Phone Validation Modal*/
/*EVX-7651 Megan D: Updating the modal css so that the below changes do not change all the modals and just Phone Validation Modal */
.modal.modal--update-direct-debit {
  max-width: 650px;
  padding: 25px;
  box-shadow: 0 2px 15px rgba(51, 51, 51, 0.2);
  border-top: 5px solid #9d57b2 !important;
  top: 10px;
}
@media screen and (min-width: 768px) {
  .modal.modal--update-direct-debit {
    top: 30px; } }
@media screen and (min-width: 1024px) {
  .modal.modal--update-direct-debit {
    top: 50px;
    padding: 40px 40px 60px;
  }
}
/*END EVX-6024*/
.modal__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  background-position: center;
  background-size: cover;
  padding-bottom: 15px;}
.modal__header > i {
  margin-bottom: 10px;
  margin-top: 20px; }
.modal__header--push {
  margin-bottom: 20px; }
.modal__close {
  padding: 0 !important;
  position: absolute;
  top: 15px !important;
  right: 15px !important;
  background: none;
  border: none;
  outline: none; }
.modal__close, .modal__close:before {
  width: 40px !important;
  height: 40px !important; }
.modal__close:hover, .modal__close:focus {
  opacity: 1 !important; }
.modal__icon, .modal__icon:before {
  width: 40px;
  height: 40px; }
@media screen and (min-width: 768px) {
  .modal__icon, .modal__icon:before {
    width: 60px;
    height: 60px; } }
@media screen and (max-width: 480px) {
  .modal__icon, .modal__icon:before {
    width: 20px;
    height: 20px; } }
.modal__heading {
  text-align: center;
  font-size: 30px;
  line-height: 1.2;
  /* max-width: 450px;WF168320_KJ forces Shipping modal header left*/
  margin-bottom: 15px !important;
  margin-top: 10px; }
@media screen and (min-width: 1024px) {
  .modal__heading--large {
    font-size: 48px;
    max-width: none;
    margin-bottom: 50px !important; } }
@media screen and (min-width: 768px) {
  .modal__heading--small {
    font-size: 20px; } }
.modal__heading--mbn {
  margin-bottom: 0 !important; }
.modal__heading--w-icon {
  display: flex;
  flex-direction: column;
  align-items: center; }
.modal__intro {
  text-align: center;
  font-size: 14px;
  line-height: 20px;
  padding: 0 15px; }
@media screen and (min-width: 768px) {
  .modal__intro {
    font-size: 16px;
    line-height: 24px;
    padding: 0 20px; } }
.modal__content {
  text-align: left;
  margin-bottom: 50px;
}
.modal__content p {
  font-size: 14px;
  line-height: 20px; }
@media screen and (min-width: 768px) {
  .modal__content p {
    font-size: 16px;
    line-height: 24px; } }
.modal__button {
  min-width: 100% !important; }
@media screen and (min-width: 768px) {
  .modal__button {
    min-width: 220px !important; } }
@media screen and (min-width: 1024px) {
  .modal__button {
    min-width: 280px !important; } }
.modal__buttons {
  text-align: center;
  margin-top: 30px;
  padding-left: 16px;
  padding-right: 16px; }
@media screen and (min-width: 768px) {
  .modal__buttons {
    margin-top: 40px; } }
.modal__buttons--row {
  display: flex;
  flex-direction: column; }
@media screen and (min-width: 768px) {
  .modal__buttons--row {
    flex-direction: row; } }
.modal__buttons--row .modal__button {
  width: 100%;
  min-width: 0 !important; }
@media screen and (min-width: 768px) {
  .modal__buttons--row .modal__button {
    width: 49% !important;
    margin: 0; } }
.modal__buttons--column {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px }
.modal__content,
.modal__content p {
  font-size: 20px;
  line-height: 1.3; }
.modal__scroller {
  margin: 0 !important;
  padding-right: 20px; }
.modal__actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap; }
.modal__actions--column {
  flex-direction: column;
  max-width: 260px;
  text-align: center;
  margin: 0 auto; }
.modal__actions--nested {
  margin-top: 20px; }
@media screen and (min-width: 768px) {
  .modal__actions--colwd {
    max-width: 390px; } }
.modal__actions--full {
  width: 100%;
  max-width: 100%; }
.modal__actions--signoff {
  flex-direction: column;
  text-align: center;
  margin: 0 auto; }
.modal__actions--signoff p {
  margin-top: 10px;
  font-size: 12px;
  line-height: 18px;
  color: #84909B; }
.modal__button {
  margin: 0 0 10px !important; }
.modal__button--centered.ui {
  display: block;
  margin: 20px auto !important; }
.modal__button--mglg {
  margin: 0 0 30px !important; }
.modal__cancel {
  margin-top: 15px;
  font-weight: 700;
  font-size: 1rem;
  text-decoration: none; }
.modal__cancel--light {
  font-weight: normal;
  margin-top: 0;
  margin: 0 auto;
  display: table; }
.modal__cancel--light:hover {
  text-decoration: underline; }
.modal__list {
  padding: 0;
  width: 320px;
  margin: 50px auto; }
.modal__list-item {
  margin-bottom: 30px;
  list-style-type: none; }
.modal__list-link {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  background-image: url("/images/chevron-right-blue.svg");
  background-position: right center;
  background-repeat: no-repeat;
  padding-left: 60px;
  position: relative;
  color: #354657;
  text-decoration: none;
  font-weight: bold; }
.modal__list-link i {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%); }
.modal__list-link i.offset {
  left: 5px; }
.modal__btn-icon-holder {
  position: relative; }
.modal__btn-icon-holder .spotlight__head-icon {
  margin: 0 5px;
  line-height: 0;
  float: right;
  position: absolute;
  top: 0;
  right: -35px; }
@media screen and (min-width: 768px) {
  .modal__btn-icon-holder .spotlight__head-icon {
    right: -40px;
    top: 5px; } }
.modal__avatar {
  width: 90px;
  height: 90px;
  margin: 15px auto;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid #BD8BCA; }
.modal__link {
  font-weight: 700;
  display: block;
  text-align: center;
  text-decoration: none;
  margin-top: 25px; }
.modal__link:hover {
  text-decoration: underline; }
.modal--enroll .modal__content {
  padding-top: 20px;
  text-align: left; }
@media screen and (min-width: 1024px) {
  .modal--enroll .column {
    display: flex; } }
.modal--pv-offer {
  padding-bottom: 40px; }
.modal--pv-offer .modal__header {
  height: 280px;
  background-color: #ccc;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -25px;
  margin-left: -25px;
  margin-right: -25px;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  margin-bottom: 40px;
  padding: 0 20px;
  text-align: center; }
@media screen and (min-width: 1024px) {
  .modal--pv-offer .modal__header {
    margin-top: -40px;
    margin-left: -40px;
    margin-right: -40px; } }
.modal--pv-offer .modal__header-logo {
  margin-bottom: 20px;
  height: 50px;
  margin-top: -30px; }
.modal--pv-offer .modal__header-title {
  color: #FFFFFF;
  font-size: 30px; }
.modal--pv-offer .modal__header-copy {
  color: #FFFFFF;
  font-size: 20px; }
.modal--pv-offer .product-cards {
  margin-top: -90px !important;
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column; }
@media screen and (min-width: 768px) {
  .modal--pv-offer .product-cards {
    justify-content: space-between;
    flex-direction: row;
    padding: 40px; } }
.modal--pv-offer .product-cards .product-card {
  display: flex;
  flex-direction: column;
  width: 175px;
  border-radius: 5px;
  border: solid 2px #EEEEEE;
  margin: 30px 0; }
.modal--pv-offer .product-cards .product-card__image {
  height: 155px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center; }
.modal--pv-offer .product-cards .product-card__image img {
  max-width: 100%;
  max-height: 100%; }
.modal--pv-offer .product-cards .product-card__heading {
  font-weight: bold;
  margin-bottom: 5px; }
.modal--pv-offer .product-cards .product-card__subheading {
  line-height: 1.5;
  font-size: 12px;
  color: #84909B;
  margin-bottom: 5px; }
.modal--pv-offer .product-cards .product-card__offer {
  margin-bottom: 20px;
  font-size: 14px;
  padding-left: 10px;
  padding-right: 10px; }
.modal--pv-offer .product-cards .product-card__offer strong {
  display: block; }
.modal--pv-offer .product-cards .product-card__price {
  display: flex;
  width: 100%;
  height: 35px;
  align-items: center;
  justify-content: center;
  background: #F5EEF7;
  color: #A25EB5;
  align-self: flex-end;
  font-size: 14px; }
.modal--pv-offer .product-cards .icon--add-brand {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%); }
.modal--no-offer {
  padding-bottom: 40px; }
.modal--no-offer .modal__header {
  height: 280px;
  background-color: #ccc;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -25px;
  margin-left: -25px;
  margin-right: -25px;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  margin-bottom: 40px; }
@media screen and (min-width: 1024px) {
  .modal--no-offer .modal__header {
    margin-top: -40px;
    margin-left: -40px;
    margin-right: -40px; } }
.modal--no-offer .modal__header-logo {
  margin-bottom: 20px;
  height: 50px; }
.modal--no-offer .modal__header-title {
  color: #FFFFFF; }
.modal--no-offer .modal__header-copy {
  color: #FFFFFF;
  font-size: 20px; }
.modal--kit-select {
  max-width: 1100px;
  width: 90% !important; }
.modal--kit-select .modal__content {
  font-size: 1rem;
  max-width: 570px;
  margin-bottom: 40px; }
.modal--kit-select .card {
  margin: 15px 12px;
  padding: 10px;
  width: 95%;
  box-shadow: 0 0 6px 0 rgba(51, 51, 51, 0.2); }
@media screen and (min-width: 768px) {
  .modal--kit-select .card {
    padding: 25px 15px 25px 15px; } }
.modal--kit-select .enroll-kit__body {
  flex-wrap: wrap; }
.modal--kit-select .enroll-kit__pic {
  flex: 0 1 30%;
  min-width: 90px;
  padding-right: 5px; }
@media screen and (max-width: 767px) {
  .modal--kit-select .enroll-kit__pic img {
    width: auto; } }
.modal--kit-select .enroll-kit__details {
  flex: 0 1 50%;
  min-width: 180px;
  margin-top: 10px; }
@media screen and (min-width: 768px) {
  .modal--kit-select .enroll-kit__details {
    min-width: calc(100% - 130px);
    padding-left: 10px; } }
@media screen and (min-width: 1024px) {
  .modal--kit-select .enroll-kit__details {
    margin-top: 0; } }
@media (min-width: 1200px) {
  .modal--kit-select .enroll-kit__details {
    min-width: calc(100% - 90px); } }
.modal--kit-select .enroll-kit__details-save {
  margin-bottom: 20px; }
.modal--kit-select .enroll-kit__selection {
  flex: 0 1 100%;
  text-align: center; }
.modal--kit-select .button.modal__button {
  display: block;
  margin: 40px auto 0 !important;
  max-width: 240px; }
.modal--kit-select .enroll-kit__selection-btn.ui {
  min-width: 170px !important;
  margin: 0 auto;
  max-width: 155px; }
.modal--kit-select .enroll-kit__details-row:last-child {
  margin-top: 5px; }
.modal--kit-select .modal__header .modal__content:last-child {
  margin-bottom: 10px; }
@media screen and (min-width: 768px) {
  .modal--kit-select .modal__header .modal__content:last-child {
    font-size: 20px; } }
.modal--kit-select .modal__link {
  color: #354657;
  font-weight: 500; }
.modal--kit-select .enroll-kit__product-title {
  text-align: center; }
@media screen and (min-width: 1024px) {
  .modal--kit-select .enroll-kit__product-title {
    text-align: left; } }
.modal--kit-select .kit-select__carousel {
  padding: 10px 10px 10px 8px; }
.modal--change-account-type {
  max-width: 900px; }
@media screen and (max-width: 767px) {
  .modal--change-account-type {
    padding-left: 10px !important;
    padding-right: 10px !important; } }
.modal--change-account-type .modal__header [class*="icon--"] {
  margin-bottom: 0; }
.modal--change-account-type .modal__heading {
  font-weight: 700; }
@media screen and (max-width: 767px) {
  .modal--change-account-type .modal__heading {
    font-size: 20px;
    line-height: 28px;
    margin: 0 !important; } }
.modal--change-account-type .modal__content {
  margin-bottom: 0;
  text-align: left; }
.modal--change-account-type .change-account-type-features {
  display: none;
  width: 100%;
  max-width: 490px;
  margin: 10px auto 25px; }
@media screen and (min-width: 768px) {
  .modal--change-account-type .change-account-type-features {
    margin: 10px auto 40px; } }
.modal--change-account-type .change-account-type-features__inner {
  background: #F4F8FD;
  padding: 20px 15px; }
@media screen and (min-width: 768px) {
  .modal--change-account-type .change-account-type-features__inner {
    padding: 40px; } }
.modal--change-account-type .change-account-type-features__list {
  list-style: none outside none;
  margin: 0;
  padding: 0;
  margin-bottom: -10px; }
.modal--change-account-type .change-account-type-features__item {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  font-size: 16px;
  line-height: 24px; }
.modal--change-account-type .change-account-type-features__item [class*="icon--"] {
  line-height: 24px;
  margin-right: 10px; }
.modal--change-account-type .change-account-type-features--active {
  display: block; }
.modal--account-exists-error {
  max-width: 900px; }
.modal--account-exists-error .modal__content {
  font-size: 16px;
  max-width: 580px;
  margin: 0 auto 40px; }
.modal--edit-personal-details {
  padding-left: 4px;
  padding-right: 4px;
  width: 95% !important;
  max-width: 1100px; }
.modal--edit-personal-details .modal__header > i {
  margin-bottom: 0; }
.modal--edit-personal-details .modal__heading {
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 10px !important; }
@media screen and (max-width: 767px) {
  .modal--edit-personal-details .modal__heading {
    font-size: 20px; } }
.modal--edit-personal-details .form {
  max-width: 540px;
  margin: 0 auto; }
.modal--edit-personal-details .form .ui.button {
  display: block;
  margin: 40px auto 0 !important; }
.modal--edit-personal-details .ui .field > label {
  margin: 10px 0; }
.modal--account-already-exists .block-message {
  margin-top: 30px; }
@media screen and (min-width: 768px) {
  .modal--limited-offer {
    padding: 25px 50px 60px !important; } }
.modal--limited-offer .modal__heading {
  font-weight: 700;
  margin: 0 !important;
  font-size: 24px !important;
  line-height: 32px;
  max-width: none; }
@media screen and (min-width: 768px) {
  .modal--limited-offer .modal__heading {
    font-size: 32px !important;
    line-height: 40px; } }
.modal--limited-offer .modal__content {
  margin-bottom: 35px; }
@media screen and (min-width: 768px) {
  .modal--limited-offer .modal__content {
    margin-bottom: 45px; } }
.modal--limited-offer .modal__content p {
  font-size: 16px !important;
  line-height: 24px; }
.modal--limited-offer .product-cards {
  box-shadow: none;
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  padding: 20px 10px 0; }
@media screen and (min-width: 768px) {
  .modal--limited-offer .product-cards {
    justify-content: space-between;
    padding: 20px 30px 0; } }
.modal--limited-offer .product-cards .product-card {
  display: flex;
  flex-direction: column;
  width: 50%; }
.modal--limited-offer .product-cards .product-card__free {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #F1D900;
  height: 56px;
  width: 56px;
  font-size: 16px;
  top: 0px;
  border-radius: 50%;
  color: #000000;
  text-transform: uppercase;
  font-weight: 700;
  font-family: "rawline", sans-serif;
  position: absolute;
  text-align: center; }
@media screen and (min-width: 768px) {
  .modal--limited-offer .product-cards .product-card__free {
    height: 80px;
    width: 80px;
    font-size: 24px; } }
@media screen and (min-width: 768px) {
  .modal--limited-offer .product-cards .product-card--left {
    padding-right: 10px; } }
.modal--limited-offer .product-cards .product-card--left .product-card__image {
  justify-content: flex-end; }
.modal--limited-offer .product-cards .product-card--left .product-card__free {
  left: -5%; }
@media screen and (min-width: 480px) {
  .modal--limited-offer .product-cards .product-card--left .product-card__free {
    left: 30%; } }
@media screen and (min-width: 768px) {
  .modal--limited-offer .product-cards .product-card--right {
    padding-left: 10px; } }
.modal--limited-offer .product-cards .product-card--right .product-card__image {
  justify-content: flex-start; }
.modal--limited-offer .product-cards .product-card--right .product-card__free {
  right: -5%; }
@media screen and (min-width: 480px) {
  .modal--limited-offer .product-cards .product-card--right .product-card__free {
    right: 30%; } }
.modal--limited-offer .product-cards .product-card__image {
  display: flex;
  align-items: center;
  padding: 0 10px;
  position: relative; }
@media screen and (min-width: 768px) {
  .modal--limited-offer .product-cards .product-card__image {
    height: 260px;
    padding: 0 20px; } }
.modal--limited-offer .product-cards .product-card__image img {
  max-width: 100%;
  max-height: 100%; }
.modal--limited-offer .product-cards .icon--add-brand {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%); }
@media screen and (min-width: 480px) {
  .modal--limited-offer .modal__actions--column {
    max-width: 290px; } }
.modal--limited-offer .modal__actions {
  margin-bottom: 40px; }
@media screen and (min-width: 768px) {
  .modal--limited-offer .modal__actions {
    margin-bottom: 20px; } }
.modal--limited-offer .modal__cancel {
  text-decoration: underline; }
.modal--full {
  width: 100vw !important;
  max-width: 1320px;
  padding: 0;
  top: 0;
  left: 0;
  margin-top: 0 !important; }
@media screen and (min-width: 768px) {
  .modal--full {
    top: 50px; } }
@media screen and (min-width: 1024px) {
  .modal--full {
    left: auto;
    width: calc(100% - 10px) !important; } }
.modal--full > .modal__close {
  width: 3.5rem !important;
  height: 3.5rem !important; }
.modal--dmo {
  width: 100% !important;
  max-width: 880px;
  padding-left: 0;
  padding-right: 0; }
@media screen and (min-width: 768px) {
  .modal--dmo {
    padding-left: 25px;
    padding-right: 25px; } }
.modal--dmo > .modal__close {
  width: 3rem !important;
  height: 3rem !important; }
.modal--dmo .modal__heading {
  max-width: 100%;
  margin-bottom: 0 !important; }
@media screen and (max-width: 767px) {
  .modal--dmo .modal__heading {
    font-size: 20px; } }
@media screen and (max-width: 767px) {
  .modal--dmo .modal__header-icon {
    font-size: 1.5rem; } }
.modal--dmo .modal__content {
  margin-bottom: 0; }
.modal--dmo .modal__content p {
  max-width: 525px;
  margin-left: auto;
  margin-right: auto; }
@media screen and (max-width: 767px) {
  .modal--dmo .modal__content p {
    font-size: 16px; } }
.modal--dmo .modal__actions {
  margin-top: 20px; }
@media screen and (min-width: 768px) {
  .modal--dmo .modal__actions {
    margin-top: 0; } }
.modal--payment h3 {
  padding-top: 100px;
  background-image: url("/images/icon-card-generic.svg");
  background-repeat: no-repeat;
  background-position: center top 10px;
  background-size: 80px; }
.modal--update-payment h3 {
  padding-top: 100px;
  background-image: url("/images/icon-lrp-address.svg");
  background-repeat: no-repeat;
  background-position: center top 10px;
  background-size: 80px;
  margin-bottom: 30px; }
.modal--update-payment p {
  font-size: 16px;
  line-height: 1.6; }
.modal--update-address h3 {
  padding-top: 100px;
  background-image: url("/images/icon-lrp-address.svg");
  background-repeat: no-repeat;
  background-position: center top 10px;
  background-size: 80px;
  margin-bottom: 30px; }
.modal--update-address p {
  font-size: 16px;
  line-height: 1.6; }
.modal--update-lrp {
  padding-left: 10px;
  padding-right: 10px; }
@media screen and (min-width: 768px) {
  .modal--update-lrp {
    padding-left: 40px;
    padding-right: 40px; } }
.modal--update-lrp .modal__heading {
  padding-top: 60px;
  background-image: url("/images/icons/loyalty-order-brand.svg");
  background-repeat: no-repeat;
  background-position: center top 10px;
  background-size: 40px;
  margin-bottom: 15px !important;
  font-size: 20px;
  max-width: 100%; }
@media screen and (min-width: 768px) {
  .modal--update-lrp .modal__heading {
    padding-top: 100px;
    font-size: 30px;
    background-size: 75px;
    margin-bottom: 20px !important; } }
.modal--update-lrp .modal__content {
  margin-bottom: 35px; }
.modal--update-lrp .modal__intro {
  margin: 0 auto 25px;
  max-width: 480px; }
.modal--update-lrp p {
  font-size: 14px;
  line-height: 1.6; }
@media screen and (min-width: 768px) {
  .modal--update-lrp p {
    font-size: 16px; } }
.modal--update-lrp .modal__loyalty-orders {
  list-style: none outside none;
  margin: 0;
  padding: 0; }
.modal--update-lrp .modal__loyalty-order {
  margin-bottom: 20px; }
.modal--update-lrp .modal__actions {
  max-width: 280px;
  margin-left: auto;
  margin-right: auto; }
.modal--update-lrp .modal__actions .ui.button,
.modal--update-lrp .modal__actions .ui.button + .modal--update-lrp .modal__actions .ui.button {
  margin: 15px 0 0; }
.modal--delete-address {
  border-color: #DE6C6C !important; }
.modal--delete-address .modal__heading {
  background-image: url("/images/icons/error-outline-danger.svg"); }
.modal--delete-payment-method {
  border-color: #DE6C6C !important; }
.modal--delete-payment-method .modal__heading {
  background-image: url("/images/icons/error-outline-danger.svg"); }
.modal--delete-phone h3 {
  padding-top: 100px;
  background-image: url("/images/icon-phone.svg");
  background-repeat: no-repeat;
  background-position: center top 10px;
  background-size: 80px;
  margin-bottom: 30px; }
.modal--delete-phone p {
  font-size: 16px; }
.modal--terms .modal__content {
  text-align: left;
  border: 1px solid #EEEEEE;
  border-radius: 5px;
  padding: 15px; }
@media screen and (min-width: 768px) {
  .modal--terms .modal__content {
    padding: 20px; } }
.modal--terms .modal__content p {
  font-size: 14px; }
@media screen and (min-width: 768px) {
  .modal--terms .modal__content p {
    font-size: 16px; } }
.modal--linkgen-share {
  max-width: 430px;
  border-top: none !important;
  background-color: #354657 !important;
  color: #FFFFFF; }
.modal--linkgen-share .modal__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 0; }
.modal--linkgen-share .modal__content p {
  font-size: 16px;
  margin-bottom: 10px; }
.modal--linkgen-share .modal__content .your-link__field {
  margin-bottom: 0;
  padding-bottom: 0;
  width: 100%;
  margin: 0 0 20px 0; }
.modal--linkgen-share .modal__content .your-link__copy-field-input {
  padding-left: 50px;
  padding-right: 50px; }
.modal--linkgen-share .modal__heading {
  margin-bottom: 30px; }
.modal--linkgen-share .social-icons {
  margin-bottom: 30px; }
.modal--enrol-with-products {
  max-width: 1000px;
  width: 95% !important; }
.modal--enrol-with-products .column {
  display: flex !important;
  flex-direction: column;
  text-align: center; }
.modal--enrol-with-products .column--left {
  padding-right: 50px !important; }
@media screen and (min-width: 1024px) {
  .modal--enrol-with-products .column--left {
    border-right: solid 2px #EEEEEE; } }
.modal--enrol-with-products .column--right {
  padding-left: 50px !important; }
.modal--enrol-with-products .column .modal__text {
  flex: 1; }
.modal--cant-find {
  max-width: 1100px;
  width: 95% !important; }
.modal--cant-find .modal__content {
  max-width: 570px; }
.modal--cant-find .ui .field > label {
  margin: 10px 0; }
.modal--cant-find em {
  font-weight: normal; }
.modal--cant-find .column {
  margin: 0 auto;
  display: flex !important;
  flex-direction: column; }
.modal--cant-find .column .button {
  justify-self: center; }
.modal--semi-login .ui.form .field {
  margin-bottom: 0; }
.modal--semi-login .ui .field > label {
  margin: 10px 0; }
.modal--semi-login em {
  font-weight: normal; }
.modal--semi-login .column {
  margin: 0 auto;
  display: flex !important;
  flex-direction: column; }
.modal--semi-login .column .button {
  justify-self: center; }
.modal--account-created {
  width: 100% !important;
  max-width: 985px;
  padding: 20px 15px; }
@media screen and (min-width: 1024px) {
  .modal--account-created {
    padding: 40px 20px; } }
.modal--account-created .modal__content {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px; }
.modal--lrp-only .modal__heading {
  margin-bottom: 15px !important;
  font-size: 20px; }
@media screen and (min-width: 768px) {
  .modal--lrp-only .modal__heading {
    font-size: 30px; } }
.modal--lrp-only .modal__content {
  margin-bottom: 25px; }
.modal--lrp-only .modal__text {
  font-size: 14px;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto; }
@media screen and (min-width: 768px) {
  .modal--lrp-only .modal__text {
    font-size: 1rem;
    line-height: 1.5; } }
.modal--lrp-only .modal__button {
  margin-bottom: 15px !important;
  font-size: 1rem !important; }
@media screen and (min-width: 768px) {
  .modal--lrp-only .modal__button {
    font-size: 19px !important; } }
.modal--lrp-only .modal__actions {
  max-width: 300px; }
.modal--lrp-only .modal__cancel {
  color: #354657;
  text-decoration: none;
  font-weight: normal; }
.modal--lrp-only .modal__cancel:hover, .modal--lrp-only .modal__cancel:focus {
  text-decoration: underline; }
@media screen and (max-width: 767px) {
  .modal--bag .modal__heading {
    font-size: 20px;
    margin: 0 0 20px !important; } }
@media screen and (max-width: 767px) {
  .modal--bag .modal__content {
    margin-bottom: 20px; }
  .modal--bag .modal__content p {
    font-size: 16px; } }
.modal--bag .modal__bag {
  margin-right: 0;
  margin-left: 0; }
@media screen and (max-width: 767px) {
  .modal--bag .modal__bag {
    margin-right: -10px;
    margin-left: -10px; } }
.modal--profile-photo {
  max-width: 430px; }
@media screen and (min-width: 768px) {
  .modal--profile-photo {
    padding: 40px !important; } }
.modal--profile-photo .modal__heading {
  font-size: 20px;
  margin-bottom: 0 !important; }
@media screen and (min-width: 768px) {
  .modal--profile-photo .modal__content {
    margin-bottom: 0; } }
.modal--profile-photo .modal__actions {
  max-width: 220px;
  margin-left: auto;
  margin-right: auto; }
.modal__bag {
  margin-left: -40px;
  margin-right: -40px;
  margin-top: 40px;
  margin-bottom: 40px; }
.modal__bag-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 40px;
  padding-right: 40px; }
.modal__bag-header-info {
  display: flex;
  margin-bottom: 10px; }
.modal__bag-header-info--mw {
  max-width: 110px;
  justify-content: space-between; }
.modal__bag-header-info--light .modal__bag-header-info-label {
  font-weight: 500; }
.modal__bag-header-info--bold .modal__bag-header-info-data {
  font-weight: 700; }
.modal__bag-header-info-wrap {
  width: 50%;
  display: flex;
  flex-direction: column; }
.modal__bag-header-info-label {
  font-weight: 700; }
.modal__bag-header-info-data {
  padding-left: 20px; }
.modal__bag-header-info-detail {
  font-size: 16px;
  color: #A25EB5; }
.modal__bag-header-products {
  width: 50%;
  display: flex;
  padding-left: 10px;
  padding-right: 10px; }
.modal__bag-header-products .loyalties__orders-box-product {
  min-width: 35%; }
.modal__bag-body {
  background: #F4F8FD;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 40px;
  padding-right: 40px;
  margin-top: 50px;
  margin-bottom: 50px; }
.modal__bag-body-info {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
.modal__bag-body-info-title {
  font-size: 16px;
  margin-bottom: 0; }
.modal__bag-body-info-list {
  padding-left: 20px;
  margin-bottom: 40px; }
.modal__bag-body-info-list-item {
  margin-bottom: 10px;
  font-size: 14px; }
.modal__bag-body-block {
  width: 275px;
  margin-bottom: -30px;
  margin-top: -30px;
  box-shadow: 0 2px 15px 0 rgba(51, 51, 51, 0.2);
  border-radius: 5px;
  overflow: hidden;
  background: #FFFFFF; }
.modal__bag-body-block-head {
  background: #A25EB5;
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  font-size: 20px;
  line-height: 1.2; }
.modal__bag-body-block-head strong {
  padding-left: 5px; }
.modal__bag-body-block-content {
  padding: 20px; }
.modal__bag-body-block-title {
  text-align: center;
  font-size: 20px;
  line-height: 1.2;
  margin-bottom: 8px;
  margin-top: 10px; }
.modal__bag-body-block-subtitle {
  font-weight: 500;
  text-align: center;
  font-size: 16px;
  color: #A25EB5;
  margin-bottom: 25px; }
.modal__bag-body-block-list {
  padding-left: 0;
  list-style: none; }
.modal__bag-body-block-list-item {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.71;
  display: flex;
  align-items: center; }
.modal__bag-summary {
  max-width: 400px;
  margin: 0 auto;
  box-shadow: 0 2px 15px 0 rgba(51, 51, 51, 0.2);
  padding: 20px 15px;
  margin-bottom: 20px; }
@media screen and (min-width: 768px) {
  .modal__bag-summary {
    padding: 30px 45px; } }
.modal--process-today {
  padding: 0 !important; }
@media screen and (max-width: 767px) {
  .modal--process-today {
    padding: 25px 0 0 !important;
    width: 100% !important;
    min-height: 100vh !important;
    top: 0 !important;
    border-radius: 0 !important;
    margin: 0 !important; } }
.modal--process-today .modal__close {
  width: 30px !important;
  height: 30px !important;
  opacity: 0.5 !important; }
.modal--process-today .modal__heading {
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  max-width: 100%;
  text-align: left;
  margin-bottom: 0 !important; }
@media screen and (min-width: 768px) {
  .modal--process-today .modal__heading {
    font-size: 20px;
    line-height: 28px; } }
.modal--process-today .modal__heading [class*="icon--"], .modal--process-today .modal__heading [class*="icon--"]::before {
  margin-right: 5px !important;
  width: 24px !important;
  height: 24px !important; }
@media screen and (min-width: 768px) {
  .modal--process-today .modal__heading [class*="icon--"], .modal--process-today .modal__heading [class*="icon--"]::before {
    margin-right: 10px !important;
    width: 30px !important;
    height: 30px !important; } }
.modal--process-today .modal__inner {
  padding: 16px;
  border-top: 2px solid #EEEEEE; }
@media screen and (min-width: 768px) {
  .modal--process-today .modal__inner {
    padding: 24px 32px; } }
.modal--process-today .modal__inner:first-of-type {
  border-top: none; }
.modal--process-today .modal__text {
  font-size: 14px;
  line-height: 22px; }
@media screen and (min-width: 768px) {
  .modal--process-today .modal__text {
    font-size: 16px;
    line-height: 24px; } }
.modal--process-today .modal__alert {
  margin: 15px 0 0; }
@media screen and (min-width: 768px) {
  .modal--process-today .modal__alert {
    margin: 25px 0 0; } }
.modal--process-today .modal__order-summary {
  margin-bottom: 15px; }
.modal--process-today .modal__button {
  margin-top: 10px !important; }
.modal--process-today .modal__cancel {
  color: #84909B;
  font-weight: 500;
  text-decoration: underline;
  margin-bottom: 30px; }
.modal--process-today .modal__cancel:hover, .modal--process-today .modal__cancel:focus {
  text-decoration: none; }
.modal--process-today .modal__footer {
  text-align: center; }
.modal--process-today .security-label {
  display: inline-flex;
  align-items: center;
  padding: 0 7px 0 3px;
  background-color: #EEEEEE;
  text-align: center;
  margin: 0 auto;
  border-radius: 2px; }
.modal--process-today .security-label__text {
  font-size: 12px;
  line-height: 20px; }

/* The Modal (background) */
body.quick-view-modal-open {
  overflow: hidden; }
@media screen and (max-width: 767px) {
  body.quick-view-modal-open #header {
    display: none; } }
@media screen and (max-width: 767px) {
  body.quick-view-modal-open .order-summary--mobile {
    display: none; } }

.product-quick-view-modal {
  display: none;
  /* Hidden by default */
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: rgba(255, 255, 255, 0.7); }
@media screen and (max-width: 767px) {
  .product-quick-view-modal {
    background-color: white; } }
.product-quick-view-modal .modal-content {
  max-width: 1272px; }
.product-quick-view-modal .product-facts {
  margin-bottom: 0; }
.product-quick-view-modal.open {
  display: block; }
.product-quick-view-modal.open .modal-content {
  bottom: 0;
  opacity: 1; }
@media screen and (min-width: 768px) {
  .product-quick-view-modal.open .modal-content {
    margin-top: 120px; } }
.product-quick-view-modal .spotlight__head {
  padding-top: 100px; }
.product-quick-view-modal .ui.button.back {
  background-color: transparent !important;
  margin-top: 20px; }
@media screen and (max-width: 767px) {
  .product-quick-view-modal .ui.button.back {
    margin-top: 0;
    right: 40px;
    left: 40px; } }
.product-quick-view-modal--kit .ui.button.back {
  border-color: #354657 !important;
  color: #354657 !important;
  background-image: url(/images/icons/arrow-left.svg) !important; }
.product-quick-view-modal--kit .ui.button.back:hover {
  color: #354657 !important; }
.product-quick-view-modal--kit .ui.button.secondary:not(:disabled):not(.disabled):hover {
  color: #354657 !important; }
@media screen and (min-width: 768px) {
  .product-quick-view-modal--kit .product-benefits {
    padding-bottom: 10px; } }
@media screen and (min-width: 768px) {
  .product-quick-view-modal--kit2 .product-benefits {
    padding-bottom: 10px; } }
.product-quick-view-modal--diamondkit .ui.button.back {
  background-color: #BD8BCA !important;
  border-color: #BD8BCA !important; }
.product-quick-view-modal--simplelit .ui.button.back {
  background-color: #BD8BCA !important;
  border-color: #BD8BCA !important; }
.product-quick-view-modal--simplebox .ui.button.back {
  background-color: #BD8BCA !important;
  border-color: #BD8BCA !important; }
.product-quick-view-modal .spotlight--eqkit .spotlight__alt-dt-pic {
  min-width: initial; }
.product-quick-view-modal .modal__close {
  display: none; }
.product-quick-view-modal .product-sourcing {
  margin-bottom: 0; }
.product-quick-view-modal .product-whats-inside-kit__info-detail-more {
  display: none; }
@media screen and (max-width: 767px) {
  .product-quick-view-modal .product-featured__order .loyalty-order__item-cta {
    margin-top: 25px;
    margin-bottom: 0; } }

/* Modal Content/Box */
.product-quick-view-modal .modal-content {
  position: relative;
  background: #ffffff;
  width: 100%;
  transition: all 0.3s ease-in-out;
  bottom: -100px;
  opacity: 0; }
@media screen and (min-width: 768px) {
  .product-quick-view-modal .modal-content {
    margin: 5% auto;
    width: 90%;
    box-shadow: 0 2px 24px 0 rgba(51, 51, 51, 0.1); } }
@media screen and (min-width: 1440px) {
  .product-quick-view-modal .modal-content {
    margin: 5% auto;
    width: 80%;
    box-shadow: 0 2px 24px 0 rgba(51, 51, 51, 0.1); } }

.product-quick-view-modal.active .modal-content {
  bottom: 0;
  opacity: 1; }

.product-quick-view-modal .modal__actions {
  padding-bottom: 60px; }
.product-quick-view-modal .modal__actions--pt {
  padding-top: 80px; }

.product-quick-view-modal .product-facts {
  margin-bottom: 0; }

.product-kit-quick-view-modal {
  max-width: 100%;
  padding: 0;
  background-color: #FFFFFF; }
.product-kit-quick-view-modal.ui.modal {
  width: 96%; }
@media screen and (min-width: 768px) {
  .product-kit-quick-view-modal.ui.modal {
    max-width: 900px; } }
@media screen and (min-width: 1024px) {
  .product-kit-quick-view-modal.ui.modal {
    max-width: 1280px; } }
.product-kit-quick-view-modal .product-facts {
  margin-bottom: 0; }

.modal--cancel {
  border-top: 5px solid #DE6C6C !important; }
@media screen and (min-width: 768px) {
  .modal--cancel .modal__actions--column {
    max-width: 320px; } }

.modal--cancel-multi {
  border-top: 5px solid #DE6C6C !important; }
@media screen and (min-width: 768px) {
  .modal--cancel-multi .modal__actions--column {
    max-width: 320px; } }

.modal--save {
  border-color: #DE6C6C !important; }
@media screen and (min-width: 768px) {
  .modal--save .modal__content {
    max-width: 420px;
    margin-left: auto;
    margin-right: auto; } }
@media screen and (min-width: 768px) {
  .modal--save .modal__actions--column {
    max-width: 240px; } }
.modal--save .modal__close-link {
  margin-top: 20px;
  margin-bottom: 50px;
  color: #DE6C6C;
  font-size: 16px;
  font-weight: 700; }

.modal--self-enroll-checkout.ui.modal {
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0; }
@media screen and (min-width: 768px) {
  .modal--self-enroll-checkout.ui.modal {
    width: 100%;
    max-width: 700px; } }
@media screen and (min-width: 1024px) {
  .modal--self-enroll-checkout.ui.modal {
    max-width: 1000px; } }
@media screen and (min-width: 1440px) {
  .modal--self-enroll-checkout.ui.modal {
    max-width: 1100px; } }

.modal--self-enroll-checkout .modal__content {
  margin-bottom: 0; }
.modal--self-enroll-checkout .modal__content,
.modal--self-enroll-checkout .modal__content p {
  font-size: 14px;
  line-height: 22px; }
@media screen and (min-width: 768px) {
  .modal--self-enroll-checkout .modal__content,
  .modal--self-enroll-checkout .modal__content p {
    font-size: 16px;
    line-height: 24px; } }

.modal--self-enroll-checkout .modal__heading {
  margin-left: 15px;
  margin-right: 15px;
  max-width: 100%;
  margin-top: 20px;
  margin-bottom: 10px !important;
  font-weight: 700; }
@media screen and (min-width: 768px) {
  .modal--self-enroll-checkout .modal__heading {
    font-size: 28px;
    margin-top: 40px;
    margin-left: 40px;
    margin-right: 40px; } }
@media screen and (min-width: 1024px) {
  .modal--self-enroll-checkout .modal__heading {
    font-size: 48px; } }

.ui.modal.modal--enroll-change-kit {
  padding-left: 10px;
  padding-right: 10px; }
@media screen and (min-width: 768px) {
  .ui.modal.modal--enroll-change-kit {
    padding-left: 25px;
    padding-right: 25px; } }
.ui.modal.modal--enroll-change-kit .modal__heading {
  margin-left: auto;
  margin-right: auto;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px; }
@media screen and (min-width: 768px) {
  .ui.modal.modal--enroll-change-kit .modal__heading {
    font-size: 30px;
    line-height: 36px; } }
.ui.modal.modal--enroll-change-kit .modal__heading [class*="icon--"] {
  margin-bottom: 8px; }
@media screen and (min-width: 768px) {
  .ui.modal.modal--enroll-change-kit {
    max-width: 870px; } }

.modal--scheduled {
  max-width: 875px; }
.modal--scheduled .modal__header {
  text-align: center; }
@media screen and (min-width: 768px) {
  .modal--scheduled .modal__header {
    max-width: 550px;
    margin-left: auto;
    margin-right: auto; } }
.modal--scheduled .modal__heading {
  max-width: 100%;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 20px !important;
  font-size: 20px; }
@media screen and (min-width: 768px) {
  .modal--scheduled .modal__heading {
    font-size: 30px; } }
.modal--scheduled .modal__text {
  font-size: 14px; }
@media screen and (min-width: 768px) {
  .modal--scheduled .modal__text {
    font-size: 16px;
    line-height: 1.5; } }
.modal--scheduled .modal__content {
  margin-bottom: 0;
  margin-top: 20px; }
@media screen and (min-width: 768px) {
  .modal--scheduled .modal__content {
    max-width: 340px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 25px; } }
@media screen and (min-width: 768px) {
  .modal--scheduled .modal__content p {
    font-size: 16px;
    line-height: 24px; } }
@media screen and (min-width: 768px) {
  .modal--scheduled .modal__actions--column {
    max-width: 100%; } }
.modal--scheduled .modal__close {
  opacity: 0.5 !important; }
.modal--scheduled .modal__close-link {
  margin-top: 25px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 600; }

#modal-se-advanced-signup .modal__heading {
  margin-bottom: 15px !important;
  margin-top: 0 !important; }
@media screen and (max-width: 767px) {
  #modal-se-advanced-signup .modal__heading {
    font-size: 20px;
    line-height: 28px; } }
@media screen and (min-width: 768px) {
  #modal-se-advanced-signup .modal__heading {
    margin-bottom: 20px !important; } }

#modal-se-advanced-signup .modal__content,
#modal-se-advanced-signup .modal__content p {
  font-size: 14px;
  line-height: 22px; }
@media screen and (min-width: 768px) {
  #modal-se-advanced-signup .modal__content,
  #modal-se-advanced-signup .modal__content p {
    font-size: 16px;
    line-height: 24px; } }

#modal-se-advanced-signup .modal__content {
  margin-bottom: 40px; }
@media screen and (min-width: 768px) {
  #modal-se-advanced-signup .modal__content {
    margin-bottom: 45px; } }

#modal-se-advanced-signup .modal__actions {
  padding-bottom: 50px; }
#modal-se-advanced-signup .modal__actions a.modal__link {
  font-weight: 500;
  text-decoration: underline; }

/* WF171423 Megan D: Redoing how the Return to Backoffice flows */
.modal--interrupt .modal__buttons button.modal__button {
  /* Brand/Lavender/Accessibility Lavender */
  background: #9D57B2;
  /* Brand/Lavender/Light Lavender */
  border: 2px solid #BD8BCA;
  box-sizing: border-box;
  border-radius: 24px;
  font-size: 16px;
  margin-bottom: 0px;
}
.modal--interrupt .modal__link{
  color: #0067dc;
  text-decoration: underline;
  font-weight:400;
  font-size:16px;
  margin: 0.563rem 0;
}

.modal--interrupt .modal__link:hover {
  color: #a25eb5;
  outline: none;
  text-decoration: none; }

.modal--interrupt .modal__heading {
  font-size: 24px;
  line-height: 32px;
  margin-top: 0px; }

.modal--interrupt .modal__content {
  padding: 0px; }

.modal--interrupt .modal__icon {
  margin-bottom: 0.625rem;
  margin-top: 0.75rem; }
@media screen and (min-width: 768px) {
  .modal--interrupt .modal__icon {
    width: 24px;
    height: 24px;
    margin-bottom: 1.25rem;
    margin-top: 2rem; } }


@media screen and (max-width: 768px) {
  .modal--interrupt .modal__buttons button.modal__button {
    font-size: 14px; }

  .modal--interrupt .modal__link{
    font-size: 14px; }

  .modal--interrupt .modal__heading {
    font-size: 26px; }

  .modal--interrupt .modal__intro {
    font-size: 14px; }

}

@media screen and (max-width: 480px) {
  .modal--interrupt .modal__buttons button.modal__button {
    font-size: 12px; }

  .modal--interrupt .modal__link{
    font-size: 12px; }

  .modal--interrupt .modal__heading {
    font-size: 20px;
    margin-bottom: 0.9rem !important; }

  .modal--interrupt .modal__intro {
    font-size: 10px; }

  .modal--interrupt .modal__header {
    padding-bottom: 0; }
}

.modal--reorder-table-columns .modal__content {
  padding: 0 20px 20px; }

.modal--reorder-table-columns .modal__heading {
  text-align: left;
  padding: 30px 20px 15px;
  margin: 0;
  font-size: 16px;
  line-height: 24px; }
@media screen and (min-width: 768px) {
  .modal--reorder-table-columns .modal__heading {
    padding: 35px 20px 15px; } }

.modal--reorder-table-columns .modal__button {
  min-width: auto !important; }

/*start WF176340 adding graphic tree specifications Mari H.*/
.modal--graphic-tree-key.modal.ui {
  box-shadow: none;
  border-top: 0 !important; }
@media screen and (min-width: 768px) {
  .modal--graphic-tree-key.modal.ui {
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.08), 0 0 8px rgba(0, 0, 0, 0.16);
    border-radius: 5px; } }
.modal--graphic-tree-key.modal.ui .content.scrolling {
  max-height: calc(var(--vh, 1vh) * 100);
  padding: 0 !important; }
.modal--graphic-tree-key.modal.ui .modal__header {
  align-items: flex-start;
  padding: 16px 16px 0; }
@media screen and (min-width: 768px) {
  .modal--graphic-tree-key.modal.ui .modal__header {
    padding: 24px 24px 0; } }
.modal--graphic-tree-key.modal.ui .close.modal__close {
  opacity: 1 !important;
  top: 8px !important;
  right: 4px !important; }
.modal--graphic-tree-key.modal.ui .modal__heading {
  font-size: 16px;
  line-height: 24px; }
@media screen and (min-width: 768px) {
  .modal--graphic-tree-key.modal.ui .modal__heading {
    font-size: 20px;
    line-height: 28px; } }
.modal__content--flush {
  padding: 0;
}
/*end WF176340*/

/*START EVX-6024 rsuazo - Add Direct Debit Modal Styling */
@media screen and (min-width: 768px) {
  .modal--update-direct-debit.modal.ui {
    padding-left: 80px;
    padding-right: 80px;
    padding-bottom: 40px;
  }
}
.modal--update-direct-debit.modal.ui .modal__header {
  padding-top: 10px;
}
.modal--update-direct-debit.modal.ui .modal__heading {
  font-size: 16px;
  line-height: 24px;
  margin-bottom: 8px !important;
}

@media screen and (min-width: 768px) {
  .modal--update-direct-debit.modal.ui .modal__heading {
    font-size: 24px;
    line-height: 32px;
    margin: 24px 0 8px !important;
  }
}
.modal--update-direct-debit.modal.ui .modal__content {
  margin-bottom: 16px;
}
.modal--update-direct-debit.modal.ui .modal__content p {
  font-size: 14px !important;
  line-height: 22px !important;
  color: #6e7a86;
}
@media screen and (min-width: 768px) {
  .modal--update-direct-debit.modal.ui .modal__content p {
    font-size: 16px !important;
    line-height: 24px !important;
  }
}
@media screen and (min-width: 768px) {
  .modal--update-direct-debit.modal.ui .modal__content {
    margin-bottom: 24px;
  }
}
.modal--update-direct-debit.modal.ui .modal__actions {
  margin-top: 32px;
  margin-bottom: 24px;
  max-width: 100%;
}
@media screen and (min-width: 768px) {
  .modal--update-direct-debit.modal.ui .modal__actions {
    margin-top: 40px;
    max-width: 320px;
    margin-bottom: 0;
  }
}
.modal--update-direct-debit.modal.ui .modal__link {
  font-size: 14px !important;
  line-height: 22px !important;
  margin-top: 8px;
  font-weight: 500;
  color: #6e7a86;
  text-decoration: underline;
}
@media screen and (min-width: 768px) {
  .modal--update-direct-debit.modal.ui .modal__link {
    font-size: 16px !important;
    line-height: 24px !important;
  }
}
@media screen and (min-width: 768px) {
  .modal--update-direct-debit.modal.ui .modal__link {
    margin-top: 24px;
  }
}
.modal--update-direct-debit.modal.ui .modal__link:hover {
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .modal--update-direct-debit.modal.ui .modal__icon {
    margin-top: 16px;
  }
}
.modal--update-direct-debit.modal.ui .modal__icon, .modal--update-direct-debit.modal.ui .modal__icon[class*=icon--], .modal--update-direct-debit.modal.ui .modal__icon[class*=icon--]::before {
  width: 32px;
  height: 32px;
}
@media screen and (min-width: 768px) {
  .modal--update-direct-debit.modal.ui .modal__icon, .modal--update-direct-debit.modal.ui .modal__icon[class*=icon--], .modal--update-direct-debit.modal.ui .modal__icon[class*=icon--]::before {
    width: 40px;
    height: 40px;
  }
}
/*END EVX-6024*/