body{
    overflow: hidden;
    background:linear-gradient(rgba(190, 132, 190, 0.159),rgb(129, 245, 216,0.333)
    );
}
.container{
    border:2px solid grey;
    width:100%;
    height:100vh;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.calci{
    border: 2px solid white;
    border-radius: 40px;
    width: 200px;
    height: 200px;
    margin: auto;
    padding: 30px 30px 35px 35px;
   box-shadow: 0px 2px 4px 0px black;
}
#userinput{
    box-sizing: border-box;
    width: 100%;
    padding: 30px 3px;
    background: whitesmoke;
    text-align: right;
    direction: ltr;
    outline: none;
    border: 2px solid rgb(190, 187, 182);
}
.btn{
    width: 47px;
    height: 25px;
    border-radius: 2px;
    outline: none;
    margin-top: 3px;
}
.btnp{
    width: 47px;
    height: 25px;
    border-radius: 2px;
    outline: none;
    margin-top: 3px;
}
.btn:hover .btnp:hover{
    background-color: rgb(179, 175, 170);
}
@media(max-width:320px) {
    .btn{
        width:39px;
    }
}