style.css

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: 'Minecraft', sans-serif;
}
.containercontainer {
    height: 100vh;
    width: 100%;
    background-color: #282525;
    display: flex;
    justify-content: center;
    align-items: center;
}
.container {
    display: grid;
    grid-template-rows: repeat(6, 1fr);
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    font-family: 'Minecraft', sans-serif;
}
.text {
    grid-column: span 4;
    text-align: right;
    color: #F5DEB3;
}
.child {
    padding: 5px;
    font-size: 2rem;
    border-radius: 10px;
    border: none;
    background-color: #1e1b1b;
    box-shadow: -3px -3px 5px rgba(225, 225, 225, 0.1), 3px 3px 5px rgba(0, 0, 0, 0.2);
    transition: color 0.4s ease-in-out;
    transition: transform 0.6s ease-in-out;
}
.child:hover {
    color: #65a0ff;
    transform: scale(1.05);
}
button {
    color: #F5DEB3;
}
.operator {
    color: #FFFF00;
}
.clear {
    color: #b80808;
}
.equal {
    color: #00ff00;
}