body{
    background-color: #eee;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}
#calculator{
    width: 296px;
    height: fit-content;
    background-color: #202020;
}
#display{
    box-sizing: border-box;
    background-color: hsl(0, 0%, 25%);
    color: white;
    outline: none;
    width: 286px;
    height: 70px;
    padding: 10px;
    margin: 5px 5px 0;
    font-size: 2rem;
    border: none;
    border-radius: 5px;
    text-align: left;
    white-space: nowrap;
    text-align: right;
}
#keys{
    position: relative;
    padding: 5px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2px;
}
button{
    width: 70px;
    height: 50px;
    color: white;
    font-size: 1.2rem;
    background-color: hsl(0, 0%, 28%);
    border: none;
    border-radius: 3px;
    cursor: pointer;
    outline: none;
}
button:hover{background-color: hsl(0, 0%, 20%);}
button:active{background-color: hsl(0, 0%, 16%);}
.operator_btn{background-color: hsl(0, 0%, 23%);}
.equal{
    width: 142px;
    background-color: hsl(211, 100%, 40%);
    color: black;
    position: absolute;
    right: 77px;
    bottom: 5px;
}
.kvadrat{
    position: absolute;
    right: 5px;
    bottom: 5px;
}
.equal:hover{background-color: hsl(211, 100%, 30%);}
.equal:active{background-color: hsl(211, 100%, 40%);}