* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
/* Bagian latar belakang */
section {
    background: radial-gradient(#00b7ff, #030a4e);
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Bagian Kalkulator */
.calculator{
    width: 90%;
    max-width: 400px;
    background-color: rgb(27, 38, 41);
    border-radius: 8px;
    overflow: hidden;
}

/* Bagian Tampilan Hitungan kalkulator */
.calculator-screen{ 
    width: 100%;
    height: 100px;
    background-color: rgb(211, 209, 209);
    color: rgb(50, 50, 50);
    text-align: right;
    font-size: 36px;
    border: none;
    padding: 0 20px;
    box-sizing: border-box;
    position: relative;
}

.calculator-keys{
    width: 100%;
}

.row{
    display: flex;
}

button{
    border: .5px solid rgba(0, 0, 0, 0.137);
    height: 100px;
    width: 25%;
    background-color: rgb(27, 38, 41);
    font-size: 30px;
    color: #fff;
    outline: none;
    cursor: pointer;
}

.all-clear, .zero-btn{
    width: 50%;
}

.operator, .equal-sign, .percent{
    background-color: rgb(1, 136, 107);
}

.all-clear{
background-color: rgb(148, 44, 44)
}

button:hover{
    background-color: rgb(30, 65, 101);
}

.operator:hover, .equal-sign:hover, .percent:hover{
    background-color: rgb(6, 86, 68);
}

.all-clear:hover{
    background-color: rgb(116, 32, 32)
}