Calculator.css

body
{
    display: flex;
    justify-content: center;
    flex-direction: column;
}
#main
{
    border: 5px solid lightgrey;
    height:60vh;
    width:20vw;
    align-self: center;
    margin-top: 15vh;
    min-width: 300px;
    min-height: 400px;
    display: flex;
   
    flex-wrap: wrap;
    border-top: 6px solid lightgrey;
    border-bottom: 6px solid lightgrey;
    
}
#display
{
    position: relative;
    height:20%;
    width:100%;
    border-bottom: 3px solid lightgrey;
    background-color: #F5F5F5;
    display: flex;
    justify-content: flex-end;
    
}
#d-para
{
    margin-top:10%;
    margin-right: 3%;
    font-size: 3rem;
    color: blue;
}
.btn
{
    margin:0px;
    padding:0px;
    width:25%;
    height:16%;
    border:1px solid lightgrey;
    display: inline-block;
    background-color: white;
}
#btn13
{
    width:50%
}
.para
{
    font-size: 1.5rem;
}
.btn:hover{
    background-color: #FFC877;
}
#btn19
{
    background-color: #C14444;
    color:white;
}
#btn19:hover
{
     background-color: limegreen;
}
#btn4
{
    background-color: #C14444;
    color:white;
}
#btn4:hover
{
     background-color: limegreen;
}
#btn8
{
    background-color: #C14444;
    color:white;
}
#btn8:hover
{
     background-color: limegreen;
}
#btn12
{
    background-color: #C14444;
    color:white;
}
#btn12:hover
{
     background-color: limegreen;
}
#btn15
{
    background-color: #C14444;
    color:white;
}
#btn15:hover
{
     background-color: limegreen;
}
#ndiv
{
    margin-top: 15vh;
    margin-bottom: -15vh;
    align-self:center;
    background-color: lightgrey;
    height:10vh;
    width:22vw;
    display:flex;
    justify-content: center;
    border: 5px solid lightgrey;
    min-width: 300px;
    min-height: 50px;

}
#name
{
    align-self: center;
    font-size: 2rem;
    text-align: center;
    width:22vw;
    min-width: 290px;
    background-color: black;
    color:white;
   
}