/* Base alert bar layout */
.alert-bar {
  width: 100%;
  color: #fff;
  padding: 8px 0;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  overflow: hidden;
  position: relative;
}

/* Color variations */
.alert-red {
  background: #d9534f;
}

.alert-yellow {
  background: #f0ad4e;
  color: #000 !important;
}

.alert-green {
  background: #5cb85c;
}

/* Scrolling Text */
.alert-text {
  display: inline-block;
  white-space: nowrap;
  animation: alertScroll 12s linear infinite;
}

@keyframes alertScroll {
  0% { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}

/* Hide bar */
.alert-hidden {
  display: none !important;
}