Enfold: Style von Kali Forms anzeigen Contact Form

Hey DermaBBSaar,

Thank you for the inquiry.

Where can we check the issue? Please provide the site URL in the private field so that we can inspect the elements. We may need to add a few css changes to re-apply the default plugin styling to the contact form fields.

Best regards,
Ismael

Hi,
Thank you for your patience and the link to your site, but the login that you provided doesn’t seem to be an admin login so we don’t have access to the theme settings or the pluging files. Typically css issues like this occur when the plugin uses weak specificity, we may be able to adjust the css of the plugin to suit, but we would also need to see what your expected results are, I assume that if we look at the same page when the default WordPress theme is enabled we will see what you are trying to achieve.
Please try this yourself to confurm that this is true and then upgrade our login so we can examine.

Best regards,
Mike

Hi,
Thank you for the link to your site, I added this custom css to your WordPress ▸ Customize ▸ Additional CSS and now the kaliforms form seem to be as you wish:

#top .main_color .kaliforms-form-container.rounded-borders input[type=color], #top .main_color .kaliforms-form-container.rounded-borders input[type=date], #top .main_color .kaliforms-form-container.rounded-borders input[type=datetime-local], #top .main_color .kaliforms-form-container.rounded-borders input[type=datetime], #top .main_color .kaliforms-form-container.rounded-borders input[type=email], #top .main_color .kaliforms-form-container.rounded-borders input[type=month], #top .main_color .kaliforms-form-container.rounded-borders input[type=number], #top .main_color .kaliforms-form-container.rounded-borders input[type=password], #top .main_color .kaliforms-form-container.rounded-borders input[type=search], #top .main_color .kaliforms-form-container.rounded-borders input[type=tel], #top .main_color .kaliforms-form-container.rounded-borders input[type=text], #top .main_color .kaliforms-form-container.rounded-borders input[type=time], #top .main_color .kaliforms-form-container.rounded-borders input[type=url], #top .main_color .kaliforms-form-container.rounded-borders input[type=week], #top .main_color .kaliforms-form-container.rounded-borders select, #top .main_color .kaliforms-form-container.rounded-borders div[class=kali-forms-digital-signature], #top .main_color .kaliforms-form-container.rounded-borders textarea, #top .main_color .kaliforms-form-container.rounded-borders #kali-stripe-iban-element, #top .main_color .kaliforms-form-container.rounded-borders #kali-stripe-card-element {
    border-radius: 15px;
    padding-right: 15px;
    padding-left: 15px;
}
#top .main_color .kaliforms-form-container.input-with-bg input[type=color], #top .main_color .kaliforms-form-container.input-with-bg input[type=date], #top .main_color .kaliforms-form-container.input-with-bg input[type=datetime-local], #top .main_color .kaliforms-form-container.input-with-bg input[type=datetime], #top .main_color .kaliforms-form-container.input-with-bg input[type=email], #top .main_color .kaliforms-form-container.input-with-bg input[type=month], #top .main_color .kaliforms-form-container.input-with-bg input[type=number], #top .main_color .kaliforms-form-container.input-with-bg input[type=password], #top .main_color .kaliforms-form-container.input-with-bg input[type=search], #top .main_color .kaliforms-form-container.input-with-bg input[type=tel], #top .main_color .kaliforms-form-container.input-with-bg input[type=text], #top .main_color .kaliforms-form-container.input-with-bg input[type=time], #top .main_color .kaliforms-form-container.input-with-bg input[type=url], #top .main_color .kaliforms-form-container.input-with-bg input[type=week], #top .main_color .kaliforms-form-container.input-with-bg select, #top .main_color .kaliforms-form-container.input-with-bg div[class=kali-forms-digital-signature], #top .main_color .kaliforms-form-container.input-with-bg textarea, #top .main_color .kaliforms-form-container.input-with-bg #kali-stripe-iban-element, #top .main_color .kaliforms-form-container.input-with-bg #kali-stripe-card-element {
    box-shadow: none;
    background-color: #f2f2f2;
}
#top .main_color .kaliforms-form-container .row>div>input[type=color], #top .main_color .kaliforms-form-container .row>div>input[type=date], #top .main_color .kaliforms-form-container .row>div>input[type=datetime-local], #top .main_color .kaliforms-form-container .row>div>input[type=datetime], #top .main_color .kaliforms-form-container .row>div>input[type=email], #top .main_color .kaliforms-form-container .row>div>input[type=month], #top .main_color .kaliforms-form-container .row>div>input[type=number], #top .main_color .kaliforms-form-container .row>div>input[type=password], #top .main_color .kaliforms-form-container .row>div>input[type=search], #top .main_color .kaliforms-form-container .row>div>input[type=tel], #top .main_color .kaliforms-form-container .row>div>input[type=text], #top .main_color .kaliforms-form-container .row>div>input[type=time], #top .main_color .kaliforms-form-container .row>div>input[type=url], #top .main_color .kaliforms-form-container .row>div>input[type=week], #top .main_color .kaliforms-form-container .row>div>select, #top .main_color .kaliforms-form-container .row>div>textarea {
    margin-bottom: 1rem;
}
#top .main_color .kaliforms-form-container label {
    display: inline-block;
    margin-bottom: 0.5rem;
}
#top .main_color .kaliforms-form-container label {
    display: block;
    font-weight: normal;
    color: #0a0a0a;
}
#top .main_color .kaliforms-form-container.bootstrap-wrapper .row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    margin-right: -15px;
    margin-left: -15px;
}
#top .main_color .kaliforms-form-container.bootstrap-wrapper .col-1, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-2, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-3, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-4, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-5, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-6, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-7, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-8, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-9, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-10, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-11, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-12, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-auto, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-1, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-2, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-3, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-4, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-5, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-6, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-7, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-8, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-9, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-10, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-11, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-12, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-sm-auto, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-1, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-2, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-3, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-4, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-5, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-6, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-7, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-8, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-9, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-10, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-11, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-12, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-auto, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-1, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-2, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-3, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-4, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-5, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-6, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-7, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-8, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-9, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-10, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-11, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-12, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-lg-auto, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-1, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-2, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-3, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-4, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-5, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-6, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-7, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-8, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-9, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-10, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-11, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-12, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl, #top .main_color .kaliforms-form-container.bootstrap-wrapper .col-xl-auto {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}
@media (min-width: 768px){
#top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-6 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}
}
@media (min-width: 768px){
#top .main_color .kaliforms-form-container.bootstrap-wrapper .col-md-12 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}
}
#top .main_color .kaliforms-form-container .row div[class^=col-], #top .main_color .kaliforms-form-container .row div[class*=" col-"] {
    margin-bottom: 15px;
}

please clear your browser cache and check.

Best regards,
Mike