/*
 * contacts style for oleificio-gallura template.
 *
 * Renamed contact.css -> contact-v2.css: this asset is served with a
 * 1-year Cache-Control and no cache-busting, so edits to it don't reach
 * visitors - a brand-new, never-before-requested filename is needed to
 * guarantee a fresh load (see pages/contact.php).
 */

section#form div#map {
    height: 20em;
    position: relative;
    overflow: hidden;
}

section#form div#map img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section#form > a {
    position: absolute;
    top: 17.5em;
    left: 0;
    right: 0;
    margin: auto;
    width: 12em;
    padding: .5em 0;
    font-size: 1.3em;
}

section#form h1 {
    padding: 2em 10%;
}

section#form div.contact > div.form, section#form div.contact > div.contacts {
    width: 50%;
    float: left;
    text-align: left;
    padding: 0 5%;
}

section#form div.contacts h3 {
    margin-bottom: .8em;
}

section#form div.contacts p {
    margin-bottom: .5em;
}

section#form form {
    margin: 0;
    width: 100%;
}

section#form form input, section#form form textarea {
    border-bottom: 2px solid #5E6D12;
}

section#form form label a {
    text-decoration: underline;
    color: initial;
}

section#form form input[type="submit"] {
    border: 1px solid #5E6D12;
}

section#form form ::placeholder {
    color: #666666;
    opacity: 1; /* Firefox */
}

section#form form :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #666666;
}

section#form form ::-ms-input-placeholder { /* Microsoft Edge */
    color: #666666;
}

/* Mobile version */
@media screen and (max-width: 500px) {

    section#form h1 {
        padding: 2em 5%;
    }

    section#form div.contact > div.form {
        width: 100%;
    }

    section#form div.contact > div.contacts {
        display: none;
    }
}