need4deed-sdk 0.0.7 → 0.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,892 @@
1
+ body {
2
+ font-family: "Figtree", sans-serif;
3
+ width: 100%;
4
+ margin: 0;
5
+ }
6
+
7
+ html {
8
+ scroll-behavior: smooth;
9
+ }
10
+
11
+ .gradient-overlay {
12
+ position: absolute;
13
+ top: 0;
14
+ left: 0;
15
+ width: 100%;
16
+ height: 100%;
17
+ pointer-events: none;
18
+ }
19
+
20
+ .image-filter-gradient-blue {
21
+ background: linear-gradient(
22
+ 180deg,
23
+ var(--color-midnight-misty) 11.02%,
24
+ var(--color-barely-blue) 89.66%
25
+ );
26
+ }
27
+
28
+ :root {
29
+ /* color */
30
+ --color-midnight: rgba(26, 38, 132, 1);
31
+ --color-midnight-light: rgba(58, 72, 178, 1);
32
+ --color-midnight-misty: rgba(44, 47, 153, 0.6);
33
+ --color-midnight-bright: rgba(75, 91, 212, 1);
34
+ --color-barely-blue: rgba(73, 79, 255, 0.05);
35
+ --color-aubergine: rgba(95, 38, 77, 1);
36
+ --color-aubergine-light: rgba(133, 63, 110, 1);
37
+ --color-orchid: rgba(247, 205, 255, 1);
38
+ --color-orchid-dark: rgba(242, 177, 255, 1);
39
+ --color-orchid-light: rgba(251, 226, 255, 1);
40
+ --color-orchid-subtle: rgba(254, 244, 255, 1);
41
+ --color-sand: rgba(242, 226, 211, 1);
42
+ --color-sand-dark: rgba(184, 172, 137, 1);
43
+ --color-magnolia: rgba(246, 238, 231, 1);
44
+ --color-papaya: rgba(255, 125, 104, 1);
45
+ --color-white: rgba(255, 255, 255, 1);
46
+ --color-black: rgba(0, 0, 0, 1);
47
+ --color-dimmed-background: rgba(0, 0, 0, 0.4);
48
+ --color-neutral-900: #fff;
49
+ --color-neutral-800: #eee;
50
+ --color-neutral-700: #ddd;
51
+ --color-neutral-600: #ccc;
52
+ --color-neutral-500: #bbb;
53
+ --color-neutral-400: #aaa;
54
+ --color-neutral-300: #888;
55
+ --color-neutral-200: #444;
56
+ --color-neutral-100: #000;
57
+
58
+ /* text */
59
+ --text-h2-font-weight: 600;
60
+ --text-h2-font-size: 32px;
61
+ --text-h2-line-height: 38px;
62
+
63
+ --text-h3-font-weight: 600;
64
+ --text-h3-font-size: 24px;
65
+ --text-h3-line-height: 30px;
66
+ --text-h3-letter-spacing: 0.1px;
67
+
68
+ --text-p-font-weight: 300;
69
+
70
+ /* icon */
71
+ --icon-color: var(--color-papaya);
72
+
73
+ /* card */
74
+ --card-border-radius: 24px;
75
+
76
+ /* text-activity-tag */
77
+ --text-activity-tag-font-weight: 600;
78
+ --text-activity-tag-font-size: 14px;
79
+ --text-activity-tag-line-height: 17px;
80
+ --text-activity-tag-text-align: center;
81
+
82
+ /* activities */
83
+ --activities-container-gap: 8px;
84
+ --activity-tag-border-radius: 4px;
85
+ --activity-tag-padding: 6px 8px;
86
+
87
+ /*homepage volunteering opportunity */
88
+ --homepage-volunteering-opportunity-detail-section-gap: 4px;
89
+ --homepage-volunteering-opportunity-detail-header-gap: 8px;
90
+
91
+ /* paginated cards container */
92
+ --paginated-cards-container-gap: 20px;
93
+
94
+ /* testimonials */
95
+ --homepage-testimonials-profile-width: 60px;
96
+ --homepage-testimonials-profile-height: 60px;
97
+ --homepage-testimonials-profile-gap: 16px;
98
+
99
+ /* layout-static-page */
100
+ --layout-static-page-background-default: linear-gradient(
101
+ 180deg,
102
+ var(--color-magnolia)-5.53%,
103
+ var(--color-orchid-dark) 100%
104
+ );
105
+
106
+ /* button */
107
+ --button-gap: 12px;
108
+
109
+ /* checkbox */
110
+ --checkbox-container-gap: 8px;
111
+ --checkbox-label-font-size: 18px;
112
+ --checkbox-label-line-height: 32px;
113
+ --checkbox-label-font-weight-selected: 400;
114
+ --checkbox-label-font-weight-not-selected: 300;
115
+ }
116
+
117
+ .with-linebreaks {
118
+ white-space: pre-wrap;
119
+ }
120
+
121
+ @media (min-width: 360px) {
122
+ :root {
123
+ --max-width-section: 360px;
124
+
125
+ --text-p-font-size: 18px;
126
+ --text-p-line-height: 21px;
127
+ --text-p-letter-spacing: 0;
128
+
129
+ --text-h1-font-weight: 700;
130
+ --text-h1-font-size: 28px;
131
+ --text-h1-line-height: 28px;
132
+
133
+ --text-h4-font-weight: 500;
134
+ --text-h4-font-size: 18px;
135
+ --text-h4-line-height: 18px;
136
+ --text-h4-letter-spacing: 0.1;
137
+
138
+ --icon-size: 40px;
139
+
140
+ --text-button-font-size: 18px;
141
+
142
+ --homepage-section-container-padding: 48px 20px;
143
+ --homepage-section-container-gap: 16px;
144
+ --homepage-section-container-footer-justify-content: center;
145
+
146
+ --homepage-volunteering-categories-header-gap: 12px;
147
+ --homepage-volunteering-category-card-width: 320px;
148
+ --homepage-volunteering-category-card-height: 328px;
149
+ --homepage-volunteering-category-card-padding-top: 24px;
150
+ --homepage-volunteering-category-card-padding-right: 24px;
151
+ --homepage-volunteering-category-card-padding-bottom: 48px;
152
+ --homepage-volunteering-category-card-padding-left: 24px;
153
+ --homepage-volunteering-category-card-gap: 16px;
154
+
155
+ --homepage-volunteering-opportunities-grid-template-columns: 1fr;
156
+ --homepage-volunteering-opportunities-grid-template-rows: repeat(2, auto);
157
+ --homepage-volunteering-opportunities-grid-gap: 16px;
158
+ --homepage-volunteering-opportunity-card-width: 320px;
159
+ --homepage-volunteering-opportunity-card-padding-top: 24px;
160
+ --homepage-volunteering-opportunity-card-padding-right: 24px;
161
+ --homepage-volunteering-opportunity-card-padding-bottom: 40px;
162
+ --homepage-volunteering-opportunity-card-padding-left: 24px;
163
+ --homepage-volunteering-opportunity-card-gap: 16px;
164
+ --homepage-volunteering-opportunity-details-gap: 12px;
165
+ --homepage-volunteering-opportunity-details-languages-gap: 4px;
166
+ --homepage-volunteering-opportunity-details-languages-detail-gap: 4px;
167
+
168
+ --page-opportunity-grid-max-width: 360px;
169
+ --page-opportunity-grid-template-columns: 1fr;
170
+ --page-opportunity-card-width: 312px;
171
+ --page-opportunity-card-height: auto; /*421px;*/
172
+ --page-opportunity-popup-card-width: 328px;
173
+ --page-opportunity-popup-card-height: auto;
174
+ --page-opportunity-popup-card-x-margins: 36px;
175
+ --page-opportunity-popup-ctas-gap: 24px;
176
+ --page-opportunity-popup-ctas-margin-top: 24px;
177
+
178
+ --homepage-testimonials-header-gap: 16px;
179
+ --homepage-testimonial-card-width: 320px;
180
+ --homepage-testimonial-card-padding-top: 24px;
181
+ --homepage-testimonial-card-padding-right: 24px;
182
+ --homepage-testimonial-card-padding-bottom: 32px;
183
+ --homepage-testimonial-card-padding-left: 24px;
184
+ --homepage-testimonial-card-gap: 14px;
185
+ --homepage-testimonial-card-text-p-font-size: 16px;
186
+ --homepage-testimonial-card-text-p-line-height: 22px;
187
+
188
+ --homepage-hero-section-container-height: 760px;
189
+ --homepage-hero-section-container-gap: 80px;
190
+ --homepage-hero-section-logo-height: 152px;
191
+ --homepage-hero-section-logo-width: 280px;
192
+ --homepage-hero-section-header-height: 202px;
193
+ --homepage-hero-section-header-menu-items-width: 100%;
194
+ --homepage-hero-section-header-menu-items-gap: 24px;
195
+ --homepage-hero-section-header-menu-items-flex-direction: column;
196
+ --homepage-hero-section-header-menu-items-padding-top: 24px;
197
+ --homepage-hero-section-header-menu-items-padding-bottom: 32px;
198
+ --homepage-hero-section-header-menu-items-padding-right: 20px;
199
+ --homepage-hero-section-header-menu-items-padding-left: 20px;
200
+ --homepage-hero-section-header-menu-items-border-bottom-right-radius: 10px;
201
+ --homepage-hero-section-header-menu-items-border-bottom-left-radius: 10px;
202
+ --homepage-hero-section-header-menu-item-fontSize: 16px;
203
+ --homepage-hero-section-header-menu-item-fontWeight: 600;
204
+ --homepage-hero-section-header-menu-item-letterSpacing: 0px;
205
+ --homepage-hero-section-header-menu-item-lineheight: 16px;
206
+ --homepage-hero-section-language-option-button-radius: 4px;
207
+ --homepage-hero-section-language-option-button-text-color: var(
208
+ --color-midnight-light
209
+ );
210
+ --homepage-hero-section-content-container-width: 100%;
211
+ --homepage-hero-section-content-container-height: 440px;
212
+ --homepage-hero-section-content-hero-text-container-gap: 20px;
213
+ --homepage-hero-section-content-hero-text-color: var(--color-white);
214
+ --homepage-hero-section-content-hero-text-fontSize: 32px;
215
+ --homepage-hero-section-content-hero-text-fontWeight: 600;
216
+ --homepage-hero-section-content-hero-text-letterSpacing: 0.1px;
217
+ --homepage-hero-section-content-hero-text-lineheight: 36px;
218
+ --homepage-hero-section-content-hero-supporting-text-fontSize: 20px;
219
+ --homepage-hero-section-content-hero-supporting-text-fontWeight: 400;
220
+ --homepage-hero-section-content-hero-supporting-text-letterSpacing: 0.25px;
221
+ --homepage-hero-section-content-hero-supporting-text-lineheight: 20px;
222
+ --homepage-hero-section-content-hero-button-container-gap: 16px;
223
+ --homepage-hero-section-content-hero-button-container-flex-direction: column;
224
+
225
+ --homepage-footer-partners-section-container-height: auto;
226
+ --homepage-footer-partners-section-container-padding: 32px 20px;
227
+ --homepage-footer-partners-section-container-gap: 64px;
228
+ --homepage-footer-partners-section-partners-container-height: 443px;
229
+ --homepage-footer-partners-section-partners-container-flex-direction: column;
230
+ --homepage-footer-partners-section-partners-container-justify-content: center;
231
+ --homepage-footer-partners-section-partners-container-gap: 48px;
232
+ --homepage-footer-partners-section-partners-frame-container-gap: 75px;
233
+ --homepage-footer-partners-section-partners-club-dialog-div-gap: 8px;
234
+ --homepage-footer-partners-section-logo-club-dialog-width: 200px;
235
+ --homepage-footer-partners-section-logo-club-dialog-height: 36px;
236
+ --homepage-footer-partners-section-logo-berlin-width: 112;
237
+ --homepage-footer-partners-section-logo-berlin-height: 120;
238
+ --homepage-footer-partners-section-logo-eu-width: 130px;
239
+ --homepage-footer-partners-section-logo-eu-height: 120px;
240
+ --homepage-footer-partners-section-logo-SchönebergHilft-width: 100px;
241
+ --homepage-footer-partners-section-logo-SchönebergHilft-height: 100px;
242
+ --homepage-footer-partners-section-logo-n4d-width: 68px;
243
+ --homepage-footer-partners-section-logo-n4d-height: 90px;
244
+ --homepage-footer-partners-section-footer-container-height: 364px;
245
+ --homepage-footer-partners-section-footer-container-flex-direction: column;
246
+ --homepage-footer-partners-section-footer-container-justify-content: space-between;
247
+ --homepage-footer-partners-section-contact-socials-container-flex-direction: column;
248
+ --homepage-footer-partners-section-contact-socials-container-justify-content: unset;
249
+ --homepage-footer-partners-section-contact-socials-container-gap: 32px;
250
+ --homepage-footer-partners-section-contact-container-gap: 10px;
251
+ --homepage-footer-partners-section-socials-container-gap: 20px;
252
+ --homepage-footer-partners-section-footer-links-container-width: 310px;
253
+ --homepage-footer-partners-section-footer-frame-container-gap: 16px;
254
+ --homepage-footer-partners-section-p-fontWeight-large: 500;
255
+ --homepage-footer-partners-section-p-fontWeight-small: 400;
256
+ --homepage-footer-partners-section-p-fontSize: 16px;
257
+
258
+ --homepage-rac-section-container-height: 720px;
259
+ --homepage-rac-section-content-container-gap: 80px;
260
+ --homepage-rac-section-content-headLine-container-gap: 16px;
261
+ --homepage-rac-section-content-headLine2-fontWeight: 700;
262
+ --homepage-rac-section-content-headLine2-fontSize: 40px;
263
+ --homepage-rac-section-content-headLine2-lineheight: 40px;
264
+ --homepage-rac-section-content-headLine2-letterSpacing: 0.1px;
265
+ --homepage-rac-section-content-buttons-container-flex-direction: column;
266
+ --homepage-rac-section-content-buttons-container-gap: 16px;
267
+
268
+ --homepage-process-section-gap: 40px;
269
+ --homepage-process-section-header-gap: 24px;
270
+ --homepage-process-section-video-height: 208px;
271
+ --homepage-process-section-video-width: 360px;
272
+ --homepage-process-section-video-border-radius: 8px;
273
+ --homepage-process-section-video-margin-left: -20px;
274
+ --homepage-process-section-card-flex-direction: column;
275
+ --homepage-process-section-card-width: 320px;
276
+ --homepage-process-section-card-height: 330px;
277
+ --homepage-process-section-card-border-radius: 24px;
278
+ --homepage-process-section-card-padding: 20px 28px 32px 20px;
279
+ --homepage-process-section-card-gap: 24px;
280
+ --homepage-process-section-card-header-flex-direction: row;
281
+ --homepage-process-section-card-header-gap: 20px;
282
+ --homepage-process-section-card-week-div-padding: 8px 12px 6px 12px;
283
+ --homepage-process-section-card-week-div-radius: 4px;
284
+ --homepage-process-section-card-info-div-gap: 16px;
285
+ --homepage-process-section-card-info-headline-div-gap: 12px;
286
+ --homepage-process-section-card-info-bullet-div-padding-left: 8px;
287
+ --homepage-process-section-card-info-text-div-gap: 24px;
288
+ --homepage-process-section-card-info-text-fontWeight: 400;
289
+ --homepage-process-section-card-info-text-fontSize: 16px;
290
+ --homepage-process-section-card-info-text-lineheight: 20px;
291
+ --homepage-process-section-card-info-text-letterSpacing: 0px;
292
+ --homepage-process-section-card-icon-size: 40px;
293
+ --homepage-process-section-card-last-step-width: 320px;
294
+
295
+ --homepage-events-section-container-height: 455px;
296
+ --homepage-events-section-content-container-gap: 32px;
297
+ --homepage-events-section-event-container-flex-direction: column;
298
+ --homepage-events-section-event-container-gap: 32px;
299
+ --homepage-events-section-event-card-gap: 20px;
300
+ --homepage-events-section-event-card-headline-gap: 16px;
301
+ --homepage-events-section-event-card-event-title-tag-padding: 8px 12px;
302
+ --homepage-events-section-event-card-event-title-tag-border-radius: 8px;
303
+ --homepage-events-section-button-container-justify-content: center;
304
+
305
+ --button-height: 64px;
306
+ --button-width: auto;
307
+ --button-padding: 12px 24px;
308
+ --button-border-radius: 125px;
309
+ --button-text-font-weight: 500;
310
+ --button-text-font-size: 18px;
311
+ --button-text-line-height: 25px;
312
+ --button-text-letter-spacing: 0.13px;
313
+ --button-text-text-align: center;
314
+
315
+ --numbering-div-width: 32px;
316
+ --numbering-div-height: 32px;
317
+ --numbering-div-border-radius: 16.57px;
318
+
319
+ --layout-static-page-n4d-logo-width: 144;
320
+ --layout-static-page-n4d-logo-height: 24;
321
+ --layout-static-page-header-height: 64px;
322
+ --layout-static-page-header-content-bottom-padding: 100px;
323
+ --layout-static-page-header-padding: 10px 18px;
324
+
325
+ --opportunities-container-width: fit-content;
326
+ --opportunities-container-min-height: none;
327
+ --opportunities-container-gap: 24px;
328
+ --opportunities-container-padding: 12px;
329
+ --opportunities-container-padding-inline: 16px;
330
+ --opportunities-header-title-tabs-gap: 24px;
331
+ --opportunities-header-tabs-searchbar-gap: 12px;
332
+ --opportunities-header-tabs-section-width: -webkit-fill-available;
333
+ --opportunities-header-tabs-gap: 16px;
334
+ --opportunities-header-tabs-border-bottom: 4px;
335
+ --opportunities-header-tabs-padding-bottom: 4px;
336
+ --opportunities-header-result-gap: 10px;
337
+ --opportunities-header-result-padding: 10px;
338
+ --opportunities-header-searchbar-flex-direction: column;
339
+ --opportunities-header-searchbar-width: -webkit-fill-available;
340
+ --opportunities-map-view-container-height: 200px;
341
+ --opportunities-cards-container-justify-content: center;
342
+ --opportunities-filters-button-height: 48px;
343
+ --opportunities-filters-button-width: 48px;
344
+ --opportunities-filters-button-icon-size: 32px;
345
+ --opportunities-filters-container-width: auto;
346
+ --opportunities-filters-container-border-bottom-radius: 40px;
347
+ --opportunities-filters-close-filter-height: 64px;
348
+ --opportunities-filters-close-filter-gap: 12px;
349
+ --opportunities-filters-close-filter-padding: 16px 0px 16px 32px;
350
+ --opportunities-filters-content-container-width: auto;
351
+ --opportunities-filters-content-container-gap: 16px;
352
+ --opportunities-filters-content-container-padding: 20px 20px 20px 20px;
353
+ --opportunities-filters-content-filter-container-gap: 16px;
354
+ --opportunities-filters-content-accordion-options-gap: 6px;
355
+ --opportunities-filters-content-accordion-options-max-height: 500px;
356
+ --opportunities-filters-content-accordion-options-checkbox-height: 18px;
357
+ --opportunities-filters-content-accordion-group-options-checkbox-height: 16px;
358
+ --opportunities-filters-content-accordion-group-options-checkbox-labelFontSize: 14px;
359
+ --opportunities-filters-content-accordion-header-border-top: 1px;
360
+ --opportunities-filters-content-accordion-header-padding-top: 16px;
361
+ --opportunities-filters-clear-all-button-padding-bottom: 20px;
362
+ --opportunities-filters-clear-all-button-icon-size: 24px;
363
+ --opportunities-filters-clear-all-button-height: 64px;
364
+ --opportunities-filters-clear-all-button-text-font-size: 20px;
365
+ --opportunities-filters-description-font-size: 14px;
366
+ --opportunities-filters-description-font-weight: 400;
367
+
368
+ --search-container-height: 64px;
369
+ --search-container-border-radius: 40px;
370
+ --search-container-padding: 0 32px;
371
+ --search-input-font-size: 16px;
372
+
373
+ --paginated-grid-container-gap: 24px;
374
+ --paginated-grid-pagination-number-width: 36px;
375
+ --paginated-grid-pagination-number-height: 44px;
376
+ --paginated-grid-pagination-number-border-radius: 6px;
377
+ }
378
+ }
379
+
380
+ @media (min-width: 768px) {
381
+ :root {
382
+ --max-width-section: 768px;
383
+
384
+ --icon-size: 48px;
385
+
386
+ --text-p-font-size: 20px;
387
+ --text-p-line-height: 24px;
388
+ --text-p-letter-spacing: 0.1px;
389
+
390
+ --text-h1-font-weight: 700;
391
+ --text-h1-font-size: 32px;
392
+ --text-h1-line-height: 32px;
393
+ --text-h1-letter-spacing: 0.1px;
394
+
395
+ --text-h4-font-weight: 600;
396
+ --text-h4-font-size: 20px;
397
+ --text-h4-line-height: 20px;
398
+ --text-h4-letter-spacing: 0.1;
399
+
400
+ --text-button-font-size: 24px;
401
+
402
+ --homepage-section-container-padding: 64px 40px;
403
+ --homepage-section-container-gap: 48px;
404
+ --homepage-section-container-footer-justify-content: flex-end;
405
+
406
+ --homepage-volunteering-categories-grid-template-columns: repeat(2, 1fr);
407
+ --homepage-volunteering-categories-grid-template-rows: repeat(3, auto);
408
+ --homepage-volunteering-categories-grid-gap: 24px;
409
+ --homepage-volunteering-categories-header-gap: 16px;
410
+ --homepage-volunteering-category-card-width: 332px;
411
+ --homepage-volunteering-category-card-height: 380px;
412
+ --homepage-volunteering-category-card-padding-top: 28px;
413
+ --homepage-volunteering-category-card-padding-right: 28px;
414
+ --homepage-volunteering-category-card-padding-bottom: 48px;
415
+ --homepage-volunteering-category-card-padding-left: 28px;
416
+ --homepage-volunteering-category-card-gap: 20px;
417
+
418
+ --homepage-volunteering-opportunities-grid-template-columns: repeat(2, 1fr);
419
+ --homepage-volunteering-opportunities-grid-template-rows: auto;
420
+ --homepage-volunteering-opportunities-grid-gap: 24px;
421
+ --homepage-volunteering-opportunity-card-width: 332px;
422
+ --homepage-volunteering-opportunity-card-padding-top: 28px;
423
+ --homepage-volunteering-opportunity-card-padding-right: 28px;
424
+ --homepage-volunteering-opportunity-card-padding-bottom: 48px;
425
+ --homepage-volunteering-opportunity-card-padding-left: 28px;
426
+ --homepage-volunteering-opportunity-card-gap: 20px;
427
+ --homepage-volunteering-opportunity-details-gap: 16px;
428
+
429
+ --page-opportunity-grid-max-width: 768px;
430
+ --page-opportunity-grid-template-columns: repeat(2, 1fr);
431
+ --page-opportunity-card-width: 332px;
432
+ --page-opportunity-card-height: auto; /*472px;*/
433
+ --page-opportunity-popup-card-width: 688px;
434
+ --page-opportunity-popup-card-height: auto;
435
+ --page-opportunity-popup-card-x-margins: 36px;
436
+ --page-opportunity-popup-ctas-gap: 24px;
437
+ --page-opportunity-popup-ctas-margin-top: 24px;
438
+
439
+ --homepage-testimonials-header-gap: 24px;
440
+ --homepage-testimonial-card-width: 328px;
441
+ --homepage-testimonial-card-padding-top: 28px;
442
+ --homepage-testimonial-card-padding-right: 28px;
443
+ --homepage-testimonial-card-padding-bottom: 40px;
444
+ --homepage-testimonial-card-padding-left: 28px;
445
+ --homepage-testimonial-card-gap: 14px;
446
+ --homepage-testimonial-card-text-p-font-size: 18px;
447
+ --homepage-testimonial-card-text-p-line-height: 24px;
448
+
449
+ --homepage-hero-section-container-height: 844px;
450
+ --homepage-hero-section-container-gap: 80px;
451
+ --homepage-hero-section-logo-height: 200px;
452
+ --homepage-hero-section-logo-width: 370px;
453
+ --homepage-hero-section-header-height: 202px;
454
+ --homepage-hero-section-header-menu-items-width: 200px;
455
+ --homepage-hero-section-header-menu-items-gap: 24px;
456
+ --homepage-hero-section-header-menu-items-flex-direction: column;
457
+ --homepage-hero-section-header-menu-item-fontSize: 16px;
458
+ --homepage-hero-section-header-menu-item-fontWeight: 600;
459
+ --homepage-hero-section-header-menu-item-letterSpacing: 0px;
460
+ --homepage-hero-section-header-menu-item-lineheight: 16px;
461
+ --homepage-hero-section-language-option-button-radius: 4px;
462
+ --homepage-hero-section-language-option-button-text-color: var(
463
+ --color-aubergine-light
464
+ );
465
+ --homepage-hero-section-content-container-width: 100%;
466
+ --homepage-hero-section-content-container-height: 440px;
467
+ --homepage-hero-section-content-hero-text-container-gap: 20px;
468
+ --homepage-hero-section-content-hero-text-color: var(--color-white);
469
+ --homepage-hero-section-content-hero-text-fontSize: 48px;
470
+ --homepage-hero-section-content-hero-text-fontWeight: 600;
471
+ --homepage-hero-section-content-hero-text-letterSpacing: 0.1px;
472
+ --homepage-hero-section-content-hero-text-lineheight: 48px;
473
+ --homepage-hero-section-content-hero-supporting-text-fontSize: 24px;
474
+ --homepage-hero-section-content-hero-supporting-text-fontWeight: 500;
475
+ --homepage-hero-section-content-hero-supporting-text-letterSpacing: 0.25px;
476
+ --homepage-hero-section-content-hero-supporting-text-lineheight: 24px;
477
+ --homepage-hero-section-content-hero-button-container-gap: 24px;
478
+ --homepage-hero-section-content-hero-button-container-flex-direction: row;
479
+
480
+ --homepage-footer-partners-section-container-height: 800px;
481
+ --homepage-footer-partners-section-container-padding: 48px;
482
+ --homepage-footer-partners-section-container-gap: 96px;
483
+ --homepage-footer-partners-section-partners-container-height: 504px;
484
+ --homepage-footer-partners-section-partners-container-flex-direction: column;
485
+ --homepage-footer-partners-section-partners-container-justify-content: center;
486
+ --homepage-footer-partners-section-partners-frame-container-height: 180px;
487
+ --homepage-footer-partners-section-partners-frame-container-gap-1: 160px;
488
+ --homepage-footer-partners-section-partners-frame-container-gap-2: 120px;
489
+ --homepage-footer-partners-section-partners-club-dialog-div-gap: 16px;
490
+ --homepage-footer-partners-section-logo-club-dialog-width: 16px;
491
+ --homepage-footer-partners-section-logo-club-dialog-height: 16px;
492
+ --homepage-footer-partners-section-logo-club-dialog-width: 316;
493
+ --homepage-footer-partners-section-logo-club-dialog-height: 58;
494
+ --homepage-footer-partners-section-logo-berlin-width: 170;
495
+ --homepage-footer-partners-section-logo-berlin-height: 180;
496
+ --homepage-footer-partners-section-logo-eu-width: 194px;
497
+ --homepage-footer-partners-section-logo-eu-height: 180px;
498
+ --homepage-footer-partners-section-logo-SchönebergHilft-width: 150px;
499
+ --homepage-footer-partners-section-logo-SchönebergHilft-height: 150px;
500
+ --homepage-footer-partners-section-logo-n4d-width: 68px;
501
+ --homepage-footer-partners-section-logo-n4d-height: 90px;
502
+ --homepage-footer-partners-section-footer-container-height: 200px;
503
+ --homepage-footer-partners-section-footer-container-flex-direction: row;
504
+ --homepage-footer-partners-section-footer-container-justify-content: space-between;
505
+ --homepage-footer-partners-section-contact-socials-container-flex-direction: row;
506
+ --homepage-footer-partners-section-contact-socials-container-justify-content: space-between;
507
+ --homepage-footer-partners-section-contact-socials-container-gap: 110px;
508
+ --homepage-footer-partners-section-contact-container-gap: 10px;
509
+ --homepage-footer-partners-section-socials-container-gap: 20px;
510
+ --homepage-footer-partners-section-footer-links-container-gap: 40px;
511
+ --homepage-footer-partners-section-footer-links-container-width: 500px;
512
+ --homepage-footer-partners-section-footer-frame-container-gap: 20px;
513
+ --homepage-footer-partners-section-p-fontWeight-large: 500;
514
+ --homepage-footer-partners-section-p-fontWeight-small: 400;
515
+ --homepage-footer-partners-section-p-fontSize: 18px;
516
+
517
+ --homepage-rac-section-container-height: 720px;
518
+ --homepage-rac-section-content-container-gap: 80px;
519
+ --homepage-rac-section-content-headLine-container-gap: 24px;
520
+ --homepage-rac-section-content-headLine2-fontWeight: 700;
521
+ --homepage-rac-section-content-headLine2-fontSize: 48px;
522
+ --homepage-rac-section-content-headLine2-lineheight: 48px;
523
+ --homepage-rac-section-content-headLine2-letterSpacing: 0.1px;
524
+ --homepage-rac-section-content-buttons-container-flex-direction: row;
525
+ --homepage-rac-section-content-buttons-container-gap: 16px;
526
+
527
+ --homepage-process-section-gap: 80px;
528
+ --homepage-process-section-header-gap: 40px;
529
+ --homepage-process-section-video-height: 378px;
530
+ --homepage-process-section-video-width: 672px;
531
+ --homepage-process-section-video-border-radius: 8px;
532
+ --homepage-process-section-video-margin-left: 0;
533
+ --homepage-process-section-card-flex-direction: column;
534
+ --homepage-process-section-card-width: 328px;
535
+ --homepage-process-section-card-height: 330px;
536
+ --homepage-process-section-card-border-radius: 24px;
537
+ --homepage-process-section-card-padding: 20px 28px 32px 20px;
538
+ --homepage-process-section-card-gap: 24px;
539
+ --homepage-process-section-card-header-flex-direction: row;
540
+ --homepage-process-section-card-header-gap: 20px;
541
+ --homepage-process-section-card-week-div-padding: 8px 12px 6px 12px;
542
+ --homepage-process-section-card-week-div-radius: 4px;
543
+ --homepage-process-section-card-info-div-gap: 16px;
544
+ --homepage-process-section-card-info-headline-div-gap: 20px;
545
+ --homepage-process-section-card-info-bullet-div-padding-left: 8px;
546
+ --homepage-process-section-card-info-text-div-gap: 28px;
547
+ --homepage-process-section-card-info-text-fontWeight: 400;
548
+ --homepage-process-section-card-info-text-fontSize: 16px;
549
+ --homepage-process-section-card-info-text-lineheight: 20px;
550
+ --homepage-process-section-card-info-text-letterSpacing: 0px;
551
+ --homepage-process-section-card-icon-size: 40px;
552
+ --homepage-process-section-card-last-step-width: 328px;
553
+
554
+ --homepage-events-section-container-height: 455px;
555
+ --homepage-events-section-content-container-gap: 48px;
556
+ --homepage-events-section-event-container-flex-direction: column;
557
+ --homepage-events-section-event-container-gap: 48px;
558
+ --homepage-events-section-event-card-gap: 20px;
559
+ --homepage-events-section-event-card-headline-gap: 16px;
560
+ --homepage-events-section-event-card-event-title-tag-padding: 8px 12px;
561
+ --homepage-events-section-event-card-event-title-tag-border-radius: 8px;
562
+ --homepage-events-section-button-container-justify-content: end;
563
+
564
+ --button-height: 72px;
565
+ --button-width: fit-content;
566
+ --button-padding: 16px 36px;
567
+ --button-border-radius: 125px;
568
+ --button-text-font-weight: 500;
569
+ --button-text-font-size: 24px;
570
+ --button-text-line-height: 25px;
571
+ --button-text-letter-spacing: 0.13px;
572
+ --button-text-text-align: center;
573
+
574
+ --paginated-cards-visible-cards-container-gap: 20px;
575
+
576
+ --numbering-div-width: 32px;
577
+ --numbering-div-height: 32px;
578
+ --numbering-div-border-radius: 16.57px;
579
+
580
+ --layout-static-page-n4d-logo-width: 230;
581
+ --layout-static-page-n4d-logo-height: 32;
582
+ --layout-static-page-header-height: 76px;
583
+ --layout-static-page-header-padding: 20px 36px;
584
+ --layout-static-page-header-content-bottom-padding: 100px;
585
+
586
+ --opportunities-container-width: 720px;
587
+ --opportunities-container-min-height: 1700px;
588
+ --opportunities-container-gap: 40px;
589
+ --opportunities-container-padding: none;
590
+ --opportunities-container-padding-inline: 16px;
591
+ --opportunities-header-title-tabs-gap: 27px;
592
+ --opportunities-header-tabs-searchbar-gap: 20px;
593
+ --opportunities-header-tabs-section-width: 688px;
594
+ --opportunities-header-tabs-gap: 16px;
595
+ --opportunities-header-tabs-border-bottom: 4px;
596
+ --opportunities-header-tabs-padding-bottom: 4px;
597
+ --opportunities-header-result-gap: 10px;
598
+ --opportunities-header-result-padding: 10px;
599
+ --opportunities-header-searchbar-width: 466px;
600
+ --opportunities-header-searchbar-flex-direction: row;
601
+ --opportunities-map-view-container-height: 300px;
602
+ --opportunities-cards-container-justify-content: center;
603
+ --opportunities-filters-button-height: 64px;
604
+ --opportunities-filters-button-icon-size: 32px;
605
+ --opportunities-filters-container-width: auto;
606
+ --opportunities-filters-container-border-bottom-radius: 40px;
607
+ --opportunities-filters-close-filter-height: 64px;
608
+ --opportunities-filters-close-filter-gap: 12px;
609
+ --opportunities-filters-close-filter-padding: 16px 0px 16px 32px;
610
+ --opportunities-filters-content-container-width: auto;
611
+ --opportunities-filters-content-container-gap: 16px;
612
+ --opportunities-filters-content-container-padding: 40px 40px 40px 32px;
613
+ --opportunities-filters-content-filter-container-gap: 16px;
614
+ --opportunities-filters-content-accordion-options-gap: 8px;
615
+ --opportunities-filters-content-accordion-options-max-height: 500px;
616
+ --opportunities-filters-content-accordion-options-checkbox-height: 18px;
617
+ --opportunities-filters-content-accordion-group-options-checkbox-height: 16px;
618
+ --opportunities-filters-content-accordion-group-options-checkbox-labelFontSize: 14px;
619
+ --opportunities-filters-content-accordion-header-border-top: 1px;
620
+ --opportunities-filters-content-accordion-header-padding-top: 16px;
621
+ --opportunities-filters-clear-all-button-padding-bottom: 24px;
622
+ --opportunities-filters-clear-all-button-icon-size: 24px;
623
+ --opportunities-filters-clear-all-button-text-font-size: 16px;
624
+ --opportunities-filters-description-font-size: 14px;
625
+ --opportunities-filters-description-font-weight: 400;
626
+
627
+ --search-container-height: 64px;
628
+ --search-container-border-radius: 40px;
629
+ --search-container-padding: 0 32px;
630
+ --search-input-font-size: 16px;
631
+
632
+ --paginated-grid-container-gap: 24px;
633
+ --paginated-grid-pagination-number-width: 36px;
634
+ --paginated-grid-pagination-number-height: 44px;
635
+ --paginated-grid-pagination-number-border-radius: 6px;
636
+ }
637
+ }
638
+
639
+ @media (min-width: 1440px) {
640
+ :root {
641
+ --max-width-section: 1440px;
642
+
643
+ --icon-size: 48px;
644
+
645
+ --text-p-font-size: 20px;
646
+ --text-p-line-height: 24px;
647
+ --text-p-letter-spacing: 0.1px;
648
+
649
+ --text-h1-font-weight: 700;
650
+ --text-h1-font-size: 32px;
651
+ --text-h1-line-height: 32px;
652
+ --text-h1-letter-spacing: 0.1px;
653
+
654
+ --text-h4-font-weight: 600;
655
+ --text-h4-font-size: 20px;
656
+ --text-h4-line-height: 20px;
657
+ --text-h4-letter-spacing: 0.1;
658
+
659
+ --text-button-font-size: 24px;
660
+
661
+ --homepage-section-container-padding: 100px 120px;
662
+ --homepage-section-container-gap: 56px;
663
+ --homepage-section-container-footer-justify-content: flex-end;
664
+
665
+ --homepage-volunteering-categories-grid-template-columns: repeat(3, 1fr);
666
+ --homepage-volunteering-categories-grid-template-rows: repeat(2, auto);
667
+ --homepage-volunteering-categories-grid-gap: 32px;
668
+ --homepage-volunteering-categories-header-gap: 36px;
669
+ --homepage-volunteering-category-card-width: 378px;
670
+ --homepage-volunteering-category-card-height: 350px;
671
+ --homepage-volunteering-category-card-padding-top: 32px;
672
+ --homepage-volunteering-category-card-padding-right: 32px;
673
+ --homepage-volunteering-category-card-padding-bottom: 48px;
674
+ --homepage-volunteering-category-card-padding-left: 32px;
675
+ --homepage-volunteering-category-card-gap: 24px;
676
+
677
+ --page-opportunity-grid-max-width: 1440px;
678
+ --page-opportunity-grid-template-columns: 1fr 1fr 1fr 1fr;
679
+ --page-opportunity-card-width: 310px;
680
+ --page-opportunity-card-height: auto; /*472px;*/
681
+ --page-opportunity-popup-card-width: 688px;
682
+ --page-opportunity-popup-card-height: auto;
683
+ --page-opportunity-popup-card-x-margins: 36px;
684
+ --page-opportunity-popup-ctas-gap: 24px;
685
+ --page-opportunity-popup-ctas-margin-top: 24px;
686
+
687
+ --homepage-volunteering-opportunities-grid-template-columns: repeat(3, 1fr);
688
+ --homepage-volunteering-opportunities-grid-template-rows: auto;
689
+ --homepage-volunteering-opportunities-grid-gap: 40px;
690
+ --homepage-volunteering-opportunity-card-width: 372px;
691
+ --homepage-volunteering-opportunity-card-padding-top: 32px;
692
+ --homepage-volunteering-opportunity-card-padding-right: 32px;
693
+ --homepage-volunteering-opportunity-card-padding-bottom: 48px;
694
+ --homepage-volunteering-opportunity-card-padding-left: 32px;
695
+ --homepage-volunteering-opportunity-card-gap: 24px;
696
+ --homepage-volunteering-opportunity-details-gap: 16px;
697
+
698
+ --homepage-testimonials-header-gap: 24px;
699
+ --homepage-testimonial-card-width: 384px;
700
+ --homepage-testimonial-card-padding-top: 32px;
701
+ --homepage-testimonial-card-padding-right: 32px;
702
+ --homepage-testimonial-card-padding-bottom: 48px;
703
+ --homepage-testimonial-card-padding-left: 32px;
704
+ --homepage-testimonial-card-gap: 16px;
705
+ --homepage-testimonial-card-text-p-font-size: 18px;
706
+ --homepage-testimonial-card-text-p-line-height: 24px;
707
+
708
+ --homepage-hero-section-container-height: 790px;
709
+ --homepage-hero-section-container-gap: 48px;
710
+ --homepage-hero-section-logo-height: 244;
711
+ --homepage-hero-section-logo-width: 450;
712
+ --homepage-hero-section-header-height: 80px;
713
+ --homepage-hero-section-header-menu-items-flex-direction: row;
714
+ --homepage-hero-section-header-menu-items-width: 680px;
715
+ --homepage-hero-section-header-menu-items-gap: 20px;
716
+ --homepage-hero-section-header-menu-item-fontSize: 16px;
717
+ --homepage-hero-section-header-menu-item-fontWeight: 600;
718
+ --homepage-hero-section-header-menu-item-letterSpacing: 0px;
719
+ --homepage-hero-section-header-menu-item-lineheight: 16px;
720
+ --homepage-hero-section-language-selection-min-width: 95px;
721
+ --homepage-hero-section-language-option-button-radius: 4px;
722
+ --homepage-hero-section-language-option-button-text-color: var(
723
+ --color-aubergine-light
724
+ );
725
+ --homepage-hero-section-content-container-width: 680px;
726
+ --homepage-hero-section-content-container-height: 485px;
727
+ --homepage-hero-section-content-hero-text-container-gap: 20px;
728
+ --homepage-hero-section-content-hero-text-color: var(--color-white);
729
+ --homepage-hero-section-content-hero-text-fontSize: 48px;
730
+ --homepage-hero-section-content-hero-text-fontWeight: 600;
731
+ --homepage-hero-section-content-hero-text-letterSpacing: 0.1px;
732
+ --homepage-hero-section-content-hero-text-lineheight: 48px;
733
+ --homepage-hero-section-content-hero-supporting-text-fontSize: 24px;
734
+ --homepage-hero-section-content-hero-supporting-text-fontWeight: 500;
735
+ --homepage-hero-section-content-hero-supporting-text-letterSpacing: 0.25px;
736
+ --homepage-hero-section-content-hero-supporting-text-lineheight: 24px;
737
+ --homepage-hero-section-content-hero-button-container-gap: 24px;
738
+ --homepage-hero-section-content-hero-button-container-flex-direction: row;
739
+
740
+ --homepage-footer-partners-section-container-height: 570px;
741
+ --homepage-footer-partners-section-container-padding: 64px 80px;
742
+ --homepage-footer-partners-section-container-gap: 128px;
743
+ --homepage-footer-partners-section-partners-container-height: 180px;
744
+ --homepage-footer-partners-section-partners-container-flex-direction: row;
745
+ --homepage-footer-partners-section-partners-container-justify-content: space-between;
746
+ --homepage-footer-partners-section-partners-club-dialog-div-gap: 16px;
747
+ --homepage-footer-partners-section-logo-club-dialog-width: 316;
748
+ --homepage-footer-partners-section-logo-club-dialog-height: 58;
749
+ --homepage-footer-partners-section-logo-berlin-width: 170;
750
+ --homepage-footer-partners-section-logo-berlin-height: 180;
751
+ --homepage-footer-partners-section-logo-eu-width: 194px;
752
+ --homepage-footer-partners-section-logo-eu-height: 180px;
753
+ --homepage-footer-partners-section-logo-SchönebergHilft-width: 150px;
754
+ --homepage-footer-partners-section-logo-SchönebergHilft-height: 150px;
755
+ --homepage-footer-partners-section-logo-n4d-width: 100px;
756
+ --homepage-footer-partners-section-logo-n4d-height: 132px;
757
+ --homepage-footer-partners-section-footer-container-height: 260px;
758
+ --homepage-footer-partners-section-footer-container-flex-direction: row;
759
+ --homepage-footer-partners-section-footer-container-justify-content: space-between;
760
+ --homepage-footer-partners-section-contact-socials-container-flex-direction: column;
761
+ --homepage-footer-partners-section-contact-socials-container-justify-content: unset;
762
+ --homepage-footer-partners-section-contact-socials-container-gap: 20px;
763
+ --homepage-footer-partners-section-contact-container-gap: 10px;
764
+ --homepage-footer-partners-section-socials-container-gap: 20px;
765
+ --homepage-footer-partners-section-footer-links-container-gap: 100px;
766
+ --homepage-footer-partners-section-footer-links-container-width: 770px;
767
+ --homepage-footer-partners-section-footer-frame-container-gap: 20px;
768
+ --homepage-footer-partners-section-p-fontWeight-large: 500;
769
+ --homepage-footer-partners-section-p-fontWeight-small: 400;
770
+ --homepage-footer-partners-section-p-fontSize: 18px;
771
+
772
+ --homepage-rac-section-container-height: 720px;
773
+ --homepage-rac-section-content-container-gap: 80px;
774
+ --homepage-rac-section-content-headLine-container-gap: 24px;
775
+ --homepage-rac-section-content-headLine2-fontWeight: 700;
776
+ --homepage-rac-section-content-headLine2-fontSize: 48px;
777
+ --homepage-rac-section-content-headLine2-lineheight: 48px;
778
+ --homepage-rac-section-content-headLine2-letterSpacing: 0.1px;
779
+ --homepage-rac-section-content-buttons-container-flex-direction: row;
780
+ --homepage-rac-section-content-buttons-container-gap: 24px;
781
+
782
+ --homepage-process-section-gap: 80px;
783
+ --homepage-process-section-header-gap: 56px;
784
+ --homepage-process-section-video-height: 562px;
785
+ --homepage-process-section-video-width: 1000px;
786
+ --homepage-process-section-video-border-radius: 10px;
787
+ --homepage-process-section-video-margin-left: 0;
788
+ --homepage-process-section-card-flex-direction: row;
789
+ --homepage-process-section-card-width: 880px;
790
+ --homepage-process-section-card-height: 274px;
791
+ --homepage-process-section-card-border-radius: 24px;
792
+ --homepage-process-section-card-padding: 32px 64px 48px 32px;
793
+ --homepage-process-section-card-gap: 32px;
794
+ --homepage-process-section-card-header-flex-direction: column;
795
+ --homepage-process-section-card-header-gap: 20px;
796
+ --homepage-process-section-card-week-div-padding: 8px 12px 6px 12px;
797
+ --homepage-process-section-card-week-div-radius: 4px;
798
+ --homepage-process-section-card-info-div-gap: 20px;
799
+ --homepage-process-section-card-info-headline-div-gap: 16px;
800
+ --homepage-process-section-card-info-text-div-gap: 24px;
801
+ --homepage-process-section-card-info-text-fontWeight: 400;
802
+ --homepage-process-section-card-info-text-fontSize: 20px;
803
+ --homepage-process-section-card-info-text-lineheight: 20px;
804
+ --homepage-process-section-card-info-text-letterSpacing: 0px;
805
+ --homepage-process-section-card-icon-size: 40px;
806
+ --homepage-process-section-card-last-step-width: 296px;
807
+
808
+ --homepage-events-section-container-height: 400px;
809
+ --homepage-events-section-content-container-gap: 48px;
810
+ --homepage-events-section-event-container-flex-direction: row;
811
+ --homepage-events-section-event-container-gap: 200px;
812
+ --homepage-events-section-event-card-width: 682px;
813
+ --homepage-events-section-event-card-gap: 20px;
814
+ --homepage-events-section-event-card-headline-gap: 16px;
815
+ --homepage-events-section-event-card-event-title-tag-padding: 8px 12px;
816
+ --homepage-events-section-event-card-event-title-tag-border-radius: 8px;
817
+ --homepage-events-section-button-container-justify-content: end;
818
+
819
+ --button-height: 72px;
820
+ --button-width: fit-content;
821
+ --button-padding: 16px 36px;
822
+ --button-border-radius: 125px;
823
+ --button-text-font-weight: 500;
824
+ --button-text-font-size: 24px;
825
+ --button-text-line-height: 25px;
826
+ --button-text-letter-spacing: 0.13px;
827
+ --button-text-text-align: center;
828
+
829
+ --paginated-cards-visible-cards-container-gap: 24px;
830
+
831
+ --numbering-div-width: 36px;
832
+ --numbering-div-height: 36px;
833
+ --numbering-div-border-radius: 18.64px;
834
+
835
+ --layout-static-page-n4d-logo-width: 230;
836
+ --layout-static-page-n4d-logo-height: 32;
837
+ --layout-static-page-header-height: 80px;
838
+ --layout-static-page-header-padding: 20px 36px;
839
+ --layout-static-page-header-content-bottom-padding: 100px;
840
+
841
+ --opportunities-container-width: 1312px;
842
+ --opportunities-container-min-height: 1800px;
843
+ --opportunities-container-gap: 40px;
844
+ --opportunities-container-padding: none;
845
+ --opportunities-container-padding-inline: 16px;
846
+ --opportunities-header-title-tabs-gap: 24px;
847
+ --opportunities-header-tabs-searchbar-gap: 20px;
848
+ --opportunities-header-tabs-section-width: 980px;
849
+ --opportunities-header-tabs-gap: 16px;
850
+ --opportunities-header-tabs-border-bottom: 4px;
851
+ --opportunities-header-tabs-padding-bottom: 4px;
852
+ --opportunities-header-result-gap: 10px;
853
+ --opportunities-header-result-padding: 10px;
854
+ --opportunities-header-searchbar-width: 980px;
855
+ --opportunities-header-searchbar-flex-direction: row;
856
+ --opportunities-map-view-container-height: 300px;
857
+ --opportunities-cards-container-justify-content: left;
858
+ --opportunities-filters-button-height: 64px;
859
+ --opportunities-filters-button-icon-size: 32px;
860
+ --opportunities-filters-container-width: 320px;
861
+ --opportunities-filters-container-border-bottom-radius: none;
862
+ --opportunities-filters-close-filter-height: 64px;
863
+ --opportunities-filters-close-filter-gap: 12px;
864
+ --opportunities-filters-close-filter-padding: 16px 0px 16px 32px;
865
+ --opportunities-filters-content-container-width: 350px;
866
+ --opportunities-filters-content-container-gap: 16px;
867
+ --opportunities-filters-content-container-padding: 40px 40px 40px 20px;
868
+ --opportunities-filters-content-filter-container-gap: 16px;
869
+ --opportunities-filters-content-accordion-options-gap: 8px;
870
+ --opportunities-filters-content-accordion-options-max-height: 500px;
871
+ --opportunities-filters-content-accordion-options-checkbox-height: 18px;
872
+ --opportunities-filters-content-accordion-group-options-checkbox-height: 16px;
873
+ --opportunities-filters-content-accordion-group-options-checkbox-labelFontSize: 14px;
874
+ --opportunities-filters-content-accordion-header-border-top: 1px;
875
+ --opportunities-filters-content-accordion-header-padding-top: 16px;
876
+ --opportunities-filters-clear-all-button-padding-bottom: 24px;
877
+ --opportunities-filters-clear-all-button-icon-size: 24px;
878
+ --opportunities-filters-clear-all-button-text-font-size: 16px;
879
+ --opportunities-filters-description-font-size: 14px;
880
+ --opportunities-filters-description-font-weight: 400;
881
+
882
+ --search-container-height: 60px;
883
+ --search-container-border-radius: 160px;
884
+ --search-container-padding: 0 32px;
885
+ --search-input-font-size: 16px;
886
+
887
+ --paginated-grid-container-gap: 24px;
888
+ --paginated-grid-pagination-number-width: 36px;
889
+ --paginated-grid-pagination-number-height: 44px;
890
+ --paginated-grid-pagination-number-border-radius: 6px;
891
+ }
892
+ }