main.css

body{
  background-image: url(../images/dot-grid.png);
  background-repeat: repeat-y repeat-x;
  background-attachment: fixed;
   background: linear-gradient(168deg, #08023a 10%,#068A5E, #0fb7dd 85%); 
}

#content{
  padding-top: 1.5em;
  padding-bottom: 4em;
 background-color: white;
  /* background: linear-gradient(168deg, #08023a 10%, #068A5E, #0fb7dd 85%); */
}

/* Color Boards */
.grid-container{
  display: grid;
  grid-template-columns: repeat(7, 3em);
  border:black;
}
#gridContainerLabel{
  display: grid;
  grid-template-columns: repeat(13, 1.5em); /*(13,2em)*/
  border:black;
}
.grid-label{
  grid-column: span 4;
  margin-right: 6px;
  margin-top: 2px;
  text-align: center;
  margin-bottom: 0.3em;
  border: black;
}
.grid-item{
  margin-right: 2px;
  margin-top: 2px;
  /* border: px solid rgba(46, 148, 31, 0); */
  text-align: center;
  border-radius: 10%;
  cursor: pointer;
  border:1px solid black;
}
.grid-item-today{
  margin-right: 2px;
  margin-top: 2px;
  border: 2px solid rgb(24, 144, 86);
  text-align: center;
  border-radius: 10%;
  cursor: pointer;
}

/* moodArray = ['Very though', 'Difficult', 'Average', 'Great','Amazing'] */
.moodType-5{
  background-color: #8e73c8;
  border: 1px solid #292833;
}
.moodType-4{
  background-color: #bae8e8;
}
.moodType-3{
  background-color: #37c2c2;
}
.moodType-2{
  background-color: #374376;
}
.moodType-1{
  background-color: #38373c;
}



/* Table */