/* Mixins for reusable styles */
/****** To use these, call the element within the less stylesheet like this:

.parentElement {
  .angled-element();
  /* Add others styles as usual 
  background-color: #000;
}

******/
.feature-card-mixin {
  border: 2px solid #000;
  border-radius: 5px;
  background-color: #fff;
  padding: 0;
}
.feature-card-mixin .field--name-body {
  padding: 7px;
}
html body .wrapper-alert {
  background: #fed502;
}
@media screen and (max-width: 1024px) {
  html body .wrapper-alert {
    max-height: initial;
  }
}
html body .wrapper-alert .container {
  width: 100%;
}
html body .wrapper-alert .container #block-alertbanner,
html body .wrapper-alert .container #block-views-block-alerts-block-1 {
  background: #fed502;
  padding: 0 20px 0 10px;
}
html body .wrapper-alert .container #block-alertbanner .field--name-body,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .field--name-body,
html body .wrapper-alert .container #block-alertbanner .views-row,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .views-row {
  width: 100%;
  margin: 20px auto;
  position: relative;
}
@media screen and (max-width: 991px) {
  html body .wrapper-alert .container #block-alertbanner .field--name-body,
  html body .wrapper-alert .container #block-views-block-alerts-block-1 .field--name-body,
  html body .wrapper-alert .container #block-alertbanner .views-row,
  html body .wrapper-alert .container #block-views-block-alerts-block-1 .views-row {
    padding: 0 20px;
  }
}
html body .wrapper-alert .container #block-alertbanner .field--name-body h2,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .field--name-body h2,
html body .wrapper-alert .container #block-alertbanner .views-row h2,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .views-row h2 {
  position: relative;
  color: #4d4d4d !important;
  font-family: 'Roboto Slab', serif;
  font-weight: bold;
  font-size: 2.16rem;
  line-height: 1.1;
  clear: both;
  padding: 0;
  margin: 0 0 10px 0;
}
html body .wrapper-alert .container #block-alertbanner .field--name-body h2:after,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .field--name-body h2:after,
html body .wrapper-alert .container #block-alertbanner .views-row h2:after,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .views-row h2:after {
  display: none;
}
html body .wrapper-alert .container #block-alertbanner .field--name-body p,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .field--name-body p,
html body .wrapper-alert .container #block-alertbanner .views-row p,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .views-row p {
  color: #4d4d4d;
  font-size: 1.6rem;
}
html body .wrapper-alert .container #block-alertbanner .field--name-body p a,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .field--name-body p a,
html body .wrapper-alert .container #block-alertbanner .views-row p a,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .views-row p a {
  color: #0071BC;
  text-decoration: none;
}
html body .wrapper-alert .container #block-alertbanner .field--name-body p a:hover,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .field--name-body p a:hover,
html body .wrapper-alert .container #block-alertbanner .views-row p a:hover,
html body .wrapper-alert .container #block-views-block-alerts-block-1 .views-row p a:hover {
  color: #000;
}
html body .wrapper-alert .container #block-notificationblock {
  background: #FDF7ED;
  padding: 19px 10px 8px 0;
  border-bottom: 4pt solid #F0AD4E;
}
html body .wrapper-alert .container #block-notificationblock .field--name-body {
  max-width: 1260px;
  width: 100%;
}
html body .wrapper-alert .container #block-notificationblock .field--name-body h2 {
  position: relative;
  color: #575757;
  font-size: 2.1em;
  line-height: 1.1;
  font-weight: bold;
  padding: 0px;
  margin: 10px;
  clear: both;
}
html body .wrapper-alert .container #block-notificationblock .field--name-body h2:before {
  position: absolute;
  top: 2px;
  left: 10px;
  content: "\f06a";
  font-family: 'Font Awesome 5 Pro';
  color: #F0AD4E;
  font-size: 1.9em;
}
html body .wrapper-alert .container #block-notificationblock .field--name-body h2:after {
  display: none;
}
html body .wrapper-alert .container #block-notificationblock .field--name-body p {
  color: #575757;
  line-height: 1.5;
  font-size: 1.6rem;
}
html body .wrapper-alert .container #block-notificationblock .field--name-body p a {
  color: #1755A5;
  text-decoration: none;
}
html body .wrapper-alert .container #block-notificationblock .field--name-body p a:hover {
  color: #1969d0;
}
