-
Notifications
You must be signed in to change notification settings - Fork 0
/
faq.html
530 lines (488 loc) · 29.4 KB
/
faq.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>European Climate Risk Typology | F.A.Q.</title>
<meta name="description" content="European Climate Risk Typology, Frequently Asked Questions">
<meta name="author" content="Vasilis Vlastaras, University of Manchester">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="images/favicons/favicon.ico" type="image/x-icon">
<!-- Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons">
<!-- Bootstrap -->
<!--<link rel="stylesheet" href="libs/bootstrap-material-design-v4.1.1/css/bootstrap-material-design.css" >-->
<!--<link rel="stylesheet" href="libs/bootstrap-material-design-v4.1.1/css/bootstrap-material-design.min.css" >-->
<link rel="stylesheet" href="styles/bootstrap-material-design-modified.css">
<!-- Font-Awesome -->
<link rel="stylesheet" href="libs/font-awesome-free-5.5.0-web/css/all.min.css">
<!-- Custom Styles -->
<link rel="stylesheet" href="styles/page.css">
<link rel="stylesheet" href="styles/faq.css">
<!--<link rel="stylesheet" href="styles/loader.css">-->
<!-- JQuery -->
<!--<script type="text/javascript" src="libs/jquery-3.2.1/jquery.js"></script>-->
<!--<script type="text/javascript" src="libs/jquery-3.2.1/jquery.min.js"></script>-->
<script type="text/javascript" src="libs/jquery-3.2.1/jquery.slim.js"></script>
<!--<script type="text/javascript" src="libs/jquery-3.2.1/jquery.slim.min.js"></script>-->
<!--<script type="text/javascript" src="js/shared.js"></script>-->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-135030252-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-135030252-1');
</script>
</head>
<body>
<nav id="navBarHost" class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="index.html">
<img src="images/logo-small.png" height="24" class="website-logo" alt="Website Logo">
<span class="xs-brand-heading">European Climate Risk Typology</span>
<span class="sm-brand-heading">European Climate Risk Typology</span>
<span class="md-brand-heading">European Climate Risk Typology</span>
<span class="d-none d-sm-inline-block">European Climate Risk Typology</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navigationBar"
aria-controls="navigationBar" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div id="navigationBar" class="collapse navbar-collapse">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="map.html">Map</a>
</li>
<li class="nav-item">
<a class="nav-link" href="typology.html">Typology</a>
</li>
<li class="nav-item">
<a class="nav-link" href="uses.html">Uses</a>
</li>
<li class="nav-item">
<a class="nav-link" href="methodology.html">Methodology</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="#">FAQ <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact</a>
</li>
</ul>
</div>
</nav>
<div class="page-container">
<div class="content-container" style="background-color: #88C378;">
<div class="container">
<br>
<br>
<!--style="background-color: #FBBE5E;"-->
<section id="faq-section">
<!--<h1 class="display-3 ml-4">Frequently Asked Questions</h1>-->
<!--<h1 class="display-4 ml-4">Frequently Asked Questions</h1>-->
<h1 class="text-white display-4 font-weight-normal ml-4">Frequently Asked Questions</h1>
<!--<h3 class="ml-4">Frequently Asked Questions</h3>-->
<p class="text-white ml-4 lead">Click below for responses to frequently asked questions.</p>
<div class="md-accordion accordion" id="accordion" role="tablist" aria-multiselectable="true">
<!--style="background-color: #FBBE5E;"-->
<div class="card">
<div class="card-header pl-0" role="tab" id="heading10">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse10"
aria-expanded="false" aria-controls="collapse10">
<h5 class="ml-4 mb-0">
What is the typology?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse10" class="collapse" role="tabpanel" aria-labelledby="heading10">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The <strong>Climate Risk Typology</strong> is a tool to visualise, describe, compare and analyse
climate risk in European cities and regions. It clusters cities and regions according to their
climate risk characteristics, creating a detailed risk profile for individual cities and regions
and enabling comparisons between them. This online portal provides interactive maps,
statistical data and supporting information related to the <strong>Climate Risk Typology</strong>.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading20">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse20"
aria-expanded="false" aria-controls="collapse20">
<h5 class="ml-4 mb-0">
Why might I want to use the typology?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse20" class="collapse" role="tabpanel" aria-labelledby="heading20">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The typology is intended for use by <strong>decision-makers</strong>,
<strong>strategic planners</strong> and <strong>researchers</strong> involved in understanding and
responding to climate risk. You can use it to inform
<strong>climate change risk assessments</strong>, support the development of
<strong>adaptation and resilience strategies</strong> and help encourage <strong>networking</strong>
and sharing of <strong>knowledge and experience</strong>. It can also be used for
<strong>exploratory work on spatial risk patterns</strong>.
See the <a href="uses.html" class="font-weight-normal">Uses</a> page of this website for further
guidance on the application of the typology.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading30">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse30"
aria-expanded="false" aria-controls="collapse30">
<h5 class="ml-4 mb-0">
What can’t I use the typology for?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse30" class="collapse" role="tabpanel" aria-labelledby="heading30">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The typology <strong>is not</strong> a tool for detailed climate change
<strong>risk assessment</strong> and climate change <strong>adaptation planning</strong> and
<strong>strategy development</strong>. Because it operates at larger spatial scales
(<a href="#heading50" class="font-weight-normal">NUTS3</a> regions), the typology and related
climate risk indicators need to be supplemented with specific local data for more detailed
assessment and planning. Nevertheless, the typology can provide an insight into the drivers of
climate risk to explore in more detail locally.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading40">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse40"
aria-expanded="false" aria-controls="collapse40">
<h5 class="ml-4 mb-0">
Why is the typology not based on cities?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse40" class="collapse" role="tabpanel" aria-labelledby="heading40">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
Cities were considered as the main unit of analysis for the typology. However, there are
significant gaps in climate risk data coverage and availability at this scale which would have
held back the development of the typology. There is also a danger of isolating cities from their
surrounding hinterland areas. Instead, the typology uses
<a href="#heading50" class="font-weight-normal">NUTS3</a> regions as a spatial unit which allows
complete coverage of Europe. Also, many of Europe’s major cities are made up of one or more
<a href="#heading50" class="font-weight-normal">NUTS3</a> region, enabling a city-based perspective
to be taken in many cases.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading50">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse50"
aria-expanded="false" aria-controls="collapse50">
<h5 class="ml-4 mb-0">
What is a NUTS3 region?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse50" class="collapse" role="tabpanel" aria-labelledby="heading50">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
<a href="#heading50" class="font-weight-normal">NUTS3</a> regions are part of a system that
subdivides the economic territory of Europe to support <strong>statistical data gathering</strong>,
<strong>socio-economic analysis</strong> and the framing of <strong>European policies</strong>.
The system is <strong>population-based</strong>, and
<a href="#heading50" class="font-weight-normal">NUTS3</a> regions are defined as ‘small regions’
with a population between 150,000 and 800,000 people. There are 1379
<a href="#heading50" class="font-weight-normal">NUTS3</a> regions in Europe, with varying densities
seen across different countries.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading60">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse60"
aria-expanded="false" aria-controls="collapse60">
<h5 class="ml-4 mb-0">
What if the results of the typology conflict with what I understand about my city or region?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse60" class="collapse" role="tabpanel" aria-labelledby="heading60">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
Sometimes the typology might give you a surprising result for a city or region. Perhaps it is in a
different class from what you expected would be the case, or it is classified alongside seemingly
different regions in other parts of Europe. There are several things to consider when interpreting
the typology classification that can help to address this question:
</p>
<ul class="lead-125 lh-12 ml-2">
<li class="mb-2">
The analysis is based on <a href="#heading50" class="font-weight-normal">NUTS3</a> regions,
and a city can be made up of one or more for those regions. Also, in some cases a city may be one
part of a wider <a href="#heading50" class="font-weight-normal">NUTS3</a> region. This may
influence the interpretation of results you see here.
</li>
<li class="mb-2">
The typology is based on Europe-wide climate risk data. At a local level, there might be more
data available on other elements of climate risk that could not be gathered for the whole of
Europe and could therefore not be incorporated into the typology.
</li>
<li class="mb-2">
Although the typology classes and sub-classes will provide a valid description of the climate
risk characteristics for the majority of cities and
<a href="#heading50" class="font-weight-normal">NUTS3</a> regions falling within them, there will
be outliers in some cases.
</li>
</ul>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading70">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse70"
aria-expanded="false" aria-controls="collapse70">
<h5 class="ml-4 mb-0">
Why are there no values for some indicators for my NUTS3 region?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse70" class="collapse" role="tabpanel" aria-labelledby="heading70">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
In some cases, indicator data for specific regions was <strong>missing</strong> or
<strong>faulty</strong> due to problems with the original data. A technique called
<strong>areal interpolation</strong> was used to fill those gaps and to enable the
typology to be developed for all European <a href="#heading50" class="font-weight-normal">NUTS3</a>
regions. This technique allows missing values to be <strong>predicted</strong> by considering
available data values for the whole European surface area. While this allows an indicator
<a href="#heading90" class="font-weight-normal">z-score</a> to be developed for the region,
it is not possible to give actual data values here as they are predicted. This is the case
for example for some demographic indicators.
See <a href="methodology.html" class="font-weight-normal">Methodology</a> for more details.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading80">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse80"
aria-expanded="false" aria-controls="collapse80">
<h5 class="ml-4 mb-0">
What are the classes and sub-classes?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse80" class="collapse" role="tabpanel" aria-labelledby="heading80">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The classes and sub-classes describe groups of
<a href="#heading50" class="font-weight-normal">NUTS3</a> regions with similar climate risk
<strong>characteristics</strong>, based on climate <strong>hazards</strong> and
<strong>exposure</strong> and <strong>vulnerability</strong> to these hazards.
They are the outcome of a <strong>cluster analysis</strong> methodology incorporating around
<strong>50 indicators</strong> for each <a href="#heading50" class="font-weight-normal">NUTS3</a>
region (see <a href="methodology.html" class="font-weight-normal">Methodology</a> for more details).
There are <strong>8 main classes</strong>, such as 'Inland and Urbanised' and 'Northern Lands',
each of which is separated into <strong>3 to 5 sub-classes</strong> that identify different
clusters of <a href="#heading50" class="font-weight-normal">NUTS3</a> regions within each class.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading90">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse90"
aria-expanded="false" aria-controls="collapse90">
<h5 class="ml-4 mb-0">
What is a z-score?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse90" class="collapse" role="tabpanel" aria-labelledby="heading90">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The indicator tables for each region and the indicator diagrams make reference to
<strong>z-scores</strong>. This is a <strong>statistical measure</strong> showing how far above or
below the <strong>European mean</strong> a particular data point lies for a selected
<a href="#heading50" class="font-weight-normal">NUTS3</a> region. The mean (or European average)
has a z-score of 0. All values above the mean have a <strong>positive z-score</strong>, and all
values below the mean have a <strong>negative z-score</strong>. The higher the positive value and
the lower the negative one, the further away from the mean these values are. For example,
the Landlocked and Elevated class has a z-score of -0.231 for the heat wave days indicator,
meaning the projected increase in heat wave days compared to the baseline is slightly below the
European average. For Southern Lands the z-score for this indicator is 1.363, which puts the
<a href="#heading50" class="font-weight-normal">NUTS3</a> regions within this class significantly
above the European average for this indicator.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading100">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse100"
aria-expanded="false" aria-controls="collapse100">
<h5 class="ml-4 mb-0">
What do the histograms show?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse100" class="collapse" role="tabpanel" aria-labelledby="heading100">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The indicator histogram shows how the values for an indicator are <strong>distributed</strong>,
or in other words, where the regions lie relative to the European average for that indicator.
The z-score values have been assigned to <strong>intervals</strong> (bands) having a distance of
<strong>half standard deviation</strong>. The height of the bars indicate the frequency of the
z-score belonging to each interval. The higher the bar, the more regions lie in a particular
interval of z-score values. This enables an easy understanding of the <strong>distribution</strong>
from a <strong>statistical perspective</strong>, and complements the
<strong>spatial distribution</strong> shown by the indicator maps.
</p>
<p class="lead-125 lh-12 ml-2">
(See question:
<a href="#heading110" class="font-weight-normal">
What do the indicator diagrams show?
</a>).
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading110">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse110"
aria-expanded="false" aria-controls="collapse110">
<h5 class="ml-4 mb-0">
What do the indicator diagrams show?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse110" class="collapse" role="tabpanel" aria-labelledby="heading110">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The indicator diagrams are a visual representation of the indicator <strong>z-scores</strong> and
are available for each <strong>class</strong>, <strong>sub-class</strong> and
<strong>region</strong>. For the classes, the blue line at z-score 0 shows the
<strong>European average</strong>, the red line indicates the <strong>average z-score</strong>
for each indicator for the selected class. For the sub-classes, the blue line at z-score 0 shows
the <strong>average for the class</strong> that it falls within, and the red line indicates the
<strong>average z-score</strong> for each indicator for the selected sub-class.
The indicator diagrams therefore allow a quick overview of those indicators which are
significantly above or below European average. These correspond to important climate risk
characteristic for each class/sub-class.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading120">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse120"
aria-expanded="false" aria-controls="collapse120">
<h5 class="ml-4 mb-0">
What do the indicator maps show?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse120" class="collapse" role="tabpanel" aria-labelledby="heading120">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The online portal offers users the ability to map a range of <strong>hazard</strong>,
<strong>exposure</strong>, <strong>sensitivity</strong> and <strong>adaptive capacity</strong>
indicators on a European scale. The indicator maps visualise the values of a selected indicator
across all <a href="#heading50" class="font-weight-normal">NUTS3</a> regions in Europe.
The maps are based on the indicator z-scores (see question:
<a href="#heading90" class="font-weight-normal">What is a z-score?</a>),
and indicate whether regions lie above or below the European average for the selected region.
Thus they complement the histograms (see question:
<a href="#heading100" class="font-weight-normal">What do the histograms show?</a>)
by showing variation in climate risk indicators across the European territory from a spatial
perspective. The visualisation can support users in placing their selected city or
<a href="#heading50" class="font-weight-normal">NUTS3</a> region in a European context.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading130">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse130"
aria-expanded="false" aria-controls="collapse130">
<h5 class="ml-4 mb-0">
Why can I map some indicators that do not appear in the radial indicator diagrams?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse130" class="collapse" role="tabpanel" aria-labelledby="heading130">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
In developing the typology, we cleaned and processed data to develop a large range of indicators.
For statistical reasons, including excessive correlation, not all of them were employed in the
final typology analysis, which the indicator diagrams are based on. Nevertheless, as these
indicators might still be interesting for users, we have made them available for use via the
online portal.
</p>
</div>
</div>
</div>
<div class="card">
<div class="card-header pl-0" role="tab" id="heading140">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse140"
aria-expanded="false" aria-controls="collapse140">
<h5 class="ml-4 mb-0">
How do I cite the typology outputs in my documentation?
<i class="fa fa-angle-down rotate-icon mr-2"></i>
</h5>
</a>
</div>
<div id="collapse140" class="collapse" role="tabpanel" aria-labelledby="heading140">
<div class="card-block">
<p class="lead-125 lh-12 ml-2">
The online version of the European Climate Risk Typology should be cited as:
</p>
<br>
<p class="ml-2">
Carter, J.G, Hincks, S, Vlastaras, V, Connelly, A and Handley, J. 2018.
European Climate Risk Typology. [ONLINE] Available at: http://european-crt.org/index.html
</p>
</div>
</div>
</div>
</div>
<br>
</section>
</div>
</div>
</div>
<!--<script type="text/javascript" src="libs/vue-2.5.16/vue.js"></script>-->
<!--<script type="text/javascript" src="libs/vue-2.5.16/vue.min.js"></script>-->
<!--<script type="text/javascript" src="libs/popper.js-1.12.6/esm/popper.js"></script>-->
<!--<script type="text/javascript" src="libs/popper.js-1.12.6/esm/popper.min.js"></script>-->
<script type="text/javascript" src="libs/popper.js-1.12.6/umd/popper.js"></script>
<!--<script type="text/javascript" src="libs/popper.js-1.12.6/umd/popper.min.js"></script>-->
<!--<script type="text/javascript" src="libs/popper.js-1.12.6/popper.js"></script>-->
<!--<script type="text/javascript" src="libs/popper.js-1.12.6/popper.min.js"></script>-->
<!--<script type="text/javascript" src="libs/bootstrap-material-design-v4.1.1/js/bootstrap-material-design.js"></script>-->
<script type="text/javascript" src="libs/bootstrap-material-design-v4.1.1/js/bootstrap-material-design.min.js"></script>
<script>
$(document).ready(function() {
$('body').bootstrapMaterialDesign();
});
</script>
</body>
</html>