#calendar {
  width: 100%;
}

#calendar a {
  color: #333;
  text-decoration: none;
  line-height:1.4;
  font-weight:bold;
}

#calendar ul {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
  display: flex;
}

#calendar li {
  display: block;
  float: left;
  xwidth: 14.342%;
  padding: 5px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  margin-right: -1px;
  margin-bottom: -1px;
  flex-basis: 14.342%;
  flex-grow: 1;
}

#calendar ul.weekdays {
  height: 40px;
  background: #ce495a;
}

#calendar ul.weekdays li {
  text-align: center;
  text-transform: uppercase;
  line-height: 20px;
  border: none !important;
  padding: 10px 6px;
  color: #fff;
  font-size: 13px;
}

#calendar .days li {
  min-height: 160px;
}

#calendar .days li:hover {
  xbackground: #d3d3d3;
}



#calendar .date {
  text-align: center;
  margin-bottom: 5px;
  padding: 4px;
  background: #333;
  color: #fff;
  width: 38px;
  border-radius: 50%;
  float: right;
}

#calendar .event {
  clear: both;
  display: block;
  font-size: medium;
  xborder-radius: 4px;
  xpadding: 5px;
  xmargin-top: 40px;
  margin-bottom: 5px;
  line-height: 14px;
  background: #fff;
  xborder: 1px solid #ffbab3;
  color: #009aaf;
  text-decoration: none;
}

#calendar .event-desc {
  border-radius: 4px;
  border: 1px solid #ffbab3;
  color: #666;
  padding: 7px;
  text-decoration: none;
  margin-bottom:2em;
}

#calendar .event-desc:hover {
	background-color:lightpink;
}

#calendar .event-time {
  display:none;
}

#calendar .other-month {
  background: #f5f5f5;
  color: #666;
}

/* ============================
				Mobile Responsiveness
   ============================*/
@media (max-width: 768px) {
	#calendar .weekdays, #calendar .other-month {
	display: none;
	}
	
	#calendar ul {
	display: inline;
	}
	
	#calendar li {
	height: auto !important;
	border: 1px solid #ededed;
	width: 100%;
	padding: 10px;
	margin-bottom: -1px;
	}
	
	#calendar .days li {
	  min-height: auto;
	}
	
	#calendar .date {
	float: none;
	}
	
	#calendar .hideifsmallscreen {
	display: none;
	}
	
	#calendar .event-time {
	display: block;
	}


}