.utevent-event__content {
  display: flex;
  margin-left: -3vw;
  margin-bottom: -2rem;
}
.utevent-event__content > * {
  margin: 0 0 2rem 3vw;
}

.utevent-event-field__item > p:last-of-type {
  margin-bottom:0;
}

.utevent-event-field--field-utevent-status .utevent-event-field__item {
  background-color: #333f48;
  border: 1px solid;
  color: #fff;
  display: inline-block;
  font-size: 1rem;
  font-style: italic;
  font-weight: 600;
  padding: 8px 10px;
}

.field--name-field-utevent-location .utevent-event-field__label::after {
  content: ":";
}
.utevent-event__content-secondary .field--name-field-utevent-location .utevent-event-field__label {
  display: block;
}

/* Styles used to visually hide status field when value is "scheduled" */
/** Based on core hidden.module.css */
.utevent-event-field__item--scheduled,
.utevent-event-field--status-scheduled {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  height: 1px;
  width: 1px;
  word-wrap: normal;
}
/** Based on core hidden.module.css */
.utevent-event-field__item--scheduled:active,
.utevent-event-field__item--scheduled:focus {
  position: static !important;
  clip: auto;
  overflow: visible;
  height: auto;
  width: auto;
}
.views-field-field-utevent-location .location-icon::after {
  content: '';
  margin-right: 5px;
  padding: 0 0.6em;
  vertical-align: middle;
  background-color: #9d4700;
  font-size: 20px;
  -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8, <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\"><title>location</title><path d=\"M16 0c-5.523 0-10 4.477-10 10 0 10 10 22 10 22s10-12 10-22c0-5.523-4.477-10-10-10zM16 16c-3.314 0-6-2.686-6-6s2.686-6 6-6 6 2.686 6 6-2.686 6-6 6z\"></path></svg>");
  mask-image: url("data:image/svg+xml;charset=UTF-8, <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\"><title>location</title><path d=\"M16 0c-5.523 0-10 4.477-10 10 0 10 10 22 10 22s10-12 10-22c0-5.523-4.477-10-10-10zM16 16c-3.314 0-6-2.686-6-6s2.686-6 6-6 6 2.686 6 6-2.686 6-6 6z\"></path></svg>");
  -webkit-mask-position: 0;
  mask-position: 0;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
}
.views-field-field-utevent-datetime .calendar-icon::after {
  content: '';
  margin-right: 5px;
  padding: 0 0.6em;
  vertical-align: middle;
  background-color: #9d4700;
  font-size: 20px;
  -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8, <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\"><title>calendar</title><path d=\"M10 12h4v4h-4zM16 12h4v4h-4zM22 12h4v4h-4zM4 24h4v4h-4zM10 24h4v4h-4zM16 24h4v4h-4zM10 18h4v4h-4zM16 18h4v4h-4zM22 18h4v4h-4zM4 18h4v4h-4zM26 0v2h-4v-2h-14v2h-4v-2h-4v32h30v-32h-4zM28 30h-26v-22h26v22z\"></path></svg>");
  mask-image: url("data:image/svg+xml;charset=UTF-8, <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\"><title>calendar</title><path d=\"M10 12h4v4h-4zM16 12h4v4h-4zM22 12h4v4h-4zM4 24h4v4h-4zM10 24h4v4h-4zM16 24h4v4h-4zM10 18h4v4h-4zM16 18h4v4h-4zM22 18h4v4h-4zM4 18h4v4h-4zM26 0v2h-4v-2h-14v2h-4v-2h-4v32h30v-32h-4zM28 30h-26v-22h26v22z\"></path></svg>");
  -webkit-mask-position: 0;
  mask-position: 0;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
}

/* Customized 'text button' style for modal trigger */
.utevent-event-field--field-utevent-datetime button,
.utevent-event-field--field-utevent-datetime button {
  color: #bf5700;
  display: inline-block;
  margin-left: 0.25rem;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  cursor: pointer;
  outline: inherit;
}

/** We must use !important here to override forty_acres' own !important
declaration on <button> HTML **/
.utevent-event-field--field-utevent-datetime button:hover,
.utevent-event-field--field-utevent-datetime button:focus {
  border: 0;
  color: #9d4700 !important;
  text-decoration: underline !important;
  background-color: inherit;
}
.utevent-event-field--field-utevent-datetime button:focus {
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.utevent-event-field--field-utevent-datetime button:focus-visible {
  outline: none;
  outline-offset: 3px;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.event-status--canceled .utevent-event-field button {
  display: none;
}