/* Importando uma fonte pixelada para dar o charme */
@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');

body {
  background-color: #000080; /* Azul clássico */
  background-image: url('https://sadgrl.online/assets/images/backgrounds/stars.gif'); 
  color: #ffffff;
  font-family: 'VT323', monospace, "Courier New";
  margin: 20px;
}

#container {
  max-width: 800px;
  margin: 0 auto;
  border: 3px double #ffffff;
  background-color: rgba(0, 0, 0, 0.8);
  padding: 15px;
}

header {
  text-align: center;
  border-bottom: 2px solid #ffffff;
  margin-bottom: 15px;
}

h1 { color: #ffff00; text-shadow: 2px 2px #ff00ff; }

#main-content {
  display: flex;
  gap: 20px;
}

#sidebar {
  width: 200px;
  border-right: 1px dashed #ffffff;
  padding-right: 15px;
}

#sidebar ul { list-style-type: "» "; padding-left: 10px; }

#sidebar a {
  color: #00ffff;
  text-decoration: none;
}

#sidebar a:hover {
  text-decoration: underline;
  background: #ff00ff;
}

#content {
  flex: 1;
}

.status-box {
  margin-top: 20px;
  border: 1px solid #00ff00;
  padding: 5px;
  font-size: 0.9em;
}

footer {
  text-align: center;
  margin-top: 20px;
  font-size: 0.8em;
  border-top: 1px solid #ffffff;
}

/* Deixando as imagens com aquele estilo old school */
img {
  image-rendering: pixelated;
}