@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');

*{
margin: 0;
padding: 0;
box-sizing: border-box;
}

body {
height: 100%;
font-family: 'Oswald', sans-serif;
background: linear-gradient(0.25turn, #d8e9f0, #ebf8e1, #dfd4c8);
}

.title{
text-align: center;
color: rgb(208, 214, 211);
font-family: Georgia, 'Times New Roman', Times, serif;
text-shadow: 2px 1px rgb(8, 26, 10);
/* margin-top: 20px; */
}
#form{

display: flex;
justify-content: center;
align-items: center;
align-content: center;
flex-flow: row nowrap;


}
.form-control{
margin-top: 10px;
padding: 15px;
width: 50%;
outline: 0.1px solid transparent;


}
.form-control:focus{
outline-color: blue;

}
.btn{
  margin-top: 10px;
padding: 5px;
height: 3.1rem;
/* margin-top: 35px; */
cursor: pointer;

}
.result{

display: flex;
flex-flow: column wrap;
justify-content: space-between;
align-items: center;
margin: 20px;
box-shadow: 3px 3px 5px 6px #ccc;

background: linear-gradient(90deg, rgb(119, 114, 212) 0%, rgb(224, 202, 226) 32%, rgba(237, 222, 238, 0.73) 35%, rgba(0,212,255,1) 100%); 
}