Wordpress не показывает часть CSS на мобильном телефоне

Question

Я создал свою собственную тему WordPress, и все прошло гладко, пока я не включил ее в сеть и не посмотрел ее на своем телефоне. Видимо, только часть моего css не показывается. Именно этот CSS я использую для изменения внешнего вида форм из плагина "Ninja Forms".

Я добавил классы CSS к элементам формы через плагин и использовал их, чтобы изменить внешний вид форм в CSS.

Он отлично работает на настольном компьютере (компьютер с Windows, браузеры Chrome и Edge, но не на моем телефоне (iPhone, браузер Safari). Я подумал, что проблема может быть в Safari, но CSS работает на моем iPad в Safari. ..

Есть идеи, в чем может быть проблема?

Ниже используется CSS для форм.

#newsletter-form, #contact-form {
    width: 30%;
    text-align: center;
    margin: 0 auto;
}

#newsletter-form {
    padding: 100px 0 50px 0;
}

#contact-form {
    padding: 50px 0 100px 0;
}

#contact-form h3, #newsletter-form h3 {
    font-size: 35px;
    padding: 0 0 10px 0;
}

.form-contact-name-wrap, .form-newsletter-name-wrap {
    padding: 20px 0 0 0;
}


.form-contact-name, .form-newsletter-name {
    border: 2px solid rgba(215,134,0,0.5);
}

.field-wrap div input, .field-wrap textarea {
    height: 35px;
    padding: 5px;
}

.form-contact-email, .form-newsletter-email {
    border: 2px solid rgba(215,134,0,0.5);
}

.form-contact-message, .form-newsletter-message {
    border: 2px solid rgba(215,134,0,0.5);
}

.form-contact-submit-wrap, .form-newsletter-submit-wrap {
    background: #D78600;
    color: white;
    border: 2px solid #9A6000;
    height: 40px;
    width: 120px;
    border-radius: 7px;
    margin: 0 auto;
}

.form-contact-submit-wrap:hover, .form-newsletter-submit-wrap:hover {
    background-color: #9A6000;
}