body{
    margin:10px;
}

.calc-container{
    margin:auto;
    max-width:280px;
    width:100%;
    border:2px solid;
    padding:10px;
}

.screen{
    width: 98%;
    height:40px;
    max-width:98%;
    background-color: #eecfa9;
    color:#000000;
    padding:30PX;
    font-size:20px;
    border:2px outset;
}

.screen{
    margin: 0px;
    padding:10px 3px;
    font-size:20px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color:rgb(78, 78, 78);
}

.buttons{
    display:inline-block;
    max-width:390px;
    height:40px;
    width:230px;
}

.buttons li{
    margin:2px;
    padding:10px;
    display:inline-block;
    margin:auto;
}

.buttons button{
    background-color:gray;
    height:30px;
    width:30px;
    margin:auto;
    color:white;
    border:1x outset #000000;
    text-align:center;
}


.buttons button:hover{
    background-color:gray;
    height:30px;
    width:30px;
    margin:auto;
    color:white;
    border:2px inset #4d4a4a;
    text-align:center;
    transition:0.6s ease-in-out;
}


.buttons #equal{
    background-color:rgb(118, 223, 150);
    height:30px;
    width:40%;
    margin:auto;
    text-align:center;
    color:white;
    
}

.buttons #UP, .buttons #DOWN{
    background-color:rgb(118, 223, 150);
    height:30px;
    width:2cm;
    margin:auto;
    text-align:center;
    color:white;
    
}

.message{
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-size:20px;
}

.title{
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-weight:oblique;
    color:grey;
    font-size:16px;
    text-align:center;
    text-decoration: underline;
}