.container{
    max-width: 65vh;
   margin:2vh auto 2vh auto;
    box-shadow: 0px 10px 43px 17px;
    padding-top: 2vh;
    border-radius: 20px;
    box-shadow: rgb(20, 20, 18);
}
.display{
    text-align: right;
    height: 15vh;
    line-height: 10px;
    padding: 15px 7px;
    font-size: 40px;
    border: 1px solid grey;
    border-radius: 3vh;
}
.buttons{
    display: grid;
    margin-top: 10px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}
.buttons>div{
    border-top: 2px solid rgb(63, 58, 58);
    border-right: 2px solid rgb(39, 35, 35);  
}
.button{
    border: 0.5px solid rgb(110, 104, 104);
    line-height: 80px;
    text-align: center;
    font-size: 30px;
    border-radius: 15px;
    margin: 5px;
    padding: 2px 2px 2px 2px;
}
.button:hover{
background-color: rgb(22, 18, 18);
color: ivory;
transition: 0.5s ease-in-out;
}
.sym{
    border: 0.5px solid rgb(110, 104, 104);
    line-height: 80px;
    text-align: center;
    font-size: 30px;
    border-radius: 15px;
    margin: 5px;
    padding: 2px 2px 2px 2px;
    color: orangered;
    font-weight: bold;
}
.sym:hover{
    background-color: rgb(85, 81, 81);
    color: ivory;
    transition: 0.5s ease-in-out;
    }
#equal{
    border: 0.5px solid rgb(110, 104, 104);
    line-height: 80px;
    text-align: center;
    font-size: 30px;
    border-radius: 15px;
    margin: 5px;
    padding: 2px 2px 2px 2px;
    background-color: orangered;
    font-weight: bold;  
}
#equal:hover{
    background-color: rgb(211, 123, 65);
    color: rgb(235, 235, 226);
    transition: 0.5s ease-in-out;
    }