jekyll-theme-saifas-legacy 0.1.0

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.
Files changed (55) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE.txt +21 -0
  3. data/README.md +64 -0
  4. data/_includes/block-iframe.html +1 -0
  5. data/_includes/card-thumbnail.html +20 -0
  6. data/_includes/lib-charting-assets.html +4 -0
  7. data/_includes/lib-gallery-assets.html +7 -0
  8. data/_includes/news-item-archive.html +21 -0
  9. data/_includes/news-item.html +21 -0
  10. data/_includes/page-base-assets.html +22 -0
  11. data/_includes/page-footer.html +107 -0
  12. data/_includes/page-header-logo.html +4 -0
  13. data/_includes/page-header-path-item.html +5 -0
  14. data/_includes/page-headline.html +3 -0
  15. data/_includes/page-preloader.html +6 -0
  16. data/_layouts/cards-layout.html +29 -0
  17. data/_layouts/default.html +1 -0
  18. data/_layouts/error-404.html +24 -0
  19. data/_layouts/home.html +27 -0
  20. data/_layouts/news-item.html +11 -0
  21. data/_layouts/news.html +26 -0
  22. data/_sass/_base.sass +676 -0
  23. data/_sass/_layout.sass +67 -0
  24. data/_sass/_variables.sass +27 -0
  25. data/_sass/buttons.sass +52 -0
  26. data/_sass/custom-styles.sass +153 -0
  27. data/_sass/custom-variables.sass +0 -0
  28. data/_sass/initialize.sass +7 -0
  29. data/_sass/media-requests.sass +104 -0
  30. data/_sass/preloader.sass +57 -0
  31. data/assets/css/styles.sass +4 -0
  32. data/assets/graphics/fonts/readme.md +1 -0
  33. data/assets/graphics/images/content/empty/empty-image-224px-224px.png +0 -0
  34. data/assets/graphics/images/content/empty/empty-showcase-sample-report/empty-image-500px-400px.jpg +0 -0
  35. data/assets/graphics/images/content/powerbi-icon-960px-1280px.png +0 -0
  36. data/assets/graphics/images/content/powerbi-icon-report-theme-white-black-900px-900px.png +0 -0
  37. data/assets/graphics/images/content/saifas-bi-powerbi-custom-visuals/saifas-bi-pbi-cv-calendar-120px-120px.png +0 -0
  38. data/assets/graphics/images/content/saifas-bi-powerbi-custom-visuals/saifas-bi-pbi-cv-legend-120px-120px.png +0 -0
  39. data/assets/graphics/images/content/saifas-bi-powerbi-custom-visuals/saifas-bi-pbi-cv-map-120px-120px.png +0 -0
  40. data/assets/graphics/images/content/saifas-bi-powerbi-custom-visuals/saifas-bi-pbi-cv-project-120px-120px.png +0 -0
  41. data/assets/graphics/images/content/saifas-bi-powerbi-custom-visuals/saifas-bi-pbi-cv-table-120px-120px.png +0 -0
  42. data/assets/graphics/images/content/saifas-bi-powerbi-reports/saifas-bi-pbi-report-company-employees-300px-300px.png +0 -0
  43. data/assets/graphics/images/content/saifas-bi-powerbi-reports/saifas-bi-pbi-report-legend-for-heatmap-300px-300px.png +0 -0
  44. data/assets/graphics/images/content/saifas-bi-powerbi-reports/saifas-bi-pbi-report-personal-schedule-300px-300px.png +0 -0
  45. data/assets/graphics/images/content/saifas-bi-powerbi-reports/saifas-bi-pbi-report-project-road-300px-300px.png +0 -0
  46. data/assets/graphics/images/content/saifas-bi-powerbi-reports/saifas-bi-pbi-report-world-population-300px-300px.png +0 -0
  47. data/assets/graphics/images/domain/saifas-bi/backgrounds/about.md +0 -0
  48. data/assets/graphics/images/domain/saifas-bi/icons/button-icons/about.md +0 -0
  49. data/assets/graphics/images/domain/saifas-bi/icons/fav-icons/saifas-brand-logo-star-theme-blue-black-256px-256px.ico +0 -0
  50. data/assets/graphics/images/domain/saifas-bi/icons/launch-shortcut-icons/about.md +0 -0
  51. data/assets/graphics/images/domain/saifas-bi/logos/saifas-brand-logo-star-theme-blue-black-276px-269px.png +0 -0
  52. data/assets/scripts/gallery.js +3 -0
  53. data/assets/scripts/highchart.js +104 -0
  54. data/assets/scripts/index.js +50 -0
  55. metadata +138 -0
data/_sass/_base.sass ADDED
@@ -0,0 +1,676 @@
1
+ //Base fonts import
2
+ @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap')
3
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap')
4
+
5
+ *
6
+ margin: 0
7
+ box-sizing: border-box
8
+
9
+ html
10
+ height: 100%
11
+ padding: 0
12
+ margin: 0
13
+ font-family: var(--main-font-family)
14
+ background: white
15
+
16
+ body
17
+ display: flex
18
+ flex-direction: column
19
+ min-height: 100vh
20
+ font-family: var(--main-font-family)f
21
+ background: white
22
+
23
+ iframe
24
+ flex: 1
25
+
26
+ .cards__container
27
+ display: flex
28
+ flex: 4
29
+ flex-direction: row
30
+ flex-wrap: wrap
31
+ justify-content: center
32
+ /* max-width: 1268px */
33
+
34
+ .custom-visual__card, .custom-visual-report__card
35
+ display: flex
36
+ flex-direction: column
37
+ background-color: var(--color-grey)
38
+ width: 300px
39
+ height: 300px
40
+ margin: 10px
41
+ padding: 20px
42
+ border-radius: 5px
43
+ -webkit-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
44
+ -moz-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -moz-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
45
+ -o-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -o-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
46
+ -ms-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -ms-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
47
+ transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
48
+ -webkit-transition-delay: 0s
49
+ -moz-transition-delay: 0s
50
+ -o-transition-delay: 0s
51
+ -ms-transition-delay: 0s
52
+ transition-delay: 0s
53
+ -webkit-transform: translateY(0px)
54
+ -moz-transform: translateY(0px)
55
+ -o-transform: translateY(0px)
56
+ -ms-transform: translateY(0px)
57
+ transform: translateY(0px)
58
+ cursor: pointer
59
+ &:hover
60
+ -webkit-box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
61
+ box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
62
+ background: rgba(200,200,200,0.2)
63
+ -webkit-transform: translateY(-1px)
64
+ -moz-transform: translateY(-1px)
65
+ -o-transform: translateY(-1px)
66
+ -ms-transform: translateY(-1px)
67
+ transform: translateY(-1px)
68
+
69
+ .card__top-section
70
+ display: flex
71
+
72
+ .top-section__icon
73
+ img
74
+ height: 64px
75
+ width: 64px
76
+ border-radius: 10px
77
+
78
+ .top-section__title
79
+ display: flex
80
+ flex-direction: column
81
+ padding-left: 10px
82
+ font-family: var(--main-font-family)
83
+ font-size: 20px
84
+ color: var(--text-color)
85
+ width: 100%
86
+
87
+ .top-section__description
88
+ font-size: 14px
89
+ font-weight: 400
90
+ margin-top: 6px
91
+ img
92
+ width: 14px
93
+ height: 14px
94
+
95
+ .main-section
96
+ display: flex
97
+ flex-direction: column
98
+ margin-top: 10px
99
+
100
+ .main-section__description
101
+ font-size: 16px
102
+ color: var(--text-color)
103
+
104
+ .cards-section
105
+ display: none
106
+ height: 100%
107
+ align-items: flex-end
108
+
109
+ .report-cards-section
110
+ display: none
111
+ height: 100%
112
+ align-items: center
113
+ flex-direction: column
114
+ justify-content: flex-end
115
+ .cards-section__top
116
+ width: 100%
117
+ a
118
+ margin: 0 5px
119
+ width: auto
120
+ padding: 0
121
+ .cards-section__bottom
122
+ margin-top: 10px
123
+ width: 100%
124
+ display: flex
125
+ a
126
+ margin: 0
127
+ width: 100%
128
+ margin: 0 5px
129
+
130
+ .custom-visual__card:hover
131
+ .cards-section
132
+ display: flex
133
+
134
+ .custom-visual-report__card:hover
135
+ .report-cards-section
136
+ display: flex
137
+
138
+ .body-separator
139
+ height: 2px
140
+ background-color: var(--color-grey)
141
+ margin: 20px
142
+
143
+ .contact-link-container
144
+ display: flex
145
+ align-items: center
146
+ justify-content: center
147
+ border: 2px solid var(--color-grey)
148
+ height: 64px
149
+ border-radius: 5px
150
+
151
+ .contact-link-container__link
152
+ font-style: normal
153
+ margin: 0 20px
154
+
155
+ .card
156
+ display: flex
157
+ flex-direction: column
158
+ background-color: var(--color-grey)
159
+ margin: 10px
160
+ padding: 20px
161
+ height: fit-content
162
+ border-radius: 5px
163
+ min-width: 295px
164
+ -webkit-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
165
+ -moz-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -moz-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
166
+ -o-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -o-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
167
+ -ms-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -ms-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
168
+ transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
169
+ -webkit-transition-delay: 0s
170
+ -moz-transition-delay: 0s
171
+ -o-transition-delay: 0s
172
+ -ms-transition-delay: 0s
173
+ transition-delay: 0s
174
+ -webkit-transform: translateY(0px)
175
+ -moz-transform: translateY(0px)
176
+ -o-transform: translateY(0px)
177
+ -ms-transform: translateY(0px)
178
+ transform: translateY(0px)
179
+ .btn
180
+ margin-top: 10px
181
+ &:hover
182
+ -webkit-box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
183
+ box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
184
+ background: rgba(200,200,200,0.2)
185
+ -webkit-transform: translateY(-1px)
186
+ -moz-transform: translateY(-1px)
187
+ -o-transform: translateY(-1px)
188
+ -ms-transform: translateY(-1px)
189
+ transform: translateY(-1px)
190
+ .card__description
191
+ display: none
192
+ .card__buttons-container
193
+ display: flex
194
+ .card__buttons-container
195
+ transition: .3s
196
+ opacity: 1
197
+
198
+ .card__title
199
+ color: var(--text-color)
200
+ font-size: var(--font-size-title)
201
+ margin-bottom: 20px
202
+
203
+ .card__description
204
+ color: var(--text-color)
205
+ font-size: var(--font-size-description)
206
+ margin-top: 20px
207
+ height: 40px
208
+
209
+ .home-body
210
+ display: flex
211
+ align-items: center
212
+ justify-content: center
213
+ flex-direction: column
214
+
215
+ .headline
216
+ margin: 18px
217
+ /* flex: 1 */
218
+ display: flex
219
+ align-items: center
220
+ justify-content: center
221
+ font-size: 30px
222
+ color: var(--text-color)
223
+
224
+ .card__image
225
+ display: flex
226
+ justify-content: center
227
+ img
228
+ width: 100%
229
+ max-width: 200px
230
+ height: auto
231
+
232
+ .footer__contact-us
233
+ display: flex
234
+ height: 100%
235
+ width: fit-content
236
+ font-family: var(--main-font-family)
237
+ align-items: center
238
+ margin-left: 20px
239
+ font-style: normal
240
+
241
+ .watermark
242
+ display: flex
243
+ font-family: var(--main-font-family)
244
+ margin-right: 20px
245
+
246
+ .details__card
247
+ margin: 20px
248
+ display: flex
249
+ background-color: var(--color-grey)
250
+ padding: 20px
251
+
252
+ .details__card-text
253
+ margin-left: 20px
254
+ a
255
+ margin-top: 20px
256
+
257
+ .details__card-title
258
+ color: var(--text-color)
259
+ font-size: var(--font-size-title)
260
+
261
+ .details__card-description
262
+ color: var(--text-color)
263
+ font-size: var(--font-size-description)
264
+ margin-top: 10px
265
+ img
266
+ height: 14px
267
+ width: 14px
268
+
269
+
270
+ .details__card-image
271
+ img
272
+ width: 150px
273
+ height: auto
274
+
275
+ .details__card-buttons
276
+ margin-left: 20px
277
+ .btn
278
+ margin-bottom: 15px
279
+
280
+ .details__card-cost
281
+ margin: 10px 0
282
+ display: flex
283
+ flex-direction: row
284
+ font-size: 16px
285
+ font-family: var(--main-font-family)
286
+ color: var(--text-color)
287
+
288
+ .details__card-cost
289
+ .cost
290
+ margin-left: 4px
291
+ font-weight: 700
292
+
293
+ .get-it-now-button
294
+ background-color: #0271b6
295
+ color: white
296
+ &:hover
297
+ background-color: #0271b6
298
+
299
+ .card__buttons-container
300
+ display: none
301
+ margin-top: 20px
302
+ transition: .3s
303
+ opacity: 0
304
+ height: 40px
305
+
306
+ .breadcrumbs-separator
307
+ display: flex
308
+ align-items: center
309
+ justify-content: center
310
+ margin: 0 6px
311
+
312
+ .breadcrumbs-text
313
+ margin: 0
314
+ display: block /* or in-line block according to your requirement */
315
+ overflow: hidden
316
+ white-space: nowrap
317
+ text-overflow: ellipsis
318
+
319
+ .columns-container
320
+ display: grid
321
+ grid-template-columns: 400px auto
322
+ height: 100%
323
+
324
+ .left-column
325
+ display: flex
326
+ flex-direction: column
327
+ padding-left: 20px
328
+ .btn
329
+ margin-bottom: 10px
330
+
331
+ .left-column__title
332
+ color: var(--text-color)
333
+ font-family: var(--main-font-family)
334
+ font-size: 20px
335
+ margin-bottom: 20px
336
+
337
+ .disabled
338
+ opacity: .5
339
+ pointer-events: none
340
+ cursor: not-allowed
341
+
342
+ .custom-visual__description
343
+ margin: 20px
344
+ display: flex
345
+ flex-direction: column
346
+ font-family: var(--main-font-family)
347
+ color: var(--text-color)
348
+
349
+ .main-features__title, .most-popular-use-cases__title
350
+ font-size: 18px
351
+ font-weight: 600
352
+ margin-bottom: 20px
353
+
354
+ .custom-visual__description-text
355
+ font-size: 16px
356
+ font-weight: 400
357
+ margin-top: 10px
358
+
359
+ .reports-card
360
+ display: flex
361
+ flex-direction: column
362
+ background: var(--color-grey)
363
+ border-radius: 5px
364
+ min-width: 480px
365
+ max-height: 240px
366
+ position: relative
367
+
368
+ .reports-card__top-section
369
+ display: flex
370
+ align-items: center
371
+ padding: 20px
372
+
373
+ .reports-card-buttons__container
374
+ display: flex
375
+ justify-content: center
376
+ flex-direction: column
377
+ opacity: 0
378
+ position: absolute
379
+ bottom: 0
380
+ transition: .3s
381
+ width: 100%
382
+
383
+ .reports-card__wrapper
384
+ position: relative
385
+ &:hover
386
+ .reports-card
387
+ filter: grayscale(70%)
388
+ filter: brightness(0.4)
389
+ .reports-card-buttons__container
390
+ opacity: 1
391
+ transition: .3s
392
+ .reports-card-buttons__container-bottom
393
+ display: flex
394
+ .btn
395
+ background: var(--color-grey)
396
+ width: 100%
397
+ margin: 10px
398
+
399
+ .reports-card-details-button
400
+ .btn
401
+ width: auto
402
+ margin: 10px 10px 0 10px
403
+ background: var(--color-grey)
404
+
405
+ .power-bi__buttons-container
406
+ display: flex
407
+ align-content: flex-start
408
+ align-items: center
409
+ justify-content: center
410
+ flex-direction: row
411
+ flex-wrap: wrap
412
+ max-width: 1400px
413
+
414
+ .power-bi__buttons-container--btn
415
+ background: var(--color-grey)
416
+ height: 240px
417
+ width: 320px
418
+ border-radius: 5px
419
+ margin: 10px
420
+ display: flex
421
+ padding-top: 20px
422
+ flex-direction: column
423
+ color: var(--text-color)
424
+ font-size: 20px
425
+ font-family: var(--main-font-family)
426
+ text-decoration: none
427
+ text-align: center
428
+ -webkit-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
429
+ -moz-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -moz-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
430
+ -o-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -o-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
431
+ -ms-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -ms-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
432
+ transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
433
+ -webkit-transition-delay: 0s
434
+ -moz-transition-delay: 0s
435
+ -o-transition-delay: 0s
436
+ -ms-transition-delay: 0s
437
+ transition-delay: 0s
438
+ -webkit-transform: translateY(0px)
439
+ -moz-transform: translateY(0px)
440
+ -o-transform: translateY(0px)
441
+ -ms-transform: translateY(0px)
442
+ transform: translateY(0px)
443
+ cursor: pointer
444
+ &:hover
445
+ -webkit-box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
446
+ box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
447
+ background: rgba(200,200,200,0.2)
448
+ -webkit-transform: translateY(-1px)
449
+ -moz-transform: translateY(-1px)
450
+ -o-transform: translateY(-1px)
451
+ -ms-transform: translateY(-1px)
452
+ transform: translateY(-1px)
453
+ i
454
+ margin-top: 20px
455
+
456
+ .power-bi__buttons-container--tag
457
+ font-family: var(--main-font-family)
458
+ font-size: 16px
459
+ color: var(--text-color)
460
+ margin-top: 30px
461
+ display: flex
462
+ padding-left: 20px
463
+ justify-content: flex-start
464
+
465
+ .conctact-us-btn
466
+ margin-left: 20px
467
+ cursor: pointer
468
+ display: flex
469
+ align-items: center
470
+ i
471
+ margin-right: 8px
472
+
473
+ /*Modal styles*/
474
+
475
+ #modal
476
+ display: none
477
+ position: fixed
478
+ top: 0
479
+ height: 100%
480
+ width: 100%
481
+ background-color: black
482
+ opacity: 0.4
483
+ z-index: 10
484
+
485
+ .modalBody
486
+ font-family: var(--main-font-family)
487
+ color: var(--text-color)
488
+ position: fixed
489
+ display: none
490
+ top: 10%
491
+ width: 100%
492
+ max-width: 600px
493
+ max-height: 700px
494
+ left: 50%
495
+ transform: translate(-50%, 0)
496
+ padding: 0 20px 20px 20px
497
+ background-color: #fff
498
+ border-radius: 5px
499
+ overflow: auto
500
+ z-index: 11
501
+
502
+ .modal-close
503
+ cursor: pointer
504
+ position: absolute
505
+ right: 10px
506
+ top: 10px
507
+ -webkit-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
508
+ -moz-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -moz-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
509
+ -o-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -o-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
510
+ -ms-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -ms-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
511
+ transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
512
+ -webkit-transition-delay: 0s
513
+ -moz-transition-delay: 0s
514
+ -o-transition-delay: 0s
515
+ -ms-transition-delay: 0s
516
+ transition-delay: 0s
517
+ -webkit-transform: translateY(0px)
518
+ -moz-transform: translateY(0px)
519
+ -o-transform: translateY(0px)
520
+ -ms-transform: translateY(0px)
521
+ transform: translateY(0px)
522
+ cursor: pointer
523
+ &:hover
524
+ -webkit-box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
525
+ box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
526
+ background: rgba(200,200,200,0.2)
527
+ -webkit-transform: translateY(-1px)
528
+ -moz-transform: translateY(-1px)
529
+ -o-transform: translateY(-1px)
530
+ -ms-transform: translateY(-1px)
531
+ transform: translateY(-1px)
532
+
533
+ .modal-headline
534
+ font-size: 22px !important
535
+
536
+ /*Form styles*/
537
+
538
+ .contact-form
539
+ display: flex
540
+ flex-direction: column
541
+ justify-content: center
542
+ align-items: center
543
+
544
+
545
+ .form-elem__container
546
+ width: 100%
547
+ display: flex
548
+ flex-direction: column
549
+ overflow: auto
550
+ margin: 0 0 20px 0
551
+
552
+
553
+ .form-elem
554
+ display: flex
555
+ flex-direction: column
556
+ margin: 5px
557
+ input, textarea, select
558
+ height: 36px
559
+ border-radius: 5px
560
+ border: 2px solid #f0f0f0
561
+ background: transparent
562
+ color: var(--text-color)
563
+ font-family: var(--main-font-family)
564
+ font-size: 16px
565
+ padding: 0 10px
566
+ textarea
567
+ padding: 10px
568
+ min-height: 100px
569
+ input:active
570
+ border: 2px solid var(--text-color)
571
+ label
572
+ font-weight: 600
573
+ margin-bottom: 3px
574
+
575
+ .three-form-elements
576
+ display: grid
577
+ grid-template-columns: 33.3% 33.3% 33.3%
578
+ .form-elem
579
+ display: flex
580
+
581
+ .two-form-elements
582
+ display: grid
583
+ grid-template-columns: 50% 50%
584
+ .form-elem
585
+ display: flex
586
+
587
+ .form-radio-buttons-container
588
+ display: flex
589
+ align-items: center
590
+ input
591
+ margin-right: 4px
592
+ .radio-button-text
593
+ margin-right: 10px
594
+
595
+ .form-current-page
596
+ display: none
597
+
598
+ .circle-container
599
+ width: 100%
600
+ height: 100%
601
+ display: flex
602
+ align-items: center
603
+ justify-content: center
604
+ flex-direction: column
605
+ a
606
+ margin-top: 20px
607
+
608
+ .circle
609
+ margin: 10px
610
+ display: flex
611
+ align-items: center
612
+ justify-content: center
613
+ max-width: 300px
614
+ width: 300px
615
+ max-height: 300px
616
+ height: 300px
617
+ border-radius: 50%
618
+ -webkit-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
619
+ -moz-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -moz-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
620
+ -o-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -o-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
621
+ -ms-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), -ms-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
622
+ transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s cubic-bezier(0.4, 0, 0.2, 1)
623
+ -webkit-transition-delay: 0s
624
+ -moz-transition-delay: 0s
625
+ -o-transition-delay: 0s
626
+ -ms-transition-delay: 0s
627
+ transition-delay: 0s
628
+ -webkit-transform: translateY(0px)
629
+ -moz-transform: translateY(0px)
630
+ -o-transform: translateY(0px)
631
+ -ms-transform: translateY(0px)
632
+ transform: translateY(0px)
633
+ cursor: pointer
634
+ background: var(--color-grey)
635
+ color: var(--text-color)
636
+ font-size: 20px
637
+ text-decoration: none
638
+ z-index: 2
639
+ &:visited
640
+ color: var(--text-color)
641
+ &:hover
642
+ -webkit-box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
643
+ box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2)
644
+ background: rgba(200,200,200,0.2)
645
+ -webkit-transform: translateY(-1px)
646
+ -moz-transform: translateY(-1px)
647
+ -o-transform: translateY(-1px)
648
+ -ms-transform: translateY(-1px)
649
+ transform: translateY(-1px)
650
+
651
+ /*Flex styles*/
652
+
653
+ .flex-direction-column
654
+ display: flex
655
+ flex-direction: column
656
+
657
+ .flex-align-items-start
658
+ display: flex
659
+ align-items: flex-start
660
+
661
+ .flex-justify-content-center
662
+ display: flex
663
+ justify-content: center
664
+
665
+ .full-centering
666
+ display: flex
667
+ align-items: center
668
+ justify-content: center
669
+
670
+ article
671
+ margin: 20px 20px 0 20px
672
+ padding: 10px
673
+ display: flex
674
+ flex-direction: column
675
+ background: var(--color-grey)
676
+ border-radius: 5px