*{
   padding: 0;
   margin: 0;
   box-sizing: border-box;
   font-size: 30px;
   font-family: Arial;
}
body{
   background-color: #000000;
   display: flex;
   justify-content: center;
   align-items: center;
}
.calc{
   width: 400px;
   margin: 100px auto;
}
.display{
   color: #ffffff;
   text-align: right;
   font-size: 60px;
   padding: 10px;
}
.keypad{

}
.keypad-table{

}
.keypad-table tr:first-child .key{
   background-color: #00695C;
}
.keypad-table tr:first-child .key:active{
   background-color: #004D40;
}
.keypad-table tr td:last-child .key{
   background-color: #558B2F;
}
.keypad-table tr td:last-child .key:active{
   background-color: #1B5E20;
}
.key{
   width: 90px;
   height: 90px;
   border: 1px solid black;
   text-align: center;
   line-height: 90px;
   border-radius: 10px;
   margin: 5px;
   background-color: #333333;
   color: #ffffff;
   cursor: pointer;
   user-select: none;
}
.key:active{
   background-color: #33333390;
}