body {
      margin: 0;
      padding: 0;
      font-family: Arial, sans-serif;
      background-image: url('background.webp');
      background-size: cover;
      background-position: center;
      color: white;
      height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
    }

body.paradox-bg {
  background-image: url('background3.webp');
}

body.root-bg {
  background-image: url('background.webp');
}

body.price-bg {
  background-image: url('background2.png');
}

.container {
  max-width: 900px;
  margin: 0 auto;
  background-color: rgba(0, 0, 0, 0.85);
  padding: 25px 30px;
  border-radius: 12px;
}
h1 {
  text-align: center;
  margin-bottom: 25px;
}

.price-bg h1 {
  color: #e74c3c;
}

.game-info img {
      width: 200px;
      height: auto;
      border-radius: 6px;
}
.game-info {
		text-align: center;
		padding: 20px;
}
.game-info h3 {
		margin: 10px 0;
		color: #f1c40f;
}
.game-info p {
	margin: 8px 0;
}

.price-bg a {
      color: #f1c40f;
      text-decoration: none;
      font-weight: bold;
    }
.price-bg a:hover {
      text-decoration: underline;
    }

.price-bg table {
      width: 100%;
      border-collapse: collapse;
      margin-top: 20px;
    }
.price-bg th,
.price-bg td {
		padding: 14px;
		text-align: center;
		border: 1px solid rgba(255, 255, 255, 0.2);
}
.price-bg th {
		background-color: rgba(52, 73, 94, 0.9);
}

.header {
      display: flex;
      align-items: center;
      gap: 20px;
      margin-bottom: 20px;
}
.header img {
      width: 200px;
      height: auto;
      border-radius: 8px;
}
.titles {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      flex-grow: 1;
}

.root-pg h1 {
      color: #27ae60;
      margin: 0;
}

.subtitle {
      color: #27ae60; 
      font-size: 1.1em;
      margin: 5px 0 0 0;
}
.root-pg a {
      color: #a3d900;
      text-decoration: none;
      font-weight: bold;
}
.root-pg a:hover {
      text-decoration: underline;
}

.titles-parabox {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      flex-grow: 1;
}
.paradox-bg h1 {
      color: #f39c12;
      margin: 0;
}
.subtitle-parabox {
      color: #f39c12; 
      font-size: 1.1em;
      margin: 5px 0 0 0;
}
.paradox-bg a {
      color: #ffcc00;
      text-decoration: none;
      font-weight: bold;
}
.paradox-bg a:hover {
      text-decoration: underline;
}