body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    /* margin: 0; */
    color: white;
    font-size: 20px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    background-color: aliceblue;
}

#calculator {
    background-color: black;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    height: 500px;
    width: 400px;
    text-align: right;
    margin-top: 6%;
    padding: 0%;
}

#display {
    background-color: gray;
    padding: 15px;
    font-size: 24px;
    border-radius: 4px;
    width: 100%; /* Makes the display take full width of #calculator */
    box-sizing: border-box; /* Includes padding in width calculation */
}

#firstrow, #secondrow, #thirdrow, #fourthrow, #fifthrow{
    display: flex;
    justify-content: space-evenly;
    gap: 10px;
}

.button {
    padding: 15px 25px;
    transition: background-color 0.2s;
    border-radius: 8px;
}

.button:active {
    background-color: grey;
}