@media screen and ( min-width: 981px ) and ( max-width: 1400px ) {
    main{
        max-width: 1400px;
        width:80%;
        margin:0 auto;
    }
    body{
    font-size: 300%;
    }
}
@media screen and ( min-width: 601px ) and ( max-width: 980px )  {
    main{
        max-width: 980px;
        width:80%;
        margin:0 auto;
    }
    body{
        font-size: 200%;
        } 
}
@media screen and ( min-width: 370px ) and ( max-width: 600px ) {
    main{
        max-width: 600px;
        width:80%;
        margin:0 auto;
    }
    body{
        font-size: 60%;
        } 
}
main input,label{
    display:block;
}
body{
    background-color:salmon;
    color: white;
    font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-size: 100%;
    text-align: center;
    margin:10%;
    
}
main form input{
    display:block;
}
figcaption{
    text-align: center;
}
body header{
    text-align: center;
}
a{
    color: blueviolet;
    text-decoration: none;
}
a:hover{
    
    color:darkblue;
}
main{
    text-align: left;
    margin:0 auto;
    width:95%;
    max-width:1200px;
}
h2{
    text-align: center;
}
main img{ 
    
    height:250px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    display:block;
}
.info{
    background-color: black;
    color:wheat;
}
.even{
    background-color: gray;
    color:black;
}
.even{
    background-color:darkgrey;
    color:black;
}
.clientinfo{
    background-color:teal;
    color:whitesmoke;
}
.calculator_keys { 
    display: grid; 
    /* other necessary CSS */ 
  }
#fullname, #telephone, #email{
    display:block;
}
li{
    text-align: left;
}

main div button{
    text-align: left;
}
main div p{
    background-color: whitesmoke;
    color: black;
}
footer button{
    background: teal;
    text-align: center;
    border-radius: 20%;
}