body {
  font-family: Arial;
  margin: 30px;
  line-height: 175%;
}

p {
  text-align: justify;
}

h1 {
  text-align: left;
}

table {
  border:1px solid grey;
  width: 100%;
  text-align: center;
  border-collapse: collapse;
}

th {
  border: 1px solid grey;
  text-align: center;
  font-weight: 300;
  user-select:none;
  color: grey;
}

td {
  border: 1px solid grey;
  text-align: center;
  font-weight: 300;
  user-select:none;
  color: grey;
}

td:hover {
  background-color: lightgrey;
  color: grey;
}

.page {
  padding: 10px 30px 10px 30px;
}

.click {
  background-color: grey;
  color: white;
}

@media only screen and (min-width: 768px) {
  body {
    width: 45%;
    padding-left: 25%
  }
}

.FadeIn {
  animation: fadeIn 1s;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.title {
  margin: 15px auto 15px 15px;
  user-select: auto;
}

.description {
  margin: 3px auto 3px 15px;
  user-select: auto;
}

.titlebox {
  background-color: grey;
  color: white;
  user-select: text;
}

.descriptionbox {
  user-select: text;
}