/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

body {
    overflow: hidden;
}

.is-search-form {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    width: 92%;
}

@media (max-width: 480px) {
    .is-search-form {
        flex-direction: column !important;
        width: 100% !important;
        text-align: center !important;
    }

    input {
        border-radius: 0;
    }

    .search-input-field {
        width: 100% !important;
    }

    .search-submit {
        width: 100% !important;
        margin-left: -25px !important;
        margin-top: 10px !important;
    }
}

.search-input-field {
    width: 70%;
}

.search-submit {
    width: 30%;
}

.is-search-form input {
    border-radius: 25px !important;
    border: 0px;
    flex: 1 !important;
    width: 100%;
}

.is-search-form #search_keywords {
    font-size: 14px;
    padding: 10px 20px;
}

.is-search-form .is-search-submit {
    position: relative !important;
    text-transform: uppercase !important;
    margin-left: 15px;
    font-size: 14px;
    padding: 10px 20px;
}

.is-search-form .is-search-submit:hover {
    background-color: #ffffff !important;
}

.wpforms-field-container input, .wpforms-field-container textarea {
    border: 0px !important;
}

.wpforms-submit {
    border-radius: 50px !important;
    font-size: 16px !important;
}

/**
 * Hide the categories that are not needed in the dropdown.
 */
.chosen-container .chosen-results li.cultureel,
.chosen-container .chosen-results li.educatie,
.chosen-container .chosen-results li.gemeenschapsvorming,
.chosen-container .chosen-results li.maatschappelijke-activering {
    display: none !important;
}

.display-none {
    display: none;
}