.Tittle{
    color: white; 
    font-size: 35px;
  }
  .Description{
    color: white; 
    font-size: 25px; 
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    
  }
  .Description{
    color: red; 
  }
  .Description span{
    color: white; 
  }
  .Gameplay{
    color: white; 
    font-size: 25px;
  }
  .Gameplay a{
    color: violet; 
    font-size: 20px;
    text-decoration: none;
  }
  .GameLogo img{
    width: 450px;
  }

.Descargar{
    color:white;
    font-size: 50px;
}
.image-container {
  display: flex;
  gap: 5px; /* Separación entre las imágenes */
}
.image-container img {
  border: 2px solid red; /* Borde fino */
  border-radius: 15px; /* Bordes redondeados */
  box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.5); /* Sombra elegante */
  box-sizing: border-box; /* Incluye el borde en las dimensiones */
}
.image-container img{
  width: 150px;
}

.ad-container {
    width: 100%;
    max-width: 728px;
    margin: 10px auto;
    text-align: center;
}

@media (max-width: 768px) {
    .ad-container iframe {
        width: 100% !important;
        height: auto !important;
    }
}

.error-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: calc(100vh - 80px); /* Resta el espacio del header */
}
.error-message {
  font-size: 24px;
  padding: 20px;
  border-radius: 10px;
  background-color: #222;
  margin-bottom: 20px;
}
.back-button {
  padding: 10px 20px;
  font-size: 18px;
  color: #fff;
  background-color: #444;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  text-decoration: none;
}
.back-button:hover {
  background-color: #666;
}

.Descargas{
    color:white;
    font-size: 25px;
}
.Descargar2{
    color:red;
}

.Server_Tittle{
    color: white;
    font-size: 20px;
}


/* Botones, listas y enlaces */
.button-container {
    display: flex;
}
.button-container img {
    cursor: pointer;
    background-color: red;
    border: 2px solid white;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    margin: 5px 0 0 0;
    padding: 5px;
}
.link-list {
    display: none;
    margin-top: 0;
    border: 1px solid white;
    border-top: none;
    padding: 10px;
    border-radius: 0 0 10px 10px;
    background-color: #2b2d30ff;
}
.link-list a {
    display: block;
    margin: 5px 0;
    color: white;
    text-decoration: none;
}




/* Estilo para la parte 'Parte X' */
.link-part {
color: white; /* Texto blanco para "Parte X" */
font-weight: bold; /* Opcional para resaltar */
}

/* Estilo para los enlaces */
.link-url {
color: blue; /* Color azul para los enlaces */
text-decoration: none; /* Quitar subrayado inicial */
}

/* Efecto hover para los enlaces */
.link-url:hover {
color: darkblue; /* Color al pasar el mouse */
text-decoration: underline; /* Subrayado al pasar el mouse */
}






.game-header {
            display: flex;
            flex-wrap: wrap;
            align-items: flex-start;
            gap: 20px;
            background-color: #1a1a1a;
            padding: 20px;
            border-radius: 10px;
            color: white;
        }
        .game-header img {
            width: 300px;
            max-width: 100%;
            border-radius: 10px;
        }
        .game-info {
            flex: 1;
        }
        .gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
    margin-top: 20px;
}


.gallery img {
    width: 100%;
    max-width: 350px; /* Máximo ancho */
    height: auto;
    border-radius: 10px;
    object-fit: cover;
}

@media (max-width: 600px) {
    .gallery img {
        max-width: 150px; /* Más pequeño en móviles */
    }
}



.gallery img:hover {
  transform: scale(1.05); /* efecto zoom suave al pasar el mouse */
}

        .buttons-container {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.buttons-container .btn {
    padding: 12px 25px;
    border-radius: 8px;
    color: white;
    font-weight: bold;
    text-decoration: none;
    transition: background-color 0.3s ease;
    cursor: pointer;
    user-select: none;
}

/* Colores distintos */
.gameplay-btn { background-color: #ff3c3c; }
.gameplay-btn:hover { background-color: #e22b2b; }

.tutorial-btn { background-color: #3c7fff; }
.tutorial-btn:hover { background-color: #2b5de2; }

.comprar-btn { background-color: #703cff; color: #000; }
.comprar-btn:hover { background-color: #7f50ed; }

.descargar-btn { background-color: #ffa53c; color: #000; }
.descargar-btn:hover { background-color: #e28a2b; }

.descripcion {
  font-size: 16px; /* más grande para la descripción */
  margin-top: 10px;
  color: #e3e2e2;
}
        .requirements-section {
    margin-top: 30px;
    background: #222;
    padding: 15px;
    border-radius: 10px;
    color: #ccc;
    text-align: center;
}

.requirements-section h2 {
    margin-bottom: 20px;
}

.requirements-container {
    display: flex;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
    max-width: 900px;
    margin: 0 auto;
}

.requirement-box {
    flex: 1 1 300px; /* flexible y mínimo 300px */
    max-width: 400px;
    background: #2a2a2a;
    padding: 15px;
    border-radius: 8px;
    font-family: monospace;
    font-size: 14px;
    line-height: 1.4;
    white-space: pre-line;
}
.icon {
  width: 18px;
  height: 18px;
  vertical-align: middle;
  margin-right: 6px;
}
.tag-container {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 5px;
}

.tag-badge {
    background-color: #a1a0a0;
    color: #333;
    padding: 6px 12px;
    border-radius: 20px;
    text-decoration: none;
    font-size: 14px;
    transition: background-color 0.2s;
    border: 1px solid #ccc;
}

.tag-badge:hover {
    background-color: #dcdcdc;
    color: #000;
}


.btn-descargar {
  display: inline-block;
  padding: 14px 32px;
  font-size: 1.1rem;
  font-weight: bold;
  color: #fff;
  background: linear-gradient(135deg, #d00000, #8c0000);
  border: none;
  border-radius: 10px;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 0 6px 16px rgba(220, 0, 0, 0.4);
  transition: all 0.3s ease-in-out;
  letter-spacing: 1px;
}

.btn-descargar:hover {
  background: linear-gradient(135deg, #8c0000, #d00000);
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 10px 20px rgba(140, 0, 0, 0.5);
}