main {
 display: flex;
 justify-content: center;
 align-items: flex-start;
}
.lower {
 font-family: "Poppins", sans-serif, "arial";
 font-weight: 600;
 font-size: xx-large;
 color: #0e2431;
 text-align: center;
}
form {
 display: flex;
 align-items: center;
 padding: 0 80px;
 flex-wrap: wrap;
}
#contact-left {
 padding: 0 80px;
}

/* ///// inputs /////*/

input:focus ~ label,
textarea:focus ~ label,
input:valid ~ label,
textarea:valid ~ label {
 font-size: 0.75em;
 color: #999;
 position: absolute;
 top: -5px;
 -webkit-transition: all 0.225s ease;
 transition: all 0.225s ease;
}

.styled-input {
 margin: 1rem 0;
 border-radius: 4px;
 position: relative;
}
.styled-input:first-child {
 margin-top: 0;
}

.styled-input label {
 color: #999;
 position: absolute;
 top: 10px;
 left: 0;
 padding: 1.3rem 30px 1rem 30px;
 pointer-events: none;
}

input,
textarea {
 padding: 30px;
 border: 0;
 width: 250px;
 font-size: 1rem;
 background-color: #2d2d2d;
 color: white;
 border-radius: 4px;
}

.submit-btn {
 width: 100%;
 padding: 10px 35px;
 border-radius: 60px;
 border: none;
 background-color: #4b8cfb;
 color: white;
 font-size: 18px;
 cursor: pointer;
 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.06), 0 2px 10px 0 rgba(0, 0, 0, 0.07);
 -webkit-transition: all 300ms ease;
 transition: all 300ms ease;
 align-self: center;
 margin-top: 15px;
}

.submit-btn:hover {
 transform: translateY(1px);
 box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.09);
}

@media only screen and (max-width: 768px) {
 main {
  flex-direction: column;
  align-items: center;
 }
 form {
  margin-top: 1em;
 }
 .lower {
  font-size: large;
 }
}