*{
    margin: 0;
    padding: 0;
}
body{
    display: flex;
    justify-content: center;
    padding-top: 60px;
}
.container{
    width:350px;
    height: 600px;
    display: flex;
   flex-direction: column;
   align-items: center;
 
   border-top-left-radius: 16px;
   border-top-right-radius: 16px;
   box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
    
}
.box >form{
    width:300px ;
    height:250px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    
    
}

.box > form >:nth-child(1){
    width: 100%;
    height: 40px;
    border:1px solid #fa116a;
    background-color: whitesmoke;
   text-align: center;
   margin-top: 8px;
}
span{
    float: inline-end;
}

.head{
display: flex;
align-items: center;

width: 95%;
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 1px 0px;

}
.head > button{
font-size: 20px;
border: none;
background-color: white;
font-style: solid;
}
.head> h3{
    width: 100%;
    height: 40px;
    text-align: center; 
    padding: 10px;
    font-size: 18px;
  
font-family: 'Roboto', sans-serif;
    padding-top: 20px;
}
#procedd{
width:100%;
height: 40px;
border: none;
color: white;
background-color:#ff1e75;
font-size: 18px;
font-family: 'Roboto', sans-serif;

}