styles.css

body{
    display:flex;
    justify-content:center;
}
.main-container{
    display:flex;
    flex-wrap:wrap;
    width:400px;
    background-color:#70706f;
    border-radius:15px;
}

.box{
    font-size:30px;
    font-family:sans-serif;
    text-align:center;
    flex-basis:100px;
}
.btn{
    width:80px;
    height:80px;
    margin:10px;
    font-size:30px;
    color:#4e4e4e;
    background-color: #fdfdfd;;
    border-radius:10px;
    border:none;
    outline:none;
}


.btn:active {
    box-shadow: 0 5px #666;
    transform: translateY(4px);
  }

.btn:hover{
    background-color: #d3d3d3;
}

.key:hover{
    //background-color: #63a4ff;   
}

.operation:hover{
    //background-color: #f9d976;
}

.dispdiv{
    flex-basis:400px;
    margin:10px 10px 10px 10px;
    text-align:right;
    font-size:50px;
    font-family:Roboto;
    background-color:#5a5a59;
    border-radius:10px;
    display:float;
}
#display{
    background-color:#0bab64;
    height:50px;
    margin:10px;
    padding:15px;
    color:#222221;
}