body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  /* Wrapper */
  max-width: 1200px;
  display: block;
  margin-right: auto;
  margin-left: auto;
  background-color: #f2f2f2;
  border-left: 2px ridge;
  border-right: 2px ridge;
  border-bottom: 2px ridge;
}

.wrapper {
  max-width: 1200px;
  display: block;
  margin-right: auto;
  margin-left: auto;
  background-color: #f2f2f2;
  border-left: 1px ridge;
  border-right: 1px ridge;
}

/* .wrapper {
    margin: 0 auto;
    width: 80%;
  } */

/* Topnav */

.topnav {
  overflow: hidden;
  background-color: #333;
}

.topnav a {
  float: left;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  background-color: #ddd;
  color: black;
}

.topnav a.active1 {
  background-color: #005000;
  color: white;
}

.box {
  margin: 5% auto;
  border-radius: 25vw;
  text-align: center;
  padding-top: 5px;
  border-style: solid;
  border-width: 5px 5px 5px 5px;
  line-height: 20px;
  width: 50vw;
  min-width: 200px;
  color: #333;
  vertical-align: text-top;
  background-color: #333;
}

.box h2 {
  color: white;
}

/* .box2 {
    width: 100%;
    border-style: solid;
    border-width: 5px 5px 5px 5px;
    min-width: 200px;
    color: black;
    border: auto;
  } */

.box2 h2 {
  color: black;
  /* vertical-align: text-top; */
}

/* Photo */

.photo img {
  width: 100%;
  z-index: -5;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  /* max-width: 1000px;
    display: block; */
}

.photo p {
  float: right;
  margin-right: 50px;
}

.pics img {
  width: 30%;
}

/* Main Text */

main {
  padding: 5vw 5vw 0 25vw;
}

/* Left navbar */

.leftcontainer {
  float: left;
  border-radius: 0vw 2vw 2vw 0vw;
  width: 20%;
  height: 80%;
  border: 5px 0 0 0;
  border-style: solid;
  margin-top: 5vw;
  color: #333;
  background-color: #333;
  z-index: -5;
}

.leftcontainer p {
  color: white;
  padding: 1vw 1vw 1vw 1vw;
  text-align: center;
}

/* side bar2nd try */

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 100%;
  background-color: #333333;
  border-radius: 0vw 2vw 2vw 0vw;
  text-align: center;
}

li {
  width: 95%;
}

li a {
  display: block;
  color: #f2f2f2;
  padding: 8px 16px;
  text-decoration: none;
}

li a:hover {
  background-color: white;
  color: #333333;
  border-radius: 0vw 2vw 2vw 0vw;
}

/* Table */
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td,
th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

/* tr:nth-child(even) {
    background-color: #333;
    color: #f2f2f2;
  } */
table th {
  background-color: #333;
  color: #f2f2f2;
}