@import url(http://fonts.googleapis.com/css?family=Lobster);
@import url(http://fonts.googleapis.com/css?family=Oswald);
@import url(http://fonts.googleapis.com/css?family=Helvetica);

body {
  background: #0E97A7;
  font-family: "Helvetica";
}

.event-calendar {
  font-size: 14px;
  overflow: hidden;
  white-space: nowrap;
}

.head {
  margin-bottom: -3.2em
}

.top-line {
  font-family: Lobster;
  font-weight: 400;
  font-size: 20px;
  text-transform: capitalize;
  text-shadow: 3px 3px #6D4C41;
  color: #6A440F
}

.spacer {
  border-bottom: 1px solid #e5e5e5
}

.event-list {
  display: block;
  border-right: 1px solid #e5e5e5
}

.event {
  text-decoration: none
}

.event:nth-child(3n+1) .event-container {
  border-left-color: #F44336
}

.event:nth-child(3n) .event-container {
  border-left-color: #F44336
}

.event:nth-child(3n-1) .event-container {
  border-left-color: #F44336
}

.event-container {
  color: #ababab;
  transition: all .2s ease;
  background: #fdf8e4;
  border-left: 3px solid;
  padding-top: 10px;
  padding-bottom: 15px
}

.event-container:hover {
  border-left-width: 7px;
  background: #ECEFF1
}

.date-container {
  display: inline-block;
  width: 2.3em;
  padding-left: 13px;
  padding-right: 8px;
  padding-bottom: 2px;
  margin-right: 6px;
  font-family: Oswald;
  font-weight: 700;
  color: #6A440F
}

.date {
  font-size: 2.2em
}

.month {
  display: block;
  font-size: .4em;
  font-weight: 400;
  margin-top: -.8em;
  text-transform: uppercase
}

.detail-container {
  display: inline-block;
  vertical-align: top;
  padding-top: 3px;
  margin-left: 13px
}

.title {
  text-transform: uppercase;
  font-family: Oswald;
  font-weight: 400;
  font-size: 1.4em;
  color: #6A440F
}

.description {
  display: block;
  font-size: 1.2em;
  color: #0E97A7;
  font-family: Helvetica; 
}