.help-and-support-notice {
  border-radius: 8px;
  position: relative;
  margin-bottom: 30px;
  padding: 20px;
  background-position: right;
  background-repeat: no-repeat;
  background-size: contain;
}

.banner-icon {
  min-height: 50px;
  min-width: 50px;
  background-position: right;
  background-repeat: no-repeat;
  background-size: contain;
}

.help-and-support-notice.banner-announcement {
  background-color: hsl(87 71% 85% / 1);
}

.help-and-support-notice.banner-information {
  background-color: hsl(197 77% 85% / 1);
}

.help-and-support-notice.banner-warning {
  background-color: hsl(38 100% 85% / 1);
}

.help-and-support-notice.banner-critical {
  background-color: hsl(324 100% 85% / 1);
}

.help-and-support-notice.banner-announcement > .help-and-support-notice-header > .banner-icon {
  background-image: url(../assets/img/Thumbs_up_RGB.svg);
}
.help-and-support-notice.banner-information > .help-and-support-notice-header > .banner-icon {
  background-image: url(../assets/img/Signature_RGB.svg);
}
.help-and-support-notice.banner-warning > .help-and-support-notice-header > .banner-icon {
  background-image: url(../assets/img/Cone_Diversion_RGB.svg);
}
.help-and-support-notice.banner-critical > .help-and-support-notice-header > .banner-icon {
  background-image: url(../assets/img/Mailing_list_RGB.svg);
}

.help-and-support-notice.bg-success .help-and-support-notice-body a,
.help-and-support-notice.bg-warning .help-and-support-notice-body a,
.help-and-support-notice.bg-danger .help-and-support-notice-body a {
  color: #fff !important;
}

.help-and-support-notice-header {
  position: relative;
  border-bottom: 1px solid hsl(197 77% 75% / 1);
  padding-bottom: 10px;
  margin-bottom: 15px;
}

.help-and-support-notice.banner-announcement > .help-and-support-notice-header {
  border-bottom: 1px solid hsl(87 71% 75% / 1);
}

.help-and-support-notice.banner-information > .help-and-support-notice-header {
  border-bottom: 1px solid hsl(197 77% 75% / 1);
}

.help-and-support-notice.banner-warning > .help-and-support-notice-header {
  border-bottom: 1px solid hsl(38 100% 75% / 1);
}

.help-and-support-notice.banner-critical > .help-and-support-notice-header {
  border-bottom: 1px solid hsl(324 100% 75% / 1);
}

.help-and-support-notice .wrap {
  /*position: relative;*/
}

/* .help-and-support-notice .wrap:before {
  content: "\e90e";
  font-family: first-icons;
  font-size: 20px;
  color: inherit;
  position: absolute;
} */

/* .help-and-support-notice.has-header .wrap:before {
  top: 5px;
}

.help-and-support-notice.bg-danger .wrap:before {
  content: "\e908";
}

.help-and-support-notice.bg-warning .wrap:before {
  content: "\e908";
}

.help-and-support-notice.bg-success .wrap:before {
  content: "\e90e";
} */

.help-and-support-notice-header h2 {
  margin: 0 0 5px 0;
  font-size: 20px;
  line-height: 32px;
  color: currentColor;
}

/* .help-and-support-notice-dismiss {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background: none !important;
  color: red !important;
  padding: 0;
  width: 44px;
  height: 44px;
} */

/* .help-and-support-notice-dismiss svg {
  width: 24px;
  height: 24px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -12px 0 0 -12px;
} */

.help-and-support-notice-dismiss svg path {
  fill: #333;
}

.help-and-support-notice-dismiss svg path,
.help-and-support-notice-dismiss svg path {
  fill: #fff;
}

.help-and-support-notice-dismiss span {
  color: transparent;
  font-size: 0;
  line-height: 0;
}

.help-and-support-notice-body {
  font-weight: 600;
}

.help-and-support-notice-body > :last-child {
  margin-bottom: 0;
}

.help-and-support-notice-body a {
  text-decoration: underline !important;
}

.help-and-support-notice + .help-and-support-notice {
  display: none !important;
}