Contact Form submit button positioning

[harry_ord]

Hello

This is my site:

http://cvkj.agencialosnavegantes.cl/

I have a contact form at the bottom of the page and i'm trying to put the submit button next to the text box, but i'm struggling a lot.

This is my initial css:

 

#enviarbajo {
    background:url(http://cvkj.agencialosnavegantes.cl/wp-content/uploads/2017/08/paper-plane-2.png) no-repeat;
    background-color: #564585;
    width:40px; 
    height:40px; 
    padding:0px 0 4px 0; 
    border:none; text-indent: -1000em; cursor:pointer;
    border-radius: 0;
    margin: 5%;
    position: relative;
    left: 35%;
   
}

Then i tried to position the button using media-queries, but i'm not able to put the button where i want

 

@media (max-width: 768px){
   #enviarbajo {
    position: relative;
    right: 100px;
    }
}

Other media-query below:

 

@media only screen and (max-width: 500px) {
    #enviarbajo {
    position: relative;
    right: 50px;
    }

Is there a more efficient way of doing this?

[harry_ord]

Here's the solution to my problem. Thanks.

 

#footer-widgets form.wpcf7-form div:nth-child(2){
  width: calc(100% - 40px);
}
#footer-widgets form.wpcf7-form div:nth-child(2) > span{
  margin: 0;
}
#footer-widgets form.wpcf7-form div:nth-child(2) input{
  width: 100%;
}

#footer-widgets form.wpcf7-form div:nth-child(3){
  width: 40px;
}