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

body{
    /* width: 100%; */
    height: 100%;
    background-color: #232323;
    display: flex;
    align-items: center;
    justify-content: center;
}

.container {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* height: 100%; */
    justify-content: center;
    /* align-self: center; */
    /* background-color: #232323; */
    padding-top: 3em;
}

h1 {
    font-family: Arial, sans-serif;
    color: #ddd;
   margin-bottom: 20px;
   font-size: 5em;
}
h3 {
    font-family: Arial, sans-serif;
    color: #ddd;
    margin-bottom: 20px;
    font-size: 2em;
    text-align: center;
    margin-bottom: 1em;
}

#honkButton {
    background-image: url("/Files/img/untitled-goose-game-review_escc.1200.webp");
}

#hahaButton {
    background-image: url("/Files/img/bird.jpeg");
}
#gunbirdButton {
    background-image: url("/Files/img/gunbird.png");
}

#jensbutton {
    background-image: url("/Files/img/jens.png");
}
#mabba {
    background-image: url("/Files/img/mabba.jpg");
}
#lizard {
    background-image: url("/Files/img/lizard.jpg");
}

#fredag {
    background-image: url("/Files/img/freeeedag.png");
}


button {
    padding: 12em 12em;
    color: #232323;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    clip-path: circle();
}


button:hover {
    transform: scale(1.05);
    transition: transform 0.2s ease-in-out;
}



.button-container {
    display: grid;
    grid: 1fr / 1fr 1fr 1fr;
    gap: 4em;
}