body {
  margin: 0;
  font-family: 'Ubuntu', sans-serif;
  font-size: 1vw;
}
header {
  text-align: center;
}
header>h1 {
  color: OrangeRed;
  font-size: 2.6vw;
}
header>h2 {
  font-size: 2vw;
}

table#key {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2vw;
}
table#key td {
  margin: 0;
  box-sizing: border-box;
  border: 1px solid #ccc;
  width: 7vw;
  height: 4vw;
  text-align: center;
  vertical-align: middle;
}
table {
  border-collapse: collapse;
}
table#cal, table#cal>tr {
  width: 100%;
}
table#cal td {
  box-sizing: border-box;
  border: 1px solid #ccc;
  width: 13vw;
  height: 12vw;
  text-align: right;
  padding-right: 1vw;
  vertical-align: top;
  padding-top: 1vw;
  background-size: 10vw 10vw;
  background-repeat:no-repeat;
  background-position-x: 1.1vw;
  background-position-y: 1vw;
}
table#cal th {
  box-sizing: border-box;
  border: 1px solid #ccc;
}
table#cal tr#colheadings th {
  height: 5vw;
  background-color: #CCC;
}
table#cal th#blank {
  width: 5vw;
  height: 5vw;
  background-color: white;
  border-right: 1px solid #ccc;
}
[rowspan], .rotated {
  margin: 0;
  padding: 0;
  width: 5vw;
  background-color: OrangeRed;
}
[rowspan]>p, table#cal th.rotated>p {
  display: inline-block;
  margin: 0;
  padding: 0;
  transform: rotate(-90deg);
  color: white;
  white-space: nowrap;
  overflow: visible;
  font-weight: bold;
  font-size: 1.4vw;
}
table#cal td.end {
  border-bottom: 3px solid black;
}
table#cal td.last {
  border-bottom: 3px solid black;
  border-right: 3px solid black;
}
table#cal td.start {
  border-top: 3px solid black;
}
table#cal td span {
  position: absolute;
  color: #000;
  background-color: #FFF;
  margin-left: -9vw;
  margin-top: 3vw;
  padding: 1vw;
  border-radius: 3vw;
  opacity: 0.5;
}
.unit1 {
  background-color: Gold;
}
.unit2 {
  background-color: Tomato;
}
.unit3 {
  background-color: LimeGreen;
}
.unit4 {
  background-color: Chocolate;
}
/*
.chap5 {
  background-color: Aqua;
}
.chap6 {
  background-color: Yellow;
}
.chap7 {
  background-color: DarkOrchid;
}
.chap8 {
  background-color: RoyalBlue;
}
.chap9 {
  background-color: HotPink;
}
.chap10 {
  background-color: Orange;
}
.chap11 {
  background-color: Red;
}
.review {
  background-color: SkyBlue;
}
.exam {
  background-color: Silver;
}
*/
.project {
  background-color: Green;
}
footer {
  font-size: 1.6vw;
  background: #DDD;
  text-align: center;
}
footer>p {
  margin: 0;
  padding: 0.8vw;
}
footer>p>a, footer>p>a:visited {
  text-decoration: none;
  color: purple;
}