*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* centralizando as imagems do container album no centro da tela */
body{
    height: 100vh;
}

.album{

    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    transform-style: preserve-3d;
}

.album .card{
    width: 300px;
    height: 350px;
    padding: 20px;
    margin: 40px;

    border-radius: 30px;


    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;

    transform-style: preserve-3d;
    background-color: aqua;
     }

     .album .card h2{
        color: rgb(69, 69, 69);
        transform-style: preserve-3d;
     }

.album .card img.produtos {
    height: 250px;
    transform-style: preserve-3d;
    transition: .5s;
    
}
.album .card:hover img.produtos, .album .card:hover button{
    transform: translate3d(0,0,100px);
    
}


.album .card button{
    padding: 10px;
    background-color: rgb(54, 184, 31);
    border: 0;
    border-radius: 15px;
    font-size: 16px;
    color: aliceblue;
    cursor: pointer;
    transform-style: preserve-3d;
    transition: .5s;
}

.album div.img-1{
    background-image: linear-gradient(45deg, #003cff, #00f7ff);
}
.album div.img-2{
    background-image: linear-gradient(45deg, #003cff, #00f7ff);
}

.album div.img-3{
    background-image: linear-gradient(45deg, #003cff, #00f7ff);
}

.album div.img-4{
    background-image: linear-gradient(45deg, #003cff, #00f7ff);
}