body > .container {
  padding-top: 236px;
}
@media (min-width: 48rem) {
  body > .container {
    padding-top: 174px;
  }
}

.announcement-bar {
  display: grid;
  gap: 0.5rem;
  padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}
@media (min-width: 48rem) {
  .announcement-bar {
    min-height: 46px;
    padding: 0 0.5rem 0 0.5rem;
  }
}
.announcement-bar__withCta {
  grid-template: "icon text close" auto "cta cta cta" auto/1fr auto 1fr;
}
@media (min-width: 48rem) {
  .announcement-bar__withCta {
    grid-template: "icon text cta close" auto/1fr auto 1fr auto;
  }
}
.announcement-bar__withoutCta {
  grid-template: "icon text arrow close" auto/1fr auto 1fr auto;
}
@media (min-width: 48rem) {
  .announcement-bar__withoutCta {
    grid-template: "icon text arrow close" auto/1fr auto 1fr auto;
  }
}
.announcement-bar__primary {
  background-color: #fcd300;
  color: #14181b;
}
.announcement-bar__primary:hover, .announcement-bar__primary:focus {
  color: #14181b !important;
  outline: unset !important;
  text-decoration: unset !important;
}
.announcement-bar__dark {
  background-color: #14181b;
  color: #fff;
}
.announcement-bar__dark:hover, .announcement-bar__dark:focus {
  color: #fff !important;
  outline: unset !important;
  text-decoration: unset !important;
}
.announcement-bar__petrol {
  background-color: #065066;
  color: #fff;
}
.announcement-bar__petrol:hover, .announcement-bar__petrol:focus {
  color: #fff !important;
  outline: unset !important;
  text-decoration: unset !important;
}
.announcement-bar__success {
  background-color: #02611f;
  color: #fff;
}
.announcement-bar__success:hover, .announcement-bar__success:focus {
  color: #fff !important;
  outline: unset !important;
  text-decoration: unset !important;
}
.announcement-bar__warning {
  background-color: #f2952f;
  color: #14181b;
}
.announcement-bar__warning:hover, .announcement-bar__warning:focus {
  color: #14181b !important;
  outline: unset !important;
  text-decoration: unset !important;
}
.announcement-bar .icon {
  align-items: center;
  display: flex;
  grid-area: icon;
  justify-content: flex-end;
}
.announcement-bar .icon i {
  color: currentcolor;
  font-size: 1.5rem;
}
.announcement-bar .text {
  align-items: center;
  display: flex;
  float: unset !important;
  font-size: 0.875rem !important;
  grid-area: text;
  justify-content: center;
  line-height: 1.3125rem !important;
  margin-top: 0 !important;
  text-align: center;
  width: unset !important;
}
.announcement-bar .text p {
  font-size: 0.875rem !important;
  line-height: 1.3125rem !important;
}
.announcement-bar .arrow {
  align-items: center;
  display: flex;
  grid-area: arrow;
  justify-content: flex-start;
}
.announcement-bar .arrow i {
  color: currentcolor;
  font-size: 1.5rem;
}
.announcement-bar .close {
  align-items: center;
  display: flex;
  grid-area: close;
  justify-content: flex-end;
}
.announcement-bar .close button {
  background: transparent;
  border: none;
  color: inherit;
  cursor: pointer;
}
.announcement-bar .close button i {
  color: currentcolor;
  font-size: 1.5rem;
}
.announcement-bar .cta {
  align-items: center;
  display: flex;
  grid-area: cta;
  justify-content: center;
  padding: 0 !important;
}
@media (min-width: 48rem) {
  .announcement-bar .cta {
    justify-content: flex-start;
  }
}
.announcement-bar .cta button {
  white-space: nowrap;
}