.form-page{
   
     background-size: cover;
     background-position: center;
     display: flex;
     margin: 50px 20px;
    width: 100%;
    height: 100%;
  
    justify-content: center;
    gap: 30px;
  

}

form{
    border: 3px solid rgb(142, 140, 135);
    box-shadow:0 8px 20px rgba(142, 140, 135, 0.3) ;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px;
    background-color: #eeeeee;
    width: 42.7%;

}
form p{

    font-size: 20px;
    text-align: center;
    padding:10px 0px ;
    background-color: rgb(181, 168, 193);
    color: white;
    font-style: italic;
}

form input, select, textarea, button{
    padding: 15px;
    color: black;
    font-size: 16px;
}
form .check{
    display: flex;
    /* gap: 20.6%;    */
    gap: 12%;
}

form .check .checkin{
    gap: 29%; 
}

form .check input{
    margin-left: 27px;
}



form .select{
    display: flex;
    gap: 14%;
}

form select{
    width: 50%;
}

form .select input{
    width:100%;
}


form button{
    text-align: center;
    margin: auto;
    padding: 10px 80px ;
    font-size: 18px;
    border: none;
    background-color: rgb(95, 144, 95);
    color: white;
    border-radius: 10px;
}
form button:hover{
    background-color: rgb(231, 223, 178);
    color: #000;
}




@media only screen and (min-width:100px) and (max-width:600px){
    form{
       
        width: 100%;
       height: auto;
    }
    
form .check{
    display: flex;
    gap: 1%;
  
}
form .check label{
    
    font-size: 14px;
}



form .check input{
    margin-left:0px;
    padding: 5px 5px;
    width: 130px;
    /*border: 1px solid ;*/
}

form .check input{
    margin-left:10px;
}


.form-page{
     display: flex;
    flex-direction: column;
    padding-inline: 20px;
}
.form-page iframe{
    width: 100%;
   
     
}



}


iframe{
   border: 1px solid ;
   width: 30%;
   height: 75vh;
   padding-inline: 10px;
 
}