.event,
.announcement {
  width: 320px;
  max-width: 450px;
  flex-grow: 1;
  margin: .2em;
  background-color: #202020;
  max-height: 400px;
  overflow: hidden;

  a:hover {
    text-decoration: none;
    .title {
      border-bottom: 1px solid #888;
      color: white;
    }
  }

  .title {
    margin-left: 1rem;
    margin-top: 1rem;
    margin-right: 1rem;
    border-bottom: 1px solid #333;
    transition: border-color .5s;
    font-size: 1.2em;
    max-height: 3em;
    overflow: hidden;
    color: #fea;
  }

  .card-footer {
    max-height: 4.5em;
    overflow: hidden;
    padding: .25rem 0.5rem;
    line-height: 1.8rem;
    min-height: 2.2rem;
  }

  .card-body {
    overflow: hidden;
  }

  .description {
    color: #999;
    font-size: 0.8em;
    overflow: hidden;
    max-height: 100%;
  }

  .el-image { width: 100% }
  img {
    width: 100%;
    max-height: 250px;
    object-fit: cover;
    object-position: top;
  }
}