@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
    
    h1, h2{
        font-family: "Fraunces", serif;
    }
    h3{
        font-family: "Montserrat", serif;
        font-weight: 500;
        font-size: small;
        letter-spacing: 5px;
        color: hsl(228, 12%, 48%);
    }

    h2{
        color: hsl(212, 21%, 14%);
        padding: 0 60px 0 0;
        font-weight: 900;
        font-size: 900;
    }

    h1{
        color: hsl(158, 36%, 37%);
    }

body{
     background-color: hsl(30, 38%, 92%);
     width: 100%;
     height: 100vh;
     display: flex;
     justify-content: center;
     align-items: center;
}
/* mobile */
    @media only screen and (min-width: 200px){
        .card{
            background-color: white;
            margin: auto;
            max-width: 330px;
            border-radius: 7px;
        }

        button{
            background-color:  hsl(158, 36%, 37%);
            color: white;
            border: none;
            padding: 10px 80px;
            font-size: 15px;
            border-radius: 7px;
        }
    }

    

/* desktop */
    @media only screen and (min-width: 1200px){
            .card{
                display: flex;
                background-color: white;
                max-width: 37rem;
                height: 28.125rem;
                overflow: hidden;
                border-top-left-radius: 10px;
                border-bottom-left-radius: 10px;
        }

        button{
            background-color:  hsl(158, 36%, 37%);
            color: white;
            border: none;
            padding: 12px 50px;
            font-size: 15px;
            border-radius: 7px;
        }
    }


.texts{
    padding: 25px;
}

 p{ 
    color: hsl(228, 12%, 48%);
    font-family: "Montserrat", serif;
    font-size: 14px;
    line-height: 1.7;
} 


.price s{
    font-size: 12px;
    color: hsl(228, 12%, 48%);
    font-family: "Montserrat", serif;
    font-weight: normal;
    padding: 15px;
}

button:hover{
    background-color: hsl(157, 95%, 9%);

}

