* {
  margin      : 0;
  padding     : 0;
  box-sizing  : border-box;
  font-family : "Quicksand", sans-serif;
  }
html {
  font-size : 62.5%;
  }
.container {
  width            : 100%;
  height           : 100vh;
  background-color : #12121f;
  color            : #eee;
  display          : flex;
  justify-content  : center;
  align-items      : center;
  }
.calendar {
  width            : 45rem;
  height           : 52rem;
  background-color : #222227;
  box-shadow       : 0 0.5rem 3rem #00000066;
  }
.month {
  width            : 100%;
  height           : 12rem;
  background-color : #167e56;
  display          : flex;
  justify-content  : space-between;
  align-items      : center;
  padding          : 0 2rem;
  text-align       : center;
  text-shadow      : 0 0.3rem 0.5rem #00000080;
  }
.month i {
  font-size : 2.5rem;
  cursor    : pointer;
  }
.month h1 {
  font-size      : 3rem;
  font-weight    : 400;
  text-transform : uppercase;
  letter-spacing : 0.2rem;
  margin-bottom  : 1rem;
  }
.month p {
  font-size : 1.6rem;
  }
.weekdays {
  width       : 100%;
  height      : 5rem;
  padding     : 0 0.4rem;
  display     : flex;
  align-items : center;
  }
.weekdays div {
  font-size       : 1.5rem;
  font-weight     : 400;
  letter-spacing  : 0.1rem;
  width           : calc(44.2rem / 7);
  display         : flex;
  justify-content : center;
  align-items     : center;
  text-shadow : 0 0.3rem 0.5rem #00000080;
  }
.days {
  width     : 100%;
  display   : flex;
  flex-wrap : wrap;
  padding   : 0.2rem;
  }
.days div {
  font-size       : 1.4rem;
  margin          : 0.3rem;
  width           : calc(40.2rem / 7);
  height          : 5rem;
  display         : flex;
  justify-content : center;
  align-items     : center;
  text-shadow     : 0 0.3rem 0.5rem #00000080;
  transition      : background-color 0.2s;
  }
.days div:hover:not(.today) {
  background-color : #262626;
  border           : 0.2rem solid #777;
  cursor           : pointer;
  }
.today {
  background-color : #167e56;
  }
/* --- --- --- 
.prev-date,
.next-date {
  opacity : 0.5;
  } 
--- --- --- */