a {
        text-decoration: unset;
        transition: all 0.15s;
        color: black !important;
        font-size: 1.5vh;
    }

    .contact-container {
        display: flex;
        width: 100%;
        margin-top: 200px;
        font-size: 3vh !important;
    }

    /* Form takes half */
    .contact-form {
        flex: 1;
        padding-left: 50px;
        padding-right: 50px;
        height: auto;
    }

    h2 {
        font-weight: bold;
        padding-bottom: 50px;
    }

    .form-group {
        margin-bottom: 25px;
        position: relative;
    }

    label {
        display: block;
        font-size: 1vw;
        margin-bottom: 5px;
    }

    input,
    textarea,
    select {
        width: 100%;
        border: none;
        border-bottom: 2px solid #555;
        background: transparent;
        padding: 10px 0;
        font-size: 0.8vw;
        color: black;
        outline: none;
        transition: border-color 0.3s;
    }

    input:focus,
    textarea:focus,
    select:focus {
        border-bottom: 2px solid #00aaff;
    }

    select {
        appearance: none;
        cursor: pointer;
    }

    .error {
        color: red;
        font-size: 0.8vw;
        margin-top: 5px;
    }

    textarea {
        resize: none;
        height: 80px;
    }

    button {
        background: transparent;
        color: black;
        border: none;
        font-size: 1vw;
        letter-spacing: 2px;
        cursor: pointer;
        border-bottom: 2px solid black;
        transition: color 0.3s, border-color 0.3s;
    }

    button:hover {
        color: gray;
        border-color: gray;
    }

    /* Map takes half */
    .contact-map {
        flex: 1;
    }

    iframe {
        width: 100%;
        height: 100%;
        border: none;
    }


    @media only screen and (max-width: 1200px) {
        @media (max-width: 1200px) {
            .contact-container {
                margin-top: 130px;
            }

            label {
                font-size: 1.8vh !important;
            }

            input,
            textarea,
            select {
                font-size: 1.5vh;
            }

            .error {
                font-size: 1.5vh;
            }

            button {
                font-size: 1.2vh;
            }
        }
    }

    @media (max-width: 915px) {
        .contact-container {
            margin-top: 100px;
        }
    }

    /* --------- Responsive for mobile --------- */
    @media (max-width: 768px) {
        .contact-container {
            flex-direction: column;
            /* stack vertically */
            height: auto;
            /* remove fixed height */
            margin-top: 100px;
        }

        .contact-map {
            order: -1;
            /* put map above form */
            height: 500px !important;
            /* force 300px height */
            flex: none;
        }

        iframe {
            height: 100% !important;
            /* fit inside .contact-map */
        }

        .contact-form {
            padding: 20px;
        }
    }