*{
    margin:0;
    padding:0;
}

body{
  font-family:Roboto;
  font-style: normal;
  background-color:rgb(255, 255, 255) ;
  text-align: center;
 
}
h1{
   
    margin-top:140px;
    margin-bottom:40px;
}
main{
    width: 90%;
    margin: auto;
    border-radius: 5px;
   
   
}
main{
   
    text-align: center;
}
main .contenedor{ 
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    height: auto;
   
}
main .contenedor .formulario, .firma{ 
    width: 42%;
  border-left: 1px solid rgba(102, 102, 102, 0.699);
  border-top: 1px solid rgba(102, 102, 102, 0.699);
    height: 400px;
    border-radius: 5px;
    box-shadow:10px 10px 8px rgba(151, 151, 151, 0.753);
    background-color:rgba(51, 51, 51, 0);
    padding: 30px;
}
.contenedor .firma{ 
 display: flex;
 align-items: center;
 justify-content: center;


}
.contenedor .firma img{ 
    width: 100%;
}
button{
 margin-top: 10px;
 width: 30%;
 padding: 10px;
 border-radius: 5px;
 border: none;
 background-color:rgb(255, 193, 77) ;
 box-shadow: 5px 5px 8px rgba(126, 126, 126, 0.753);
 cursor: pointer;
 transition: 0.3s linear;
}
button:hover{
    background-color:rgb(255, 166, 0) ;

}
form{
    width: 80%;
    margin: auto;
   
}
form div {
    display: flex;
    flex-direction:column;
    align-items: flex-start;
}
form div input{
   margin: 6px 0px;
   width: 100%;
   padding:5px;
   border-radius: 5px;
   border: 1px solid;
  
}
form div input:focus{
background-color: rgba(240, 240, 240, 0);
box-shadow: 1px 1px 5px rgb(56, 56, 56);

}
@media (max-width:1560px) {

    main .contenedor {
       
        flex-direction: column;
        height: auto;
    }

    main .contenedor .formulario, .firma {
        margin-top: 20px;
        width: 80%;
     
      
    }
}

@media (max-width:1080px) {
    main .contenedor .formulario, .firma {
        margin-top: 20px;
        width: 100%;
        height: auto;
      
    }
}

@media (max-width:768px) {
    main .contenedor {
        flex-direction: column;
        height: auto;
    }

    main .contenedor .formulario, .firma {
        width: 90%;
        margin: 10px 0px;
        height: auto;
    }

    h1 {
      
        margin-top: 45px;
    }


    button {
        margin: 13px 0px;
        width: 90%;
        
    }
    
}



    
  
