.announcement-banner {
   margin-inline: auto;

   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
   width: var(--max-text-width);
   border-top: 2px dashed var(--colour-brand1);
   border-bottom: 2px dashed var(--colour-brand1);
   border-left: 6px solid var(--colour-brand1);
   border-right: 6px solid var(--colour-brand1);

   padding: 16px 24px;
   /*background-color: #fffaf1;*/

   position: relative;
}

.announcement-banner-icon {
   position: absolute;
   width: 132px;
   top: 0;
   left: -90px;
   transform: translateY(-20px) rotate(-33deg);
}

.announcement-banner-title {
   color: var(--colour-brand1);
   font-size: larger;
}

.announcement-banner-text {
   font-size: large;
}

@keyframes banner-in {
   from {
      opacity: 0;
      transform: translateY(-8px);
   }
   to {
      opacity: 1;
      transform: translateY(0);
   }
}

.announcement-banner {
   animation: banner-in 0.3s ease-out;
}