body  {
  font-family: normal;
  padding:5%;
  letter-spacing: 5px;
  background-image: url(Lumino.png);
  background-size: 650px;
  background-position: right;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

@keyframes hover {
  from{transform: translate(0%, 10%); } 
    50%{transform: translate(0%, 0%); }
    to{transform: translate(0%, 10%); }
}

@keyframes raise {
    from{transform: translate(0%, 0%); }
    to{transform: translate(0%, 10%); }
}

@keyframes lower {
    from{transform: translate(0%, 10%); }
    to{transform: translate(0%, 0%); }
}

.boxes {
  background-image: url('paper.png');
  background-size: 100%;
  background-blend-mode: multiply;
  width: 90%;
  margin:5%;
  padding: 2%;
  overflow: scroll;
  box-shadow: 3px 3px 10px grey;
  letter-spacing: 2px;
  font-size: 1.2rem;
}

h1 {
  font-family: head;
  font-size: 6rem;
}

#red {
  color: #522a31;
  background-color: #d9646c;
}
    
#orange {
  color: #916b49;
  background-color: #e6a132;
}

#yellow {
  color: #998956;
  background-color: #e0c15a;
}

#green {
  color: #445e58;
  background-color:#7cbf86;
}

#blue {
  color: #485569;
  background-color:#87d4d6;
}

#purple {
  color: #5b496e;
  background-color: #ba8cd4;
}