body {
  font-family: "Arial", sans-serif;
  background-color: hsl(220, 35%, 95%);
  color: Black;
  
  margin: 1em 2em 1em 2em;
}

p {
  margin-top: 5px;
  margin-bottom: 5px;
  
  text-align: justify;
  text-align-last: left;
} p a {
  color: hsl(220, 75%, 65%);
  transition: color 0.25s ease;
} p a:hover {
  color: hsl(220, 55%, 35%);
}

li a {
  color: hsl(220, 75%, 65%);
  transition: color 0.25s ease;
} li a:hover {
  color: hsl(220, 55%, 35%);
}

h1 {
  background-color: hsl(220, 75%, 65%);
  color: hsl(0, 0%, 100%);
  
  margin-bottom: 0px;
  
  padding: 8px 10px;
  text-align: center;
  
  border-radius: 10px 10px 0 0;
}

h2 {
  background-color: hsl(220, 75%, 65%);
  color: hsl(0, 0%, 100%);
  
  margin-bottom: 0px;
  
  padding: 8px 10px;
  text-align: right;
  
  border-radius: 10px 10px 0 0;
} h2 a {
  color: hsl(220, 0%, 100%);
  transition: color 0.25s ease;
} h2 a:hover {
  color: hsl(220, 5%, 80%);
}

h3 {
  color: hsl(220, 75%, 65%);
} h3 a {
  text-decoration: none;
  
  color: hsl(220, 75%, 65%);
  transition: color 0.25s ease;
} h3 a:hover {
  color: hsl(220, 55%, 35%);
}

div {
  padding: 1px 10px;
  
  margin-bottom: 10px;
  
  background-color: White;
  
  border: 2px solid CornflowerBlue;
  box-shadow: 0 3px hsl(220, 75%, 85%);
  
  border-radius: 0 0 10px 10px;
  
  overflow: hidden;
}

.navigation {
  padding: 5px 10px;
  
  text-align: center;
} .navigation a {
  color: hsl(220, 75%, 65%);
  transition: color 0.25s ease;
} .navigation a:hover {
  color: hsl(220, 55%, 35%);
}

table, th, td {
  border: 2px solid CornflowerBlue;
} table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  
  margin-bottom: 8px;
} th, td {
  padding: 3px;
} th {
  background-color: CornflowerBlue;
  color: White;
}

tr {
  background-color: White;
  transition: background-color 0.10s ease;
} tr:nth-child(even) {
  background-color: hsl(0, 0%, 95%);
} tr:hover {
  background-color: hsl(0, 0%, 85%);
} tr:nth-child(even):hover {
  background-color: hsl(0, 0%, 90%);
}

img {
  padding: 2px 2px;
  max-width: 100%;
}

.copyright {
  display: flex;
  flex-wrap: nowrap;
  
  gap: 0;
}

@media screen and (max-width: 500px) {
  .copyright {
    display: grid;
    float: right;
    
    padding: 4px 0px;
  }
}