html {
  height: 100%;
  width: 60%;
  text-align: justify;
  margin:auto;
  background-color:  #a58d8d;
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

h1 {
font-family:sans-serif;
}

.center {
  display: block;
  margin: auto;
  height: 50%;
   width: 50%;
  border-radius: 15px;
}

.center2 {
    display: block;
  margin: auto;
  height: 85%;
   width: 85%;
  border-radius: 15px;
}

a {
  text-decoration: none;
  display: inline-block;
  padding: 8px 16px;
  font-family: sans-serif;
  border-radius: 5px;
}

a:hover {
  background-color: #ffffff;
  color: black;
  font-family: sans-serif;
}

.previous {
  background-color: #f1f1f1;
  color: black;
}

.next {
  background-color: #795c25;
  color: white;
}

.topnav {
  background-color: #333;
  overflow: hidden;
  width: 100%;
  display: flex;
    border-radius: 5px;
}

.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.active {
  background-color: #f1f1f1;
  color: black;
}

.box {
  display: block;
  margin-top: 10px;  
  height: 100%;
  width: 95.1%;
  padding: 2.5%;
  background-color: #e8e3e3;
  border-radius: 5px;
}