.clubs-background {
  background-image: url("../img/event-bg5.jpg");
  background-size: 100% auto;
  height: 100vh;
  width: 100%;
  padding-top: 80px;
  position: absolute;
  left: 0;
  top: 0; }

@media screen and (max-width: 1225px) {
  .clubs-background {
    background-size: auto 100%; } }
.event-container {
  padding: 3em; }

.event-list-title {
  color: white;
  font-family: 'Open Sans Condensed', sans-serif;
  font-weight: 800;
  font-size: 2em; }

.event-list-date {
  color: white;
  font-family: 'Open Sans Condensed', sans-serif;
  font-weight: 400;
  font-size: 2em; }

.event-date:hover, .event-title:hover {
  background-color: rgba(0, 0, 0, 0.5); }

.extraScroll {
  overflow-y: scroll;
  height: 73vh; }

ul {
  margin-bottom: 0; }

.form-control {
  color: white !important;
  font-family: 'Open Sans Condensed', sans-serif;
  font-weight: 400; }

.list-of-events {
  padding-bottom: 1em;
  padding-right: 1em;
  margin-top: 2em;
  margin-bottom: 2em; }

.event-grid {
  width: 100%;
  position: relative;
  -webkit-filter: grayscale(50%); }

.event-grid:hover {
  -webkit-filter: grayscale(0%) brightness(20%); }

.event-list-title {
  position: absolute !important;
  font-size: 3em;
  padding: 15px;
  bottom: 0;
  z-index: 100; }

.event-list-date {
  position: absolute !important;
  padding: 15px;
  bottom: 50px;
  z-index: 100; }

.search-for-club {
  color: white;
  font-size: 2em;
  padding: 0.3em;
  text-decoration: none;
  font-family: 'Open Sans', sans-serif; }

.event-grids {
  margin-bottom: 10px; }

.clubs-container {
  position: relative;
  margin-top: 20px; }

/*# sourceMappingURL=event.css.map */
.ng-enter {
  transition:0.5s linear all;
  opacity:0;
}

/* The finishing CSS styles for the enter animation */
.ng-enter.ng-enter-active {
  opacity:1;
}