calculator.css

body {
    margin: 0;
    padding: 0;
    font-family: 'Lato', Arial, Helvetica, sans-serif;
    text-align: center;
}
.calculator {
    max-width: 500px;
    text-align: center;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: minmax(50px, auto);
    margin: 120px auto 0;
    font-size: 40px;
}
.calculator div {
    padding: 5px 10px;
    border: 1px solid #ccc;
    background-color: #eee;
    cursor: pointer;
}
.calculator .display {
    grid-column: 1 / 5;
    text-align: right;
    padding-right: 40px;
    background-color: #444;
    color: #fff;
}
.calculator .zero {
    grid-column: 1 / 3;
}
.calculator .operator {
    background-color: orange;
    color: white;
}