div#announcementCarousel {
    border: 1px solid #DBDBDB;
    border-radius: 12px;
}
.announcement-banner{
  margin-top: 1.5rem;
}
.announcementDescription,.anncoucementSender,.announcementdate > span,.acknowledgement-message,.announcementdate > i{
    color: rgba(112, 112, 112, 1);
  }
.announcementContainer > div > div> span.highimportance-pill,.announcementdate,.requiresacknowledgement {
     margin: 0.75rem;
}
.anncoucementSender{
  margin-left:0.75rem;
  margin-bottom:0.75rem;
  margin-top:0.75rem;
}
.requiresacknowledgement > div > span { 
  font-weight: 600; 
  font-size: 18px; 
  line-height: 100%;
  letter-spacing: 0%;
  margin-left: 1rem;
  margin-left: 1rem;

}
 .announcement-indicators [data-bs-target] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: #ccc; /* inactive = gray */
    }    
 

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236c757d'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236c757d'%3e%3cpath d='M11.354 1.646a.5.5 0 0 0-.708 0L4.646 7.646a.5.5 0 0 0 0 .708l6 6a.5.5 0 0 0 .708-.708L5.707 8l5.647-5.646a.5.5 0 0 0 0-.708z'/%3e%3c/svg%3e");
}
 
  
.announcement-indicators .active {
  background-color: #000; /* active = black */
}
.requiresacknowledgement > div{
   background: rgba(248, 230, 230, 1);
}
.announcementHeader{ 
    font-weight: 600;
    font-style: SemiBold;
    font-size: 21px; 
    line-height: 100%;
    letter-spacing: 0%;
    padding: 0rem 0.75rem;
    padding-bottom: 0.75rem;
} 
.announcementDescription,.anncoucementSender{
    padding: 0rem 0.75rem;
}
 .carousel-item {  
   min-height: 140px;
 }
 .carousel-indicators{
        bottom: -50px;
 }
 .carousel-control-next {
    right: -50px;
    justify-content: right;
    width: 4%;
}
.carousel-control-prev {
    left: -50px;
     justify-content: left;
     width: 4%;
}
.requiresacknowledgement {
  opacity: 1;  
  transition: opacity 0.5s ease-out;
}

.requiresacknowledgement.hide {
  opacity: 0;
  pointer-events: none; /*prevent clicks while fading */
}
.requiresacknowledgement > .well{
  margin-bottom: unset;
border-radius: 0.75rem;
}
 
/* Base snackbar container */
.snackbar {
  visibility: hidden;
  min-width: 250px;
  max-width: 400px;
  background-color: #333; /* dark background */
  color: #fff;
  text-align: left;
  border-radius: 4px;
  padding: 14px 16px;
  position: fixed;
  left: 50%;
  bottom: 30px;
  transform: translateX(-50%);
  z-index: 9999;
  font-size: 16px;

  /* keep progress bar inside bottom */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.acknowledge-btn{
background-color:rgba(214, 67, 9, 1);
}

.snackbar.show {
  visibility: visible;
  animation: fadein 0.3s, fadeout 0.3s 3.2s;
}

.snackbar span {
  margin-bottom: 6px;
}

.snackbar-progress {
  position: absolute;
  left: 0;
  bottom: 0;       /* stick to bottom of snackbar */
  height: 4px;
  width: 0%;
  border-radius: 0 0 4px 4px; /* rounded only at bottom corners */
  transition: width 3s linear;
}
.announcement-bullhorn-icon{
   margin-top: 0.75rem;
    margin-left: 0.75rem;
     margin-right: 0.75rem;
}

.announcementContainer {
  cursor: pointer;
}

.announcementContainer .requiresacknowledgement {
  cursor: default; /* keep normal cursor on acknowledgement section */
}

.announcementDescription {
  display: -webkit-box;
   -webkit-line-clamp: 2; /* only 2 lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
   position: relative;
  padding-right: 7rem; /* reserve space for Read more */
}
 
.announcementDescription .read-more { 
  cursor: pointer;
  position: absolute;
  right: 2rem;
  bottom: 0;
  color: #1a73e8;  
  white-space: nowrap;
}
.carousel-control-next.disabled ,.carousel-control-prev.disabled ,.carousel-control-next.disabled > .carousel-control-next-icon,.carousel-control-prev.disabled > .carousel-control-prev-icon{
  cursor:default;
}
/* When button has disabled class */
.carousel-control-prev.disabled .carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23d3d3d3'%3e%3cpath d='M11.354 1.646a.5.5 0 0 0-.708 0L4.646 7.646a.5.5 0 0 0 0 .708l6 6a.5.5 0 0 0 .708-.708L5.707 8l5.647-5.646a.5.5 0 0 0 0-.708z'/%3e%3c/svg%3e");
}
.carousel-control-next.disabled .carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23d3d3d3'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.carousel-control-prev.disabled:hover .carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23d3d3d3'%3e%3cpath d='M11.354 1.646a.5.5 0 0 0-.708 0L4.646 7.646a.5.5 0 0 0 0 .708l6 6a.5.5 0 0 0 .708-.708L5.707 8l5.647-5.646a.5.5 0 0 0 0-.708z'/%3e%3c/svg%3e");
}
.carousel-control-next.disabled:hover > .carousel-control-next-icon{
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23d3d3d3'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"
);
}

@keyframes fadein {
  from { bottom: 0; opacity: 0; }
  to   { bottom: 30px; opacity: 1; }
}

@keyframes fadeout {
  from { bottom: 30px; opacity: 1; }
  to   { bottom: 0; opacity: 0; }
}
@media only screen and (min-width: 768px) and (max-device-width: 1366px) {
  .carousel-control-prev {
    left: -35px;
  }
  .carousel-control-next {
    right: -35px;
  }
}
@media (max-width: 576px) {
  .acknowledge-btn{
    width: 100%;
  }
  .requiresacknowledgement.show > .well{
    text-align: center;
  }
  .acknowledgement-message{
    /* text-align: left; */
    display: none;
  }
  .announcement-banner{
    padding: 0rem 1rem;
  }
.carousel-control-prev{
    left: -33px; 
    width: 15%;
}
.carousel-control-next{
   right: -33px; 
    width: 15%;
}
.announcementDescription {
    font-size: 1rem;
    -webkit-line-clamp: 2;  
  }

  .announcementDescription {
    padding-right: 0.75rem; /* remove reserved space */ 
        word-break: break-word;
  }

  .announcementDescription .read-more {
    position: static; /* inline with text */
    display: inline;   
    /* margin-left: 0.3em;   */
  }
.requiresacknowledgement > .well i {
  margin-left: unset !important;
}
.requiresacknowledgement > .well span {
 font-size: 17px;
}
.acknowledgement-button {
  text-align: center;
          margin-top: 0.75rem;
}
}