.calculator {
margin: 50px auto;
padding: 20px;
border: 2px solid #ccc;
border-radius: 5px;
background-color: #fff;
width: 90%;
max-width: 800px;
display: flex;
flex-wrap: wrap;
}
.input-section,
.output-section {
flex-basis: 100%;
}
.input-section h2,
.output-section h2 {
margin-bottom: 10px;
}
.input-section label,
.output-section label {
display: block;
margin-bottom: 5px;
font-size: 14px;
}
.input-section input,
.output-section input {
padding: 5px;
margin-bottom: 10px;
width: 100%;
}
.input-section button,
.output-section button {
margin-top: 10px;
margin-bottom: 10px;
padding: 10px;
background-color: #008CBA;
border: none;
color: #fff;
border-radius: 5px;
cursor: pointer;
}
#reset-btn {background-color: red}
.input-section button:hover,
.output-section button:hover {
background-color: #005f73;
}