Project

General

Profile

« Previous | Next » 

Revision 57697

Added by Konstantinos Triantafyllou over 4 years ago

[Monitor Dashboard]: 1. Change inputs to materials. 2. Add fonts. 3. Add uikit.js on index 4. Add reorder functionality on indicators. 5. Fix height of header to 70px

View differences:

uikit.css
1 
/*! UIkit 2.27.5 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
1 
/*! UIkit 3.2.3 | http://www.getuikit.com | (c) 2014 - 2019 YOOtheme | MIT License */
2 2 
/* ========================================================================
3 3 
   Component: Base
4 4 
 ========================================================================== */
5 5 
/*
6 
 * 1. Normalize default `font-family` and set `font-size` to support `rem` units
7 
 * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
6 
 * 1. Set `font-size` to support `rem` units
7 
 *    Not using `font` property because a leading hyphen (e.g. -apple-system) causes the font to break in IE11 and Edge
8 
 * 2. Prevent adjustments of font size after orientation changes in iOS.
8 9 
 * 3. Style
9 10 
 */
10 11 
html {
11 12 
  /* 1 */
12 
  font: normal 14px / 20px "Helvetica Neue", Helvetica, Arial, sans-serif;
13 
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
14 
  font-size: 16px;
15 
  font-weight: normal;
16 
  line-height: 1.5;
13 17 
  /* 2 */
14 18 
  -webkit-text-size-adjust: 100%;
15 
  -ms-text-size-adjust: 100%;
16 19 
  /* 3 */
17 20 
  background: #fff;
18 
  color: #444;
21 
  color: #666;
19 22 
}
20 23 
/*
21 
 * Removes default margin.
24 
 * Remove the margin in all browsers.
22 25 
 */
23 26 
body {
24 27 
  margin: 0;
......
26 29 
/* Links
27 30 
 ========================================================================== */
28 31 
/*
29 
 * Remove the gray background color from active links in IE 10.
32 
 * Remove the outline on focused links when they are also active or hovered
30 33 
 */
31 
a {
32 
  background: transparent;
33 
}
34 
/*
35 
 * Improve readability of focused elements when they are also in an active/hover state.
36 
 */
37 34 
a:active,
38 35 
a:hover {
39 
  outline: 0;
36 
  outline: none;
40 37 
}
41 38 
/*
42 39 
 * Style
43 40 
 */
44 41 
a,
45 42 
.uk-link {
46 
  color: #07D;
43 
  color: #1e87f0;
47 44 
  text-decoration: none;
48 45 
  cursor: pointer;
49 46 
}
50 47 
a:hover,
51 
.uk-link:hover {
52 
  color: #059;
48 
.uk-link:hover,
49 
.uk-link-toggle:hover .uk-link,
50 
.uk-link-toggle:focus .uk-link {
51 
  color: #0f6ecd;
53 52 
  text-decoration: underline;
54 53 
}
55 54 
/* Text-level semantics
56 55 
 ========================================================================== */
57 56 
/*
58 
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
57 
 * 1. Add the correct text decoration in Edge.
58 
 * 2. The shorthand declaration `underline dotted` is not supported in Safari.
59 59 
 */
60 60 
abbr[title] {
61 
  border-bottom: 1px dotted;
61 
  /* 1 */
62 
  text-decoration: underline dotted;
63 
  /* 2 */
64 
  -webkit-text-decoration-style: dotted;
62 65 
}
63 66 
/*
64 
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
67 
 * Add the correct font weight in Chrome, Edge, and Safari.
65 68 
 */
66 69 
b,
67 70 
strong {
68 
  font-weight: bold;
71 
  font-weight: bolder;
69 72 
}
70 73 
/*
71 
 * 1. Address odd `em`-unit font size rendering in all browsers.
72 
 * 2. Consolas has a better baseline in running text compared to `Courier`
74 
 * 1. Consolas has a better baseline in running text compared to `Courier`
75 
 * 2. Correct the odd `em` font sizing in all browsers.
76 
 * 3. Style
73 77 
 */
74 78 
:not(pre) > code,
75 79 
:not(pre) > kbd,
76 80 
:not(pre) > samp {
77 81 
  /* 1 */
78 
  font-size: 12px;
82 
  font-family: Consolas, monaco, monospace;
79 83 
  /* 2 */
80 
  font-family: Consolas, monospace, serif;
84 
  font-size: 0.875rem;
81 85 
  /* 3 */
82 
  color: #D05;
86 
  color: #f0506e;
83 87 
  white-space: nowrap;
88 
  padding: 2px 6px;
89 
  background: #f8f8f8;
84 90 
}
85 91 
/*
86 92 
 * Emphasize
87 93 
 */
88 94 
em {
89 
  color: #D05;
95 
  color: #f0506e;
90 96 
}
91 97 
/*
92 98 
 * Insert
93 99 
 */
94 100 
ins {
95 
  background: #ffa;
96 
  color: #444;
101 
  background: #ffd;
102 
  color: #666;
97 103 
  text-decoration: none;
98 104 
}
99 105 
/*
100 106 
 * Mark
101 
 * Note: Addresses styling not present in IE 8/9.
102 107 
 */
103 108 
mark {
104 
  background: #ffa;
105 
  color: #444;
109 
  background: #ffd;
110 
  color: #666;
106 111 
}
107 112 
/*
108 113 
 * Quote
......
111 116 
  font-style: italic;
112 117 
}
113 118 
/*
114 
 * Addresses inconsistent and variable font size in all browsers.
119 
 * Add the correct font size in all browsers.
115 120 
 */
116 121 
small {
117 122 
  font-size: 80%;
......
146 151 
  vertical-align: middle;
147 152 
}
148 153 
/*
149 
 * Responsiveness
150 
 * 1. Sets a maximum width relative to the parent and auto scales the height
151 
 * 2. Corrects `max-width` behavior if padding and border are used
154 
 * 1. Add responsiveness.
155 
 * 2. Auto-scale the height. Only needed if `height` attribute is present.
156 
 * 3. Corrects responsive `max-width` behavior if padding and border are used.
157 
 * 4. Exclude SVGs for IE11 because they don't preserve their aspect ratio.
152 158 
 */
153 
audio,
154 159 
canvas,
155 160 
img,
156 
svg,
157 161 
video {
158 162 
  /* 1 */
159 163 
  max-width: 100%;
164 
  /* 2 */
160 165 
  height: auto;
161 
  /* 2 */
166 
  /* 3 */
162 167 
  box-sizing: border-box;
163 168 
}
169 
/* 4 */
170 
@supports (display: block) {
171 
  svg {
172 
    max-width: 100%;
173 
    height: auto;
174 
    box-sizing: border-box;
175 
  }
176 
}
164 177 
/*
165 
 * Preserve original dimensions
178 
 * Hide the overflow in IE.
166 179 
 */
167 
.uk-img-preserve,
168 
.uk-img-preserve audio,
169 
.uk-img-preserve canvas,
170 
.uk-img-preserve img,
171 
.uk-img-preserve svg,
172 
.uk-img-preserve video {
173 
  max-width: none;
180 
svg:not(:root) {
181 
  overflow: hidden;
174 182 
}
175 183 
/*
176 
 * Remove border when inside `a` element in IE 8/9/10.
184 
 * 1. Fix lazy loading images if parent element is set to `display: inline` and has `overflow: hidden`.
185 
 * 2. Hide `alt` text for lazy loading images.
186 
 * Note: Selector for background while loading img[data-src*='.jpg'][src*='data:image'] { background: grey; }
177 187 
 */
178 
img {
179 
  border: 0;
188 
img:not([src]) {
189 
  /* 1 */
190 
  min-width: 1px;
191 
  /* 2 */
192 
  visibility: hidden;
180 193 
}
181 194 
/*
182 
 * Correct overflow not hidden in IE 9/10/11.
195 
 * Iframe
196 
 * Remove border in all browsers
183 197 
 */
184 
svg:not(:root) {
185 
  overflow: hidden;
198 
iframe {
199 
  border: 0;
186 200 
}
187 201 
/* Block elements
188 202 
 ========================================================================== */
189 203 
/*
190 
 * Reset margin
191 
 */
192 
blockquote,
193 
figure {
194 
  margin: 0;
195 
}
196 
/*
197 204 
 * Margins
198 205 
 */
199 206 
p,
200 207 
ul,
201 208 
ol,
202 209 
dl,
203 
blockquote,
204 210 
pre,
205 211 
address,
206 212 
fieldset,
207 213 
figure {
208 
  margin: 0 0 15px 0;
214 
  margin: 0 0 20px 0;
209 215 
}
216 
/* Add margin if adjacent element */
210 217 
* + p,
211 218 
* + ul,
212 219 
* + ol,
213 220 
* + dl,
214 
* + blockquote,
215 221 
* + pre,
216 222 
* + address,
217 223 
* + fieldset,
218 224 
* + figure {
219 
  margin-top: 15px;
225 
  margin-top: 20px;
220 226 
}
221 227 
/* Headings
222 228 
 ========================================================================== */
223 229 
h1,
230 
.uk-h1,
224 231 
h2,
232 
.uk-h2,
225 233 
h3,
234 
.uk-h3,
226 235 
h4,
236 
.uk-h4,
227 237 
h5,
228 
h6 {
229 
  margin: 0 0 15px 0;
230 
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
238 
.uk-h5,
239 
h6,
240 
.uk-h6,
241 
.uk-heading-small,
242 
.uk-heading-medium,
243 
.uk-heading-large,
244 
.uk-heading-xlarge,
245 
.uk-heading-2xlarge {
246 
  margin: 0 0 20px 0;
247 
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
231 248 
  font-weight: normal;
232 
  color: #444;
249 
  color: #333;
233 250 
  text-transform: none;
234 251 
}
235 
/*
236 
 * Margins
237 
 */
252 
/* Add margin if adjacent element */
238 253 
* + h1,
254 
* + .uk-h1,
239 255 
* + h2,
256 
* + .uk-h2,
240 257 
* + h3,
258 
* + .uk-h3,
241 259 
* + h4,
260 
* + .uk-h4,
242 261 
* + h5,
243 
* + h6 {
244 
  margin-top: 25px;
262 
* + .uk-h5,
263 
* + h6,
264 
* + .uk-h6,
265 
* + .uk-heading-small,
266 
* + .uk-heading-medium,
267 
* + .uk-heading-large,
268 
* + .uk-heading-xlarge,
269 
* + .uk-heading-2xlarge {
270 
  margin-top: 40px;
245 271 
}
246 272 
/*
247 273 
 * Sizes
248 274 
 */
249 275 
h1,
250 276 
.uk-h1 {
251 
  font-size: 36px;
252 
  line-height: 42px;
277 
  font-size: 2.23125rem;
278 
  line-height: 1.2;
253 279 
}
254 280 
h2,
255 281 
.uk-h2 {
256 
  font-size: 24px;
257 
  line-height: 30px;
282 
  font-size: 1.7rem;
283 
  line-height: 1.3;
258 284 
}
259 285 
h3,
260 286 
.uk-h3 {
261 
  font-size: 18px;
262 
  line-height: 24px;
287 
  font-size: 1.5rem;
288 
  line-height: 1.4;
263 289 
}
264 290 
h4,
265 291 
.uk-h4 {
266 
  font-size: 16px;
267 
  line-height: 22px;
292 
  font-size: 1.25rem;
293 
  line-height: 1.4;
268 294 
}
269 295 
h5,
270 296 
.uk-h5 {
271 
  font-size: 14px;
272 
  line-height: 20px;
297 
  font-size: 16px;
298 
  line-height: 1.4;
273 299 
}
274 300 
h6,
275 301 
.uk-h6 {
276 
  font-size: 12px;
277 
  line-height: 18px;
302 
  font-size: 0.875rem;
303 
  line-height: 1.4;
278 304 
}
305 
/* Tablet landscape and bigger */
306 
@media (min-width: 960px) {
307 
  h1,
308 
  .uk-h1 {
309 
    font-size: 2.625rem;
310 
  }
311 
  h2,
312 
  .uk-h2 {
313 
    font-size: 2rem;
314 
  }
315 
}
279 316 
/* Lists
280 317 
 ========================================================================== */
281 318 
ul,
......
302 339 
/* Horizontal rules
303 340 
 ========================================================================== */
304 341 
/*
305 
 * 1. Address differences between Firefox and other browsers.
306 
 * 2. Style
342 
 * 1. Show the overflow in Chrome, Edge and IE.
343 
 * 2. Add the correct text-align in Edge and IE.
344 
 * 3. Style
307 345 
 */
308 
hr {
346 
hr,
347 
.uk-hr {
309 348 
  /* 1 */
310 
  box-sizing: content-box;
311 
  height: 0;
349 
  overflow: visible;
312 350 
  /* 2 */
313 
  margin: 15px 0;
351 
  text-align: inherit;
352 
  /* 3 */
353 
  margin: 0 0 20px 0;
314 354 
  border: 0;
315 
  border-top: 1px solid #ddd;
355 
  border-top: 1px solid #e5e5e5;
316 356 
}
357 
/* Add margin if adjacent element */
358 
* + hr,
359 
* + .uk-hr {
360 
  margin-top: 20px;
361 
}
317 362 
/* Address
318 363 
 ========================================================================== */
319 364 
address {
......
322 367 
/* Blockquotes
323 368 
 ========================================================================== */
324 369 
blockquote {
325 
  padding-left: 15px;
326 
  border-left: 5px solid #ddd;
327 
  font-size: 16px;
328 
  line-height: 22px;
370 
  margin: 0 0 20px 0;
371 
  font-size: 1.25rem;
372 
  line-height: 1.5;
329 373 
  font-style: italic;
374 
  color: #333;
330 375 
}
376 
/* Add margin if adjacent element */
377 
* + blockquote {
378 
  margin-top: 20px;
379 
}
380 
/*
381 
 * Content
382 
 */
383 
blockquote p:last-of-type {
384 
  margin-bottom: 0;
385 
}
386 
blockquote footer {
387 
  margin-top: 10px;
388 
  font-size: 0.875rem;
389 
  line-height: 1.5;
390 
  color: #666;
391 
}
392 
blockquote footer::before {
393 
  content: "— ";
394 
}
331 395 
/* Preformatted text
332 396 
 ========================================================================== */
333 397 
/*
334 398 
 * 1. Contain overflow in all browsers.
335 399 
 */
336 400 
pre {
337 
  padding: 10px;
338 
  background: #f5f5f5;
339 
  font: 12px / 18px Consolas, monospace, serif;
340 
  color: #444;
401 
  font: 0.875rem / 1.5 Consolas, monaco, monospace;
402 
  color: #666;
341 403 
  -moz-tab-size: 4;
342 404 
  tab-size: 4;
343 405 
  /* 1 */
344 406 
  overflow: auto;
407 
  padding: 10px;
408 
  border: 1px solid #e5e5e5;
409 
  border-radius: 3px;
410 
  background: #fff;
345 411 
}
412 
pre code {
413 
  font-family: Consolas, monaco, monospace;
414 
}
346 415 
/* Selection pseudo-element
347 416 
 ========================================================================== */
348 
::-moz-selection {
349 
  background: #39f;
350 
  color: #fff;
351 
  text-shadow: none;
352 
}
353 417 
::selection {
354 418 
  background: #39f;
355 419 
  color: #fff;
......
358 422 
/* HTML5 elements
359 423 
 ========================================================================== */
360 424 
/*
361 
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
362 
 * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
363 
 * Correct `block` display not defined for `main` in IE 11.
425 
 * 1. Add the correct display in Edge, IE 10+, and Firefox.
426 
 * 2. Add the correct display in IE.
364 427 
 */
365 
article,
366 
aside,
367 428 
details,
368 
figcaption,
369 
figure,
370 
footer,
371 
header,
372 
main,
373 
nav,
374 
section,
375 
summary {
429 
main {
430 
  /* 2 */
376 431 
  display: block;
377 432 
}
378 433 
/*
379 
 * Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
434 
 * Add the correct display in all browsers.
380 435 
 */
381 
progress {
382 
  vertical-align: baseline;
436 
summary {
437 
  display: list-item;
383 438 
}
384 439 
/*
385 
 * Prevent displaying `audio` without controls in Chrome, Safari and Opera
440 
 * Add the correct display in IE.
386 441 
 */
387 
audio:not([controls]) {
388 
  display: none;
389 
}
390 
/*
391 
 * Address `[hidden]` styling not present in IE 8/9/10.
392 
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
393 
 */
394 
[hidden],
395 442 
template {
396 443 
  display: none;
397 444 
}
398 
/* Iframe
445 
/* Pass media breakpoints to JS
399 446 
 ========================================================================== */
400 
iframe {
401 
  border: 0;
402 
}
403 
/* Fix viewport for IE10 snap mode
404 
 ========================================================================== */
405 
@media screen and (max-width: 400px) {
406 
  @-ms-viewport {
407 
    width: device-width;
408 
  }
409 
}
410 
/* ========================================================================
411 
   Component: Grid
412 
 ========================================================================== */
413 447 
/*
414 
 * 1. Makes grid more robust so that it can be used with other block elements like lists
448 
 * Breakpoints
415 449 
 */
416 
.uk-grid {
417 
  display: -ms-flexbox;
418 
  display: -webkit-flex;
419 
  display: flex;
420 
  -ms-flex-wrap: wrap;
421 
  -webkit-flex-wrap: wrap;
422 
  flex-wrap: wrap;
423 
  /* 1 */
424 
  margin: 0;
425 
  padding: 0;
426 
  list-style: none;
450 
.uk-breakpoint-s::before {
451 
  content: '640px';
427 452 
}
428 
/*
429 
 * DEPRECATED
430 
 * Micro clearfix
431 
 * Can't use `table` because it creates a 1px gap when it becomes a flex item, only in Webkit
432 
 */
433 
.uk-grid:before,
434 
.uk-grid:after {
435 
  content: "";
436 
  display: block;
437 
  overflow: hidden;
453 
.uk-breakpoint-m::before {
454 
  content: '960px';
438 455 
}
439 
.uk-grid:after {
440 
  clear: both;
456 
.uk-breakpoint-l::before {
457 
  content: '1200px';
441 458 
}
442 
/*
443 
 * Grid cell
444 
 * 1. Space is allocated solely based on content dimensions
445 
 * 2. Makes grid more robust so that it can be used with other block elements
446 
 * 3. DEPRECATED Using `float` to support IE9
447 
 */
448 
.uk-grid > * {
449 
  /* 1 */
450 
  -ms-flex: none;
451 
  -webkit-flex: none;
452 
  flex: none;
453 
  /* 2 */
454 
  margin: 0;
455 
  /* 3 */
456 
  float: left;
459 
.uk-breakpoint-xl::before {
460 
  content: '1600px';
457 461 
}
458 
/*
459 
 * Remove margin from the last-child
460 
 */
461 
.uk-grid > * > :last-child {
462 
  margin-bottom: 0;
462 
:root {
463 
  --uk-breakpoint-s: 640px;
464 
  --uk-breakpoint-m: 960px;
465 
  --uk-breakpoint-l: 1200px;
466 
  --uk-breakpoint-xl: 1600px;
463 467 
}
464 
/* Grid gutter
468 
/* ========================================================================
469 
   Component: Link
465 470 
 ========================================================================== */
466 
/*
467 
 * Default gutter
468 
 */
469 
/* Horizontal */
470 
.uk-grid {
471 
  margin-left: -25px;
471 
/* Muted
472 
 ========================================================================== */
473 
a.uk-link-muted,
474 
.uk-link-muted a {
475 
  color: #999;
472 476 
}
473 
.uk-grid > * {
474 
  padding-left: 25px;
477 
a.uk-link-muted:hover,
478 
.uk-link-muted a:hover,
479 
.uk-link-toggle:hover .uk-link-muted,
480 
.uk-link-toggle:focus .uk-link-muted {
481 
  color: #666;
475 482 
}
476 
/* Vertical */
477 
.uk-grid + .uk-grid,
478 
.uk-grid-margin,
479 
.uk-grid > * > .uk-panel + .uk-panel {
480 
  margin-top: 25px;
483 
/* Text
484 
 ========================================================================== */
485 
a.uk-link-text,
486 
.uk-link-text a {
487 
  color: inherit;
481 488 
}
482 
/* Large screen and bigger */
483 
@media (min-width: 1220px) {
484 
  /* Horizontal */
485 
  .uk-grid {
486 
    margin-left: -35px;
487 
  }
488 
  .uk-grid > * {
489 
    padding-left: 35px;
490 
  }
491 
  /* Vertical */
492 
  .uk-grid + .uk-grid,
493 
  .uk-grid-margin,
494 
  .uk-grid > * > .uk-panel + .uk-panel {
495 
    margin-top: 35px;
496 
  }
489 
a.uk-link-text:hover,
490 
.uk-link-text a:hover,
491 
.uk-link-toggle:hover .uk-link-text,
492 
.uk-link-toggle:focus .uk-link-text {
493 
  color: #999;
497 494 
}
498 
/*
499 
 * Collapse gutter
500 
 */
501 
/* Horizontal */
502 
.uk-grid-collapse {
503 
  margin-left: 0;
495 
/* Heading
496 
 ========================================================================== */
497 
a.uk-link-heading,
498 
.uk-link-heading a {
499 
  color: inherit;
504 500 
}
505 
.uk-grid-collapse > * {
506 
  padding-left: 0;
501 
a.uk-link-heading:hover,
502 
.uk-link-heading a:hover,
503 
.uk-link-toggle:hover .uk-link-heading,
504 
.uk-link-toggle:focus .uk-link-heading {
505 
  color: #1e87f0;
506 
  text-decoration: none;
507 507 
}
508 
/* Vertical */
509 
.uk-grid-collapse + .uk-grid-collapse,
510 
.uk-grid-collapse > .uk-grid-margin,
511 
.uk-grid-collapse > * > .uk-panel + .uk-panel {
512 
  margin-top: 0;
513 
}
514 
/*
515 
 * Small gutter
516 
 */
517 
/* Horizontal */
518 
.uk-grid-small {
519 
  margin-left: -10px;
520 
}
521 
.uk-grid-small > * {
522 
  padding-left: 10px;
523 
}
524 
/* Vertical */
525 
.uk-grid-small + .uk-grid-small,
526 
.uk-grid-small > .uk-grid-margin,
527 
.uk-grid-small > * > .uk-panel + .uk-panel {
528 
  margin-top: 10px;
529 
}
530 
/*
531 
 * Medium gutter
532 
 */
533 
/* Horizontal */
534 
.uk-grid-medium {
535 
  margin-left: -25px;
536 
}
537 
.uk-grid-medium > * {
538 
  padding-left: 25px;
539 
}
540 
/* Vertical */
541 
.uk-grid-medium + .uk-grid-medium,
542 
.uk-grid-medium > .uk-grid-margin,
543 
.uk-grid-medium > * > .uk-panel + .uk-panel {
544 
  margin-top: 25px;
545 
}
546 
/*
547 
 * Large gutter
548 
 */
549 
/* Large screen and bigger */
550 
@media (min-width: 960px) {
551 
  /* Horizontal */
552 
  .uk-grid-large {
553 
    margin-left: -35px;
554 
  }
555 
  .uk-grid-large > * {
556 
    padding-left: 35px;
557 
  }
558 
  /* Vertical */
559 
  .uk-grid-large + .uk-grid-large,
560 
  .uk-grid-large-margin,
561 
  .uk-grid-large > * > .uk-panel + .uk-panel {
562 
    margin-top: 35px;
563 
  }
564 
}
565 
/* Extra Large screens */
566 
@media (min-width: 1220px) {
567 
  /* Horizontal */
568 
  .uk-grid-large {
569 
    margin-left: -50px;
570 
  }
571 
  .uk-grid-large > * {
572 
    padding-left: 50px;
573 
  }
574 
  /* Vertical */
575 
  .uk-grid-large + .uk-grid-large,
576 
  .uk-grid-large-margin,
577 
  .uk-grid-large > * > .uk-panel + .uk-panel {
578 
    margin-top: 50px;
579 
  }
580 
}
581 
/* Modifier: `uk-grid-divider`
508 
/* Reset
582 509 
 ========================================================================== */
583 510 
/*
584 
 * Horizontal divider
585 
 * Only works with the default gutter. Does not work with gutter collapse, small or large.
586 
 * Does not work with `uk-push-*`, `uk-pull-*` and not if the columns float into the next row.
511 
 * `!important` needed to override inverse component
587 512 
 */
588 
.uk-grid-divider:not(:empty) {
589 
  margin-left: -25px;
590 
  margin-right: -25px;
513 
a.uk-link-reset,
514 
.uk-link-reset a {
515 
  color: inherit !important;
516 
  text-decoration: none !important;
591 517 
}
592 
.uk-grid-divider > * {
593 
  padding-left: 25px;
594 
  padding-right: 25px;
595 
}
596 
.uk-grid-divider > [class*='uk-width-1-']:not(.uk-width-1-1):nth-child(n+2),
597 
.uk-grid-divider > [class*='uk-width-2-']:nth-child(n+2),
598 
.uk-grid-divider > [class*='uk-width-3-']:nth-child(n+2),
599 
.uk-grid-divider > [class*='uk-width-4-']:nth-child(n+2),
600 
.uk-grid-divider > [class*='uk-width-5-']:nth-child(n+2),
601 
.uk-grid-divider > [class*='uk-width-6-']:nth-child(n+2),
602 
.uk-grid-divider > [class*='uk-width-7-']:nth-child(n+2),
603 
.uk-grid-divider > [class*='uk-width-8-']:nth-child(n+2),
604 
.uk-grid-divider > [class*='uk-width-9-']:nth-child(n+2) {
605 
  border-left: 1px solid #ddd;
606 
}
607 
/* Tablet and bigger */
608 
@media (min-width: 768px) {
609 
  .uk-grid-divider > [class*='uk-width-medium-']:not(.uk-width-medium-1-1):nth-child(n+2) {
610 
    border-left: 1px solid #ddd;
611 
  }
612 
}
613 
/* Desktop and bigger */
614 
@media (min-width: 960px) {
615 
  .uk-grid-divider > [class*='uk-width-large-']:not(.uk-width-large-1-1):nth-child(n+2) {
616 
    border-left: 1px solid #ddd;
617 
  }
618 
}
619 
/* Large screen and bigger */
620 
@media (min-width: 1220px) {
621 
  /*
622 
     * Large gutter
623 
     */
624 
  .uk-grid-divider:not(:empty) {
625 
    margin-left: -35px;
626 
    margin-right: -35px;
627 
  }
628 
  .uk-grid-divider > * {
629 
    padding-left: 35px;
630 
    padding-right: 35px;
631 
  }
632 
  .uk-grid-divider:empty {
633 
    margin-top: 35px;
634 
    margin-bottom: 35px;
635 
  }
636 
}
637 
/*
638 
 * Vertical divider
639 
 */
640 
.uk-grid-divider:empty {
641 
  margin-top: 25px;
642 
  margin-bottom: 25px;
643 
  border-top: 1px solid #ddd;
644 
}
645 
/* Match panels in grids
518 
/* Toggle
646 519 
 ========================================================================== */
647 
/*
648 
 * 1. Behave like a block element
649 
 */
650 
.uk-grid-match > * {
651 
  display: -ms-flexbox;
652 
  display: -webkit-flex;
653 
  display: flex;
654 
  /* 1 */
655 
  -ms-flex-wrap: wrap;
656 
  -webkit-flex-wrap: wrap;
657 
  flex-wrap: wrap;
520 
.uk-link-toggle {
521 
  color: inherit !important;
522 
  text-decoration: none !important;
658 523 
}
659 
.uk-grid-match > * > * {
660 
  /* 1 */
661 
  -ms-flex: none;
662 
  -webkit-flex: none;
663 
  flex: none;
664 
  box-sizing: border-box;
665 
  width: 100%;
524 
.uk-link-toggle:focus {
525 
  outline: none;
666 526 
}
667 
/* Even grid cell widths
527 
/* ========================================================================
528 
   Component: Heading
668 529 
 ========================================================================== */
669 
[class*='uk-grid-width'] > * {
670 
  box-sizing: border-box;
671 
  width: 100%;
530 
.uk-heading-small {
531 
  font-size: 2.6rem;
532 
  line-height: 1.2;
672 533 
}
673 
.uk-grid-width-1-2 > * {
674 
  width: 50%;
534 
.uk-heading-medium {
535 
  font-size: 2.8875rem;
536 
  line-height: 1.1;
675 537 
}
676 
.uk-grid-width-1-3 > * {
677 
  width: 33.333%;
538 
.uk-heading-large {
539 
  font-size: 3.4rem;
540 
  line-height: 1.1;
678 541 
}
679 
.uk-grid-width-1-4 > * {
680 
  width: 25%;
542 
.uk-heading-xlarge {
543 
  font-size: 4rem;
544 
  line-height: 1;
681 545 
}
682 
.uk-grid-width-1-5 > * {
683 
  width: 20%;
546 
.uk-heading-2xlarge {
547 
  font-size: 6rem;
548 
  line-height: 1;
684 549 
}
685 
.uk-grid-width-1-6 > * {
686 
  width: 16.666%;
687 
}
688 
.uk-grid-width-1-10 > * {
689 
  width: 10%;
690 
}
691 
.uk-grid-width-auto > * {
692 
  width: auto;
693 
}
694 
/* Phone landscape and bigger */
695 
@media (min-width: 480px) {
696 
  .uk-grid-width-small-1-1 > * {
697 
    width: 100%;
698 
  }
699 
  .uk-grid-width-small-1-2 > * {
700 
    width: 50%;
701 
  }
702 
  .uk-grid-width-small-1-3 > * {
703 
    width: 33.333%;
704 
  }
705 
  .uk-grid-width-small-1-4 > * {
706 
    width: 25%;
707 
  }
708 
  .uk-grid-width-small-1-5 > * {
709 
    width: 20%;
710 
  }
711 
  .uk-grid-width-small-1-6 > * {
712 
    width: 16.666%;
713 
  }
714 
  .uk-grid-width-small-1-10 > * {
715 
    width: 10%;
716 
  }
717 
}
718 
/* Tablet and bigger */
719 
@media (min-width: 768px) {
720 
  .uk-grid-width-medium-1-1 > * {
721 
    width: 100%;
722 
  }
723 
  .uk-grid-width-medium-1-2 > * {
724 
    width: 50%;
725 
  }
726 
  .uk-grid-width-medium-1-3 > * {
727 
    width: 33.333%;
728 
  }
729 
  .uk-grid-width-medium-1-4 > * {
730 
    width: 25%;
731 
  }
732 
  .uk-grid-width-medium-1-5 > * {
733 
    width: 20%;
734 
  }
735 
  .uk-grid-width-medium-1-6 > * {
736 
    width: 16.666%;
737 
  }
738 
  .uk-grid-width-medium-1-10 > * {
739 
    width: 10%;
740 
  }
741 
}
742 
/* Desktop and bigger */
550 
/* Tablet Landscape and bigger */
743 551 
@media (min-width: 960px) {
744 
  .uk-grid-width-large-1-1 > * {
745 
    width: 100%;
552 
  .uk-heading-small {
553 
    font-size: 3.25rem;
746 554 
  }
747 
  .uk-grid-width-large-1-2 > * {
748 
    width: 50%;
555 
  .uk-heading-medium {
556 
    font-size: 3.5rem;
749 557 
  }
750 
  .uk-grid-width-large-1-3 > * {
751 
    width: 33.333%;
558 
  .uk-heading-large {
559 
    font-size: 4rem;
752 560 
  }
753 
  .uk-grid-width-large-1-4 > * {
754 
    width: 25%;
561 
  .uk-heading-xlarge {
562 
    font-size: 6rem;
755 563 
  }
756 
  .uk-grid-width-large-1-5 > * {
757 
    width: 20%;
564 
  .uk-heading-2xlarge {
565 
    font-size: 8rem;
758 566 
  }
759 
  .uk-grid-width-large-1-6 > * {
760 
    width: 16.666%;
761 
  }
762 
  .uk-grid-width-large-1-10 > * {
763 
    width: 10%;
764 
  }
765 567 
}
766 
/* Large screen and bigger */
767 
@media (min-width: 1220px) {
768 
  .uk-grid-width-xlarge-1-1 > * {
769 
    width: 100%;
568 
/* Laptop and bigger */
569 
@media (min-width: 1200px) {
570 
  .uk-heading-medium {
571 
    font-size: 4rem;
770 572 
  }
771 
  .uk-grid-width-xlarge-1-2 > * {
772 
    width: 50%;
573 
  .uk-heading-large {
574 
    font-size: 6rem;
773 575 
  }
774 
  .uk-grid-width-xlarge-1-3 > * {
775 
    width: 33.333%;
576 
  .uk-heading-xlarge {
577 
    font-size: 8rem;
776 578 
  }
777 
  .uk-grid-width-xlarge-1-4 > * {
778 
    width: 25%;
579 
  .uk-heading-2xlarge {
580 
    font-size: 11rem;
779 581 
  }
780 
  .uk-grid-width-xlarge-1-5 > * {
781 
    width: 20%;
782 
  }
783 
  .uk-grid-width-xlarge-1-6 > * {
784 
    width: 16.666%;
785 
  }
786 
  .uk-grid-width-xlarge-1-10 > * {
787 
    width: 10%;
788 
  }
789 582 
}
790 
/* Sub-objects: `uk-width-*`
583 
/* Primary
584 
   Deprecated: Use `uk-heading-medium` instead
791 585 
 ========================================================================== */
792 
[class*='uk-width'] {
793 
  box-sizing: border-box;
794 
  width: 100%;
795 
}
796 
/*
797 
 * Widths
798 
 */
799 
/* Whole */
800 
.uk-width-1-1 {
801 
  width: 100%;
802 
}
803 
/* Halves */
804 
.uk-width-1-2,
805 
.uk-width-2-4,
806 
.uk-width-3-6,
807 
.uk-width-5-10 {
808 
  width: 50%;
809 
}
810 
/* Thirds */
811 
.uk-width-1-3,
812 
.uk-width-2-6 {
813 
  width: 33.333%;
814 
}
815 
.uk-width-2-3,
816 
.uk-width-4-6 {
817 
  width: 66.666%;
818 
}
819 
/* Quarters */
820 
.uk-width-1-4 {
821 
  width: 25%;
822 
}
823 
.uk-width-3-4 {
824 
  width: 75%;
825 
}
826 
/* Fifths */
827 
.uk-width-1-5,
828 
.uk-width-2-10 {
829 
  width: 20%;
830 
}
831 
.uk-width-2-5,
832 
.uk-width-4-10 {
833 
  width: 40%;
834 
}
835 
.uk-width-3-5,
836 
.uk-width-6-10 {
837 
  width: 60%;
838 
}
839 
.uk-width-4-5,
840 
.uk-width-8-10 {
841 
  width: 80%;
842 
}
843 
/* Sixths */
844 
.uk-width-1-6 {
845 
  width: 16.666%;
846 
}
847 
.uk-width-5-6 {
848 
  width: 83.333%;
849 
}
850 
/* Tenths */
851 
.uk-width-1-10 {
852 
  width: 10%;
853 
}
854 
.uk-width-3-10 {
855 
  width: 30%;
856 
}
857 
.uk-width-7-10 {
858 
  width: 70%;
859 
}
860 
.uk-width-9-10 {
861 
  width: 90%;
862 
}
863 
/* Phone landscape and bigger */
864 
@media (min-width: 480px) {
865 
  /* Whole */
866 
  .uk-width-small-1-1 {
867 
    width: 100%;
868 
  }
869 
  /* Halves */
870 
  .uk-width-small-1-2,
871 
  .uk-width-small-2-4,
872 
  .uk-width-small-3-6,
873 
  .uk-width-small-5-10 {
874 
    width: 50%;
875 
  }
876 
  /* Thirds */
877 
  .uk-width-small-1-3,
878 
  .uk-width-small-2-6 {
879 
    width: 33.333%;
880 
  }
881 
  .uk-width-small-2-3,
882 
  .uk-width-small-4-6 {
883 
    width: 66.666%;
884 
  }
885 
  /* Quarters */
886 
  .uk-width-small-1-4 {
887 
    width: 25%;
888 
  }
889 
  .uk-width-small-3-4 {
890 
    width: 75%;
891 
  }
892 
  /* Fifths */
893 
  .uk-width-small-1-5,
894 
  .uk-width-small-2-10 {
895 
    width: 20%;
896 
  }
897 
  .uk-width-small-2-5,
898 
  .uk-width-small-4-10 {
899 
    width: 40%;
900 
  }
901 
  .uk-width-small-3-5,
902 
  .uk-width-small-6-10 {
903 
    width: 60%;
904 
  }
905 
  .uk-width-small-4-5,
906 
  .uk-width-small-8-10 {
907 
    width: 80%;
908 
  }
909 
  /* Sixths */
910 
  .uk-width-small-1-6 {
911 
    width: 16.666%;
912 
  }
913 
  .uk-width-small-5-6 {
914 
    width: 83.333%;
915 
  }
916 
  /* Tenths */
917 
  .uk-width-small-1-10 {
918 
    width: 10%;
919 
  }
920 
  .uk-width-small-3-10 {
921 
    width: 30%;
922 
  }
923 
  .uk-width-small-7-10 {
924 
    width: 70%;
925 
  }
926 
  .uk-width-small-9-10 {
927 
    width: 90%;
928 
  }
929 
}
930 
/* Tablet and bigger */
931 
@media (min-width: 768px) {
932 
  /* Whole */
933 
  .uk-width-medium-1-1 {
934 
    width: 100%;
935 
  }
936 
  /* Halves */
937 
  .uk-width-medium-1-2,
938 
  .uk-width-medium-2-4,
939 
  .uk-width-medium-3-6,
940 
  .uk-width-medium-5-10 {
941 
    width: 50%;
942 
  }
943 
  /* Thirds */
944 
  .uk-width-medium-1-3,
945 
  .uk-width-medium-2-6 {
946 
    width: 33.333%;
947 
  }
948 
  .uk-width-medium-2-3,
949 
  .uk-width-medium-4-6 {
950 
    width: 66.666%;
951 
  }
952 
  /* Quarters */
953 
  .uk-width-medium-1-4 {
954 
    width: 25%;
955 
  }
956 
  .uk-width-medium-3-4 {
957 
    width: 75%;
958 
  }
959 
  /* Fifths */
960 
  .uk-width-medium-1-5,
961 
  .uk-width-medium-2-10 {
962 
    width: 20%;
963 
  }
964 
  .uk-width-medium-2-5,
965 
  .uk-width-medium-4-10 {
966 
    width: 40%;
967 
  }
968 
  .uk-width-medium-3-5,
969 
  .uk-width-medium-6-10 {
970 
    width: 60%;
971 
  }
972 
  .uk-width-medium-4-5,
973 
  .uk-width-medium-8-10 {
974 
    width: 80%;
975 
  }
976 
  /* Sixths */
977 
  .uk-width-medium-1-6 {
978 
    width: 16.666%;
979 
  }
980 
  .uk-width-medium-5-6 {
981 
    width: 83.333%;
982 
  }
983 
  /* Tenths */
984 
  .uk-width-medium-1-10 {
985 
    width: 10%;
986 
  }
987 
  .uk-width-medium-3-10 {
988 
    width: 30%;
989 
  }
990 
  .uk-width-medium-7-10 {
991 
    width: 70%;
992 
  }
993 
  .uk-width-medium-9-10 {
994 
    width: 90%;
995 
  }
996 
}
586 
/* Tablet landscape and bigger */
997 587 
/* Desktop and bigger */
998 
@media (min-width: 960px) {
999 
  /* Whole */
1000 
  .uk-width-large-1-1 {
1001 
    width: 100%;
1002 
  }
1003 
  /* Halves */
1004 
  .uk-width-large-1-2,
1005 
  .uk-width-large-2-4,
1006 
  .uk-width-large-3-6,
1007 
  .uk-width-large-5-10 {
1008 
    width: 50%;
1009 
  }
1010 
  /* Thirds */
1011 
  .uk-width-large-1-3,
1012 
  .uk-width-large-2-6 {
1013 
    width: 33.333%;
1014 
  }
1015 
  .uk-width-large-2-3,
1016 
  .uk-width-large-4-6 {
1017 
    width: 66.666%;
1018 
  }
1019 
  /* Quarters */
1020 
  .uk-width-large-1-4 {
1021 
    width: 25%;
1022 
  }
1023 
  .uk-width-large-3-4 {
1024 
    width: 75%;
1025 
  }
1026 
  /* Fifths */
1027 
  .uk-width-large-1-5,
1028 
  .uk-width-large-2-10 {
1029 
    width: 20%;
1030 
  }
1031 
  .uk-width-large-2-5,
1032 
  .uk-width-large-4-10 {
1033 
    width: 40%;
1034 
  }
1035 
  .uk-width-large-3-5,
1036 
  .uk-width-large-6-10 {
1037 
    width: 60%;
1038 
  }
1039 
  .uk-width-large-4-5,
1040 
  .uk-width-large-8-10 {
1041 
    width: 80%;
1042 
  }
1043 
  /* Sixths */
1044 
  .uk-width-large-1-6 {
1045 
    width: 16.666%;
1046 
  }
1047 
  .uk-width-large-5-6 {
1048 
    width: 83.333%;
1049 
  }
1050 
  /* Tenths */
1051 
  .uk-width-large-1-10 {
1052 
    width: 10%;
1053 
  }
1054 
  .uk-width-large-3-10 {
1055 
    width: 30%;
1056 
  }
1057 
  .uk-width-large-7-10 {
1058 
    width: 70%;
1059 
  }
1060 
  .uk-width-large-9-10 {
1061 
    width: 90%;
1062 
  }
588 
/* Hero
589 
   Deprecated: Use `uk-heading-xlarge` instead
590 
 ========================================================================== */
591 
/* Tablet landscape and bigger */
592 
/* Desktop and bigger */
593 
/* Divider
594 
 ========================================================================== */
595 
.uk-heading-divider {
596 
  padding-bottom: calc(5px + 0.1em);
597 
  border-bottom: calc(0.2px + 0.05em) solid #e5e5e5;
1063 598 
}
1064 
/* Large screen and bigger */
1065 
@media (min-width: 1220px) {
1066 
  /* Whole */
1067 
  .uk-width-xlarge-1-1 {
1068 
    width: 100%;
1069 
  }
1070 
  /* Halves */
1071 
  .uk-width-xlarge-1-2,
1072 
  .uk-width-xlarge-2-4,
1073 
  .uk-width-xlarge-3-6,
1074 
  .uk-width-xlarge-5-10 {
1075 
    width: 50%;
1076 
  }
1077 
  /* Thirds */
1078 
  .uk-width-xlarge-1-3,
1079 
  .uk-width-xlarge-2-6 {
1080 
    width: 33.333%;
1081 
  }
1082 
  .uk-width-xlarge-2-3,
1083 
  .uk-width-xlarge-4-6 {
1084 
    width: 66.666%;
1085 
  }
1086 
  /* Quarters */
1087 
  .uk-width-xlarge-1-4 {
1088 
    width: 25%;
1089 
  }
1090 
  .uk-width-xlarge-3-4 {
1091 
    width: 75%;
1092 
  }
1093 
  /* Fifths */
1094 
  .uk-width-xlarge-1-5,
1095 
  .uk-width-xlarge-2-10 {
1096 
    width: 20%;
1097 
  }
1098 
  .uk-width-xlarge-2-5,
1099 
  .uk-width-xlarge-4-10 {
1100 
    width: 40%;
1101 
  }
1102 
  .uk-width-xlarge-3-5,
1103 
  .uk-width-xlarge-6-10 {
1104 
    width: 60%;
1105 
  }
1106 
  .uk-width-xlarge-4-5,
1107 
  .uk-width-xlarge-8-10 {
1108 
    width: 80%;
1109 
  }
1110 
  /* Sixths */
1111 
  .uk-width-xlarge-1-6 {
1112 
    width: 16.666%;
1113 
  }
1114 
  .uk-width-xlarge-5-6 {
1115 
    width: 83.333%;
1116 
  }
1117 
  /* Tenths */
1118 
  .uk-width-xlarge-1-10 {
1119 
    width: 10%;
1120 
  }
1121 
  .uk-width-xlarge-3-10 {
1122 
    width: 30%;
1123 
  }
1124 
  .uk-width-xlarge-7-10 {
1125 
    width: 70%;
1126 
  }
1127 
  .uk-width-xlarge-9-10 {
1128 
    width: 90%;
1129 
  }
1130 
}
1131 
/* Sub-object: `uk-push-*` and `uk-pull-*`
599 
/* Bullet
1132 600 
 ========================================================================== */
1133 
/*
1134 
 * Source ordering
1135 
 * Works only with `uk-width-medium-*`
1136 
 */
1137 
/* Tablet and bigger */
1138 
@media (min-width: 768px) {
1139 
  [class*='uk-push-'],
1140 
  [class*='uk-pull-'] {
1141 
    position: relative;
1142 
  }
1143 
  /*
1144 
     * Push
1145 
     */
1146 
  /* Halves */
1147 
  .uk-push-1-2,
1148 
  .uk-push-2-4,
1149 
  .uk-push-3-6,
1150 
  .uk-push-5-10 {
1151 
    left: 50%;
1152 
  }
1153 
  /* Thirds */
1154 
  .uk-push-1-3,
1155 
  .uk-push-2-6 {
1156 
    left: 33.333%;
1157 
  }
1158 
  .uk-push-2-3,
1159 
  .uk-push-4-6 {
1160 
    left: 66.666%;
1161 
  }
1162 
  /* Quarters */
1163 
  .uk-push-1-4 {
1164 
    left: 25%;
1165 
  }
1166 
  .uk-push-3-4 {
1167 
    left: 75%;
1168 
  }
1169 
  /* Fifths */
1170 
  .uk-push-1-5,
1171 
  .uk-push-2-10 {
1172 
    left: 20%;
1173 
  }
1174 
  .uk-push-2-5,
1175 
  .uk-push-4-10 {
1176 
    left: 40%;
1177 
  }
1178 
  .uk-push-3-5,
1179 
  .uk-push-6-10 {
1180 
    left: 60%;
1181 
  }
1182 
  .uk-push-4-5,
1183 
  .uk-push-8-10 {
1184 
    left: 80%;
1185 
  }
1186 
  /* Sixths */
1187 
  .uk-push-1-6 {
1188 
    left: 16.666%;
1189 
  }
1190 
  .uk-push-5-6 {
1191 
    left: 83.333%;
1192 
  }
1193 
  /* Tenths */
1194 
  .uk-push-1-10 {
1195 
    left: 10%;
1196 
  }
1197 
  .uk-push-3-10 {
1198 
    left: 30%;
1199 
  }
1200 
  .uk-push-7-10 {
1201 
    left: 70%;
1202 
  }
1203 
  .uk-push-9-10 {
1204 
    left: 90%;
1205 
  }
1206 
  /*
1207 
     * Pull
1208 
     */
1209 
  /* Halves */
1210 
  .uk-pull-1-2,
1211 
  .uk-pull-2-4,
1212 
  .uk-pull-3-6,
1213 
  .uk-pull-5-10 {
1214 
    left: -50%;
1215 
  }
1216 
  /* Thirds */
1217 
  .uk-pull-1-3,
1218 
  .uk-pull-2-6 {
1219 
    left: -33.333%;
1220 
  }
1221 
  .uk-pull-2-3,
1222 
  .uk-pull-4-6 {
1223 
    left: -66.666%;
1224 
  }
1225 
  /* Quarters */
1226 
  .uk-pull-1-4 {
1227 
    left: -25%;
1228 
  }
1229 
  .uk-pull-3-4 {
1230 
    left: -75%;
1231 
  }
1232 
  /* Fifths */
1233 
  .uk-pull-1-5,
1234 
  .uk-pull-2-10 {
1235 
    left: -20%;
1236 
  }
1237 
  .uk-pull-2-5,
1238 
  .uk-pull-4-10 {
1239 
    left: -40%;
1240 
  }
1241 
  .uk-pull-3-5,
1242 
  .uk-pull-6-10 {
1243 
    left: -60%;
1244 
  }
1245 
  .uk-pull-4-5,
1246 
  .uk-pull-8-10 {
1247 
    left: -80%;
1248 
  }
1249 
  /* Sixths */
1250 
  .uk-pull-1-6 {
1251 
    left: -16.666%;
... This diff was truncated because it exceeds the maximum size that can be displayed.

Also available in: Unified diff