body {
    margin: auto;
    width: auto;
    height: 60%;
    background-color: rgb(34, 114, 144);
}

h1 {
    text-align: center;
    color: rgb(49, 46, 46);
}

button {
    float: none !important;
}

#box {
    background: #005A31;
    width: 40%;
    margin: 30px auto;
    height: 440px;
    padding: 10px;
    -webkit-box-shadow: 1px 2px 10px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 1px 2px 10px 4px rgba(0,0,0,0.75);
    box-shadow: 1px 2px 10px 4px rgba(0,0,0,0.75);
}

#results {
    background: #CBE32D;
    margin: 1%;
    text-align: right;
    font-size: 300%;
}

.buttons {
    background: #e2e2e2;
    border: hidden;
    border-radius: 20%;
    font-size: 15px;
    padding: 4%;
    margin-top: 20px;
}
.buttons:hover {
    background-color: #1c1e0c;
    /*border: dotted;*/
    -webkit-box-shadow: 1px 2px 10px 3px rgba(0,0,0,0.75);
    -moz-box-shadow: 1px 2px 10px 3px rgba(0,0,0,0.75);
    box-shadow: 1px 2px 10px 3px rgba(0,0,0,0.75)
}


.buttons:active {
    background: #005A99;
}

.operations {
    background: #F3FAB6;
}



#container{
    text-align: center;
}
#container > div {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(5, 1fr);
    grid-gap: 20px;
    height: 55px;
}
#equals {
    border: solid;
    border-color: #092352;
    border-width: 7px;
}
