body {
    background-color:lightgray;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    text-align: center;
    margin: 0;
}
 nav {
    text-align:center;
    margin: 0;
 }
 nav a {
    color:blue;
    font-weight: bold;
    text-decoration: underline;
    margin:0 15px;
 }
 h1 {
    color:springgreen;
    border: 1px solid whitesmoke;
    background-color: dimgray;
    text-align: center;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: bolder;
    font-size: larger;
    font-style: unset;
 }
 h2 {
    color:cyan;
    border: 1px solid whitesmoke;
    background-color: dimgray;
    text-align: center;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: bolder;
    font-size:x-large;
    font-style: oblique;
 }
 h3 {
    color:orange;
    border: 1px solid whitesmoke;
    background-color: dimgray;
    text-align: center;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: bolder;
    font-size:xx-large;
    font-style: inherit;
 }
 p {
    color:black;
    text-align: center;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size:24px;
    max-width: 500px;
    margin:auto;
 }
 img{
    display:block;
    margin: 20px auto;
 }
 ul{
    font-size: large;
    margin: 20px auto;
    width: fit-content;
    padding: 20px 30px;
    background-color:lightsteelblue;
    border: 5px solid black;
    border-radius: 3px;
    list-style-type:decimal;

 }
 li {
    color: darkgoldenrod;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    width:fit-content;
    padding: 10px;
 }
 table{
    margin: 20px auto;
    border: 3px solid black;
    border-collapse: collapse;
    background-color: darkred;
    padding: 10px 20px;
    align-content: center;
 }
 th {
    border: 1px solid black;
    color: beige;
    font-size: large;
}
 td {
    border: 1px solid black;
    color: cornsilk;  
    font-size: medium;
 }
 th, td:hover {
    color: gold;
 }

 form {
   background-color: aliceblue;
   text-align: center;
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   color: black;
   font-style: initial;
   margin: 25px auto;
   padding: 15px;
   width: fit-content;
   border: 2px solid darkgray;
   border-radius: 15px;
}
label {
   display: block;
   margin-top: auto;
}

input {
   display: block;
   padding: 10px;
   margin: 7px;
   width: 250px;
}

button {
   padding: 10px 20px;
   background-color: khaki;
   color: black;
   border: 2px solid lightskyblue;
   border-radius: 3px;
   font-weight: bold;
   cursor: pointer;
}

button:hover {
   background-color: gold;
   color: black;
}

#message {
   color: black;
   font-size: large;
   font-weight: bold;
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   margin-top: auto;
}

@media (max-width: 600px) {
   body {
      padding:12px
   }

   nav a {
      display: flex;
      margin: 10px 0;
   }

   img {
      width: 100%;
      height: auto;
   }

   table {
      width: 100%;
      font-size: small;
   }

   form {
      width: 80%;
   }

   input, button {
      width: 75%;
      margin: 12px 0;
   }
}

