* {
  box-sizing: border-box;
}

body {
  padding: 0px;
  margin: 0px;
  font-family: 'Times New Roman', Times, serif;
  font-family: 'Roboto';
  font-weight: 300;
}

.bgimg {
  position: fixed;
  width: 100%;
  height: 100%;
  background-image: url("../../medien/werk.jpg");
  background-size: cover;
  background-position: right bottom;
  opacity: 0.2;
}

nav {
  position: absolute;
  top: 80px;
  width: 200px;
  height: 400px;
  border-radius: 0px 10px 10px 0px;
  background-color: rgba(128,0,0,0.3);
  box-shadow: 3px 3px 5px rgba(50,50,50,0.7);
}

header {
  position: absolute;
  height: 60px;
  width: 100%;
  line-height: 60px;
  background-color: rgba(128,0,0,0.3);
  background-image: linear-gradient(45deg,black,red,gold);
}

header h1 {
  margin: 0px;
  padding-left: 20px;
  text-align: left;
  color: beige;
  text-shadow: 3px 3px 3px rgba(50,50,50,0.7);
}

.content {
  display: block;
  position: absolute;
  top: 60px;
  left: 210px;
  width: calc(100% - 210px);  height: calc(100% - 120px);
  background-color: rgba(128,0,0,0.3);
  overflow-y: auto;
  padding: 10px;
}

main {
  height: 2000px;
  background-color: rgba(128,0,0,0.3);
}

footer {
  position: fixed;
  width: 100vw;
  height: 60px;
  bottom: 0px;
  color: white;
  background-color: rgba(128,0,0,0.3);
  background-image: linear-gradient(45deg,black 33%,red 33%,red 66%, gold 66%,gold);
}

footer table {
  width: 100%;
  height: 100%;
  text-align: center;
}

footer td:nth-child(1) {
  color: gold;
}
footer td:nth-child(2) {
  color: black;
}
footer td:nth-child(3) {
  color: cornflowerblue;
}

