react-schedule.css

body {
  background-color: grey;
}

.schedule {
  display: table;
  position: relative;
}

.schedule-row {
  display: table-row;
}

/* Size Calcs: (Embed in component later)
  height: 12(units) * 3(scale) - 2(border) = 34px;
  width: 24(units) * 3(scale) - 2(border) = 70px;
  timeWidth: 18(units) * 3(scale) - 2(border) = 52px;
  headHeight: 12(units) * 3(scale) - 2(border) = 34px;
*/

.schedule-cell {
  display: table-cell;
  border: solid white 1px;
  height: 34px;
  min-height: 34px;
  min-width: 70px;
  width: 70px;
  background: linear-gradient(to bottom, #E7F7FE 50%, #E7F7FE 50%, #C1D7F1 50%);
}
/* Subtracting 2 to account for border on each side */
.schedule-head {
  height: 34px;
  min-height: 34px;
  background-color: #425872;
  border: solid white 1px;
  display: table-cell;
}
.schedule-time {
  width: 52px;
  min-width: 52px;
  background-color: #425872;
  border: solid white 1px;
  display: table-cell;
  font-size: 12px;
}

.entry-block {
  width: 70px;
  position: absolute;
  font-size: 12px;
}