:root {
  --bg: url(https://images.unsplash.com/photo-1542273917363-3b1817f69a2d?fm=jpg&q=60&w=3000&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8M3x8Zm9yZXN0JTIwYmFja2dyb3VuZHxlbnwwfHwwfHx8MA%3D%3D);
  --font: 15px monospace;
  
  --main-container-bg: #FFFFFFAA;
  --main-container-bg-gradient: linear-gradient(var(--main-container-bg) 70%, #FFFFFF00);
  
  --secondary-color: gold;
}

body {
  background: var(--bg);
  background-size: 100vw;
}

#host-container {
  display: flex;
}

.main-container {
  background: var(--main-container-bg-gradient);
  border: 1px dashed #004512;
  padding: 30px 25px;
  font: var(--font);
  font-size: var(--font-size), 20px;
  margin: 5px;
}

.navbar {
  background: var(--main-container-bg);
  font-weight: bold;
}

.left {
  width: 80%;
}

.right {
  width: 20%;
}

.sidebar {
  text-align: center;
}

#sitename {
  font-size: 20px;
}

#sitename:hover {
  color: var(--secondary-color);
}