form {
    padding: 5vw;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    justify-content: center;
    align-items: center;
}

.message{
    grid-column: span 2;
}

form * {
    font-family: 'Raleway', sans-serif;
    font-size: 1rem;
    padding: 0.75rem;
    margin: 0.5rem;
    border-radius: 3px;
    border: black 2px solid;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.306);
    transition: all 100ms ease-in-out;
}

form input:hover, form textarea:hover, form button:hover{
    border: #FF6B00 2px solid;
    background: transparent;
    box-shadow: 0 5px 10px #ff6a008a;
}

form > div > *:focus {
    background-color: #ff6a001c;
}

textarea {
    height: 25rem;
    font-size: 1rem;
}

form > button {
    outline: none;
    color: black;
    font-family: inherit;
    font-size: 1rem;
    border-color: black;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.306);
    grid-column: 2 / 3;
}

form > button:hover{color:#FF6B00}

@media (max-width: 500px) {
    form {padding: 1em;}
    form * {
        margin: 5px;
        padding: 5px;
    }
}

@media (max-width: 400px) {
    form {grid-template-columns: 1fr;}
    .message {grid-column: 1;}
    form > button {grid-column: 1;}
}