body {
  background: linear-gradient(to right, #333, #000);
  color: #FFF;
  margin: 0;
}
h1 {
  font-family: "Times New Roman", Times, serif;
  font-weight: bold;
  font-size: 50px;
  text-align: center;
  margin: 35px 0px 20px;
}
p {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 20px;
  margin: 20px 30px;
}
a {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 20px;
}
table {
  width: -webkit-fill-available;
  margin: 0px 50px;
}
table, th, td {
  border-collapse: collapse;
}
th, td {
  font-family: Arial, Helvetica, sans-serif;
  padding: 4px;
}
div {
  margin: 0;
  padding: 10px 0px;
}

.first_h1 {
  margin: 20px 0px;
}

/* Starts the color indicating for each group of word */
/* I will make space for each class for understand this logic */
.Pronouns {
  background: linear-gradient(to right, #000, #300);
  color: #F00;
}
.Pronouns table, .Pronouns th, .Pronouns td {
  border: 2px solid red;
}

.Articles {
  background: linear-gradient(to right, #330, #000);
  color: #FF0;
}
.Articles table, .Articles th, .Articles td {
  border: 2px solid yellow;
}

.Verbs {
  background: linear-gradient(to right, #000, #030);
  color: #0F0;
}
.Verbs table, .Verbs th, .Verbs td {
  border: 2px solid lime;
}

/* External Sources */
.ExtSrc {
  background: linear-gradient(to right, #ffed7d, #f16b8e, #a764bc);
  color: black;
  text-align: center;
}
.ExtSrc p {
  text-align: center;
  font-size: 60px;
}