Issues:
1.wpcf7 .screen-reader-response {
2 position: absolute;
3 overflow: hidden;
4 clip: rect(1px, 1px, 1px, 1px);
5 clip-path: inset(50%);
6 height: 1px;
7 width: 1px;
8 margin: -1px;
9 padding: 0;
10 border: 0;
11 word-wrap: normal !important;
12}
13
14.wpcf7 .hidden-fields-container {
15 display: none;
16}
17
18.wpcf7 form .wpcf7-response-output {
19 margin: 2em 0.5em 1em;
20 padding: 0.2em 1em;
21 border: 2px solid #00a0d2; /* Blue */
22}
23
24.wpcf7 form.init .wpcf7-response-output,
25.wpcf7 form.resetting .wpcf7-response-output,
26.wpcf7 form.submitting .wpcf7-response-output {
27 display: none;
28}
29
30.wpcf7 form.sent .wpcf7-response-output {
31 border-color: #46b450; /* Green */
32}
33
34.wpcf7 form.failed .wpcf7-response-output,
35.wpcf7 form.aborted .wpcf7-response-output {
36 border-color: #dc3232; /* Red */
37}
38
39.wpcf7 form.spam .wpcf7-response-output {
40 border-color: #f56e28; /* Orange */
41}
42
43.wpcf7 form.invalid .wpcf7-response-output,
44.wpcf7 form.unaccepted .wpcf7-response-output,
45.wpcf7 form.payment-required .wpcf7-response-output {
46 border-color: #ffb900; /* Yellow */
47}
48
49.wpcf7-form-control-wrap {
50 position: relative;
51}
52
53.wpcf7-not-valid-tip {
54 color: #dc3232; /* Red */
55 font-size: 1em;
56 font-weight: normal;
57 display: block;
58}
59
60.use-floating-validation-tip .wpcf7-not-valid-tip {
61 position: relative;
62 top: -2ex;
63 left: 1em;
64 z-index: 100;
65 border: 1px solid #dc3232;
66 background: #fff;
67 padding: .2em .8em;
68 width: 24em;
69}
70
71.wpcf7-list-item {
72 display: inline-block;
73 margin: 0 0 0 1em;
74}
75
76.wpcf7-list-item-label::before,
77.wpcf7-list-item-label::after {
78 content: " ";
79}
80
81.wpcf7-spinner {
82 visibility: hidden;
83 display: inline-block;
84 background-color: #23282d; /* Dark Gray 800 */
85 opacity: 0.75;
86 width: 24px;
87 height: 24px;
88 border: none;
89 border-radius: 100%;
90 padding: 0;
91 margin: 0 24px;
92 position: relative;
93}
94
95form.submitting .wpcf7-spinner {
96 visibility: visible;
97}
98
99.wpcf7-spinner::before {
100 content: '';
101 position: absolute;
102 background-color: #fbfbfc; /* Light Gray 100 */
103 top: 4px;
104 left: 4px;
105 width: 6px;
106 height: 6px;
107 border: none;
108 border-radius: 100%;
109 transform-origin: 8px 8px;
110 animation-name: spin;
111 animation-duration: 1000ms;
112 animation-timing-function: linear;
113 animation-iteration-count: infinite;
114}
115
116@media (prefers-reduced-motion: reduce) {
117 .wpcf7-spinner::before {
118 animation-name: blink;
119 animation-duration: 2000ms;
120 }
121}
122
123@keyframes spin {
124 from {
125 transform: rotate(0deg);
126 }
127
128 to {
129 transform: rotate(360deg);
130 }
131}
132
133@keyframes blink {
134 from {
135 opacity: 0;
136 }
137
138 50% {
139 opacity: 1;
140 }
141
142 to {
143 opacity: 0;
144 }
145}
146
147.wpcf7 [inert] {
148 opacity: 0.5;
149}
150
151.wpcf7 input[type="file"] {
152 cursor: pointer;
153}
154
155.wpcf7 input[type="file"]:disabled {
156 cursor: default;
157}
158
159.wpcf7 .wpcf7-submit:disabled {
160 cursor: not-allowed;
161}
162
163.wpcf7 input[type="url"],
164.wpcf7 input[type="email"],
165.wpcf7 input[type="tel"] {
166 direction: ltr;
167}
168
169.wpcf7-reflection > output {
170 display: list-item;
171 list-style: none;
172}
173
174.wpcf7-reflection > output[hidden] {
175 display: none;
176}