body {
  background-image: url(BackPattern.webp);
  background-repeat: repeat;

  font-family: "Courier New", Courier, monospace;

  /*background: rgb(204, 204, 204);
    background: radial-gradient(circle, rgba(204, 204, 204, 1) 21%, rgba(221, 86, 18, 1) 100%); */
}

#wrapper {
  width: 1000px;
  margin-left: auto;
  margin-right: auto;
  border: 2px solid #000;
}

header {
  background-color: #444;
  color: #ffffff;
  text-align: center;
  padding: 8px;
}

header a:visited {
  color: #ffffff;
}

header a {
  text-decoration: none;
  color: #ffffff;
}

a:visited {
  color: #000;
}

a {
  text-decoration: none;
  color: #000;
}

nav {
  font-weight: bold;
  font-size: 1.25em;
  background-color: #cfcfcf;
  text-align: center;
  padding: 0px;
  border-bottom: 3px solid #dd5612;
  border-top: 2px solid #dd5612;
}

nav a {
  text-decoration: none;
  padding: 4px;
  display: block;
  color: #333333;
  width: 200px;
}

nav a:hover {
  color: #fff;
}

nav ul {
  /* get rid of the bullets */
  margin: 0px;
}

nav li {
  display: inline-block;
  vertical-align: middle;
  /* set a border color border width: ;*/
  /* padding: 10px 0;
    border: 3px solid green;
    text-align: center; */
}

main {
  background-color: #eeeeee;
  color: #000000;
  padding: 2em;
}

footer {
  font-style: italic;
  text-align: center;
  background-color: #444;
  color: #fff;
  padding: 0.5em;
}

img {
  float: right;
}

table {
  border: 1px solid black;
  border-collapse: collapse;
  width: 50%;
}

th,
td {
  margin: 0px;
  /* set the css here */
}

tr:nth-child(even) {
  background-color: #a1a1a1;
}

.circle-photo {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid black;
  /* display: inline-block; */
  object-fit: cover;
  float: right;
}

.small-caps {
  font-variant-caps: small-caps;
}