.date-info.pinkservice {
  background-color: #f0abff
}

.date-info.pinkservice:after {
  content: "TT1"
}

.date-info.greenservice {
  background-color: #9cce78
}

.date-info.greenservice:after {
  content: "TT2"
}

.date-info.purpleservice {
  background-color: #af6db9
}

.date-info.purpleservice:after {
  content: "TT3"
}

.date-info.revisedservice {
  background-color: #4c829e
}

.date-info.revisedservice:after {
  content: "TT4"
}

.date-info.blueservice {
  background-color: #4c829e
}

.date-info.blueservice:after {
  content: "TT4"
}

.date-info.specialevent {
  background-color: #bf2837
}

.date-info.specialevent:after {
  content: "TT5"
}

.date-info.santaspecials {
  background-color: #df8423
}

.date-info.santaspecials:after {
  content: "TT6"
}

.date-info.orangeservice {
  background-color: #df8423
}

.date-info.orangeservice:after {
  content: "TT6"
}

.date-info.yellowservice {
  background-color: #e5c425
}

.date-info.yellowservice:after {
  content: "TT7"
}

.date-info.noservice {
  background-color: #666
}

.date-info:after {
  position: absolute;
  bottom: 2px;
  left: 10px;
  font-size: 14px;
  letter-spacing: 1px
}

@media only screen and (max-width: 500px) {
  .date-info:after {
    font-size: 9px;
    left: 4px;
  }
}