.container{
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(225deg, #e4ff8b 0%, #a58aff 100%)
}
.main_container{
    width: 28%;
    height: 60%;
    background-color: rgb(206, 207, 212);
    padding: 25px;
   
    
}
.text{
  padding-bottom: 20px;
  font-size: 20px;
}

input{
    width: 98%;
    border-radius: 10px;
    height: 5vh;
  font-size: 30px;
  background-color: rgb(235, 232, 232); 
  outline: none;
}
input:focus{
    border: none;
    outline: none;
}
select{
    width: 100px;
    height: 25px;
    background-color: rgb(215, 215, 229);
    border-radius: 10px;
    cursor: pointer;
}


button{
    width: 100%;
    background-color: green;
    color: white;
    font-size: 20px;
    cursor: pointer;
    border-radius: 10px;
  transition: all 0.3 ease;
    
}
button:hover{
    background-color: rgb(76, 188, 130);
    transform: scale(1.05);
}
@media only screen and (max-width: 600px) {
  .main_container{
    width: 90vw;
    height: 90vh;
 padding: 5px;
  }
}
@media only screen and (min-width:800px || max-width:1200px){
    .main_container{
        width: 90vw;
        height: 90vh;
        padding: 2px;
    }
}