body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f9f9f9;
}

.contenedor {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
}

{
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-wrap: wrap;
            padding: 20px;
        }
        .card {
            background: white;
            border-radius: 10px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
            margin: 15px;
            overflow: hidden;
            width: 300px;
            transition: transform 0.2s;
        }
        .card:hover {
            transform: scale(1.05);
        }
        .card img {
            width: auto;
            height: auto;
            object-fit: cover;
        }
        .card-content {
            padding: 15px;
        }
        .card-title {
            font-size: 1.5em;
            margin: 0;
        }
        .card-description {
            color: #666;
        }
        .card-button {
            display: block;
            margin: 10px 0 0;
            padding: 10px;
            background: #007BFF;
            color: white;
            text-align: center;
            border: none;
            border-radius: 5px;
            text-decoration: none;
        }
        .card-button:hover {
            background: #808080;
        }

.precio {
    font-size: 1.5em;
    color: #4CAF50; /* Color verde para el precio */
}

button {
    background-color: #4CAF50;
    color: white;
    border: none;
    padding: 10px 15px;
    cursor: pointer;
    border-radius: 5px;
    transition: background-color 0.3s; /* Efecto al pasar el mouse */
}

button:hover {
    background-color: #45a049; /* Color más oscuro al pasar el mouse */
}
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f9f9f9;
}

.contenedor {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
}

.imagen-contenedor {
    width: 200px; /* Ancho fijo para las imágenes */
    height: 200px; /* Altura fija para las imágenes */
    overflow: hidden; /* Esconde la parte de la imagen que se desborda */
    border: 1px solid #ddd; /* Borde opcional */
    border-radius: 5px; /* Bordes redondeados opcionales */
}

.imagen {
    width: 100%; /* Ocupa el 100% del contenedor */
    height: 100%; /* Ocupa el 100% del contenedor */
    object-fit: cover; /* Recorta la imagen manteniendo la proporción */
}
table {
    width: 100%;
    border-collapse: collapse; /* Para evitar bordes dobles */
}

th, td {
    border: 1px solid #ddd; /* Borde de las celdas */
    padding: 15px; /* Espacio interno */
    text-align: left; /* Alineación del texto */
}

th {
    background-color: #f2f2f2; /* Color de fondo del encabezado */
}
body, html {
    margin: 0;
    padding: 0;
    height: 100%;
}
