table.calendar {
  border-left: #e0e0e0 1px solid;
  border-right: #e0e0e0 1px solid;
  width: 100%;
}

/* Settings for the control menu */
table.calendar-control {
  width: 100%;
  text-align: center;
}
/* This changes the select month and select year drop down menus */

.event {
  clear: both;
  display: block;
  font-size: 12px;
  border-radius: 4px;
  padding: 5px;
  margin-bottom: 5px;
  line-height: 14px;
  background: #e4f2f2;
  border: 1px solid #e0e0e0;
  color: #009aaf;
  text-decoration: none;
  position: relative;
}
.event-monogram{
  position: absolute;
  top: 5px;
  border: 1px solid #aaaaaa;
  padding:3px;
  border-radius: 3px;
  background-color: white;
  left: 3px;
}
.event-monogram-container{
  padding-left: 18px !important;
}

div.calendar-day-number a {
  color:#2196f3;
}

.sub-header {
  font-size: 12px;
}

.phone {
  background: #f2eee3;
  color: #ad8200;
}

.personal {
  background: 	#e3f2f2;
  color: #00adad;
}

.other {
  background: #e3eef2;
  color: #2196f3;
}

.past {
  background: #f2e3e3;
  color: #ad0000;
}

.resolved {
  background: #e3f2e3;
  color: #57ad00;
}

td.calendar-day, td.calendar-weekend-day, td.calendar-current-day {
  height:250px;
  font-size:12px;
  position:relative;
  vertical-align: top;
  line-height: 10px; /* This determins the space that will  space out the events on the calendar */
}
* html div.calendar-day, div.calendar-weekend-day, div.calendar-current-day {
  height:250px;
}

/* This alters the headings (the days of the week) Change the colour and background for those here */
td.calendar-day-head {
  height: 10px;
  color: #ffffff;
  background-color: #2196f3;
  border-color: #2196f3;
  text-transform: uppercase;
  font-weight:bold;
  text-align:center;
  width:125px;
  padding:25px;
}

td.calendar-weekend-day {
  background-color: #f5f5f5;
}
td.calendar-current-day .calendar-day-number {
  background-color: #2196f3;
  border-radius: 18px;
}

td.calendar-current-day .calendar-day-number a {
  color: white;
}
/* These colours are for the mouse over effects on the calendar */
td.calendar-day:hover {
  background:#f5f5f5;
}
td.calendar-weekend-day:hover {
  background:#f5f5f5;
}
td.calendar-current-day:hover {
  background:#f5f5f5; 
}
/* background colour of the blank dates */
td.calendar-day-np {
  background:#f5f5f5;
  min-height:100px;
}
* html div.calendar-day-np {
  height:100px; }
/* This alters the number dates of the calendar */
div.calendar-day-number {
  position: relative;
  padding: 3px;
  color:#000;
  font-weight:bold;
  float:right;
  margin: 3px;
  width: 21px;
  text-align: center;
  line-height: normal;
  font-size: 12px;
}

div.calendar-day-number a:hover {
  text-decoration: none;
}

div.calendar-text a, div.event a:hover {
  color: #666666;
  text-decoration: none;
}
/* This alters the text section for events on the calendar. */
div.calendar-text {
  color:white;  
  margin-bottom: 2px;  
}

div.calendar-text .badge {
  padding-left: 3px;
  padding-right: 3px;
}

/* shared */
td.calendar-day,td.calendar-current-day, td.calendar-weekend-day, td.calendar-day-np {
  width:120px;
  padding:5px;
  border-bottom: #e0e0e0 1px solid;
  border-right: #e0e0e0 1px solid;
}

.event-date-icon {
  margin-left: 3px;
}

.calendar-pager a {
  color: black;
}

@media print {
  .navbar, #header, #footer, .calendar-pager {
    display: none;
  }
}