*{ 
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family: Arial, Helvetica, sans-serif;
}
body{
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    background-image: url(sas.JPG);
    background-attachment: fixed;
    background-size: cover;
}
.Calculator{
    width:330px;
    padding:25px;
    border-radius:35px;
    background:black;
    box-shadow: white
    15px 15px 30px transparent,
    -10px -10px 20px transparent;
}
.display{
    width:100%;
    height:90px;
    border:none;
    outline:none;
    border-radius:25px;
    margin-bottom:35px;
    padding:25px;
    text-align:right;
    font-size:55px;
    color:white;
    background:transparent;
    box-shadow:black;
}
.button{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
}
button{
     height:65px;
     border:none;
     border-radius:50%;
     font-size:24px;
     cursor:pointer;
     background:#eef2f3;
    color:black;
    box-shadow:
    inset 6px 6px 12px rgba(0,0,0,0.08),
    inset -6px -6px 12px rgba(255,255,255,0.9);
    transition:0.2s;


}
button:hover{
    transform:scale(1.05);
}
button:active{
      box-shadow:white;
}
.operator{
     color:white;
     font-weight:bold;
     background-color: black;
}
.equal{
    grid-column: span 2;
    border-radius: 40px;
    background:black;
    color: white;
    font-size: 28px;
}