@import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&display=swap');

html{
    height: 100%;
}
body{
    /* background-color: rgb(66, 66, 66); */
    background-image: linear-gradient(rgb(66,66,66),rgb(99,99,99));
    color: white;
    font-family: 'Alfa Slab One', cursive;;
}
.container{
    width: 1024px;
    margin-left: auto;
    margin-right: auto;
}

h1{
    font-size: 6.0rem;
    font-family: 'Alfa Slab One', cursive;
    /* font-weight: 800, bold; */
    text-shadow: 8px 8px 8px rgba(0, 0, 0, 0.50);
}
.cards {
    display: flex;
    justify-content: space-evenly;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.40);
    text-align: center;
}
.card1 {
    background-image: linear-gradient(to top left, red,rgb(0, 0, 0, 0));
    width: 40%;
    
}
.card2 {
    background-image: linear-gradient(to top left, green,rgb(0, 0, 0, 0));
    width: 30%;
}
.card3 {
    background-image: linear-gradient(to top left, blue,rgba(0, 0, 0, 0));
    width: 20%;
}

.card1, .card2, .card3 {
    padding: 5px 5px 0px 5px;
    box-sizing: border-box;
    border-radius: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    align-items: center;
}