@charset "UTF-8";

.alert-row {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
}

.alert-row .one {
  -webkit-flex-basis: 60%;
  flex-basis: 60%;
}

.alert-row .two {
  -webkit-flex-basis: 40%;
  flex-basis: 40%;
  text-align: right;
}

div[class*="light"] .alert-link {
  font-weight: 600;
  color: #0D4486;
}

div[class*="light"] .alert-link:hover {
  color: #1088b8;
}

div[class*="dark"] .alert-link {
  font-weight: 700;
  color: #fff;
}

div[class*="dark"] .alert-link:hover {
  color: rgba(255, 255, 255, 0.5);
}

.alert-large {
  padding-top: 25px;
  padding-left: 60px;
  width: 100%;
  padding-right: 36px;
  padding-bottom: 24px;
  border-left: 5px solid;
}

.alert-large:before {
  font-family: "SCCXAICONS";
  font-style: normal;
  /*   content: ""; */
  font-size: 30px;
  position: absolute;
  margin: -9px -45px;
}

.alert-large h1 {
  line-height: 62px;
}

.alert-large h2 {
  line-height: 52px;
}

.alert-large h3 {
  line-height: 44px;
}

.alert-large h4 {
  line-height: 36px;
}

.alert-large h5 {
  line-height: 28px;
}

.alert-large p {
  line-height: 24px;
  font-size: 16px;
  padding-top: 13px;
}

.alert-large hr {
  margin-top: 21px;
  margin-bottom: 21px;
}

.alert-large a.btn {
  min-width: 155px;
}

.alert-large .alert-link {
  font-size: 16px;
}

.alert-dark-success .alert-row li,
.alert-dark-error .alert-row li,
.alert-dark-neutral .alert-row li,
.alert-dark-warning .alert-row li {
  color: white;
  font-size: 16px;
}

.alert-dark-success hr,
.alert-dark-error hr,
.alert-dark-neutral hr,
.alert-dark-warning hr {
  border: 1px solid rgba(255, 255, 255, 0.3);
}

.alert-light-success:before,
.alert-dark-success:before {
  content: "";
}

.alert-light-error:before,
.alert-dark-error:before {
  content: "";
}

.alert-light-neutral:before,
.alert-dark-neutral:before {
  content: "";
}

.alert-light-warning:before,
.alert-dark-warning:before {
  content: "";
}

.alert-light-success {
  color: #08a863;
  background-color: rgba(8, 168, 99, 0.15);
  border-color: rgba(8, 168, 99, 0.6);
}

.alert-light-success:before {
  color: #08a863;
}

.alert-light-success hr {
  opacity: 0.3;
  border: 1px solid #08a863;
}

.alert-light-success h1,
.alert-light-success h2,
.alert-light-success h3,
.alert-light-success h4,
.alert-light-success h5,
.alert-light-success p {
  color: #08a863 !important;
}

.alert-light-success ul li, .alert-light-success ol li {
  color: #08a863 !important;
}

.alert-light-error {
  color: #a80013;
  background-color: rgba(168, 0, 19, 0.15);
  border-color: rgba(168, 0, 19, 0.6);
}

.alert-light-error hr {
  opacity: 0.3;
  border: 1px solid #a80013;
}

.alert-light-error h1,
.alert-light-error h2,
.alert-light-error h3,
.alert-light-error h4,
.alert-light-error h5,
.alert-light-error p {
  color: #a80013 !important;
}

.alert-light-error ul li, .alert-light-error ol li {
  color: #a80013 !important;
}

.alert-light-neutral {
  color: #0080b3;
  background-color: rgba(0, 128, 179, 0.15);
  border-color: rgba(0, 128, 179, 0.6);
}

.alert-light-neutral hr {
  opacity: 0.3;
  border: 1px solid #0080b3;
}

.alert-light-neutral h1,
.alert-light-neutral h2,
.alert-light-neutral h3,
.alert-light-neutral h4,
.alert-light-neutral h5,
.alert-light-neutral p {
  color: #0080b3 !important;
}

.alert-light-neutral ul li, .alert-light-neutral ol li {
  color: #0080b3 !important;
}

.alert-light-warning {
  color: #e5a84f;
  background-color: rgba(229, 168, 79, 0.15);
  border-color: rgba(229, 168, 79, 0.6);
}

.alert-light-warning hr {
  opacity: 0.3;
  border: 1px solid #e5a84f;
}

.alert-light-warning h1,
.alert-light-warning h2,
.alert-light-warning h3,
.alert-light-warning h4,
.alert-light-warning h5,
.alert-light-warning p {
  color: #e5a84f !important;
}

.alert-light-warning ul li, .alert-light-warning ol li {
  color: #e5a84f !important;
}

.alert-dark-success {
  color: #b4fdde;
  background-color: #08a863;
  border-color: rgba(8, 168, 99, 0.6);
}

.alert-dark-error {
  color: #f4c5cb;
  background-color: #a80013;
  border-color: rgba(168, 0, 19, 0.6);
}

.alert-dark-neutral {
  color: #d2ecf7;
  background-color: #0080b3;
  border-color: rgba(0, 128, 179, 0.6);
}

.alert-dark-warning {
  color: #ffeed5;
  background-color: #e5a84f;
  border-color: rgba(229, 168, 79, 0.6);
}

.alert-dark-success h1,
.alert-dark-success h2,
.alert-dark-success h3,
.alert-dark-success h4,
.alert-dark-success h5,
.alert-dark-success p,
.alert-dark-error h1,
.alert-dark-error h2,
.alert-dark-error h3,
.alert-dark-error h4,
.alert-dark-error h5,
.alert-dark-error p,
.alert-dark-neutral h1,
.alert-dark-neutral h2,
.alert-dark-neutral h3,
.alert-dark-neutral h4,
.alert-dark-neutral h5,
.alert-dark-neutral p,
.alert-dark-warning h1,
.alert-dark-warning h2,
.alert-dark-warning h3,
.alert-dark-warning h4,
.alert-dark-warning h5,
.alert-dark-warning p {
  color: white !important;
}

.alert-small {
  padding-top: 12px;
  padding-left: 44px;
  width: 100%;
  padding-right: 12px;
  padding-bottom: 12px;
  border-left: 2px solid;
}

.alert-small:before {
  font-family: "SCCXAICONS";
  font-style: normal;
  font-size: 20px;
  position: absolute;
  margin: -4px -35px;
}

@media (max-width: 575px) {
  .alert-small {
    padding-left: 36px;
    padding-right: 8px;
  }
  .alert-small:before {
    font-size: 16px;
    margin: -4px -28px;
  }
  .alert-large {
    padding-left: 48px;
    padding-right: 20px;
  }
  .alert-large h1 {
    font-size: 48px;
    line-height: 50px;
  }
  .alert-large h2 {
    font-size: 30px;
    line-height: 40px;
  }
  .alert-large h3 {
    font-size: 26px;
    line-height: 36px;
  }
  .alert-large h4 {
    font-size: 22px;
    line-height: 28px;
  }
  .alert-large h5 {
    font-size: 18px;
    line-height: 24px;
  }
  .alert-large p {
    line-height: 20px;
    font-size: 1 14px;
    padding-top: 20px;
  }
  .alert-row .one {
    -webkit-flex-basis: 100%;
    flex-basis: 100%;
    -webkit-flex-grow: 4;
    flex-grow: 4;
  }
  .alert-row .two {
    display: none;
    -webkit-flex-basis: 0%;
    flex-basis: 0%;
  }
}
