-
Notifications
You must be signed in to change notification settings - Fork 0
/
helix-anim2
41 lines (41 loc) · 9.3 KB
/
helix-anim2
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>heliX</title>
<meta name="description"content="Forkiosk waiting page">
<meta name="viewport"content="width=device-width, initial-scale=1, maximum-scale=1">
<style media="screen" type="text/css">
html {font-family: Arial;}
body { background: #589442;}
.content { position: absolute; top: 20%; width: 99%; height: 80%; }
.logo { display: block; margin: 0 auto; }
.loader { height: 50px; margin: 0 auto; display: block; opacity: .8; }
.text { margin: 0 auto; display: block; text-align: center; color: #fff; }
video {
position: fixed;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
transform: translateX(-50%) translateY(-50%);
transition: 1s opacity;
}
</style>
<!--[if lt IE 9]> <script src="js/ie/respond.min.js" cache="false"></script> <script src="js/ie/html5.js" cache="false"></script> <script src="js/ie/excanvas.js" cache="false"></script> <![endif]-->
</head>
<body>
<video autoplay id="bgvid" loop>
<!-- WCAG general accessibility recommendation is that media such as background video play through only once. Loop turned on for the purposes of illustration; if removed, the end of the video will fade in the same way created by pressing the "Pause" button -->
<source src="img/sloth.webm" type="video/webm">
</video>
<div class="content">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAPoAAAD6CAMAAAC/MqoPAAAC2VBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8Xe6ihAAAA8nRSTlMAAQIDBAUGBwgJCgsMDQ4PEBESExQVFhcYGRobHB0eHyAhIiMkJSYnKCkqKywuLzAxMjM0NTY4OTo7PD0+P0BBQkNERUZHSElKS0xNTk9QUVJUVVZXWFlaW1xdXl9gYWNkZWZnaGlqa2xtbm9wcXJzdHZ3eHp7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" class="logo">
<img src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTM1IiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDEzNSAxNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI2ZmZiI+ICAgIDxyZWN0IHk9IjEwIiB3aWR0aD0iMTUiIGhlaWdodD0iMTIwIiByeD0iNiI+ICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiICAgICAgICAgICAgIGJlZ2luPSIwLjVzIiBkdXI9IjFzIiAgICAgICAgICAgICB2YWx1ZXM9IjEyMDsxMTA7MTAwOzkwOzgwOzcwOzYwOzUwOzQwOzE0MDsxMjAiIGNhbGNNb2RlPSJsaW5lYXIiICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0ieSIgICAgICAgICAgICAgYmVnaW49IjAuNXMiIGR1cj0iMXMiICAgICAgICAgICAgIHZhbHVlcz0iMTA7MTU7MjA7MjU7MzA7MzU7NDA7NDU7NTA7MDsxMCIgY2FsY01vZGU9ImxpbmVhciIgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+ICAgIDwvcmVjdD4gICAgPHJlY3QgeD0iMzAiIHk9IjEwIiB3aWR0aD0iMTUiIGhlaWdodD0iMTIwIiByeD0iNiI+ICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiICAgICAgICAgICAgIGJlZ2luPSIwLjI1cyIgZHVyPSIxcyIgICAgICAgICAgICAgdmFsdWVzPSIxMjA7MTEwOzEwMDs5MDs4MDs3MDs2MDs1MDs0MDsxNDA7MTIwIiBjYWxjTW9kZT0ibGluZWFyIiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4gICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InkiICAgICAgICAgICAgIGJlZ2luPSIwLjI1cyIgZHVyPSIxcyIgICAgICAgICAgICAgdmFsdWVzPSIxMDsxNTsyMDsyNTszMDszNTs0MDs0NTs1MDswOzEwIiBjYWxjTW9kZT0ibGluZWFyIiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4gICAgPC9yZWN0PiAgICA8cmVjdCB4PSI2MCIgd2lkdGg9IjE1IiBoZWlnaHQ9IjE0MCIgcng9IjYiPiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iaGVpZ2h0IiAgICAgICAgICAgICBiZWdpbj0iMHMiIGR1cj0iMXMiICAgICAgICAgICAgIHZhbHVlcz0iMTIwOzExMDsxMDA7OTA7ODA7NzA7NjA7NTA7NDA7MTQwOzEyMCIgY2FsY01vZGU9ImxpbmVhciIgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+ICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJ5IiAgICAgICAgICAgICBiZWdpbj0iMHMiIGR1cj0iMXMiICAgICAgICAgICAgIHZhbHVlcz0iMTA7MTU7MjA7MjU7MzA7MzU7NDA7NDU7NTA7MDsxMCIgY2FsY01vZGU9ImxpbmVhciIgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+ICAgIDwvcmVjdD4gICAgPHJlY3QgeD0iOTAiIHk9IjEwIiB3aWR0aD0iMTUiIGhlaWdodD0iMTIwIiByeD0iNiI+ICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiICAgICAgICAgICAgIGJlZ2luPSIwLjI1cyIgZHVyPSIxcyIgICAgICAgICAgICAgdmFsdWVzPSIxMjA7MTEwOzEwMDs5MDs4MDs3MDs2MDs1MDs0MDsxNDA7MTIwIiBjYWxjTW9kZT0ibGluZWFyIiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4gICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InkiICAgICAgICAgICAgIGJlZ2luPSIwLjI1cyIgZHVyPSIxcyIgICAgICAgICAgICAgdmFsdWVzPSIxMDsxNTsyMDsyNTszMDszNTs0MDs0NTs1MDswOzEwIiBjYWxjTW9kZT0ibGluZWFyIiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4gICAgPC9yZWN0PiAgICA8cmVjdCB4PSIxMjAiIHk9IjEwIiB3aWR0aD0iMTUiIGhlaWdodD0iMTIwIiByeD0iNiI+ICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiICAgICAgICAgICAgIGJlZ2luPSIwLjVzIiBkdXI9IjFzIiAgICAgICAgICAgICB2YWx1ZXM9IjEyMDsxMTA7MTAwOzkwOzgwOzcwOzYwOzUwOzQwOzE0MDsxMjAiIGNhbGNNb2RlPSJsaW5lYXIiICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0ieSIgICAgICAgICAgICAgYmVnaW49IjAuNXMiIGR1cj0iMXMiICAgICAgICAgICAgIHZhbHVlcz0iMTA7MTU7MjA7MjU7MzA7MzU7NDA7NDU7NTA7MDsxMCIgY2FsY01vZGU9ImxpbmVhciIgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+ICAgIDwvcmVjdD48L3N2Zz4=" class="loader">
<div class="text">Loading your program please wait</div>
</div>
</body>
</html>