How to Align Side by Side Login and Registration Field

Hello everyone, my question falls into two parts, both in CSS:

First: I would like to know how to align the login and registration form side by side, go to: https://economizababy.com.br/minha-conta/.

I was able to decrease the size of the fields, but I can not put the registration form on the same line.

Second: How do I do when the person accesses the mobile version, the registration form is below the login form?

Below the codes I’m using

`.col-1 {
display: block;
}
.col-1 > form {
width: 500px;
display: inline-block;
}

.col-2 {
display: block;
}
.col-2 > form {
width: 500px;
display: inline-block;
}

The page I need help with: [log in to see the link]