* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  font: normal 1rem Verdana, Geneva, Tahoma, sans-serif;
  background: linear-gradient(45deg, #ff000088, #ffff0088, #00ff0088, #00ffff88, #0000ff88);
}

header {
  height: 20vh;
  width: 100vw;
  background-color: #ffffff33;
  border-bottom: solid 1px #000;
}

main {
  min-height: 70vh;
  width: 100vw;
  padding: 25px;
}

footer {
  height: 10vh;
  width: 100vw;
  background-color: #ffffff33;
  border-top: solid 1px #000;
}

header,
footer {
  display: flex;
  justify-content: center;
  align-items: center;
}

#divCopied {
  display: none;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  background-color: #ccccccbb;
  font-size: 3rem;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
}

table {
  width: 100%;
  cursor: default;
}

table td, th {
  padding: 5px 10px;
  word-wrap: break-word;
}

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

table tr:nth-child(odd) {
  background-color: #7777;
}

table thead tr:nth-child(odd) {
  background-color: #5557;
}

button {
  padding: 5px;
  width: 10rem;
}