-
Notifications
You must be signed in to change notification settings - Fork 0
/
viezfaeltigkeit.html
656 lines (628 loc) · 35 KB
/
viezfaeltigkeit.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="ViezFältigkeit - Vielfältiges zu Viez: lustige Fakten, Rezepte, unser Chatbot und unsere persönliche Geschmacksskala." />
<meta name="author" content="Digital Humanities Universitaet Trier" />
<title>Digital Viez - Fakten, Rezepte, Chatbot, Geschmacksskala</title>
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/img/icons/faviconOrange/original-orange.png" />
<link rel="apple-touch-icon" sizes="180x180" href="assets/img/icons/faviconOrange/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/img/icons/faviconOrange/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/img/icons/faviconOrange/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<!-- Bootstrap Icons-->
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" />
<!-- Google fonts-->
<link href="https://fonts.googleapis.com/css?family=Merriweather+Sans:400,700" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic" rel="stylesheet" type="text/css" />
<!-- SimpleLightbox plugin CSS-->
<link href="https://cdnjs.cloudflare.com/ajax/libs/SimpleLightbox/2.1.0/simpleLightbox.min.css" rel="stylesheet" />
<!-- Core theme CSS (includes Bootstrap)-->
<link href="css/styles.css" rel="stylesheet" />
<link rel="stylesheet" href="viezmuseum/css/owl.carousel.min.css">
<link rel="stylesheet" href="viezmuseum/css/owl.theme.default.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/4.5.6/css/ionicons.min.css">
</head>
<body id="page-top">
<!-- Navigation-->
<nav class="navbar navbar-expand-lg navbar-light fixed-top py-1" id="mainNav">
<div class="container px-4 px-lg-5">
<a class="navbar-brand" href="index.html"><img src="assets/img/icons/logo-white-Variante2.png" width="180" height="50" id="logo" alt="..." /></a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ms-auto my-2 my-lg-0">
<li class="nav-item"><a class="nav-link" href="karte.html">ViezKarte</a></li>
<li class="nav-item"><a class="nav-link" href="museum.html">ViezMuseum</a></li>
<li class="nav-item"><a class="nav-link" href="sprache.html">ViezSprache</a></li>
<li class="nav-item dropdown">
<a class="nav-link" href="viezfaeltigkeit.html" aria-expanded="false">ViezFältigkeit</a>
<ul class="dropdown-menu" aria-labelledby="dropdown">
<li><a class="dropdown-item" href="stories.html">ViezStories</a></li>
<li><a class="dropdown-item" href="https://viezbot.herokuapp.com/" target="blank">ViezBot</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link" href="projekt.html" aria-expanded="false">Was ist Digital Viez?</a>
<ul class="dropdown-menu" aria-labelledby="dropdown">
<li><a class="dropdown-item" href="projekt.html">Das Projekt</a></li>
<li><a class="dropdown-item" href="projekt.html#ueberuns">Das Team</a></li>
<li><a class="dropdown-item" href="projekt.html#dhmethoden">Digital Humanities-Methoden</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<button type="button" class="btn btn-totop" id="btn-back-to-top"><i class="bi bi-arrow-up fs-0" style="color:white;"></i></button>
<!-- Header -->
<section class="page-section bg-primary">
<div class="container px-4 px-lg-5">
<div class="row gx-4 gx-lg-5 justify-content-center">
<div class="col-lg-8 text-center">
<br>
<br>
<br>
<h2 class="text-white mt-0">ViezFältigkeit</h2>
<hr class="divider divider-light" />
</div>
</div>
</div>
</section>
<div style="background-color: #f8f9fa;">
<br>
</div>
<!-- Slider Desktop -->
<div class="desktop">
<div class="hero_area">
<div class="bg-box">
</div>
<section class="slider_section ">
<div id="customCarouselDesktop" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<div class="container-slider">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezStories
</h1>
<p>
In den ViezStories kommen die Stimmen der Region zu Wort. Aus verschiedenen Perspektiven erzählen regionale Landwirt*innen und Gastronom*innen ihre Viezgeschichten und zeigen, wie stark historisch der Viez in der Region verankert ist.
</p>
<a class="text-font btn btn-primary" href="stories.html">Zu den ViezStories</a>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container-slider">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezBot
</h1>
<p>
Lerne Volker, unseren digitalen Viez-Experten, kennen und teste Dein Wissen mit seinem Quiz!
</p>
<a class="text-font btn btn-primary" href="#viezbot">Zum ViezBot</a>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item ">
<div class="container-slider">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezFacts
</h1>
<p>
Was hat GPS mit Viez zu tun und wofür steht Covie? In der Rubrik "Wusstest Du schon?" werden Dir spannende Facts rund um das Kulturgetränk präsentiert.
</p>
<a class="text-font btn btn-primary" href="#viezfacts">Zu den ViezFacts</a>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container-slider">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezRezepte
</h1>
<p>
Viez ist nicht nur zum Trinken da. Hier erwarten Dich leckere Rezepte mit Viez. (Unser Tipp: Viezkuchen!)
</p>
<a class="text-font btn btn-primary" href="#viezrezepte">Zu den ViezRezepten</a>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container-slider">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezGeschmack
</h1>
<p>
In unserem Vieztasting haben wir verschiedene Viezsorten der Region probiert und individuell bewertet. Wir hoffen Dich auf den Geschmack bringen zu können!
</p>
<a class="text-font btn btn-primary" href="#viezgeschmack">Zum ViezGeschmack</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container-slider">
<div class="row">
<div class="col-lg-2"></div>
<div class="col-lg-2">
<ol class="carousel-indicators">
<li data-target="#customCarouselDesktop" data-slide-to="0" class="active"></li>
<li data-target="#customCarouselDesktop" data-slide-to="1"></li>
<li data-target="#customCarouselDesktop" data-slide-to="2"></li>
<li data-target="#customCarouselDesktop" data-slide-to="3"></li>
<li data-target="#customCarouselDesktop" data-slide-to="4"></li>
</ol>
</div>
</div>
</div>
<div class="desktop">
<a class="carousel-control-prev" href="#customCarouselDesktop" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only"></span>
</a>
<a class="carousel-control-next" href="#customCarouselDesktop" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only"></span>
</a>
</div>
</div>
</section>
</div>
</div>
<!--Slider Mobile-->
<div class="mobile">
<div class="hero_area">
<div class="bg-box">
</div>
<section class="slider_section ">
<div id="customCarouselMobile" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<div class="container-slider text-center">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezStories
</h1>
<p>
In den ViezStories kommen die Stimmen der Region zu Wort. Aus verschiedenen Perspektiven erzählen regionale Landwirt*innen und Gastronom*innen ihre Viezgeschichten und zeigen, wie stark historisch der Viez in der Region verankert ist.
</p>
<a class="text-font btn btn-primary" href="stories.html">Zu den ViezStories</a>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container-slider text-center">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezBot
</h1>
<p>
Volker ist unser ViezBot. Er ist Experte was Viez angeht und hat deshalb ein Quiz für Dich erstellt. Teste Dein Wissen über Viez!
</p>
<a class="text-font btn btn-primary" href="#viezbot">Zum ViezBot</a>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item ">
<div class="container-slider text-center">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezFacts
</h1>
<p>
Was hat GPS mit Viez zu tun und wofür steht Covie? In der Rubrik "Wusstest Du schon?" werden Dir spannende Facts rund um das Kulturgetränk präsentiert.
</p>
<a class="text-font btn btn-primary" href="#viezfacts">Zu den ViezFacts</a>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container-slider text-center">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezRezepte
</h1>
<p>
Viez ist nicht nur zum Trinken da. Hier erwarten Dich leckere Rezepte mit Viez. (Unser Tipp: Viezkuchen!)
</p>
<a class="text-font btn btn-primary" href="#viezrezepte">Zu den ViezRezepten</a>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container-slider text-center">
<div class="row">
<div class="col-lg-2 col-md-2">
</div>
<div class="col-md-7 col-lg-6 ">
<div class="detail-box">
<h1>
ViezGeschmack
</h1>
<p>
Viez ist nicht gleich Viez und schmeckt jedem etwas anders. Mit den Ergebnissen unseres individuellen Vieztasting hoffen wir Dich auf den Geschmack bringen zu können!
</p>
<a class="text-font btn btn-primary" href="#viezgeschmack">Zum ViezGeschmack</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container-slider">
<div class="row">
<div class="col-lg-2"></div>
<div class="col-lg-2 centered">
<ol class="carousel-indicators">
<li data-target="#customCarouselMobile" data-slide-to="0" class="active"></li>
<li data-target="#customCarouselMobile" data-slide-to="1"></li>
<li data-target="#customCarouselMobile" data-slide-to="2"></li>
<li data-target="#customCarouselMobile" data-slide-to="3"></li>
<li data-target="#customCarouselMobile" data-slide-to="4"></li>
</ol>
</div>
</div>
</div>
<div class="desktop">
<a class="carousel-control-prev" href="#customCarouselMobile" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only"></span>
</a>
<a class="carousel-control-next" href="#customCarouselMobile" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only"></span>
</a>
</div>
</div>
</section>
</div>
</div>
<!--ViezFacts-->
<section class="page-section" id="viezfacts">
<div class="container desktop-width">
<br>
<div class="row">
<div class="col-md-6 gx-5 mb-4 text-center">
<div class="bg-image hover-overlay ripple shadow-2-strong rounded-5" data-mdb-ripple-color="light">
<br>
<img src="assets/img/viezfacts.png" class="img-fluid1" />
<a href="#!">
<div class="mask" style="background-color: rgba(251, 251, 251, 0.15);"></div>
</a>
</div>
</div>
<div class="col-md-6 gx-5 mb-4 accordionTwo">
<div class="desktop">
<br>
</div>
<br>
<div class="panel-group" id="accordionFacts">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsOne" aria-expanded="false" class="collapsed"> Covie </a> </h4>
</div>
<div id="collapseFactsOne" class="panel-collapse collapse" aria-expanded="false" role="tablist" style="height: 0px;">
<div class="panel-body"> Covie ist die gängige Abkürzung für Viez mit Cola. <br> Viez wird neben Sprudel, Cola, Limo auch mit Saft (Cranberry Maracuja, Mango) gemischt getrunken.</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsTwo" aria-expanded="false"> GPS </a> </h4>
</div>
<div id="collapseFactsTwo" class="panel-collapse collapse" aria-expanded="false" role="tablist">
<div class="panel-body"> Das Kürzel „GPS" steht für Gebrüder Plein Speicher. Die Initialien verbergen sich unter den regional hergestellten Viezporzen. </div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsThree" aria-expanded="false"> Gezapfter Viez </a> </h4>
</div>
<div id="collapseFactsThree" class="panel-collapse collapse" aria-expanded="false" role="tablist">
<div class="panel-body"> In vielen Kneipen wird der Viez gezapft. Es bedarf dafür jedoch eigens hergestellter Schläuche, da die Säure des Viez die handelsüblichen auflöst. </div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsFour" aria-expanded="false"> Porz oder Glaskrug? </a> </h4>
</div>
<div id="collapseFactsFour" class="panel-collapse collapse" aria-expanded="false" role="tablist">
<div class="panel-body"> Nicht überall wird der Viez aus einer Porz getrunken. Im Saarland serviert man das Getränk in einem Glaskrug. </div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsFive" aria-expanded="false"> Wie viele Äpfel werden für einen Liter Viez benötigt? </a> </h4>
</div>
<div id="collapseFactsFive" class="panel-collapse collapse" aria-expanded="false" role="tablist">
<div class="panel-body"> 1 Liter Viez = ca. 1,3 kg Äpfel </div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsSix" aria-expanded="false"> Keine Regeln </a> </h4>
</div>
<div id="collapseFactsSix" class="panel-collapse collapse" aria-expanded="false" role="tablist">
<div class="panel-body"> Im Gegensatz zu vielen anderen traditionellen Getränken gelten für die Herstellung von Viez keine Regeln. Weder die Zusammensetzung noch die Region, in der das Getränk hergestellt werden darf, sind vorgeschrieben. </div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsSeven" aria-expanded="false"> Ein verstaubtes Altherrengetränk </a> </h4>
</div>
<div id="collapseFactsSeven" class="panel-collapse collapse" aria-expanded="false" role="tablist">
<div class="panel-body"> Viez ist erst in den letzten 40 Jahren wieder für viele Menschen rund um Trier attraktiv geworden. In der Mitte des letzten Jahrhundert galt es als verstaubtes Altherrengetränk und fand bei jüngeren Menschen kaum Beliebtheit. </div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsEight" aria-expanded="false"> Die Liersberger Viezallee </a> </h4>
</div>
<div id="collapseFactsEight" class="panel-collapse collapse" aria-expanded="false" role="tablist">
<div class="panel-body"> Die Viezallee befindet sich in der Gemeinde Igel im Ortsteil Liersberg. Sie hat ihren Namen bekommen, weil der damals zuständige örtliche Revierleiter scherzhaft ein Schild mit "Viezallee" dort angebracht hat und dort früher zahlreiche Obstbäume standen.
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionFacts" href="#collapseFactsNine" aria-expanded="false"> In Viez wohnen </a> </h4>
</div>
<div id="collapseFactsNine" class="panel-collapse collapse" aria-expanded="false" role="tablist">
<div class="panel-body"> In Hagenow (Mecklenburg-Vorpommern) gibt es einen Stadtteil namens Viez. </div>
</div>
</div>
</div>
</div>
</div>
</div>
<br>
<!--Chatbot-->
<section class="page-section bg-light" id="viezbot">
<div class="container desktop-width">
<div>
<br>
<h2 style="text-align: left;"> ViezBot </h2>
<hr style="height:5px;border-width:0;color:#f4623a;background-color:#f4623a; opacity:1;width: 15%;">
<br>
</div>
<div class="row">
<div class="col-md-6 gx-5 mb-4">
<div class="bg-image hover-overlay ripple shadow-2-strong rounded-5" data-mdb-ripple-color="light">
<a href="https://viezbot.herokuapp.com/" target="blank">
<figure>
<img src="assets/img/viezbot.png" style="border-radius: 5%;"/>
<figcaption class="text-font-imgcaption" style="color: black;"><em>Lizenz CC BY Namensnennung</em></figcaption>
</figure>
</a>
</div>
</div>
<div class="col-md-6 gx-5 mb-4">
<h5><strong>Volker stellt sich vor <i class="bi bi-chat-dots"></i></strong></h5><br>
<p class="text-font">
Hallo, ich bin Volker, der ViezBot.
<br><br>
Ich habe ein Quiz für dich erstellt um Dein Viez-Wissen zu testen. Klick’ einfach unten auf den Button und los geht's!
</p>
<br>
<a class="btn btn-primary btn-xl" href="https://viezbot.herokuapp.com/" target="blank">Quiz starten</a>
</div>
</div>
</div>
</section>
<br>
<!--ViezRezepte-->
<section class="page-section" id="viezrezepte" >
<div class="container desktop-width">
<br>
<div>
<h2 id = "viezrezepte" style="text-align: right;"> ViezRezepte </h2>
<hr style="height:5px;border-width:0;color:#f4623a;background-color:#f4623a; opacity:1;width: 15%;margin-left: 85%;">
</div>
<br>
<div class="row accordionOne">
<div class="col-lg-6 col-md-12 mb-4">
<div class="card text-center" style="border: 0em;">
<div class="card-header">
<h3 class="card-title">Viezkuchen</h3>
</div>
<div class="bg-image hover-overlay ripple" data-mdb-ripple-color="light">
<a data-toggle="collapse" data-parent="#accordionRez" href="#collapseRezOne" aria-expanded="false" class="collapsed">
<img src="assets/img/viezkuchen.jpeg" class="img-rezept" />
</a>
</div>
<div class="card-body">
<div class="panel-group" id="accordionRez">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordionRez" href="#collapseRezOne" aria-expanded="false" class="collapsed"> Das Rezept</a> </h4>
</div>
<div id="collapseRezOne" class="panel-collapse collapse" aria-expanded="false" role="tablist" style="height: 0px;">
<div class="panel-body">
<br>
<img src="assets/img/viezkuchenrezept.png" />
<br>
<br>
<a href="http://www.haag-bull.de/pdf/VIEZKUCHEN.pdf" target="blank" class="btn btn-primary">Link zum Rezept</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 col-md-12 mb-4">
<div class="card text-center" style="border: 0em;">
<div class="card-header">
<h3 class="card-title">Glühviez</h3>
</div>
<div class="bg-image hover-overlay ripple" data-mdb-ripple-color="light">
<a data-toggle="collapse" data-parent="#accordionRez" href="#collapseRezTwo" aria-expanded="false" class="collapsed">
<img src="assets/img/img_projekt/projektgruppe_mit_gluehviez.jpg" class="img-rezept" />
<div class="mask" style="background-color: rgba(251, 251, 251, 0.15);"></div>
</a>
</div>
<div class="card-body accordionOne">
<div class="panel-group" id="accordionRez">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordionRez" href="#collapseRezTwo" aria-expanded="false" class="collapsed"> Das Rezept</a> </h4>
</div>
<div id="collapseRezTwo" class="panel-collapse collapse" aria-expanded="false" role="tablist" style="height: 0px;">
<div class="panel-body text-font-noblock">
<strong>Zutaten:</strong>
<p>1 Liter Apfelwein, 8 Nelken, 2 Zitronenscheiben, etwas Zimtpulver (oder eine Zimtstange), Brauner Zucker</p>
<strong>Zubereitung:</strong>
<p>Apfelwein in einen Topf geben, dazu Nelken, Zimtpulver (Zimtstange) und die Zitronenscheiben. Bis zum Siedepunkt erhitzen (nicht kochen, da sonst der Alkohol verdunstet), vom Herd nehmen und Zucker nach Geschmack beifügen.</p>
<br>
<a href="https://www.inrlp.de/freizeit-tourismus/gastronomie/trier-kultgetraenk-viez-was-das-ist-und-wo-er-zu-bekommen-ist-art-5359306" target="blank" class="btn btn-primary">Link zum Rezept</a><br>
<em>Rezept von inrlp.de</em>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<p class="text-font text-center"><strong>Weitere leckere Viez-Rezepte wie Vieziger Ritter oder Viezfleisch gibt es auf der Website der Viezstraße e.V.</strong></p>
<div class="text-center">
<a href="https://www.viezstrasse-online.de/Reiseinfos/Rezepte" target="blank" class="btn btn-primary">Zu den Rezepten</a>
</div>
<br>
</div>
</section>
<br>
<br>
<!--ViezGeschmack-->
<section class="page-section bg-light" id="viezgeschmack">
<div class="container desktop-width">
<div>
<br>
<h2 style="text-align: left;"> ViezGeschmack </h2>
<hr style="height:5px;border-width:0;color:#f4623a;background-color:#f4623a; opacity:1;width: 15%;">
</div>
<div class="row">
<div class="col-md-8 gx-5 mb-4">
<p class="text-font">
Viez ist nicht gleich Viez und schmeckt jedem etwas anders. In unserem Vieztasting haben wir verschiedene Viezsorten der Region probiert. Darunter waren folgende Sorten: Marc Conrad Welschbilliger (Welschbillig), Weyand's Viez (Biewer), Joachim Meyer Holzäpelchi (Waldrach), Klimmes (Ralingen), Wolfgang Schmitt Sorte Barbe (Merzig), Römerviez (Welschbillig), Merziger Alter Särkower (Merzig), Franco Viez Juppis Viez (Welschbillig), Rudi Müller (Pluwig), Wiltinger Glühviez (Wiltingen).
</p>
<p class="text-font"><strong>Bewertet wurde auf einer mild-sauer Skala; mild stellt dabei eine 10 dar und sauer eine 0.</strong></p>
<p class="text-font">
Die Grafik präsentiert die <strong>subjektive</strong> Bewertung eines jeden Teilnehmers bzw. einer jeden Teilnehmerin (A-K). Die einzelnen Geschmackskurven können ein- und ausgeblendet werden durch Klick auf den jeweiligen Buchstaben.
</p>
<p class="text-font">
Vielleicht hilft Dir die Skala ja dabei, Deinen Lieblingsviez zu finden. Prost!
</p>
</div>
<div class="col-md-4 gx-5 mb-4">
<figure>
<img src="assets/img/img_projekt/viezsorten.jpg">
<figcaption class="text-font-imgcaption">Die Sorten bei unserem Vieztasting.<br><em>Lizenz CC BY Namensnennung</em></figcaption>
</figure>
</div>
</div>
<div class="mobile">
<br>
<div class="card text-white bg-primary mb-3" style="max-width: 14rem;" margin-top: 25px;>
<ul class="list-group list-group-flush">
<div class="list-group-item text-font text-primary" style="font-size: 0.85rem;"><b><i class="bi bi-info-circle"></i><br>Die Grafiken dieser Seite sind leider nicht für die mobile Ansicht geeignet.</b></div>
</ul>
</div>
</div>
<br>
</div>
<canvas id="bar-chart" width="400px" height="150px"></canvas>
</section>
<div class="container desktop-width">
<br>
<p class="text-font">
<strong>Die durchschnittlichen Bewertungen für die einzelnen Viezsorten:</strong>
</p>
<br>
<br>
<!-- https://tobiasahlin.com/blog/chartjs-charts-to-get-you-started/ -->
</div>
<canvas id="bar-chart-2" width="400px" height="180px"></canvas>
<br>
<br>
<!-- Footer-->
<footer class="bg-light py-5">
<div class="container px-4 px-lg-5"><div class="text-center text-muted text-footer"><a href="projekt.html#impressum">Impressum</a></div></div>
<div class="container px-4 px-lg-5"><div class="text-center text-muted text-footer"> <a href="datenschutz.html">Datenschutzerklärung</a></div></div>
<div class="container px-4 px-lg-5"><div class="text-center text-muted text-footer">© 2022 - Digital Humanities - <a href="https://www.uni-trier.de/universitaet/fachbereiche-faecher/fachbereich-ii/faecher/computerlinguistik-und-digital-humanities/digital-humanities" target="blank">Universität Trier</a></div></div>
<div class="py-6"></div>
<div class="container px-4 px-lg-5"><div class="text-center text-muted text-footer"> <i class="bi bi-info-circle"></i> Der Verzehr von Viez ist aufgrund des Alkoholgehalts erst ab 16 Jahren gestattet. </div></div>
</footer>
<script src="viezmuseum/js/jquery.min.js"></script>
<script src="viezmuseum/js/popper.js"></script>
<script src="viezmuseum/js/bootstrap.min.js"></script>
<script src="viezmuseum/js/owl.carousel.min.js"></script>
<script src="viezmuseum/js/main.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
<!-- Bootstrap core JS-->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<!-- SimpleLightbox plugin JS-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/SimpleLightbox/2.1.0/simpleLightbox.min.js"></script>
<!-- Core theme JS-->
<script src="js/scripts.js"></script>
</body>
</html>