:root {
    --fuenteHeading: "Outfit", sans-serif;
    --fuenteParrafos: "Outfit", sans-serif;

    --Gris: hsl(220, 15%, 55%);
    --ClaroGris: hsl(212, 45%, 89%);
    --Blanco: hsl(0, 0%, 100%);
    --AzulOscuro: hsl(218, 44%, 22%);
}


/** Globales **/
html {
    background-color: var(--Blanco);
    box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
h1 {
    font-family: var(--fuenteHeading);
    font-weight: 700;
    font-size: 20px;
}
p {
    font-family: var(--fuenteParrafos);
    font-weight: 400;
    font-size: 15px;
}
a {
    text-decoration: none;
    color: var(--Gris);
}
footer {
    font-family: var(--fuenteParrafos);
    text-align: center;
}

/** contenedores **/

.contenedor {
    margin: 5rem;
    max-width: 100%;
    background-color: var(--ClaroGris);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 6rem 0rem; 
    border-radius: 2px;
    box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.2);
}

.carta {
    background-color: var(--Blanco);
    border-radius: 15px;
    box-shadow: 0 15px 20px rgba(0, 0, 0, 0.2);
    text-align: center;
    padding: 20px;
    width: 100%;
    max-width: 350px;
}
.carta img {
    width: 100%;
}

footer {
    align-items: baseline;
}

/*Media querys mobile */
@media (max-width: 768px) {
.carta {
    width: 100%;
    max-width: 300px;
}

.contenedor {
    padding: 8rem 1rem;
    margin: 2rem;
}
}