style.css

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,100&family=Raleway:wght@100&family=Zen+Kurenaido&display=swap');
*{
    margin: 0px;
    padding: 0px;
}
body{
font-family: 'Lato', sans-serif;
font-family: 'Raleway', sans-serif;
font-family: 'Zen Kurenaido', sans-serif;
background-color: #fed7aa;}
h1{text-align: center; font-weight: bolder;font-size: 3.5rem;}
.img{
    display: block;
    margin: 6vh auto;
    height: 25vh;
}
.container{
    display: block;
     height:20vh;
     width: 50%;
     align-items: center;
     justify-content: center;
     margin: auto ;font-weight: bold;}
#input{
    display: block;
    height:20vh;
    width: 50%;
    align-items: center;
    justify-content: center;
    margin: 1rem auto ;
    border: 1px solid black;
}

#button{
    display:block;
    margin:  auto;
    border-radius:15px;
    padding: 0.8rem 0.8rem;
    border-color: black;
    background-color: #fdba74;
}
#para{text-align: center;margin: 1rem 0.5rem;font-weight: bold;
}
button:hover{cursor: pointer; background-color: #ea580c;}

#output{  display: block;
    height:25vh;
    width: 50%;
    align-items: center;
    justify-content: center;
    margin: 1rem auto ;
    border: 1px solid black;}