-
Notifications
You must be signed in to change notification settings - Fork 0
/
style.css
143 lines (143 loc) · 22 KB
/
style.css
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
*{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}
body{font-family:Telex,sans-serif;color:#555;background-image:url("ui/light_wool.png")}
::selection{background:#fe6f66}
::-moz-selection{background:#fe6f66}
a{color:inherit;text-decoration:none;-webkit-transition:.25s;-moz-transition:.25s;-ms-transition:.25s;-o-transition:.25s;transition:.25s;}
a:hover{color:#e9463c}
.impress-supported .step{opacity:.05}
.step{position:relative;width:900px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;font-size:48px;line-height:1.5;-webkit-transition:opacity .5s;-moz-transition:opacity .5s;-ms-transition:opacity .5s;-o-transition:opacity .5s;transition:opacity .5s;}
.step.active{opacity:1 !important}
.step > h2{font-size:60%;text-align:right;border-right:6px solid #555;margin-bottom:2em;padding-right:1em;text-transform:capitalize}
.step .info{margin-top:1em;text-align:center;font-size:.27em;font-style:italic}
.step .small{margin-top:1em;text-align:left;font-size:.27em;font-style:italic}
.step .medium{margin-top:1em;text-align:left;font-size:.44em;font-style:italic}
#title .info{text-align:left;margin-top:0;margin-bottom:.3em}
#title h1{text-align:center;border-top:3px solid #e9463c;border-bottom:3px solid #e9463c;padding:1em 0;text-transform:uppercase;}
#title h1 span{display:inline-block;margin}
#title h1 .article{letter-spacing:285px;margin-right:-285px}
#title h1 .adj{letter-spacing:39px;margin-right:-39px;font-size:50%;color:#e9463c}
#title h1 .noun{font-size:260%;line-height:100%}
#title .subtitle{text-align:center;font-size:50%;margin-top:1em}
body.impress-on-how #title{opacity:0}
#impact p{font-size:54%;}
#impact p em{color:#e9463c}
#impact-old p{margin:2em 0;font-size:75%;}
#impact-old p em{font-size:150%}
#impact-old p .problem{text-decoration:line-through}
#impact-old .problem{color:#e9463c}
#impact-old .animation em{display:inline-block;-webkit-animation:swing-anim 1s infinite ease-in-out alternate;-moz-animation:swing-anim 1s infinite ease-in-out alternate;-ms-animation:swing-anim 1s infinite ease-in-out alternate;-o-animation:swing-anim 1s infinite ease-in-out alternate;animation:swing-anim 1s infinite ease-in-out alternate}
#impact-old .visual em{display:inline-block;background-image:url("ui/low_contrast_linen.png");overflow:hidden;padding:12px 27px;-webkit-border-radius:21px;-moz-border-radius:21px;-ms-border-radius:21px;-o-border-radius:21px;border-radius:21px;color:#fff;text-shadow:0 0 10px #fff,0 0 20px #fff,0 0 30px #f00,0 0 40px #f00,0 0 70px #f00,0 0 80px #f00,0 0 100px #ff00de,0 0 150px #f00;box-shadow:inset 0 0 12px rgba(0,0,0,0.75)}
@-webkit-keyframes swing-anim{0%{-webkit-transform:rotate(-15deg);-moz-transform:rotate(-15deg);-ms-transform:rotate(-15deg);-o-transform:rotate(-15deg);transform:rotate(-15deg)}
100%{-webkit-transform:rotate(15deg);-moz-transform:rotate(15deg);-ms-transform:rotate(15deg);-o-transform:rotate(15deg);transform:rotate(15deg)}
}@-moz-keyframes swing-anim{0%{-webkit-transform:rotate(-15deg);-moz-transform:rotate(-15deg);-ms-transform:rotate(-15deg);-o-transform:rotate(-15deg);transform:rotate(-15deg)}
100%{-webkit-transform:rotate(15deg);-moz-transform:rotate(15deg);-ms-transform:rotate(15deg);-o-transform:rotate(15deg);transform:rotate(15deg)}
}@-o-keyframes swing-anim{0%{-webkit-transform:rotate(-15deg);-moz-transform:rotate(-15deg);-ms-transform:rotate(-15deg);-o-transform:rotate(-15deg);transform:rotate(-15deg)}
100%{-webkit-transform:rotate(15deg);-moz-transform:rotate(15deg);-ms-transform:rotate(15deg);-o-transform:rotate(15deg);transform:rotate(15deg)}
}#how:not(.present){opacity:.02}
#how .how{font-size:550%;line-height:.8em;text-align:center;text-transform:uppercase}
#border-radius .doraemon{margin:auto;}
#border-radius .doraemon *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;-webkit-transition:border-radius .25s ease-out;-moz-transition:border-radius .25s ease-out;-ms-transition:border-radius .25s ease-out;-o-transition:border-radius .25s ease-out;transition:border-radius .25s ease-out}
#border-radius .doraemon .face{position:relative;width:600px;height:600px;background:#3c96e9;border:#555 3px solid;margin:auto;z-index:0;}
#border-radius .doraemon .face:hover{-webkit-border-radius:300px;-moz-border-radius:300px;-ms-border-radius:300px;-o-border-radius:300px;border-radius:300px}
#border-radius .doraemon .face > *{position:absolute}
#border-radius .doraemon .face .base-white{border:#555 3px solid;width:510px;height:392px;background:#fff;z-index:1;bottom:45px;left:45px}
#border-radius .doraemon .face:hover .base-white{-webkit-border-radius:300px;-moz-border-radius:300px;-ms-border-radius:300px;-o-border-radius:300px;border-radius:300px}
#border-radius .doraemon .face .eye{border:#555 3px solid;width:144px;height:165px;top:90px;z-index:20;background:#fff}
#border-radius .doraemon .face .eye-left{left:154px}
#border-radius .doraemon .face .eye-right{top:90px;right:154px}
#border-radius .doraemon .face:hover .eye{-webkit-border-radius:75px;-moz-border-radius:75px;-ms-border-radius:75px;-o-border-radius:75px;border-radius:75px}
#border-radius .doraemon .face .black-eye{position:absolute;width:30px;height:30px;background:#555;bottom:45px;z-index:21}
#border-radius .doraemon .face .black-left{right:27px}
#border-radius .doraemon .face .black-right{left:27px}
#border-radius .doraemon .face:hover .black-eye{-webkit-border-radius:15px;-moz-border-radius:15px;-ms-border-radius:15px;-o-border-radius:15px;border-radius:15px}
#border-radius .doraemon .face .nose{width:66px;height:66px;border:#555 3px solid;background:#e9463c;top:234px;left:264px;z-index:30;}
#border-radius .doraemon .face .nose .nose-line{position:absolute;background:#555;width:4px;height:165px;top:63px;left:29px;z-index:20}
#border-radius .doraemon .face:hover .nose{-webkit-border-radius:33px;-moz-border-radius:33px;-ms-border-radius:33px;-o-border-radius:33px;border-radius:33px}
#border-radius .doraemon .face .mouth{width:420px;height:900px;border-bottom:4px solid #555;bottom:126px;left:90px;z-index:10}
#border-radius .doraemon .face:hover .mouth{-webkit-border-radius:150px;-moz-border-radius:150px;-ms-border-radius:150px;-o-border-radius:150px;border-radius:150px}
#border-radius .doraemon .face .whiskers{background:#555;height:2px;width:111px;z-index:20}
#border-radius .doraemon .face .whi-left{left:117px}
#border-radius .doraemon .face .whi-right{right:117px}
#border-radius .doraemon .face .whi-top{bottom:318px}
#border-radius .doraemon .face .whi-mid{bottom:279px}
#border-radius .doraemon .face .whi-bottom{bottom:240px}
#border-radius .doraemon .face .whi-left.whi-top,#border-radius .doraemon .face .whi-right.whi-bottom{-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-ms-transform:rotate(10deg);-o-transform:rotate(10deg);transform:rotate(10deg)}
#border-radius .doraemon .face .whi-left.whi-bottom,#border-radius .doraemon .face .whi-right.whi-top{-webkit-transform:rotate(-10deg);-moz-transform:rotate(-10deg);-ms-transform:rotate(-10deg);-o-transform:rotate(-10deg);transform:rotate(-10deg)}
#gradient .apple-nav{width:900px;height:45px;background-image:-webkit-gradient(linear,0 100%,0 0,from(#666),color-stop(.5,#5e5e5e),color-stop(.51,#707070),to(#808080));background-image:-webkit-linear-gradient(bottom,#666 0,#5e5e5e 50%,#707070 51%,#808080 100%);background-image:-moz-linear-gradient(bottom,#666 0,#5e5e5e 50%,#707070 51%,#808080 100%);background-image:-ms-linear-gradient(bottom,#666 0,#5e5e5e 50%,#707070 51%,#808080 100%);background-image:-o-linear-gradient(bottom,#666 0,#5e5e5e 50%,#707070 51%,#808080 100%);background-image:linear-gradient(bottom,#666 0,#5e5e5e 50%,#707070 51%,#808080 100%);box-shadow:0 0 3px #aaa;-webkit-border-radius:12px;-moz-border-radius:12px;-ms-border-radius:12px;-o-border-radius:12px;border-radius:12px}
#gradient .radial{width:600px;height:240px;margin:1em auto;-webkit-border-radius:12px;-moz-border-radius:12px;-ms-border-radius:12px;-o-border-radius:12px;border-radius:12px;background-image:-webkit-gradient(radial,center center,0,center center,100%,color-stop(0%,#fe6f66),color-stop(100%,#e9463c));background-image:-webkit-radial-gradient(75% 25%,circle cover,#fe6f66 0%,#e9463c 100%);background-image:-moz-radial-gradient(75% 25%,circle cover,#fe6f66 0%,#e9463c 100%);background-image:-o-radial-gradient(75% 25%,circle cover,#fe6f66 0%,#e9463c 100%);background-image:-ms-radial-gradient(75% 25%,circle cover,#fe6f66 0%,#e9463c 100%);background-image:radial-gradient(circle at 75% 25%,#fe6f66 0%,#e9463c 100%);box-shadow:0 0 6px #993832}
#shadows .inset{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;-webkit-border-radius:12px;-moz-border-radius:12px;-ms-border-radius:12px;-o-border-radius:12px;border-radius:12px;margin:auto;width:900px;height:300px;background-image:url("ui/low_contrast_linen.png");box-shadow:inset 0 24px 60px rgba(0,0,0,0.75);color:#222;text-shadow:0 1px 0 rgba(255,255,255,0.15);padding:75px 225px}
#google-lofter > .box{float:left;width:50%;text-align:center;}
#google-lofter > .box .content{display:-webkit-box;display:-moz-box;display:box;-webkit-box-align:center;-moz-box-align:center;-ms-box-align:center;-o-box-align:center;box-align:center;-webkit-box-pack:center;-moz-box-pack:center;-ms-box-pack:center;-o-box-pack:center;box-pack:center;-webkit-box-orient:vertical;-moz-box-orient:vertical;-ms-box-orient:vertical;-o-box-orient:vertical;box-orient:vertical;height:450px;}
#google-lofter > .box .content .google-button{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;margin:12px 0;font-size:30px;color:#fff;text-transform:uppercase;text-shadow:0 2px rgba(0,0,0,0.25);-webkit-border-radius:6px;-moz-border-radius:6px;-ms-border-radius:6px;-o-border-radius:6px;border-radius:6px;padding:12px;width:300px;display:inline-block;cursor:pointer;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#dd4b39),color-stop(100%,#ec625a));background-image:-webkit-linear-gradient(top,#dd4b39 0%,#ec625a 100%);background-image:-moz-linear-gradient(top,#dd4b39 0%,#ec625a 100%);background-image:-ms-linear-gradient(top,#dd4b39 0%,#ec625a 100%);background-image:-o-linear-gradient(top,#dd4b39 0%,#ec625a 100%);background-image:linear-gradient(to bottom,#dd4b39 0%,#ec625a 100%);border:1px solid transparent;}
#google-lofter > .box .content .google-button:hover{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#dd4b39),color-stop(100%,#c53727));background-image:-webkit-linear-gradient(top,#dd4b39 0%,#c53727 100%);background-image:-moz-linear-gradient(top,#dd4b39 0%,#c53727 100%);background-image:-ms-linear-gradient(top,#dd4b39 0%,#c53727 100%);background-image:-o-linear-gradient(top,#dd4b39 0%,#c53727 100%);background-image:linear-gradient(to bottom,#dd4b39 0%,#c53727 100%);border:1px solid #b0281a;box-shadow:0 3px 3px rgba(0,0,0,0.2)}
#google-lofter > .box .content .google-button:active{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#dd4b39),color-stop(100%,#b0281a));background-image:-webkit-linear-gradient(top,#dd4b39 0%,#b0281a 100%);background-image:-moz-linear-gradient(top,#dd4b39 0%,#b0281a 100%);background-image:-ms-linear-gradient(top,#dd4b39 0%,#b0281a 100%);background-image:-o-linear-gradient(top,#dd4b39 0%,#b0281a 100%);background-image:linear-gradient(to bottom,#dd4b39 0%,#b0281a 100%);border:1px solid #992a1b;box-shadow:inset 0 3px 6px rgba(0,0,0,0.3)}
#opacity .renren-button{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;width:390px;height:60px;margin:0 auto;box-shadow:0 0 6px rgba(0,0,0,0.25);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;background-color:#f7f7f7;-webkit-transition:background-color .3s ease-out;-moz-transition:background-color .3s ease-out;-ms-transition:background-color .3s ease-out;-o-transition:background-color .3s ease-out;transition:background-color .3s ease-out;cursor:pointer;}
#opacity .renren-button:hover{background-color:#fafafa}
#opacity .renren-button > div{opacity:.2;-webkit-transition:opacity .3s ease-out;-moz-transition:opacity .3s ease-out;-ms-transition:opacity .3s ease-out;-o-transition:opacity .3s ease-out;transition:opacity .3s ease-out;float:left}
#opacity .renren-button:hover > div{opacity:.7}
#opacity .renren-button .renren-button-icon{width:60px;height:60px;background-repeat:no-repeat;background-position:19px 14px;background-image:url("img/renren-button-icon.png")}
#opacity .renren-button .renren-button-text{color:#000;height:60px;width:330px;text-align:center;padding:9px 12px;border-left:3px solid #ddd;font-size:30px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box}
#opacity-image .image-wrapper{position:relative;margin:0 auto;width:500px;height:500px;box-shadow:0 0 9px rgba(0,0,0,0.75);}
#opacity-image .image-wrapper .caption{position:absolute;left:0;bottom:51px;background-color:rgba(0,0,0,0.3);color:#fff;padding:3px 12px 0 51px;font-size:75%;-webkit-border-radius:0 3px 3px 0;-moz-border-radius:0 3px 3px 0;-ms-border-radius:0 3px 3px 0;-o-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0}
#reflect .content{height:555px;}
#reflect .content .ibooks-wrapper{text-align:center;-webkit-box-reflect:below -36px -webkit-gradient(linear,0 100%,0 90%,from(rgba(255,255,255,0.75)),to(transparent));}
#reflect .content .ibooks-wrapper img{box-shadow:0 6px 12px rgba(0,0,0,0.75);-webkit-border-radius:90px;-moz-border-radius:90px;-ms-border-radius:90px;-o-border-radius:90px;border-radius:90px}
#transform > h2{-webkit-transform:translate(-300px,390px) rotate(-90deg);-moz-transform:translate(-300px,390px) rotate(-90deg);-ms-transform:translate(-300px,390px) rotate(-90deg);-o-transform:translate(-300px,390px) rotate(-90deg);transform:translate(-300px,390px) rotate(-90deg)}
#transform .content{margin:0 0 0 240px;}
#transform .content::after{content:'';clear:both;display:none}
#transform .content .tag{display:inline-block;margin:0 0 6px 54px;position:relative;font-size:.35em;font-weight:bold;color:#993832;text-transform:lowercase;text-shadow:0 1px 0 rgba(255,255,255,0.4);padding:.417em .417em .417em 1.2em;border-top:1px solid #993832;border-right:1px solid #993832;border-bottom:1px solid #993832;-webkit-border-radius:0 .25em .25em 0;-moz-border-radius:0 .25em .25em 0;-ms-border-radius:0 .25em .25em 0;-o-border-radius:0 .25em .25em 0;border-radius:0 .25em .25em 0;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#fe6f66),color-stop(100%,#ec625a));background-image:-webkit-linear-gradient(top,#fe6f66 0%,#ec625a 100%);background-image:-moz-linear-gradient(top,#fe6f66 0%,#ec625a 100%);background-image:-ms-linear-gradient(top,#fe6f66 0%,#ec625a 100%);background-image:-o-linear-gradient(top,#fe6f66 0%,#ec625a 100%);background-image:linear-gradient(to bottom,#fe6f66 0%,#ec625a 100%);z-index:10;}
#transform .content .tag:before{content:'';width:1.67em;height:1.67em;left:-.86em;top:.35em;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#fe6f66),color-stop(100%,#ec625a));background-image:-webkit-linear-gradient(top,#fe6f66 0%,#ec625a 100%);background-image:-moz-linear-gradient(top,#fe6f66 0%,#ec625a 100%);background-image:-ms-linear-gradient(top,#fe6f66 0%,#ec625a 100%);background-image:-o-linear-gradient(top,#fe6f66 0%,#ec625a 100%);background-image:linear-gradient(to bottom,#fe6f66 0%,#ec625a 100%);position:absolute;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);border-left:1px solid #993832;border-bottom:1px solid #993832;-webkit-border-radius:0 0 0 .25em;-moz-border-radius:0 0 0 .25em;-ms-border-radius:0 0 0 .25em;-o-border-radius:0 0 0 .25em;border-radius:0 0 0 .25em}
#transform .content .tag:after{content:'';position:absolute;width:.5em;height:.5em;top:.91em;left:0;background:#fff;-webkit-border-radius:.25em;-moz-border-radius:.25em;-ms-border-radius:.25em;-o-border-radius:.25em;border-radius:.25em;border:1px solid #993832;box-shadow:0 1px 0 rgba(255,255,255,0.6);z-index:9999}
#animation .spinner{position:relative;width:340px;height:340px;margin:0 auto;}
#animation .spinner .spinner-dot{position:absolute;background-color:transparent;height:60px;width:60px;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-animation:spinning-anim 1.04s infinite linear;-moz-animation:spinning-anim 1.04s infinite linear;-ms-animation:spinning-anim 1.04s infinite linear;-o-animation:spinning-anim 1.04s infinite linear;animation:spinning-anim 1.04s infinite linear;}
#animation .spinner .spinner-dot:nth-child(1){left:0;top:140px;-webkit-animation-delay:.39s;-moz-animation-delay:.39s;-ms-animation-delay:.39s;-o-animation-delay:.39s;animation-delay:.39s}
#animation .spinner .spinner-dot:nth-child(2){left:40px;top:40px;-webkit-animation-delay:.52s;-moz-animation-delay:.52s;-ms-animation-delay:.52s;-o-animation-delay:.52s;animation-delay:.52s}
#animation .spinner .spinner-dot:nth-child(3){left:140px;top:0;-webkit-animation-delay:.65s;-moz-animation-delay:.65s;-ms-animation-delay:.65s;-o-animation-delay:.65s;animation-delay:.65s}
#animation .spinner .spinner-dot:nth-child(4){right:40px;top:40px;-webkit-animation-delay:.78s;-moz-animation-delay:.78s;-ms-animation-delay:.78s;-o-animation-delay:.78s;animation-delay:.78s}
#animation .spinner .spinner-dot:nth-child(5){right:0;top:140px;-webkit-animation-delay:.91s;-moz-animation-delay:.91s;-ms-animation-delay:.91s;-o-animation-delay:.91s;animation-delay:.91s}
#animation .spinner .spinner-dot:nth-child(6){right:40px;bottom:40px;-webkit-animation-delay:1.04s;-moz-animation-delay:1.04s;-ms-animation-delay:1.04s;-o-animation-delay:1.04s;animation-delay:1.04s}
#animation .spinner .spinner-dot:nth-child(7){left:140px;bottom:0;-webkit-animation-delay:1.17s;-moz-animation-delay:1.17s;-ms-animation-delay:1.17s;-o-animation-delay:1.17s;animation-delay:1.17s}
#animation .spinner .spinner-dot:nth-child(8){left:40px;bottom:40px;-webkit-animation-delay:1.3s;-moz-animation-delay:1.3s;-ms-animation-delay:1.3s;-o-animation-delay:1.3s;animation-delay:1.3s}
@-webkit-keyframes spinning-anim{0%{background-color:#555}
100%{background-color:transparent}
}@-moz-keyframes spinning-anim{0%{background-color:#555}
100%{background-color:transparent}
}@-o-keyframes spinning-anim{0%{background-color:#555}
100%{background-color:transparent}
}#end .credits a{font-weight:bold}
#end .credits h2{line-height:2em;border-bottom:1px solid #e9463c;margin-bottom:1.5em;padding-bottom:.5em;font-size:50%;width:60%;margin-left:20%;text-align:center;}
#end .credits h2 .title{font-size:150%}
#end .credits p{font-size:50%;line-height:2em;text-align:center}
#end .css3-logo-wrapper{margin-top:1em;text-align:center;}
#end .css3-logo-wrapper .css3-logo{width:73px;height:66px;fill:#e9463c}
#fallback-message{display:none;width:800px;margin:150px auto;font-size:20px;line-height:200%;text-align:center;}
#fallback-message a{font-weight:bold}
.impress-not-supported #fallback-message{display:block}
#hint{display:none}
.impress-enabled #hint{display:block;position:fixed;left:0;right:0;bottom:-100px;background:rgba(233,70,60,0.75);color:#eee;text-align:center;font-size:1.5em;padding:.5em 0;opacity:0;-webkit-transition:opacity .5s,bottom .5s;-moz-transition:opacity .5s,bottom .5s;-ms-transition:opacity .5s,bottom .5s;-o-transition:opacity .5s,bottom .5s;transition:opacity .5s,bottom .5s}
.impress-on-title #hint{opacity:1;bottom:0;-webkit-transition:opacity .5s 1.5s,bottom .5s 1.5s;-moz-transition:opacity .5s 1.5s,bottom .5s 1.5s;-ms-transition:opacity .5s 1.5s,bottom .5s 1.5s;-o-transition:opacity .5s 1.5s,bottom .5s 1.5s;transition:opacity .5s 1.5s,bottom .5s 1.5s}
#social{position:absolute;top:10px;right:10px;}
#social .social-button-wrapper{display:inline-block;margin-left:10px}
.impress-enabled{pointer-events:none;}
.impress-enabled #impress,.impress-enabled #fallback-message,.impress-enabled #social *{pointer-events:auto}
@-moz-keyframes swing-anim{0%{-webkit-transform:rotate(-15deg);-moz-transform:rotate(-15deg);-ms-transform:rotate(-15deg);-o-transform:rotate(-15deg);transform:rotate(-15deg)}
100%{-webkit-transform:rotate(15deg);-moz-transform:rotate(15deg);-ms-transform:rotate(15deg);-o-transform:rotate(15deg);transform:rotate(15deg)}
}@-webkit-keyframes swing-anim{0%{-webkit-transform:rotate(-15deg);-moz-transform:rotate(-15deg);-ms-transform:rotate(-15deg);-o-transform:rotate(-15deg);transform:rotate(-15deg)}
100%{-webkit-transform:rotate(15deg);-moz-transform:rotate(15deg);-ms-transform:rotate(15deg);-o-transform:rotate(15deg);transform:rotate(15deg)}
}@-o-keyframes swing-anim{0%{-webkit-transform:rotate(-15deg);-moz-transform:rotate(-15deg);-ms-transform:rotate(-15deg);-o-transform:rotate(-15deg);transform:rotate(-15deg)}
100%{-webkit-transform:rotate(15deg);-moz-transform:rotate(15deg);-ms-transform:rotate(15deg);-o-transform:rotate(15deg);transform:rotate(15deg)}
}@-ms-keyframes swing-anim{0%{-webkit-transform:rotate(-15deg);-moz-transform:rotate(-15deg);-ms-transform:rotate(-15deg);-o-transform:rotate(-15deg);transform:rotate(-15deg)}
100%{-webkit-transform:rotate(15deg);-moz-transform:rotate(15deg);-ms-transform:rotate(15deg);-o-transform:rotate(15deg);transform:rotate(15deg)}
}@keyframes swing-anim{0%{-webkit-transform:rotate(-15deg);-moz-transform:rotate(-15deg);-ms-transform:rotate(-15deg);-o-transform:rotate(-15deg);transform:rotate(-15deg)}
100%{-webkit-transform:rotate(15deg);-moz-transform:rotate(15deg);-ms-transform:rotate(15deg);-o-transform:rotate(15deg);transform:rotate(15deg)}
}@-moz-keyframes spinning-anim{0%{background-color:#555}
100%{background-color:transparent}
}@-webkit-keyframes spinning-anim{0%{background-color:#555}
100%{background-color:transparent}
}@-o-keyframes spinning-anim{0%{background-color:#555}
100%{background-color:transparent}
}@-ms-keyframes spinning-anim{0%{background-color:#555}
100%{background-color:transparent}
}@keyframes spinning-anim{0%{background-color:#555}
100%{background-color:transparent}
}