.numberpad{display:grid;width:max-content;background-color:#000;grid-template-areas:" d  d  d  c" "n7 n8 n9  b" "n4 n5 n6  x" "n1 n2 n3  a" " s n0  p  a"}@media (orientation: portrait){.numberpad{font-size:min(10vw,50px);grid-template-columns:repeat(4,min(20vw,100px));grid-template-rows:repeat(5,min(20vw,100px));grid-gap:1vw;padding:1vw}}@media (orientation: landscape){.numberpad{font-size:min(8vh,50px);grid-template-columns:repeat(4,min(16vh,100px));grid-template-rows:repeat(5,min(16vh,100px));grid-gap:1vh;padding:1vh}}.numberpad div{display:flex;align-items:center;text-align:center;color:#fff}.numberpad div:hover{cursor:pointer}.numberpad div *{margin:0 auto}.grid-area-d{grid-area:d;margin-left:auto}.fractionpad{display:grid;width:max-content;background-color:#000;grid-gap:2px;padding:2px;grid-template-areas:" w  w nd nd" "n7 n8 n9 r3" "n4 n5 n6 r2" "n1 n2 n3 r1" " b n0  f r1"}@media (orientation: portrait){.fractionpad{font-size:min(10vw,50px);grid-template-columns:repeat(4,min(20vw,100px));grid-template-rows:repeat(5,min(20vw,100px))}}@media (orientation: landscape){.fractionpad{font-size:min(8vh,50px);grid-template-columns:repeat(4,min(16vh,100px));grid-template-rows:repeat(5,min(16vh,100px))}}.fractionpad div{display:flex;align-items:center;text-align:center;color:#fff}.fractionpad div:hover{cursor:pointer}.fractionpad div *{margin:0 auto}.grid-area-w{grid-area:w}.grid-area-nd{grid-area:nd}.cursor-pointer:hover{cursor:pointer}
