body {
  background-color: #222;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  margin: 0;
}

.box {
  display: flex;
  flex-direction: column;
  font-family: monospace;
  border: 3px inset #fff;
  width: 400px;
}

.box-title {
  background-color: #808080;
  color: white;
  width: 100%;
  padding: 5px;
  box-sizing: border-box;
  border-bottom: 2px solid #fff;
}

.box-content {
  background-color: #c0c0c0;
  padding: 25px;
  width: 100%;
  box-sizing: border-box;
 }
 
 button {
  width: 100%; 
  padding: 5px; 
  cursor: pointer; 
  font-family: monospace; 
  font-weight: bold; 
  background-color: #c0c0c0;
  border: 2px outset white;
 }
 
 button:hover {
  background-color: #8c8c8c;
  border: 2px inset white;
}

hr {
  border: 1px inset white;
  margin: 20px 0 10px 0;
}

a {
  color: #444;
  font-style: none;
  text-decoration: underline solid 2px;
}

.data-table {
        border-collapse: collapse;
        width: 100%;
        max-width: 600px;
        overflow-wrap: break-word;
}

.data-table td {
    border: none;
    padding: 8px 15px;
    vertical-align: top;
    overflow-wrap: break-word;
}

.label{
    font-weight: bold;
    text-transform: uppercase;
    width: 150px;
}