vx-aptly 0.9.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (75) hide show
  1. checksums.yaml +7 -0
  2. data/.gitignore +23 -0
  3. data/Dockerfile +11 -0
  4. data/Gemfile +4 -0
  5. data/LICENSE.txt +22 -0
  6. data/README.md +29 -0
  7. data/Rakefile +36 -0
  8. data/bin/vx-aptly +4 -0
  9. data/doc/aptly.example +16 -0
  10. data/doc/aptly.upstart +27 -0
  11. data/doc/cloud-files.example +9 -0
  12. data/docker/install.sh +47 -0
  13. data/docker/my_init +57 -0
  14. data/docker/supervisord.conf +17 -0
  15. data/lib/vx/aptly.rb +33 -0
  16. data/lib/vx/aptly/app.rb +194 -0
  17. data/lib/vx/aptly/cli.sh +116 -0
  18. data/lib/vx/aptly/config.ru +3 -0
  19. data/lib/vx/aptly/mixin/capture.rb +37 -0
  20. data/lib/vx/aptly/package.rb +110 -0
  21. data/lib/vx/aptly/public/404.html +153 -0
  22. data/lib/vx/aptly/public/css/animate.css +3158 -0
  23. data/lib/vx/aptly/public/css/bootstrap.min.css +5 -0
  24. data/lib/vx/aptly/public/css/flat-ui.css +6007 -0
  25. data/lib/vx/aptly/public/css/theme.css +131 -0
  26. data/lib/vx/aptly/public/fonts/glyphicons/flat-ui-icons-regular.eot +0 -0
  27. data/lib/vx/aptly/public/fonts/glyphicons/flat-ui-icons-regular.svg +126 -0
  28. data/lib/vx/aptly/public/fonts/glyphicons/flat-ui-icons-regular.ttf +0 -0
  29. data/lib/vx/aptly/public/fonts/glyphicons/flat-ui-icons-regular.woff +0 -0
  30. data/lib/vx/aptly/public/fonts/glyphicons/selection.json +2106 -0
  31. data/lib/vx/aptly/public/fonts/lato/lato-black.eot +0 -0
  32. data/lib/vx/aptly/public/fonts/lato/lato-black.svg +4691 -0
  33. data/lib/vx/aptly/public/fonts/lato/lato-black.ttf +0 -0
  34. data/lib/vx/aptly/public/fonts/lato/lato-black.woff +0 -0
  35. data/lib/vx/aptly/public/fonts/lato/lato-bold.eot +0 -0
  36. data/lib/vx/aptly/public/fonts/lato/lato-bold.svg +5085 -0
  37. data/lib/vx/aptly/public/fonts/lato/lato-bold.ttf +0 -0
  38. data/lib/vx/aptly/public/fonts/lato/lato-bold.woff +0 -0
  39. data/lib/vx/aptly/public/fonts/lato/lato-bolditalic.eot +0 -0
  40. data/lib/vx/aptly/public/fonts/lato/lato-bolditalic.svg +4514 -0
  41. data/lib/vx/aptly/public/fonts/lato/lato-bolditalic.ttf +0 -0
  42. data/lib/vx/aptly/public/fonts/lato/lato-bolditalic.woff +0 -0
  43. data/lib/vx/aptly/public/fonts/lato/lato-italic.eot +0 -0
  44. data/lib/vx/aptly/public/fonts/lato/lato-italic.svg +4514 -0
  45. data/lib/vx/aptly/public/fonts/lato/lato-italic.ttf +0 -0
  46. data/lib/vx/aptly/public/fonts/lato/lato-italic.woff +0 -0
  47. data/lib/vx/aptly/public/fonts/lato/lato-light.eot +0 -0
  48. data/lib/vx/aptly/public/fonts/lato/lato-light.svg +4691 -0
  49. data/lib/vx/aptly/public/fonts/lato/lato-light.ttf +0 -0
  50. data/lib/vx/aptly/public/fonts/lato/lato-light.woff +0 -0
  51. data/lib/vx/aptly/public/fonts/lato/lato-regular.eot +0 -0
  52. data/lib/vx/aptly/public/fonts/lato/lato-regular.svg +4691 -0
  53. data/lib/vx/aptly/public/fonts/lato/lato-regular.ttf +0 -0
  54. data/lib/vx/aptly/public/fonts/lato/lato-regular.woff +0 -0
  55. data/lib/vx/aptly/public/img/favicon.ico +0 -0
  56. data/lib/vx/aptly/public/js/app.js +12 -0
  57. data/lib/vx/aptly/public/js/jquery_ujs.js +446 -0
  58. data/lib/vx/aptly/repo.rb +161 -0
  59. data/lib/vx/aptly/repo_publish.rb +165 -0
  60. data/lib/vx/aptly/version.rb +5 -0
  61. data/lib/vx/aptly/views/index.erb +94 -0
  62. data/lib/vx/aptly/views/layout.erb +54 -0
  63. data/lib/vx/aptly/views/repo_publishes/new.erb +49 -0
  64. data/lib/vx/aptly/views/repos/edit.erb +17 -0
  65. data/lib/vx/aptly/views/repos/errors.erb +5 -0
  66. data/lib/vx/aptly/views/repos/form.erb +26 -0
  67. data/lib/vx/aptly/views/repos/new.erb +17 -0
  68. data/lib/vx/aptly/views/repos/packages.erb +51 -0
  69. data/lib/vx/aptly/views/repos/show.erb +66 -0
  70. data/spec/lib/repo_publish_spec.rb +60 -0
  71. data/spec/spec_helper.rb +13 -0
  72. data/spec/support/aptly.conf +0 -0
  73. data/spec/support/home.rb +39 -0
  74. data/vx-aptly.gemspec +32 -0
  75. metadata +263 -0
@@ -0,0 +1,116 @@
1
+ #!/bin/bash
2
+
3
+ set -e
4
+
5
+ script=$(cd $(dirname $0) && echo "$(pwd)/$(basename $0)")
6
+ script_name=vx-aptly
7
+ root=$(cd $(dirname $0)/../../../ && pwd)
8
+ tar="tar"
9
+ mktemp="mktemp"
10
+ find="find"
11
+
12
+ if [ "x$(uname)" = "xDarwin" ] ; then
13
+ tar="gtar"
14
+ mktemp="gmktemp"
15
+ find="gfind"
16
+ fi
17
+
18
+ silent_output () {
19
+ cmd=$@
20
+
21
+ log=$($mktemp)
22
+
23
+ eval "$cmd" > $log 2> $log || (
24
+ echoerr "failed: $cmd"
25
+ echoerr ""
26
+ cat $log
27
+ rm -f $log
28
+ exit 1
29
+ )
30
+
31
+ rm -f $log
32
+ }
33
+
34
+
35
+ echoerr() {
36
+ echo "$@" 1>&2;
37
+ }
38
+
39
+ add_files_to_repo () {
40
+ local repo_name=$1
41
+ local archive_path=$2
42
+ local count="0"
43
+
44
+ if [[ "x$SSH_ORIGINAL_COMMAND" != "x" ]] ; then
45
+ repo_name=$SSH_ORIGINAL_COMMAND
46
+ fi
47
+
48
+ if [[ "x$repo_name" = 'x' ]] ; then
49
+ echoerr "Usage: $script_name push REPO_NAME ARCHIVE_PATH"
50
+ exit 1
51
+ fi
52
+
53
+ if [[ "x$archive_path" = 'x' ]] ; then
54
+ echoerr "Usage: $script_name push REPO_NAME ARCHIVE_PATH"
55
+ exit 1
56
+ fi
57
+
58
+ local files=$($mktemp -d)
59
+ echo " --> unpacking archive"
60
+ $tar -x -C $files -f $archive_path
61
+
62
+ count=$($find $files -type f -name "*.deb" | wc -l | tr -d ' ')
63
+ echo " --> add $count files to $repo_name"
64
+ aptly repo add $repo_name $files
65
+
66
+ rm -rf $files
67
+
68
+ aptly_publish_repo $repo_name
69
+ aptly_run_hooks $repo_name
70
+ }
71
+
72
+ aptly_publish_repo () {
73
+ local repo_name=$1
74
+ local ruby_code="Vx::Aptly::Repo.find(\"$repo_name\").publishes.each {|p| puts p.update_command_line } ; nil"
75
+ local command_lines=$(env SILENT=1 ruby -r $root/lib/vx/aptly -e "$ruby_code")
76
+ local IFS=$'\n'
77
+
78
+ for line in $command_lines ; do
79
+ echo " --> $line"
80
+ silent_output $line
81
+ done
82
+ }
83
+
84
+ aptly_run_hooks () {
85
+ local repo_name=$1
86
+
87
+ if [ -d ~/hooks ] ; then
88
+ for i in $(find ~/hooks -type f) ; do
89
+ fname=$(basename $i)
90
+ fext=${fname##*.}
91
+
92
+ if [[ $fext != 'example' ]] ; then
93
+ chmod +x $i
94
+ echo " --> run $i"
95
+ $i $repo_name
96
+ fi
97
+ done
98
+ fi
99
+ }
100
+
101
+ case $1 in
102
+ serve)
103
+ echo rackup $root/lib/vx/aptly/config.ru ${@:2}
104
+ exec puma $root/lib/vx/aptly/config.ru ${@:2}
105
+ ;;
106
+ push)
107
+ add_files_to_repo $2 $3
108
+ ;;
109
+ root)
110
+ echo $root
111
+ ;;
112
+ *)
113
+ echoerr "Usage: $script_name (serve|push)"
114
+ exit 1
115
+ ;;
116
+ esac
@@ -0,0 +1,3 @@
1
+ require File.expand_path("../../aptly", __FILE__)
2
+
3
+ run Vx::Aptly::App
@@ -0,0 +1,37 @@
1
+ module Vx
2
+ module Aptly
3
+ module Mixin
4
+ module Capture
5
+
6
+ def capture(cmd)
7
+ Aptly.logger.write "[aptly] #{cmd}\n" unless silent?
8
+ rs = `#{cmd} 2>&1`
9
+ st = $?.exitstatus
10
+ if st != 0
11
+ txt = "The command '#{cmd}' exit with status #{st}\n\n"
12
+
13
+ rs.lines do |line|
14
+ Aptly.logger.write "[aptly:ERROR] #{line}" unless silent?
15
+ txt << line
16
+ end
17
+
18
+ txt = txt.strip
19
+ raise AptlyCommandError, txt
20
+ end
21
+ if block_given?
22
+ yield rs
23
+ else
24
+ rs
25
+ end
26
+ end
27
+
28
+ private
29
+
30
+ def silent?
31
+ ENV['SILENT'] == '1'
32
+ end
33
+
34
+ end
35
+ end
36
+ end
37
+ end
@@ -0,0 +1,110 @@
1
+ require 'fileutils'
2
+ require 'tempfile'
3
+ require 'vx/common/spawn'
4
+
5
+ module Vx
6
+ module Aptly
7
+ class Package
8
+
9
+ include Mixin::Capture
10
+ extend Mixin::Capture
11
+ extend Vx::Common::Spawn
12
+
13
+ AddResult = Struct.new(:notice, :error) do
14
+ def valid?
15
+ !error
16
+ end
17
+ end
18
+
19
+ attr_accessor :error, :attributes, :notice
20
+
21
+ def initialize(params = {})
22
+ @attributes = {}
23
+ params.each do |k,v|
24
+ if self.respond_to?(:"#{k}=")
25
+ self.public_send(:"#{k}=", v)
26
+ end
27
+ end
28
+ end
29
+
30
+ %w{ package version installed_size priority section maintainer architecture
31
+ description md5sum sha1 sha256 vendor license size depends homepage
32
+ source filename }.each do |m|
33
+ define_method :"#{m}=" do |value|
34
+ if value.to_s.strip == ''
35
+ value = nil
36
+ end
37
+ @attributes[m.to_sym] = value
38
+ end
39
+
40
+ define_method :"#{m}" do
41
+ @attributes[m.to_sym]
42
+ end
43
+ end
44
+
45
+ def id
46
+ @id ||= [package, version, architecture].join("_")
47
+ end
48
+
49
+ def destroy(repo)
50
+ line = "aptly repo remove #{repo.name} #{id}"
51
+ capture line do |re|
52
+ @notice = "The command '#{line}' was successfuly finished with output:\n"
53
+ @notice << re
54
+ end
55
+ end
56
+
57
+ class << self
58
+ def find(name)
59
+ capture "aptly package show #{name}" do |re|
60
+ package = new(package: name)
61
+
62
+ re.lines.each do |line|
63
+ key, value = line.split(":").map(&:strip)
64
+ key_name = key.gsub(/[^a-zA-Z]/, ' ').gsub(/ +/, '_').downcase
65
+ if package.respond_to?("#{key_name}=")
66
+ package.public_send(:"#{key_name}=", value)
67
+ end
68
+ end
69
+
70
+ package
71
+ end
72
+ end
73
+
74
+ def all(repo)
75
+ capture "aptly repo search #{repo.name} 'Name'" do |re|
76
+ re.lines.inject([]) do |a, line|
77
+ a << find(line.strip)
78
+ a
79
+ end.sort_by(&:id)
80
+ end
81
+ end
82
+
83
+ def add(repo, filename, filepath)
84
+ new_filepath = Dir.tmpdir + "/#{filename}"
85
+ FileUtils.cp filepath, new_filepath
86
+
87
+ line = "aptly repo add #{repo.name} #{new_filepath}"
88
+ rs = AddResult.new
89
+ begin
90
+ capture line do |re|
91
+ rs.notice = "The command '#{line}' was successfuly finished with output:\n"
92
+ rs.notice << re
93
+ end
94
+ rescue AptlyCommandError => e
95
+ rs.error = e
96
+ end
97
+ rs
98
+ end
99
+
100
+ def push(repo, archive_path)
101
+ spawn "#{Aptly.root}/bin/vx-aptly push #{repo.name} #{archive_path}" do |re|
102
+ yield re
103
+ end
104
+ end
105
+
106
+ end
107
+
108
+ end
109
+ end
110
+ end
@@ -0,0 +1,153 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <title>Page Not Found :(</title>
6
+ <style>
7
+ ::-moz-selection {
8
+ background: #b3d4fc;
9
+ text-shadow: none;
10
+ }
11
+
12
+ ::selection {
13
+ background: #b3d4fc;
14
+ text-shadow: none;
15
+ }
16
+
17
+ html {
18
+ padding: 30px 10px;
19
+ font-size: 20px;
20
+ line-height: 1.4;
21
+ color: #737373;
22
+ background: #f0f0f0;
23
+ -webkit-text-size-adjust: 100%;
24
+ -ms-text-size-adjust: 100%;
25
+ }
26
+
27
+ html,
28
+ input {
29
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
30
+ }
31
+
32
+ body {
33
+ max-width: 500px;
34
+ _width: 500px;
35
+ padding: 30px 20px 50px;
36
+ border: 1px solid #b3b3b3;
37
+ border-radius: 4px;
38
+ margin: 0 auto;
39
+ box-shadow: 0 1px 10px #a7a7a7, inset 0 1px 0 #fff;
40
+ background: #fcfcfc;
41
+ }
42
+
43
+ h1 {
44
+ margin: 0 10px;
45
+ font-size: 50px;
46
+ text-align: center;
47
+ }
48
+
49
+ h1 span {
50
+ color: #bbb;
51
+ }
52
+
53
+ h3 {
54
+ margin: 1.5em 0 0.5em;
55
+ }
56
+
57
+ p {
58
+ margin: 1em 0;
59
+ }
60
+
61
+ ul {
62
+ padding: 0 0 0 40px;
63
+ margin: 1em 0;
64
+ }
65
+
66
+ .container {
67
+ max-width: 380px;
68
+ _width: 380px;
69
+ margin: 0 auto;
70
+ }
71
+
72
+ /* google search */
73
+
74
+ #goog-fixurl ul {
75
+ list-style: none;
76
+ padding: 0;
77
+ margin: 0;
78
+ }
79
+
80
+ #goog-fixurl form {
81
+ margin: 0;
82
+ }
83
+
84
+ #goog-wm-qt,
85
+ #goog-wm-sb {
86
+ border: 1px solid #bbb;
87
+ font-size: 16px;
88
+ line-height: normal;
89
+ vertical-align: top;
90
+ color: #444;
91
+ border-radius: 2px;
92
+ }
93
+
94
+ #goog-wm-qt {
95
+ width: 220px;
96
+ height: 20px;
97
+ padding: 5px;
98
+ margin: 5px 10px 0 0;
99
+ box-shadow: inset 0 1px 1px #ccc;
100
+ }
101
+
102
+ #goog-wm-sb {
103
+ display: inline-block;
104
+ height: 32px;
105
+ padding: 0 10px;
106
+ margin: 5px 0 0;
107
+ white-space: nowrap;
108
+ cursor: pointer;
109
+ background-color: #f5f5f5;
110
+ background-image: -webkit-linear-gradient(rgba(255,255,255,0), #f1f1f1);
111
+ background-image: -moz-linear-gradient(rgba(255,255,255,0), #f1f1f1);
112
+ background-image: -ms-linear-gradient(rgba(255,255,255,0), #f1f1f1);
113
+ background-image: -o-linear-gradient(rgba(255,255,255,0), #f1f1f1);
114
+ -webkit-appearance: none;
115
+ -moz-appearance: none;
116
+ appearance: none;
117
+ *overflow: visible;
118
+ *display: inline;
119
+ *zoom: 1;
120
+ }
121
+
122
+ #goog-wm-sb:hover,
123
+ #goog-wm-sb:focus {
124
+ border-color: #aaa;
125
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
126
+ background-color: #f8f8f8;
127
+ }
128
+
129
+ #goog-wm-qt:hover,
130
+ #goog-wm-qt:focus {
131
+ border-color: #105cb6;
132
+ outline: 0;
133
+ color: #222;
134
+ }
135
+
136
+ input::-moz-focus-inner {
137
+ padding: 0;
138
+ border: 0;
139
+ }
140
+ </style>
141
+ </head>
142
+ <body>
143
+ <div class="container">
144
+ <h1>Not found <span>:(</span></h1>
145
+ <p>Sorry, but the page you were trying to view does not exist.</p>
146
+ <p>It looks like this was the result of either:</p>
147
+ <ul>
148
+ <li>a mistyped address</li>
149
+ <li>an out-of-date link</li>
150
+ </ul>
151
+ </div>
152
+ </body>
153
+ </html>
@@ -0,0 +1,3158 @@
1
+ @charset "UTF-8";
2
+ /*!
3
+ Animate.css - http://daneden.me/animate
4
+ Licensed under the MIT license - http://opensource.org/licenses/MIT
5
+
6
+ Copyright (c) 2014 Daniel Eden
7
+ */
8
+
9
+ .animated {
10
+ -webkit-animation-duration: 1s;
11
+ animation-duration: 1s;
12
+ -webkit-animation-fill-mode: both;
13
+ animation-fill-mode: both;
14
+ }
15
+
16
+ .animated.infinite {
17
+ -webkit-animation-iteration-count: infinite;
18
+ animation-iteration-count: infinite;
19
+ }
20
+
21
+ .animated.hinge {
22
+ -webkit-animation-duration: 2s;
23
+ animation-duration: 2s;
24
+ }
25
+
26
+ @-webkit-keyframes bounce {
27
+ 0%, 20%, 53%, 80%, 100% {
28
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
29
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
30
+ -webkit-transform: translate3d(0,0,0);
31
+ transform: translate3d(0,0,0);
32
+ }
33
+
34
+ 40%, 43% {
35
+ -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
36
+ transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
37
+ -webkit-transform: translate3d(0, -30px, 0);
38
+ transform: translate3d(0, -30px, 0);
39
+ }
40
+
41
+ 70% {
42
+ -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
43
+ transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
44
+ -webkit-transform: translate3d(0, -15px, 0);
45
+ transform: translate3d(0, -15px, 0);
46
+ }
47
+
48
+ 90% {
49
+ -webkit-transform: translate3d(0,-4px,0);
50
+ transform: translate3d(0,-4px,0);
51
+ }
52
+ }
53
+
54
+ @keyframes bounce {
55
+ 0%, 20%, 53%, 80%, 100% {
56
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
57
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
58
+ -webkit-transform: translate3d(0,0,0);
59
+ transform: translate3d(0,0,0);
60
+ }
61
+
62
+ 40%, 43% {
63
+ -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
64
+ transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
65
+ -webkit-transform: translate3d(0, -30px, 0);
66
+ transform: translate3d(0, -30px, 0);
67
+ }
68
+
69
+ 70% {
70
+ -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
71
+ transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
72
+ -webkit-transform: translate3d(0, -15px, 0);
73
+ transform: translate3d(0, -15px, 0);
74
+ }
75
+
76
+ 90% {
77
+ -webkit-transform: translate3d(0,-4px,0);
78
+ transform: translate3d(0,-4px,0);
79
+ }
80
+ }
81
+
82
+ .bounce {
83
+ -webkit-animation-name: bounce;
84
+ animation-name: bounce;
85
+ -webkit-transform-origin: center bottom;
86
+ -ms-transform-origin: center bottom;
87
+ transform-origin: center bottom;
88
+ }
89
+
90
+ @-webkit-keyframes flash {
91
+ 0%, 50%, 100% {
92
+ opacity: 1;
93
+ }
94
+
95
+ 25%, 75% {
96
+ opacity: 0;
97
+ }
98
+ }
99
+
100
+ @keyframes flash {
101
+ 0%, 50%, 100% {
102
+ opacity: 1;
103
+ }
104
+
105
+ 25%, 75% {
106
+ opacity: 0;
107
+ }
108
+ }
109
+
110
+ .flash {
111
+ -webkit-animation-name: flash;
112
+ animation-name: flash;
113
+ }
114
+
115
+ /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
116
+
117
+ @-webkit-keyframes pulse {
118
+ 0% {
119
+ -webkit-transform: scale3d(1, 1, 1);
120
+ transform: scale3d(1, 1, 1);
121
+ }
122
+
123
+ 50% {
124
+ -webkit-transform: scale3d(1.05, 1.05, 1.05);
125
+ transform: scale3d(1.05, 1.05, 1.05);
126
+ }
127
+
128
+ 100% {
129
+ -webkit-transform: scale3d(1, 1, 1);
130
+ transform: scale3d(1, 1, 1);
131
+ }
132
+ }
133
+
134
+ @keyframes pulse {
135
+ 0% {
136
+ -webkit-transform: scale3d(1, 1, 1);
137
+ transform: scale3d(1, 1, 1);
138
+ }
139
+
140
+ 50% {
141
+ -webkit-transform: scale3d(1.05, 1.05, 1.05);
142
+ transform: scale3d(1.05, 1.05, 1.05);
143
+ }
144
+
145
+ 100% {
146
+ -webkit-transform: scale3d(1, 1, 1);
147
+ transform: scale3d(1, 1, 1);
148
+ }
149
+ }
150
+
151
+ .pulse {
152
+ -webkit-animation-name: pulse;
153
+ animation-name: pulse;
154
+ }
155
+
156
+ @-webkit-keyframes rubberBand {
157
+ 0% {
158
+ -webkit-transform: scale3d(1, 1, 1);
159
+ transform: scale3d(1, 1, 1);
160
+ }
161
+
162
+ 30% {
163
+ -webkit-transform: scale3d(1.25, 0.75, 1);
164
+ transform: scale3d(1.25, 0.75, 1);
165
+ }
166
+
167
+ 40% {
168
+ -webkit-transform: scale3d(0.75, 1.25, 1);
169
+ transform: scale3d(0.75, 1.25, 1);
170
+ }
171
+
172
+ 50% {
173
+ -webkit-transform: scale3d(1.15, 0.85, 1);
174
+ transform: scale3d(1.15, 0.85, 1);
175
+ }
176
+
177
+ 65% {
178
+ -webkit-transform: scale3d(.95, 1.05, 1);
179
+ transform: scale3d(.95, 1.05, 1);
180
+ }
181
+
182
+ 75% {
183
+ -webkit-transform: scale3d(1.05, .95, 1);
184
+ transform: scale3d(1.05, .95, 1);
185
+ }
186
+
187
+ 100% {
188
+ -webkit-transform: scale3d(1, 1, 1);
189
+ transform: scale3d(1, 1, 1);
190
+ }
191
+ }
192
+
193
+ @keyframes rubberBand {
194
+ 0% {
195
+ -webkit-transform: scale3d(1, 1, 1);
196
+ transform: scale3d(1, 1, 1);
197
+ }
198
+
199
+ 30% {
200
+ -webkit-transform: scale3d(1.25, 0.75, 1);
201
+ transform: scale3d(1.25, 0.75, 1);
202
+ }
203
+
204
+ 40% {
205
+ -webkit-transform: scale3d(0.75, 1.25, 1);
206
+ transform: scale3d(0.75, 1.25, 1);
207
+ }
208
+
209
+ 50% {
210
+ -webkit-transform: scale3d(1.15, 0.85, 1);
211
+ transform: scale3d(1.15, 0.85, 1);
212
+ }
213
+
214
+ 65% {
215
+ -webkit-transform: scale3d(.95, 1.05, 1);
216
+ transform: scale3d(.95, 1.05, 1);
217
+ }
218
+
219
+ 75% {
220
+ -webkit-transform: scale3d(1.05, .95, 1);
221
+ transform: scale3d(1.05, .95, 1);
222
+ }
223
+
224
+ 100% {
225
+ -webkit-transform: scale3d(1, 1, 1);
226
+ transform: scale3d(1, 1, 1);
227
+ }
228
+ }
229
+
230
+ .rubberBand {
231
+ -webkit-animation-name: rubberBand;
232
+ animation-name: rubberBand;
233
+ }
234
+
235
+ @-webkit-keyframes shake {
236
+ 0%, 100% {
237
+ -webkit-transform: translate3d(0, 0, 0);
238
+ transform: translate3d(0, 0, 0);
239
+ }
240
+
241
+ 10%, 30%, 50%, 70%, 90% {
242
+ -webkit-transform: translate3d(-10px, 0, 0);
243
+ transform: translate3d(-10px, 0, 0);
244
+ }
245
+
246
+ 20%, 40%, 60%, 80% {
247
+ -webkit-transform: translate3d(10px, 0, 0);
248
+ transform: translate3d(10px, 0, 0);
249
+ }
250
+ }
251
+
252
+ @keyframes shake {
253
+ 0%, 100% {
254
+ -webkit-transform: translate3d(0, 0, 0);
255
+ transform: translate3d(0, 0, 0);
256
+ }
257
+
258
+ 10%, 30%, 50%, 70%, 90% {
259
+ -webkit-transform: translate3d(-10px, 0, 0);
260
+ transform: translate3d(-10px, 0, 0);
261
+ }
262
+
263
+ 20%, 40%, 60%, 80% {
264
+ -webkit-transform: translate3d(10px, 0, 0);
265
+ transform: translate3d(10px, 0, 0);
266
+ }
267
+ }
268
+
269
+ .shake {
270
+ -webkit-animation-name: shake;
271
+ animation-name: shake;
272
+ }
273
+
274
+ @-webkit-keyframes swing {
275
+ 20% {
276
+ -webkit-transform: rotate3d(0, 0, 1, 15deg);
277
+ transform: rotate3d(0, 0, 1, 15deg);
278
+ }
279
+
280
+ 40% {
281
+ -webkit-transform: rotate3d(0, 0, 1, -10deg);
282
+ transform: rotate3d(0, 0, 1, -10deg);
283
+ }
284
+
285
+ 60% {
286
+ -webkit-transform: rotate3d(0, 0, 1, 5deg);
287
+ transform: rotate3d(0, 0, 1, 5deg);
288
+ }
289
+
290
+ 80% {
291
+ -webkit-transform: rotate3d(0, 0, 1, -5deg);
292
+ transform: rotate3d(0, 0, 1, -5deg);
293
+ }
294
+
295
+ 100% {
296
+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
297
+ transform: rotate3d(0, 0, 1, 0deg);
298
+ }
299
+ }
300
+
301
+ @keyframes swing {
302
+ 20% {
303
+ -webkit-transform: rotate3d(0, 0, 1, 15deg);
304
+ transform: rotate3d(0, 0, 1, 15deg);
305
+ }
306
+
307
+ 40% {
308
+ -webkit-transform: rotate3d(0, 0, 1, -10deg);
309
+ transform: rotate3d(0, 0, 1, -10deg);
310
+ }
311
+
312
+ 60% {
313
+ -webkit-transform: rotate3d(0, 0, 1, 5deg);
314
+ transform: rotate3d(0, 0, 1, 5deg);
315
+ }
316
+
317
+ 80% {
318
+ -webkit-transform: rotate3d(0, 0, 1, -5deg);
319
+ transform: rotate3d(0, 0, 1, -5deg);
320
+ }
321
+
322
+ 100% {
323
+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
324
+ transform: rotate3d(0, 0, 1, 0deg);
325
+ }
326
+ }
327
+
328
+ .swing {
329
+ -webkit-transform-origin: top center;
330
+ -ms-transform-origin: top center;
331
+ transform-origin: top center;
332
+ -webkit-animation-name: swing;
333
+ animation-name: swing;
334
+ }
335
+
336
+ @-webkit-keyframes tada {
337
+ 0% {
338
+ -webkit-transform: scale3d(1, 1, 1);
339
+ transform: scale3d(1, 1, 1);
340
+ }
341
+
342
+ 10%, 20% {
343
+ -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
344
+ transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
345
+ }
346
+
347
+ 30%, 50%, 70%, 90% {
348
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
349
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
350
+ }
351
+
352
+ 40%, 60%, 80% {
353
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
354
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
355
+ }
356
+
357
+ 100% {
358
+ -webkit-transform: scale3d(1, 1, 1);
359
+ transform: scale3d(1, 1, 1);
360
+ }
361
+ }
362
+
363
+ @keyframes tada {
364
+ 0% {
365
+ -webkit-transform: scale3d(1, 1, 1);
366
+ transform: scale3d(1, 1, 1);
367
+ }
368
+
369
+ 10%, 20% {
370
+ -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
371
+ transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
372
+ }
373
+
374
+ 30%, 50%, 70%, 90% {
375
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
376
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
377
+ }
378
+
379
+ 40%, 60%, 80% {
380
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
381
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
382
+ }
383
+
384
+ 100% {
385
+ -webkit-transform: scale3d(1, 1, 1);
386
+ transform: scale3d(1, 1, 1);
387
+ }
388
+ }
389
+
390
+ .tada {
391
+ -webkit-animation-name: tada;
392
+ animation-name: tada;
393
+ }
394
+
395
+ /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
396
+
397
+ @-webkit-keyframes wobble {
398
+ 0% {
399
+ -webkit-transform: none;
400
+ transform: none;
401
+ }
402
+
403
+ 15% {
404
+ -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
405
+ transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
406
+ }
407
+
408
+ 30% {
409
+ -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
410
+ transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
411
+ }
412
+
413
+ 45% {
414
+ -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
415
+ transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
416
+ }
417
+
418
+ 60% {
419
+ -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
420
+ transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
421
+ }
422
+
423
+ 75% {
424
+ -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
425
+ transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
426
+ }
427
+
428
+ 100% {
429
+ -webkit-transform: none;
430
+ transform: none;
431
+ }
432
+ }
433
+
434
+ @keyframes wobble {
435
+ 0% {
436
+ -webkit-transform: none;
437
+ transform: none;
438
+ }
439
+
440
+ 15% {
441
+ -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
442
+ transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
443
+ }
444
+
445
+ 30% {
446
+ -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
447
+ transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
448
+ }
449
+
450
+ 45% {
451
+ -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
452
+ transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
453
+ }
454
+
455
+ 60% {
456
+ -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
457
+ transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
458
+ }
459
+
460
+ 75% {
461
+ -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
462
+ transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
463
+ }
464
+
465
+ 100% {
466
+ -webkit-transform: none;
467
+ transform: none;
468
+ }
469
+ }
470
+
471
+ .wobble {
472
+ -webkit-animation-name: wobble;
473
+ animation-name: wobble;
474
+ }
475
+
476
+ @-webkit-keyframes bounceIn {
477
+ 0%, 20%, 40%, 60%, 80%, 100% {
478
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
479
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
480
+ }
481
+
482
+ 0% {
483
+ opacity: 0;
484
+ -webkit-transform: scale3d(.3, .3, .3);
485
+ transform: scale3d(.3, .3, .3);
486
+ }
487
+
488
+ 20% {
489
+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
490
+ transform: scale3d(1.1, 1.1, 1.1);
491
+ }
492
+
493
+ 40% {
494
+ -webkit-transform: scale3d(.9, .9, .9);
495
+ transform: scale3d(.9, .9, .9);
496
+ }
497
+
498
+ 60% {
499
+ opacity: 1;
500
+ -webkit-transform: scale3d(1.03, 1.03, 1.03);
501
+ transform: scale3d(1.03, 1.03, 1.03);
502
+ }
503
+
504
+ 80% {
505
+ -webkit-transform: scale3d(.97, .97, .97);
506
+ transform: scale3d(.97, .97, .97);
507
+ }
508
+
509
+ 100% {
510
+ opacity: 1;
511
+ -webkit-transform: scale3d(1, 1, 1);
512
+ transform: scale3d(1, 1, 1);
513
+ }
514
+ }
515
+
516
+ @keyframes bounceIn {
517
+ 0%, 20%, 40%, 60%, 80%, 100% {
518
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
519
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
520
+ }
521
+
522
+ 0% {
523
+ opacity: 0;
524
+ -webkit-transform: scale3d(.3, .3, .3);
525
+ transform: scale3d(.3, .3, .3);
526
+ }
527
+
528
+ 20% {
529
+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
530
+ transform: scale3d(1.1, 1.1, 1.1);
531
+ }
532
+
533
+ 40% {
534
+ -webkit-transform: scale3d(.9, .9, .9);
535
+ transform: scale3d(.9, .9, .9);
536
+ }
537
+
538
+ 60% {
539
+ opacity: 1;
540
+ -webkit-transform: scale3d(1.03, 1.03, 1.03);
541
+ transform: scale3d(1.03, 1.03, 1.03);
542
+ }
543
+
544
+ 80% {
545
+ -webkit-transform: scale3d(.97, .97, .97);
546
+ transform: scale3d(.97, .97, .97);
547
+ }
548
+
549
+ 100% {
550
+ opacity: 1;
551
+ -webkit-transform: scale3d(1, 1, 1);
552
+ transform: scale3d(1, 1, 1);
553
+ }
554
+ }
555
+
556
+ .bounceIn {
557
+ -webkit-animation-name: bounceIn;
558
+ animation-name: bounceIn;
559
+ -webkit-animation-duration: .75s;
560
+ animation-duration: .75s;
561
+ }
562
+
563
+ @-webkit-keyframes bounceInDown {
564
+ 0%, 60%, 75%, 90%, 100% {
565
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
566
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
567
+ }
568
+
569
+ 0% {
570
+ opacity: 0;
571
+ -webkit-transform: translate3d(0, -3000px, 0);
572
+ transform: translate3d(0, -3000px, 0);
573
+ }
574
+
575
+ 60% {
576
+ opacity: 1;
577
+ -webkit-transform: translate3d(0, 25px, 0);
578
+ transform: translate3d(0, 25px, 0);
579
+ }
580
+
581
+ 75% {
582
+ -webkit-transform: translate3d(0, -10px, 0);
583
+ transform: translate3d(0, -10px, 0);
584
+ }
585
+
586
+ 90% {
587
+ -webkit-transform: translate3d(0, 5px, 0);
588
+ transform: translate3d(0, 5px, 0);
589
+ }
590
+
591
+ 100% {
592
+ -webkit-transform: none;
593
+ transform: none;
594
+ }
595
+ }
596
+
597
+ @keyframes bounceInDown {
598
+ 0%, 60%, 75%, 90%, 100% {
599
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
600
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
601
+ }
602
+
603
+ 0% {
604
+ opacity: 0;
605
+ -webkit-transform: translate3d(0, -3000px, 0);
606
+ transform: translate3d(0, -3000px, 0);
607
+ }
608
+
609
+ 60% {
610
+ opacity: 1;
611
+ -webkit-transform: translate3d(0, 25px, 0);
612
+ transform: translate3d(0, 25px, 0);
613
+ }
614
+
615
+ 75% {
616
+ -webkit-transform: translate3d(0, -10px, 0);
617
+ transform: translate3d(0, -10px, 0);
618
+ }
619
+
620
+ 90% {
621
+ -webkit-transform: translate3d(0, 5px, 0);
622
+ transform: translate3d(0, 5px, 0);
623
+ }
624
+
625
+ 100% {
626
+ -webkit-transform: none;
627
+ transform: none;
628
+ }
629
+ }
630
+
631
+ .bounceInDown {
632
+ -webkit-animation-name: bounceInDown;
633
+ animation-name: bounceInDown;
634
+ }
635
+
636
+ @-webkit-keyframes bounceInLeft {
637
+ 0%, 60%, 75%, 90%, 100% {
638
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
639
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
640
+ }
641
+
642
+ 0% {
643
+ opacity: 0;
644
+ -webkit-transform: translate3d(-3000px, 0, 0);
645
+ transform: translate3d(-3000px, 0, 0);
646
+ }
647
+
648
+ 60% {
649
+ opacity: 1;
650
+ -webkit-transform: translate3d(25px, 0, 0);
651
+ transform: translate3d(25px, 0, 0);
652
+ }
653
+
654
+ 75% {
655
+ -webkit-transform: translate3d(-10px, 0, 0);
656
+ transform: translate3d(-10px, 0, 0);
657
+ }
658
+
659
+ 90% {
660
+ -webkit-transform: translate3d(5px, 0, 0);
661
+ transform: translate3d(5px, 0, 0);
662
+ }
663
+
664
+ 100% {
665
+ -webkit-transform: none;
666
+ transform: none;
667
+ }
668
+ }
669
+
670
+ @keyframes bounceInLeft {
671
+ 0%, 60%, 75%, 90%, 100% {
672
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
673
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
674
+ }
675
+
676
+ 0% {
677
+ opacity: 0;
678
+ -webkit-transform: translate3d(-3000px, 0, 0);
679
+ transform: translate3d(-3000px, 0, 0);
680
+ }
681
+
682
+ 60% {
683
+ opacity: 1;
684
+ -webkit-transform: translate3d(25px, 0, 0);
685
+ transform: translate3d(25px, 0, 0);
686
+ }
687
+
688
+ 75% {
689
+ -webkit-transform: translate3d(-10px, 0, 0);
690
+ transform: translate3d(-10px, 0, 0);
691
+ }
692
+
693
+ 90% {
694
+ -webkit-transform: translate3d(5px, 0, 0);
695
+ transform: translate3d(5px, 0, 0);
696
+ }
697
+
698
+ 100% {
699
+ -webkit-transform: none;
700
+ transform: none;
701
+ }
702
+ }
703
+
704
+ .bounceInLeft {
705
+ -webkit-animation-name: bounceInLeft;
706
+ animation-name: bounceInLeft;
707
+ }
708
+
709
+ @-webkit-keyframes bounceInRight {
710
+ 0%, 60%, 75%, 90%, 100% {
711
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
712
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
713
+ }
714
+
715
+ 0% {
716
+ opacity: 0;
717
+ -webkit-transform: translate3d(3000px, 0, 0);
718
+ transform: translate3d(3000px, 0, 0);
719
+ }
720
+
721
+ 60% {
722
+ opacity: 1;
723
+ -webkit-transform: translate3d(-25px, 0, 0);
724
+ transform: translate3d(-25px, 0, 0);
725
+ }
726
+
727
+ 75% {
728
+ -webkit-transform: translate3d(10px, 0, 0);
729
+ transform: translate3d(10px, 0, 0);
730
+ }
731
+
732
+ 90% {
733
+ -webkit-transform: translate3d(-5px, 0, 0);
734
+ transform: translate3d(-5px, 0, 0);
735
+ }
736
+
737
+ 100% {
738
+ -webkit-transform: none;
739
+ transform: none;
740
+ }
741
+ }
742
+
743
+ @keyframes bounceInRight {
744
+ 0%, 60%, 75%, 90%, 100% {
745
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
746
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
747
+ }
748
+
749
+ 0% {
750
+ opacity: 0;
751
+ -webkit-transform: translate3d(3000px, 0, 0);
752
+ transform: translate3d(3000px, 0, 0);
753
+ }
754
+
755
+ 60% {
756
+ opacity: 1;
757
+ -webkit-transform: translate3d(-25px, 0, 0);
758
+ transform: translate3d(-25px, 0, 0);
759
+ }
760
+
761
+ 75% {
762
+ -webkit-transform: translate3d(10px, 0, 0);
763
+ transform: translate3d(10px, 0, 0);
764
+ }
765
+
766
+ 90% {
767
+ -webkit-transform: translate3d(-5px, 0, 0);
768
+ transform: translate3d(-5px, 0, 0);
769
+ }
770
+
771
+ 100% {
772
+ -webkit-transform: none;
773
+ transform: none;
774
+ }
775
+ }
776
+
777
+ .bounceInRight {
778
+ -webkit-animation-name: bounceInRight;
779
+ animation-name: bounceInRight;
780
+ }
781
+
782
+ @-webkit-keyframes bounceInUp {
783
+ 0%, 60%, 75%, 90%, 100% {
784
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
785
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
786
+ }
787
+
788
+ 0% {
789
+ opacity: 0;
790
+ -webkit-transform: translate3d(0, 3000px, 0);
791
+ transform: translate3d(0, 3000px, 0);
792
+ }
793
+
794
+ 60% {
795
+ opacity: 1;
796
+ -webkit-transform: translate3d(0, -20px, 0);
797
+ transform: translate3d(0, -20px, 0);
798
+ }
799
+
800
+ 75% {
801
+ -webkit-transform: translate3d(0, 10px, 0);
802
+ transform: translate3d(0, 10px, 0);
803
+ }
804
+
805
+ 90% {
806
+ -webkit-transform: translate3d(0, -5px, 0);
807
+ transform: translate3d(0, -5px, 0);
808
+ }
809
+
810
+ 100% {
811
+ -webkit-transform: translate3d(0, 0, 0);
812
+ transform: translate3d(0, 0, 0);
813
+ }
814
+ }
815
+
816
+ @keyframes bounceInUp {
817
+ 0%, 60%, 75%, 90%, 100% {
818
+ -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
819
+ transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
820
+ }
821
+
822
+ 0% {
823
+ opacity: 0;
824
+ -webkit-transform: translate3d(0, 3000px, 0);
825
+ transform: translate3d(0, 3000px, 0);
826
+ }
827
+
828
+ 60% {
829
+ opacity: 1;
830
+ -webkit-transform: translate3d(0, -20px, 0);
831
+ transform: translate3d(0, -20px, 0);
832
+ }
833
+
834
+ 75% {
835
+ -webkit-transform: translate3d(0, 10px, 0);
836
+ transform: translate3d(0, 10px, 0);
837
+ }
838
+
839
+ 90% {
840
+ -webkit-transform: translate3d(0, -5px, 0);
841
+ transform: translate3d(0, -5px, 0);
842
+ }
843
+
844
+ 100% {
845
+ -webkit-transform: translate3d(0, 0, 0);
846
+ transform: translate3d(0, 0, 0);
847
+ }
848
+ }
849
+
850
+ .bounceInUp {
851
+ -webkit-animation-name: bounceInUp;
852
+ animation-name: bounceInUp;
853
+ }
854
+
855
+ @-webkit-keyframes bounceOut {
856
+ 20% {
857
+ -webkit-transform: scale3d(.9, .9, .9);
858
+ transform: scale3d(.9, .9, .9);
859
+ }
860
+
861
+ 50%, 55% {
862
+ opacity: 1;
863
+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
864
+ transform: scale3d(1.1, 1.1, 1.1);
865
+ }
866
+
867
+ 100% {
868
+ opacity: 0;
869
+ -webkit-transform: scale3d(.3, .3, .3);
870
+ transform: scale3d(.3, .3, .3);
871
+ }
872
+ }
873
+
874
+ @keyframes bounceOut {
875
+ 20% {
876
+ -webkit-transform: scale3d(.9, .9, .9);
877
+ transform: scale3d(.9, .9, .9);
878
+ }
879
+
880
+ 50%, 55% {
881
+ opacity: 1;
882
+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
883
+ transform: scale3d(1.1, 1.1, 1.1);
884
+ }
885
+
886
+ 100% {
887
+ opacity: 0;
888
+ -webkit-transform: scale3d(.3, .3, .3);
889
+ transform: scale3d(.3, .3, .3);
890
+ }
891
+ }
892
+
893
+ .bounceOut {
894
+ -webkit-animation-name: bounceOut;
895
+ animation-name: bounceOut;
896
+ -webkit-animation-duration: .75s;
897
+ animation-duration: .75s;
898
+ }
899
+
900
+ @-webkit-keyframes bounceOutDown {
901
+ 20% {
902
+ -webkit-transform: translate3d(0, 10px, 0);
903
+ transform: translate3d(0, 10px, 0);
904
+ }
905
+
906
+ 40%, 45% {
907
+ opacity: 1;
908
+ -webkit-transform: translate3d(0, -20px, 0);
909
+ transform: translate3d(0, -20px, 0);
910
+ }
911
+
912
+ 100% {
913
+ opacity: 0;
914
+ -webkit-transform: translate3d(0, 2000px, 0);
915
+ transform: translate3d(0, 2000px, 0);
916
+ }
917
+ }
918
+
919
+ @keyframes bounceOutDown {
920
+ 20% {
921
+ -webkit-transform: translate3d(0, 10px, 0);
922
+ transform: translate3d(0, 10px, 0);
923
+ }
924
+
925
+ 40%, 45% {
926
+ opacity: 1;
927
+ -webkit-transform: translate3d(0, -20px, 0);
928
+ transform: translate3d(0, -20px, 0);
929
+ }
930
+
931
+ 100% {
932
+ opacity: 0;
933
+ -webkit-transform: translate3d(0, 2000px, 0);
934
+ transform: translate3d(0, 2000px, 0);
935
+ }
936
+ }
937
+
938
+ .bounceOutDown {
939
+ -webkit-animation-name: bounceOutDown;
940
+ animation-name: bounceOutDown;
941
+ }
942
+
943
+ @-webkit-keyframes bounceOutLeft {
944
+ 20% {
945
+ opacity: 1;
946
+ -webkit-transform: translate3d(20px, 0, 0);
947
+ transform: translate3d(20px, 0, 0);
948
+ }
949
+
950
+ 100% {
951
+ opacity: 0;
952
+ -webkit-transform: translate3d(-2000px, 0, 0);
953
+ transform: translate3d(-2000px, 0, 0);
954
+ }
955
+ }
956
+
957
+ @keyframes bounceOutLeft {
958
+ 20% {
959
+ opacity: 1;
960
+ -webkit-transform: translate3d(20px, 0, 0);
961
+ transform: translate3d(20px, 0, 0);
962
+ }
963
+
964
+ 100% {
965
+ opacity: 0;
966
+ -webkit-transform: translate3d(-2000px, 0, 0);
967
+ transform: translate3d(-2000px, 0, 0);
968
+ }
969
+ }
970
+
971
+ .bounceOutLeft {
972
+ -webkit-animation-name: bounceOutLeft;
973
+ animation-name: bounceOutLeft;
974
+ }
975
+
976
+ @-webkit-keyframes bounceOutRight {
977
+ 20% {
978
+ opacity: 1;
979
+ -webkit-transform: translate3d(-20px, 0, 0);
980
+ transform: translate3d(-20px, 0, 0);
981
+ }
982
+
983
+ 100% {
984
+ opacity: 0;
985
+ -webkit-transform: translate3d(2000px, 0, 0);
986
+ transform: translate3d(2000px, 0, 0);
987
+ }
988
+ }
989
+
990
+ @keyframes bounceOutRight {
991
+ 20% {
992
+ opacity: 1;
993
+ -webkit-transform: translate3d(-20px, 0, 0);
994
+ transform: translate3d(-20px, 0, 0);
995
+ }
996
+
997
+ 100% {
998
+ opacity: 0;
999
+ -webkit-transform: translate3d(2000px, 0, 0);
1000
+ transform: translate3d(2000px, 0, 0);
1001
+ }
1002
+ }
1003
+
1004
+ .bounceOutRight {
1005
+ -webkit-animation-name: bounceOutRight;
1006
+ animation-name: bounceOutRight;
1007
+ }
1008
+
1009
+ @-webkit-keyframes bounceOutUp {
1010
+ 20% {
1011
+ -webkit-transform: translate3d(0, -10px, 0);
1012
+ transform: translate3d(0, -10px, 0);
1013
+ }
1014
+
1015
+ 40%, 45% {
1016
+ opacity: 1;
1017
+ -webkit-transform: translate3d(0, 20px, 0);
1018
+ transform: translate3d(0, 20px, 0);
1019
+ }
1020
+
1021
+ 100% {
1022
+ opacity: 0;
1023
+ -webkit-transform: translate3d(0, -2000px, 0);
1024
+ transform: translate3d(0, -2000px, 0);
1025
+ }
1026
+ }
1027
+
1028
+ @keyframes bounceOutUp {
1029
+ 20% {
1030
+ -webkit-transform: translate3d(0, -10px, 0);
1031
+ transform: translate3d(0, -10px, 0);
1032
+ }
1033
+
1034
+ 40%, 45% {
1035
+ opacity: 1;
1036
+ -webkit-transform: translate3d(0, 20px, 0);
1037
+ transform: translate3d(0, 20px, 0);
1038
+ }
1039
+
1040
+ 100% {
1041
+ opacity: 0;
1042
+ -webkit-transform: translate3d(0, -2000px, 0);
1043
+ transform: translate3d(0, -2000px, 0);
1044
+ }
1045
+ }
1046
+
1047
+ .bounceOutUp {
1048
+ -webkit-animation-name: bounceOutUp;
1049
+ animation-name: bounceOutUp;
1050
+ }
1051
+
1052
+ @-webkit-keyframes fadeIn {
1053
+ 0% {opacity: 0;}
1054
+ 100% {opacity: 1;}
1055
+ }
1056
+
1057
+ @keyframes fadeIn {
1058
+ 0% {opacity: 0;}
1059
+ 100% {opacity: 1;}
1060
+ }
1061
+
1062
+ .fadeIn {
1063
+ -webkit-animation-name: fadeIn;
1064
+ animation-name: fadeIn;
1065
+ }
1066
+
1067
+ @-webkit-keyframes fadeInDown {
1068
+ 0% {
1069
+ opacity: 0;
1070
+ -webkit-transform: translate3d(0, -100%, 0);
1071
+ transform: translate3d(0, -100%, 0);
1072
+ }
1073
+
1074
+ 100% {
1075
+ opacity: 1;
1076
+ -webkit-transform: none;
1077
+ transform: none;
1078
+ }
1079
+ }
1080
+
1081
+ @keyframes fadeInDown {
1082
+ 0% {
1083
+ opacity: 0;
1084
+ -webkit-transform: translate3d(0, -100%, 0);
1085
+ transform: translate3d(0, -100%, 0);
1086
+ }
1087
+
1088
+ 100% {
1089
+ opacity: 1;
1090
+ -webkit-transform: none;
1091
+ transform: none;
1092
+ }
1093
+ }
1094
+
1095
+ .fadeInDown {
1096
+ -webkit-animation-name: fadeInDown;
1097
+ animation-name: fadeInDown;
1098
+ }
1099
+
1100
+ @-webkit-keyframes fadeInDownBig {
1101
+ 0% {
1102
+ opacity: 0;
1103
+ -webkit-transform: translate3d(0, -2000px, 0);
1104
+ transform: translate3d(0, -2000px, 0);
1105
+ }
1106
+
1107
+ 100% {
1108
+ opacity: 1;
1109
+ -webkit-transform: none;
1110
+ transform: none;
1111
+ }
1112
+ }
1113
+
1114
+ @keyframes fadeInDownBig {
1115
+ 0% {
1116
+ opacity: 0;
1117
+ -webkit-transform: translate3d(0, -2000px, 0);
1118
+ transform: translate3d(0, -2000px, 0);
1119
+ }
1120
+
1121
+ 100% {
1122
+ opacity: 1;
1123
+ -webkit-transform: none;
1124
+ transform: none;
1125
+ }
1126
+ }
1127
+
1128
+ .fadeInDownBig {
1129
+ -webkit-animation-name: fadeInDownBig;
1130
+ animation-name: fadeInDownBig;
1131
+ }
1132
+
1133
+ @-webkit-keyframes fadeInLeft {
1134
+ 0% {
1135
+ opacity: 0;
1136
+ -webkit-transform: translate3d(-100%, 0, 0);
1137
+ transform: translate3d(-100%, 0, 0);
1138
+ }
1139
+
1140
+ 100% {
1141
+ opacity: 1;
1142
+ -webkit-transform: none;
1143
+ transform: none;
1144
+ }
1145
+ }
1146
+
1147
+ @keyframes fadeInLeft {
1148
+ 0% {
1149
+ opacity: 0;
1150
+ -webkit-transform: translate3d(-100%, 0, 0);
1151
+ transform: translate3d(-100%, 0, 0);
1152
+ }
1153
+
1154
+ 100% {
1155
+ opacity: 1;
1156
+ -webkit-transform: none;
1157
+ transform: none;
1158
+ }
1159
+ }
1160
+
1161
+ .fadeInLeft {
1162
+ -webkit-animation-name: fadeInLeft;
1163
+ animation-name: fadeInLeft;
1164
+ }
1165
+
1166
+ @-webkit-keyframes fadeInLeftBig {
1167
+ 0% {
1168
+ opacity: 0;
1169
+ -webkit-transform: translate3d(-2000px, 0, 0);
1170
+ transform: translate3d(-2000px, 0, 0);
1171
+ }
1172
+
1173
+ 100% {
1174
+ opacity: 1;
1175
+ -webkit-transform: none;
1176
+ transform: none;
1177
+ }
1178
+ }
1179
+
1180
+ @keyframes fadeInLeftBig {
1181
+ 0% {
1182
+ opacity: 0;
1183
+ -webkit-transform: translate3d(-2000px, 0, 0);
1184
+ transform: translate3d(-2000px, 0, 0);
1185
+ }
1186
+
1187
+ 100% {
1188
+ opacity: 1;
1189
+ -webkit-transform: none;
1190
+ transform: none;
1191
+ }
1192
+ }
1193
+
1194
+ .fadeInLeftBig {
1195
+ -webkit-animation-name: fadeInLeftBig;
1196
+ animation-name: fadeInLeftBig;
1197
+ }
1198
+
1199
+ @-webkit-keyframes fadeInRight {
1200
+ 0% {
1201
+ opacity: 0;
1202
+ -webkit-transform: translate3d(100%, 0, 0);
1203
+ transform: translate3d(100%, 0, 0);
1204
+ }
1205
+
1206
+ 100% {
1207
+ opacity: 1;
1208
+ -webkit-transform: none;
1209
+ transform: none;
1210
+ }
1211
+ }
1212
+
1213
+ @keyframes fadeInRight {
1214
+ 0% {
1215
+ opacity: 0;
1216
+ -webkit-transform: translate3d(100%, 0, 0);
1217
+ transform: translate3d(100%, 0, 0);
1218
+ }
1219
+
1220
+ 100% {
1221
+ opacity: 1;
1222
+ -webkit-transform: none;
1223
+ transform: none;
1224
+ }
1225
+ }
1226
+
1227
+ .fadeInRight {
1228
+ -webkit-animation-name: fadeInRight;
1229
+ animation-name: fadeInRight;
1230
+ }
1231
+
1232
+ @-webkit-keyframes fadeInRightBig {
1233
+ 0% {
1234
+ opacity: 0;
1235
+ -webkit-transform: translate3d(2000px, 0, 0);
1236
+ transform: translate3d(2000px, 0, 0);
1237
+ }
1238
+
1239
+ 100% {
1240
+ opacity: 1;
1241
+ -webkit-transform: none;
1242
+ transform: none;
1243
+ }
1244
+ }
1245
+
1246
+ @keyframes fadeInRightBig {
1247
+ 0% {
1248
+ opacity: 0;
1249
+ -webkit-transform: translate3d(2000px, 0, 0);
1250
+ transform: translate3d(2000px, 0, 0);
1251
+ }
1252
+
1253
+ 100% {
1254
+ opacity: 1;
1255
+ -webkit-transform: none;
1256
+ transform: none;
1257
+ }
1258
+ }
1259
+
1260
+ .fadeInRightBig {
1261
+ -webkit-animation-name: fadeInRightBig;
1262
+ animation-name: fadeInRightBig;
1263
+ }
1264
+
1265
+ @-webkit-keyframes fadeInUp {
1266
+ 0% {
1267
+ opacity: 0;
1268
+ -webkit-transform: translate3d(0, 100%, 0);
1269
+ transform: translate3d(0, 100%, 0);
1270
+ }
1271
+
1272
+ 100% {
1273
+ opacity: 1;
1274
+ -webkit-transform: none;
1275
+ transform: none;
1276
+ }
1277
+ }
1278
+
1279
+ @keyframes fadeInUp {
1280
+ 0% {
1281
+ opacity: 0;
1282
+ -webkit-transform: translate3d(0, 100%, 0);
1283
+ transform: translate3d(0, 100%, 0);
1284
+ }
1285
+
1286
+ 100% {
1287
+ opacity: 1;
1288
+ -webkit-transform: none;
1289
+ transform: none;
1290
+ }
1291
+ }
1292
+
1293
+ .fadeInUp {
1294
+ -webkit-animation-name: fadeInUp;
1295
+ animation-name: fadeInUp;
1296
+ }
1297
+
1298
+ @-webkit-keyframes fadeInUpBig {
1299
+ 0% {
1300
+ opacity: 0;
1301
+ -webkit-transform: translate3d(0, 2000px, 0);
1302
+ transform: translate3d(0, 2000px, 0);
1303
+ }
1304
+
1305
+ 100% {
1306
+ opacity: 1;
1307
+ -webkit-transform: none;
1308
+ transform: none;
1309
+ }
1310
+ }
1311
+
1312
+ @keyframes fadeInUpBig {
1313
+ 0% {
1314
+ opacity: 0;
1315
+ -webkit-transform: translate3d(0, 2000px, 0);
1316
+ transform: translate3d(0, 2000px, 0);
1317
+ }
1318
+
1319
+ 100% {
1320
+ opacity: 1;
1321
+ -webkit-transform: none;
1322
+ transform: none;
1323
+ }
1324
+ }
1325
+
1326
+ .fadeInUpBig {
1327
+ -webkit-animation-name: fadeInUpBig;
1328
+ animation-name: fadeInUpBig;
1329
+ }
1330
+
1331
+ @-webkit-keyframes fadeOut {
1332
+ 0% {opacity: 1;}
1333
+ 100% {opacity: 0;}
1334
+ }
1335
+
1336
+ @keyframes fadeOut {
1337
+ 0% {opacity: 1;}
1338
+ 100% {opacity: 0;}
1339
+ }
1340
+
1341
+ .fadeOut {
1342
+ -webkit-animation-name: fadeOut;
1343
+ animation-name: fadeOut;
1344
+ }
1345
+
1346
+ @-webkit-keyframes fadeOutDown {
1347
+ 0% {
1348
+ opacity: 1;
1349
+ }
1350
+
1351
+ 100% {
1352
+ opacity: 0;
1353
+ -webkit-transform: translate3d(0, 100%, 0);
1354
+ transform: translate3d(0, 100%, 0);
1355
+ }
1356
+ }
1357
+
1358
+ @keyframes fadeOutDown {
1359
+ 0% {
1360
+ opacity: 1;
1361
+ }
1362
+
1363
+ 100% {
1364
+ opacity: 0;
1365
+ -webkit-transform: translate3d(0, 100%, 0);
1366
+ transform: translate3d(0, 100%, 0);
1367
+ }
1368
+ }
1369
+
1370
+ .fadeOutDown {
1371
+ -webkit-animation-name: fadeOutDown;
1372
+ animation-name: fadeOutDown;
1373
+ }
1374
+
1375
+ @-webkit-keyframes fadeOutDownBig {
1376
+ 0% {
1377
+ opacity: 1;
1378
+ }
1379
+
1380
+ 100% {
1381
+ opacity: 0;
1382
+ -webkit-transform: translate3d(0, 2000px, 0);
1383
+ transform: translate3d(0, 2000px, 0);
1384
+ }
1385
+ }
1386
+
1387
+ @keyframes fadeOutDownBig {
1388
+ 0% {
1389
+ opacity: 1;
1390
+ }
1391
+
1392
+ 100% {
1393
+ opacity: 0;
1394
+ -webkit-transform: translate3d(0, 2000px, 0);
1395
+ transform: translate3d(0, 2000px, 0);
1396
+ }
1397
+ }
1398
+
1399
+ .fadeOutDownBig {
1400
+ -webkit-animation-name: fadeOutDownBig;
1401
+ animation-name: fadeOutDownBig;
1402
+ }
1403
+
1404
+ @-webkit-keyframes fadeOutLeft {
1405
+ 0% {
1406
+ opacity: 1;
1407
+ }
1408
+
1409
+ 100% {
1410
+ opacity: 0;
1411
+ -webkit-transform: translate3d(-100%, 0, 0);
1412
+ transform: translate3d(-100%, 0, 0);
1413
+ }
1414
+ }
1415
+
1416
+ @keyframes fadeOutLeft {
1417
+ 0% {
1418
+ opacity: 1;
1419
+ }
1420
+
1421
+ 100% {
1422
+ opacity: 0;
1423
+ -webkit-transform: translate3d(-100%, 0, 0);
1424
+ transform: translate3d(-100%, 0, 0);
1425
+ }
1426
+ }
1427
+
1428
+ .fadeOutLeft {
1429
+ -webkit-animation-name: fadeOutLeft;
1430
+ animation-name: fadeOutLeft;
1431
+ }
1432
+
1433
+ @-webkit-keyframes fadeOutLeftBig {
1434
+ 0% {
1435
+ opacity: 1;
1436
+ }
1437
+
1438
+ 100% {
1439
+ opacity: 0;
1440
+ -webkit-transform: translate3d(-2000px, 0, 0);
1441
+ transform: translate3d(-2000px, 0, 0);
1442
+ }
1443
+ }
1444
+
1445
+ @keyframes fadeOutLeftBig {
1446
+ 0% {
1447
+ opacity: 1;
1448
+ }
1449
+
1450
+ 100% {
1451
+ opacity: 0;
1452
+ -webkit-transform: translate3d(-2000px, 0, 0);
1453
+ transform: translate3d(-2000px, 0, 0);
1454
+ }
1455
+ }
1456
+
1457
+ .fadeOutLeftBig {
1458
+ -webkit-animation-name: fadeOutLeftBig;
1459
+ animation-name: fadeOutLeftBig;
1460
+ }
1461
+
1462
+ @-webkit-keyframes fadeOutRight {
1463
+ 0% {
1464
+ opacity: 1;
1465
+ }
1466
+
1467
+ 100% {
1468
+ opacity: 0;
1469
+ -webkit-transform: translate3d(100%, 0, 0);
1470
+ transform: translate3d(100%, 0, 0);
1471
+ }
1472
+ }
1473
+
1474
+ @keyframes fadeOutRight {
1475
+ 0% {
1476
+ opacity: 1;
1477
+ }
1478
+
1479
+ 100% {
1480
+ opacity: 0;
1481
+ -webkit-transform: translate3d(100%, 0, 0);
1482
+ transform: translate3d(100%, 0, 0);
1483
+ }
1484
+ }
1485
+
1486
+ .fadeOutRight {
1487
+ -webkit-animation-name: fadeOutRight;
1488
+ animation-name: fadeOutRight;
1489
+ }
1490
+
1491
+ @-webkit-keyframes fadeOutRightBig {
1492
+ 0% {
1493
+ opacity: 1;
1494
+ }
1495
+
1496
+ 100% {
1497
+ opacity: 0;
1498
+ -webkit-transform: translate3d(2000px, 0, 0);
1499
+ transform: translate3d(2000px, 0, 0);
1500
+ }
1501
+ }
1502
+
1503
+ @keyframes fadeOutRightBig {
1504
+ 0% {
1505
+ opacity: 1;
1506
+ }
1507
+
1508
+ 100% {
1509
+ opacity: 0;
1510
+ -webkit-transform: translate3d(2000px, 0, 0);
1511
+ transform: translate3d(2000px, 0, 0);
1512
+ }
1513
+ }
1514
+
1515
+ .fadeOutRightBig {
1516
+ -webkit-animation-name: fadeOutRightBig;
1517
+ animation-name: fadeOutRightBig;
1518
+ }
1519
+
1520
+ @-webkit-keyframes fadeOutUp {
1521
+ 0% {
1522
+ opacity: 1;
1523
+ }
1524
+
1525
+ 100% {
1526
+ opacity: 0;
1527
+ -webkit-transform: translate3d(0, -100%, 0);
1528
+ transform: translate3d(0, -100%, 0);
1529
+ }
1530
+ }
1531
+
1532
+ @keyframes fadeOutUp {
1533
+ 0% {
1534
+ opacity: 1;
1535
+ }
1536
+
1537
+ 100% {
1538
+ opacity: 0;
1539
+ -webkit-transform: translate3d(0, -100%, 0);
1540
+ transform: translate3d(0, -100%, 0);
1541
+ }
1542
+ }
1543
+
1544
+ .fadeOutUp {
1545
+ -webkit-animation-name: fadeOutUp;
1546
+ animation-name: fadeOutUp;
1547
+ }
1548
+
1549
+ @-webkit-keyframes fadeOutUpBig {
1550
+ 0% {
1551
+ opacity: 1;
1552
+ }
1553
+
1554
+ 100% {
1555
+ opacity: 0;
1556
+ -webkit-transform: translate3d(0, -2000px, 0);
1557
+ transform: translate3d(0, -2000px, 0);
1558
+ }
1559
+ }
1560
+
1561
+ @keyframes fadeOutUpBig {
1562
+ 0% {
1563
+ opacity: 1;
1564
+ }
1565
+
1566
+ 100% {
1567
+ opacity: 0;
1568
+ -webkit-transform: translate3d(0, -2000px, 0);
1569
+ transform: translate3d(0, -2000px, 0);
1570
+ }
1571
+ }
1572
+
1573
+ .fadeOutUpBig {
1574
+ -webkit-animation-name: fadeOutUpBig;
1575
+ animation-name: fadeOutUpBig;
1576
+ }
1577
+
1578
+ @-webkit-keyframes flip {
1579
+ 0% {
1580
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1581
+ transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1582
+ -webkit-animation-timing-function: ease-out;
1583
+ animation-timing-function: ease-out;
1584
+ }
1585
+
1586
+ 40% {
1587
+ -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1588
+ transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1589
+ -webkit-animation-timing-function: ease-out;
1590
+ animation-timing-function: ease-out;
1591
+ }
1592
+
1593
+ 50% {
1594
+ -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1595
+ transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1596
+ -webkit-animation-timing-function: ease-in;
1597
+ animation-timing-function: ease-in;
1598
+ }
1599
+
1600
+ 80% {
1601
+ -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
1602
+ transform: perspective(400px) scale3d(.95, .95, .95);
1603
+ -webkit-animation-timing-function: ease-in;
1604
+ animation-timing-function: ease-in;
1605
+ }
1606
+
1607
+ 100% {
1608
+ -webkit-transform: perspective(400px);
1609
+ transform: perspective(400px);
1610
+ -webkit-animation-timing-function: ease-in;
1611
+ animation-timing-function: ease-in;
1612
+ }
1613
+ }
1614
+
1615
+ @keyframes flip {
1616
+ 0% {
1617
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1618
+ transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1619
+ -webkit-animation-timing-function: ease-out;
1620
+ animation-timing-function: ease-out;
1621
+ }
1622
+
1623
+ 40% {
1624
+ -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1625
+ transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1626
+ -webkit-animation-timing-function: ease-out;
1627
+ animation-timing-function: ease-out;
1628
+ }
1629
+
1630
+ 50% {
1631
+ -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1632
+ transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1633
+ -webkit-animation-timing-function: ease-in;
1634
+ animation-timing-function: ease-in;
1635
+ }
1636
+
1637
+ 80% {
1638
+ -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
1639
+ transform: perspective(400px) scale3d(.95, .95, .95);
1640
+ -webkit-animation-timing-function: ease-in;
1641
+ animation-timing-function: ease-in;
1642
+ }
1643
+
1644
+ 100% {
1645
+ -webkit-transform: perspective(400px);
1646
+ transform: perspective(400px);
1647
+ -webkit-animation-timing-function: ease-in;
1648
+ animation-timing-function: ease-in;
1649
+ }
1650
+ }
1651
+
1652
+ .animated.flip {
1653
+ -webkit-backface-visibility: visible;
1654
+ backface-visibility: visible;
1655
+ -webkit-animation-name: flip;
1656
+ animation-name: flip;
1657
+ }
1658
+
1659
+ @-webkit-keyframes flipInX {
1660
+ 0% {
1661
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1662
+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1663
+ -webkit-transition-timing-function: ease-in;
1664
+ transition-timing-function: ease-in;
1665
+ opacity: 0;
1666
+ }
1667
+
1668
+ 40% {
1669
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1670
+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1671
+ -webkit-transition-timing-function: ease-in;
1672
+ transition-timing-function: ease-in;
1673
+ }
1674
+
1675
+ 60% {
1676
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1677
+ transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1678
+ opacity: 1;
1679
+ }
1680
+
1681
+ 80% {
1682
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
1683
+ transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
1684
+ }
1685
+
1686
+ 100% {
1687
+ -webkit-transform: perspective(400px);
1688
+ transform: perspective(400px);
1689
+ }
1690
+ }
1691
+
1692
+ @keyframes flipInX {
1693
+ 0% {
1694
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1695
+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1696
+ -webkit-transition-timing-function: ease-in;
1697
+ transition-timing-function: ease-in;
1698
+ opacity: 0;
1699
+ }
1700
+
1701
+ 40% {
1702
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1703
+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1704
+ -webkit-transition-timing-function: ease-in;
1705
+ transition-timing-function: ease-in;
1706
+ }
1707
+
1708
+ 60% {
1709
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1710
+ transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1711
+ opacity: 1;
1712
+ }
1713
+
1714
+ 80% {
1715
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
1716
+ transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
1717
+ }
1718
+
1719
+ 100% {
1720
+ -webkit-transform: perspective(400px);
1721
+ transform: perspective(400px);
1722
+ }
1723
+ }
1724
+
1725
+ .flipInX {
1726
+ -webkit-backface-visibility: visible !important;
1727
+ backface-visibility: visible !important;
1728
+ -webkit-animation-name: flipInX;
1729
+ animation-name: flipInX;
1730
+ }
1731
+
1732
+ @-webkit-keyframes flipInY {
1733
+ 0% {
1734
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1735
+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1736
+ -webkit-transition-timing-function: ease-in;
1737
+ transition-timing-function: ease-in;
1738
+ opacity: 0;
1739
+ }
1740
+
1741
+ 40% {
1742
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1743
+ transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1744
+ -webkit-transition-timing-function: ease-in;
1745
+ transition-timing-function: ease-in;
1746
+ }
1747
+
1748
+ 60% {
1749
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1750
+ transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1751
+ opacity: 1;
1752
+ }
1753
+
1754
+ 80% {
1755
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
1756
+ transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
1757
+ }
1758
+
1759
+ 100% {
1760
+ -webkit-transform: perspective(400px);
1761
+ transform: perspective(400px);
1762
+ }
1763
+ }
1764
+
1765
+ @keyframes flipInY {
1766
+ 0% {
1767
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1768
+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1769
+ -webkit-transition-timing-function: ease-in;
1770
+ transition-timing-function: ease-in;
1771
+ opacity: 0;
1772
+ }
1773
+
1774
+ 40% {
1775
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1776
+ transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1777
+ -webkit-transition-timing-function: ease-in;
1778
+ transition-timing-function: ease-in;
1779
+ }
1780
+
1781
+ 60% {
1782
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1783
+ transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1784
+ opacity: 1;
1785
+ }
1786
+
1787
+ 80% {
1788
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
1789
+ transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
1790
+ }
1791
+
1792
+ 100% {
1793
+ -webkit-transform: perspective(400px);
1794
+ transform: perspective(400px);
1795
+ }
1796
+ }
1797
+
1798
+ .flipInY {
1799
+ -webkit-backface-visibility: visible !important;
1800
+ backface-visibility: visible !important;
1801
+ -webkit-animation-name: flipInY;
1802
+ animation-name: flipInY;
1803
+ }
1804
+
1805
+ @-webkit-keyframes flipOutX {
1806
+ 0% {
1807
+ -webkit-transform: perspective(400px);
1808
+ transform: perspective(400px);
1809
+ }
1810
+
1811
+ 30% {
1812
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1813
+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1814
+ opacity: 1;
1815
+ }
1816
+
1817
+ 100% {
1818
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1819
+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1820
+ opacity: 0;
1821
+ }
1822
+ }
1823
+
1824
+ @keyframes flipOutX {
1825
+ 0% {
1826
+ -webkit-transform: perspective(400px);
1827
+ transform: perspective(400px);
1828
+ }
1829
+
1830
+ 30% {
1831
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1832
+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1833
+ opacity: 1;
1834
+ }
1835
+
1836
+ 100% {
1837
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1838
+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1839
+ opacity: 0;
1840
+ }
1841
+ }
1842
+
1843
+ .flipOutX {
1844
+ -webkit-animation-name: flipOutX;
1845
+ animation-name: flipOutX;
1846
+ -webkit-animation-duration: .75s;
1847
+ animation-duration: .75s;
1848
+ -webkit-backface-visibility: visible !important;
1849
+ backface-visibility: visible !important;
1850
+ }
1851
+
1852
+ @-webkit-keyframes flipOutY {
1853
+ 0% {
1854
+ -webkit-transform: perspective(400px);
1855
+ transform: perspective(400px);
1856
+ }
1857
+
1858
+ 30% {
1859
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1860
+ transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1861
+ opacity: 1;
1862
+ }
1863
+
1864
+ 100% {
1865
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1866
+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1867
+ opacity: 0;
1868
+ }
1869
+ }
1870
+
1871
+ @keyframes flipOutY {
1872
+ 0% {
1873
+ -webkit-transform: perspective(400px);
1874
+ transform: perspective(400px);
1875
+ }
1876
+
1877
+ 30% {
1878
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1879
+ transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1880
+ opacity: 1;
1881
+ }
1882
+
1883
+ 100% {
1884
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1885
+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1886
+ opacity: 0;
1887
+ }
1888
+ }
1889
+
1890
+ .flipOutY {
1891
+ -webkit-backface-visibility: visible !important;
1892
+ backface-visibility: visible !important;
1893
+ -webkit-animation-name: flipOutY;
1894
+ animation-name: flipOutY;
1895
+ -webkit-animation-duration: .75s;
1896
+ animation-duration: .75s;
1897
+ }
1898
+
1899
+ @-webkit-keyframes lightSpeedIn {
1900
+ 0% {
1901
+ -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
1902
+ transform: translate3d(100%, 0, 0) skewX(-30deg);
1903
+ opacity: 0;
1904
+ }
1905
+
1906
+ 60% {
1907
+ -webkit-transform: skewX(20deg);
1908
+ transform: skewX(20deg);
1909
+ opacity: 1;
1910
+ }
1911
+
1912
+ 80% {
1913
+ -webkit-transform: skewX(-5deg);
1914
+ transform: skewX(-5deg);
1915
+ opacity: 1;
1916
+ }
1917
+
1918
+ 100% {
1919
+ -webkit-transform: none;
1920
+ transform: none;
1921
+ opacity: 1;
1922
+ }
1923
+ }
1924
+
1925
+ @keyframes lightSpeedIn {
1926
+ 0% {
1927
+ -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
1928
+ transform: translate3d(100%, 0, 0) skewX(-30deg);
1929
+ opacity: 0;
1930
+ }
1931
+
1932
+ 60% {
1933
+ -webkit-transform: skewX(20deg);
1934
+ transform: skewX(20deg);
1935
+ opacity: 1;
1936
+ }
1937
+
1938
+ 80% {
1939
+ -webkit-transform: skewX(-5deg);
1940
+ transform: skewX(-5deg);
1941
+ opacity: 1;
1942
+ }
1943
+
1944
+ 100% {
1945
+ -webkit-transform: none;
1946
+ transform: none;
1947
+ opacity: 1;
1948
+ }
1949
+ }
1950
+
1951
+ .lightSpeedIn {
1952
+ -webkit-animation-name: lightSpeedIn;
1953
+ animation-name: lightSpeedIn;
1954
+ -webkit-animation-timing-function: ease-out;
1955
+ animation-timing-function: ease-out;
1956
+ }
1957
+
1958
+ @-webkit-keyframes lightSpeedOut {
1959
+ 0% {
1960
+ opacity: 1;
1961
+ }
1962
+
1963
+ 100% {
1964
+ -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
1965
+ transform: translate3d(100%, 0, 0) skewX(30deg);
1966
+ opacity: 0;
1967
+ }
1968
+ }
1969
+
1970
+ @keyframes lightSpeedOut {
1971
+ 0% {
1972
+ opacity: 1;
1973
+ }
1974
+
1975
+ 100% {
1976
+ -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
1977
+ transform: translate3d(100%, 0, 0) skewX(30deg);
1978
+ opacity: 0;
1979
+ }
1980
+ }
1981
+
1982
+ .lightSpeedOut {
1983
+ -webkit-animation-name: lightSpeedOut;
1984
+ animation-name: lightSpeedOut;
1985
+ -webkit-animation-timing-function: ease-in;
1986
+ animation-timing-function: ease-in;
1987
+ }
1988
+
1989
+ @-webkit-keyframes rotateIn {
1990
+ 0% {
1991
+ -webkit-transform-origin: center;
1992
+ transform-origin: center;
1993
+ -webkit-transform: rotate3d(0, 0, 1, -200deg);
1994
+ transform: rotate3d(0, 0, 1, -200deg);
1995
+ opacity: 0;
1996
+ }
1997
+
1998
+ 100% {
1999
+ -webkit-transform-origin: center;
2000
+ transform-origin: center;
2001
+ -webkit-transform: none;
2002
+ transform: none;
2003
+ opacity: 1;
2004
+ }
2005
+ }
2006
+
2007
+ @keyframes rotateIn {
2008
+ 0% {
2009
+ -webkit-transform-origin: center;
2010
+ transform-origin: center;
2011
+ -webkit-transform: rotate3d(0, 0, 1, -200deg);
2012
+ transform: rotate3d(0, 0, 1, -200deg);
2013
+ opacity: 0;
2014
+ }
2015
+
2016
+ 100% {
2017
+ -webkit-transform-origin: center;
2018
+ transform-origin: center;
2019
+ -webkit-transform: none;
2020
+ transform: none;
2021
+ opacity: 1;
2022
+ }
2023
+ }
2024
+
2025
+ .rotateIn {
2026
+ -webkit-animation-name: rotateIn;
2027
+ animation-name: rotateIn;
2028
+ }
2029
+
2030
+ @-webkit-keyframes rotateInDownLeft {
2031
+ 0% {
2032
+ -webkit-transform-origin: left bottom;
2033
+ transform-origin: left bottom;
2034
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
2035
+ transform: rotate3d(0, 0, 1, -45deg);
2036
+ opacity: 0;
2037
+ }
2038
+
2039
+ 100% {
2040
+ -webkit-transform-origin: left bottom;
2041
+ transform-origin: left bottom;
2042
+ -webkit-transform: none;
2043
+ transform: none;
2044
+ opacity: 1;
2045
+ }
2046
+ }
2047
+
2048
+ @keyframes rotateInDownLeft {
2049
+ 0% {
2050
+ -webkit-transform-origin: left bottom;
2051
+ transform-origin: left bottom;
2052
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
2053
+ transform: rotate3d(0, 0, 1, -45deg);
2054
+ opacity: 0;
2055
+ }
2056
+
2057
+ 100% {
2058
+ -webkit-transform-origin: left bottom;
2059
+ transform-origin: left bottom;
2060
+ -webkit-transform: none;
2061
+ transform: none;
2062
+ opacity: 1;
2063
+ }
2064
+ }
2065
+
2066
+ .rotateInDownLeft {
2067
+ -webkit-animation-name: rotateInDownLeft;
2068
+ animation-name: rotateInDownLeft;
2069
+ }
2070
+
2071
+ @-webkit-keyframes rotateInDownRight {
2072
+ 0% {
2073
+ -webkit-transform-origin: right bottom;
2074
+ transform-origin: right bottom;
2075
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
2076
+ transform: rotate3d(0, 0, 1, 45deg);
2077
+ opacity: 0;
2078
+ }
2079
+
2080
+ 100% {
2081
+ -webkit-transform-origin: right bottom;
2082
+ transform-origin: right bottom;
2083
+ -webkit-transform: none;
2084
+ transform: none;
2085
+ opacity: 1;
2086
+ }
2087
+ }
2088
+
2089
+ @keyframes rotateInDownRight {
2090
+ 0% {
2091
+ -webkit-transform-origin: right bottom;
2092
+ transform-origin: right bottom;
2093
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
2094
+ transform: rotate3d(0, 0, 1, 45deg);
2095
+ opacity: 0;
2096
+ }
2097
+
2098
+ 100% {
2099
+ -webkit-transform-origin: right bottom;
2100
+ transform-origin: right bottom;
2101
+ -webkit-transform: none;
2102
+ transform: none;
2103
+ opacity: 1;
2104
+ }
2105
+ }
2106
+
2107
+ .rotateInDownRight {
2108
+ -webkit-animation-name: rotateInDownRight;
2109
+ animation-name: rotateInDownRight;
2110
+ }
2111
+
2112
+ @-webkit-keyframes rotateInUpLeft {
2113
+ 0% {
2114
+ -webkit-transform-origin: left bottom;
2115
+ transform-origin: left bottom;
2116
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
2117
+ transform: rotate3d(0, 0, 1, 45deg);
2118
+ opacity: 0;
2119
+ }
2120
+
2121
+ 100% {
2122
+ -webkit-transform-origin: left bottom;
2123
+ transform-origin: left bottom;
2124
+ -webkit-transform: none;
2125
+ transform: none;
2126
+ opacity: 1;
2127
+ }
2128
+ }
2129
+
2130
+ @keyframes rotateInUpLeft {
2131
+ 0% {
2132
+ -webkit-transform-origin: left bottom;
2133
+ transform-origin: left bottom;
2134
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
2135
+ transform: rotate3d(0, 0, 1, 45deg);
2136
+ opacity: 0;
2137
+ }
2138
+
2139
+ 100% {
2140
+ -webkit-transform-origin: left bottom;
2141
+ transform-origin: left bottom;
2142
+ -webkit-transform: none;
2143
+ transform: none;
2144
+ opacity: 1;
2145
+ }
2146
+ }
2147
+
2148
+ .rotateInUpLeft {
2149
+ -webkit-animation-name: rotateInUpLeft;
2150
+ animation-name: rotateInUpLeft;
2151
+ }
2152
+
2153
+ @-webkit-keyframes rotateInUpRight {
2154
+ 0% {
2155
+ -webkit-transform-origin: right bottom;
2156
+ transform-origin: right bottom;
2157
+ -webkit-transform: rotate3d(0, 0, 1, -90deg);
2158
+ transform: rotate3d(0, 0, 1, -90deg);
2159
+ opacity: 0;
2160
+ }
2161
+
2162
+ 100% {
2163
+ -webkit-transform-origin: right bottom;
2164
+ transform-origin: right bottom;
2165
+ -webkit-transform: none;
2166
+ transform: none;
2167
+ opacity: 1;
2168
+ }
2169
+ }
2170
+
2171
+ @keyframes rotateInUpRight {
2172
+ 0% {
2173
+ -webkit-transform-origin: right bottom;
2174
+ transform-origin: right bottom;
2175
+ -webkit-transform: rotate3d(0, 0, 1, -90deg);
2176
+ transform: rotate3d(0, 0, 1, -90deg);
2177
+ opacity: 0;
2178
+ }
2179
+
2180
+ 100% {
2181
+ -webkit-transform-origin: right bottom;
2182
+ transform-origin: right bottom;
2183
+ -webkit-transform: none;
2184
+ transform: none;
2185
+ opacity: 1;
2186
+ }
2187
+ }
2188
+
2189
+ .rotateInUpRight {
2190
+ -webkit-animation-name: rotateInUpRight;
2191
+ animation-name: rotateInUpRight;
2192
+ }
2193
+
2194
+ @-webkit-keyframes rotateOut {
2195
+ 0% {
2196
+ -webkit-transform-origin: center;
2197
+ transform-origin: center;
2198
+ opacity: 1;
2199
+ }
2200
+
2201
+ 100% {
2202
+ -webkit-transform-origin: center;
2203
+ transform-origin: center;
2204
+ -webkit-transform: rotate3d(0, 0, 1, 200deg);
2205
+ transform: rotate3d(0, 0, 1, 200deg);
2206
+ opacity: 0;
2207
+ }
2208
+ }
2209
+
2210
+ @keyframes rotateOut {
2211
+ 0% {
2212
+ -webkit-transform-origin: center;
2213
+ transform-origin: center;
2214
+ opacity: 1;
2215
+ }
2216
+
2217
+ 100% {
2218
+ -webkit-transform-origin: center;
2219
+ transform-origin: center;
2220
+ -webkit-transform: rotate3d(0, 0, 1, 200deg);
2221
+ transform: rotate3d(0, 0, 1, 200deg);
2222
+ opacity: 0;
2223
+ }
2224
+ }
2225
+
2226
+ .rotateOut {
2227
+ -webkit-animation-name: rotateOut;
2228
+ animation-name: rotateOut;
2229
+ }
2230
+
2231
+ @-webkit-keyframes rotateOutDownLeft {
2232
+ 0% {
2233
+ -webkit-transform-origin: left bottom;
2234
+ transform-origin: left bottom;
2235
+ opacity: 1;
2236
+ }
2237
+
2238
+ 100% {
2239
+ -webkit-transform-origin: left bottom;
2240
+ transform-origin: left bottom;
2241
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
2242
+ transform: rotate3d(0, 0, 1, 45deg);
2243
+ opacity: 0;
2244
+ }
2245
+ }
2246
+
2247
+ @keyframes rotateOutDownLeft {
2248
+ 0% {
2249
+ -webkit-transform-origin: left bottom;
2250
+ transform-origin: left bottom;
2251
+ opacity: 1;
2252
+ }
2253
+
2254
+ 100% {
2255
+ -webkit-transform-origin: left bottom;
2256
+ transform-origin: left bottom;
2257
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
2258
+ transform: rotate3d(0, 0, 1, 45deg);
2259
+ opacity: 0;
2260
+ }
2261
+ }
2262
+
2263
+ .rotateOutDownLeft {
2264
+ -webkit-animation-name: rotateOutDownLeft;
2265
+ animation-name: rotateOutDownLeft;
2266
+ }
2267
+
2268
+ @-webkit-keyframes rotateOutDownRight {
2269
+ 0% {
2270
+ -webkit-transform-origin: right bottom;
2271
+ transform-origin: right bottom;
2272
+ opacity: 1;
2273
+ }
2274
+
2275
+ 100% {
2276
+ -webkit-transform-origin: right bottom;
2277
+ transform-origin: right bottom;
2278
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
2279
+ transform: rotate3d(0, 0, 1, -45deg);
2280
+ opacity: 0;
2281
+ }
2282
+ }
2283
+
2284
+ @keyframes rotateOutDownRight {
2285
+ 0% {
2286
+ -webkit-transform-origin: right bottom;
2287
+ transform-origin: right bottom;
2288
+ opacity: 1;
2289
+ }
2290
+
2291
+ 100% {
2292
+ -webkit-transform-origin: right bottom;
2293
+ transform-origin: right bottom;
2294
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
2295
+ transform: rotate3d(0, 0, 1, -45deg);
2296
+ opacity: 0;
2297
+ }
2298
+ }
2299
+
2300
+ .rotateOutDownRight {
2301
+ -webkit-animation-name: rotateOutDownRight;
2302
+ animation-name: rotateOutDownRight;
2303
+ }
2304
+
2305
+ @-webkit-keyframes rotateOutUpLeft {
2306
+ 0% {
2307
+ -webkit-transform-origin: left bottom;
2308
+ transform-origin: left bottom;
2309
+ opacity: 1;
2310
+ }
2311
+
2312
+ 100% {
2313
+ -webkit-transform-origin: left bottom;
2314
+ transform-origin: left bottom;
2315
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
2316
+ transform: rotate3d(0, 0, 1, -45deg);
2317
+ opacity: 0;
2318
+ }
2319
+ }
2320
+
2321
+ @keyframes rotateOutUpLeft {
2322
+ 0% {
2323
+ -webkit-transform-origin: left bottom;
2324
+ transform-origin: left bottom;
2325
+ opacity: 1;
2326
+ }
2327
+
2328
+ 100% {
2329
+ -webkit-transform-origin: left bottom;
2330
+ transform-origin: left bottom;
2331
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
2332
+ transform: rotate3d(0, 0, 1, -45deg);
2333
+ opacity: 0;
2334
+ }
2335
+ }
2336
+
2337
+ .rotateOutUpLeft {
2338
+ -webkit-animation-name: rotateOutUpLeft;
2339
+ animation-name: rotateOutUpLeft;
2340
+ }
2341
+
2342
+ @-webkit-keyframes rotateOutUpRight {
2343
+ 0% {
2344
+ -webkit-transform-origin: right bottom;
2345
+ transform-origin: right bottom;
2346
+ opacity: 1;
2347
+ }
2348
+
2349
+ 100% {
2350
+ -webkit-transform-origin: right bottom;
2351
+ transform-origin: right bottom;
2352
+ -webkit-transform: rotate3d(0, 0, 1, 90deg);
2353
+ transform: rotate3d(0, 0, 1, 90deg);
2354
+ opacity: 0;
2355
+ }
2356
+ }
2357
+
2358
+ @keyframes rotateOutUpRight {
2359
+ 0% {
2360
+ -webkit-transform-origin: right bottom;
2361
+ transform-origin: right bottom;
2362
+ opacity: 1;
2363
+ }
2364
+
2365
+ 100% {
2366
+ -webkit-transform-origin: right bottom;
2367
+ transform-origin: right bottom;
2368
+ -webkit-transform: rotate3d(0, 0, 1, 90deg);
2369
+ transform: rotate3d(0, 0, 1, 90deg);
2370
+ opacity: 0;
2371
+ }
2372
+ }
2373
+
2374
+ .rotateOutUpRight {
2375
+ -webkit-animation-name: rotateOutUpRight;
2376
+ animation-name: rotateOutUpRight;
2377
+ }
2378
+
2379
+ @-webkit-keyframes hinge {
2380
+ 0% {
2381
+ -webkit-transform-origin: top left;
2382
+ transform-origin: top left;
2383
+ -webkit-animation-timing-function: ease-in-out;
2384
+ animation-timing-function: ease-in-out;
2385
+ }
2386
+
2387
+ 20%, 60% {
2388
+ -webkit-transform: rotate3d(0, 0, 1, 80deg);
2389
+ transform: rotate3d(0, 0, 1, 80deg);
2390
+ -webkit-transform-origin: top left;
2391
+ transform-origin: top left;
2392
+ -webkit-animation-timing-function: ease-in-out;
2393
+ animation-timing-function: ease-in-out;
2394
+ }
2395
+
2396
+ 40%, 80% {
2397
+ -webkit-transform: rotate3d(0, 0, 1, 60deg);
2398
+ transform: rotate3d(0, 0, 1, 60deg);
2399
+ -webkit-transform-origin: top left;
2400
+ transform-origin: top left;
2401
+ -webkit-animation-timing-function: ease-in-out;
2402
+ animation-timing-function: ease-in-out;
2403
+ opacity: 1;
2404
+ }
2405
+
2406
+ 100% {
2407
+ -webkit-transform: translate3d(0, 700px, 0);
2408
+ transform: translate3d(0, 700px, 0);
2409
+ opacity: 0;
2410
+ }
2411
+ }
2412
+
2413
+ @keyframes hinge {
2414
+ 0% {
2415
+ -webkit-transform-origin: top left;
2416
+ transform-origin: top left;
2417
+ -webkit-animation-timing-function: ease-in-out;
2418
+ animation-timing-function: ease-in-out;
2419
+ }
2420
+
2421
+ 20%, 60% {
2422
+ -webkit-transform: rotate3d(0, 0, 1, 80deg);
2423
+ transform: rotate3d(0, 0, 1, 80deg);
2424
+ -webkit-transform-origin: top left;
2425
+ transform-origin: top left;
2426
+ -webkit-animation-timing-function: ease-in-out;
2427
+ animation-timing-function: ease-in-out;
2428
+ }
2429
+
2430
+ 40%, 80% {
2431
+ -webkit-transform: rotate3d(0, 0, 1, 60deg);
2432
+ transform: rotate3d(0, 0, 1, 60deg);
2433
+ -webkit-transform-origin: top left;
2434
+ transform-origin: top left;
2435
+ -webkit-animation-timing-function: ease-in-out;
2436
+ animation-timing-function: ease-in-out;
2437
+ opacity: 1;
2438
+ }
2439
+
2440
+ 100% {
2441
+ -webkit-transform: translate3d(0, 700px, 0);
2442
+ transform: translate3d(0, 700px, 0);
2443
+ opacity: 0;
2444
+ }
2445
+ }
2446
+
2447
+ .hinge {
2448
+ -webkit-animation-name: hinge;
2449
+ animation-name: hinge;
2450
+ }
2451
+
2452
+ /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
2453
+
2454
+ @-webkit-keyframes rollIn {
2455
+ 0% {
2456
+ opacity: 0;
2457
+ -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
2458
+ transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
2459
+ }
2460
+
2461
+ 100% {
2462
+ opacity: 1;
2463
+ -webkit-transform: none;
2464
+ transform: none;
2465
+ }
2466
+ }
2467
+
2468
+ @keyframes rollIn {
2469
+ 0% {
2470
+ opacity: 0;
2471
+ -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
2472
+ transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
2473
+ }
2474
+
2475
+ 100% {
2476
+ opacity: 1;
2477
+ -webkit-transform: none;
2478
+ transform: none;
2479
+ }
2480
+ }
2481
+
2482
+ .rollIn {
2483
+ -webkit-animation-name: rollIn;
2484
+ animation-name: rollIn;
2485
+ }
2486
+
2487
+ /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
2488
+
2489
+ @-webkit-keyframes rollOut {
2490
+ 0% {
2491
+ opacity: 1;
2492
+ }
2493
+
2494
+ 100% {
2495
+ opacity: 0;
2496
+ -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
2497
+ transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
2498
+ }
2499
+ }
2500
+
2501
+ @keyframes rollOut {
2502
+ 0% {
2503
+ opacity: 1;
2504
+ }
2505
+
2506
+ 100% {
2507
+ opacity: 0;
2508
+ -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
2509
+ transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
2510
+ }
2511
+ }
2512
+
2513
+ .rollOut {
2514
+ -webkit-animation-name: rollOut;
2515
+ animation-name: rollOut;
2516
+ }
2517
+
2518
+ @-webkit-keyframes zoomIn {
2519
+ 0% {
2520
+ opacity: 0;
2521
+ -webkit-transform: scale3d(.3, .3, .3);
2522
+ transform: scale3d(.3, .3, .3);
2523
+ }
2524
+
2525
+ 50% {
2526
+ opacity: 1;
2527
+ }
2528
+ }
2529
+
2530
+ @keyframes zoomIn {
2531
+ 0% {
2532
+ opacity: 0;
2533
+ -webkit-transform: scale3d(.3, .3, .3);
2534
+ transform: scale3d(.3, .3, .3);
2535
+ }
2536
+
2537
+ 50% {
2538
+ opacity: 1;
2539
+ }
2540
+ }
2541
+
2542
+ .zoomIn {
2543
+ -webkit-animation-name: zoomIn;
2544
+ animation-name: zoomIn;
2545
+ }
2546
+
2547
+ @-webkit-keyframes zoomInDown {
2548
+ 0% {
2549
+ opacity: 0;
2550
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
2551
+ transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
2552
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2553
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2554
+ }
2555
+
2556
+ 60% {
2557
+ opacity: 1;
2558
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2559
+ transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2560
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2561
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2562
+ }
2563
+ }
2564
+
2565
+ @keyframes zoomInDown {
2566
+ 0% {
2567
+ opacity: 0;
2568
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
2569
+ transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
2570
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2571
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2572
+ }
2573
+
2574
+ 60% {
2575
+ opacity: 1;
2576
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2577
+ transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2578
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2579
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2580
+ }
2581
+ }
2582
+
2583
+ .zoomInDown {
2584
+ -webkit-animation-name: zoomInDown;
2585
+ animation-name: zoomInDown;
2586
+ }
2587
+
2588
+ @-webkit-keyframes zoomInLeft {
2589
+ 0% {
2590
+ opacity: 0;
2591
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
2592
+ transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
2593
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2594
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2595
+ }
2596
+
2597
+ 60% {
2598
+ opacity: 1;
2599
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
2600
+ transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
2601
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2602
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2603
+ }
2604
+ }
2605
+
2606
+ @keyframes zoomInLeft {
2607
+ 0% {
2608
+ opacity: 0;
2609
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
2610
+ transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
2611
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2612
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2613
+ }
2614
+
2615
+ 60% {
2616
+ opacity: 1;
2617
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
2618
+ transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
2619
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2620
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2621
+ }
2622
+ }
2623
+
2624
+ .zoomInLeft {
2625
+ -webkit-animation-name: zoomInLeft;
2626
+ animation-name: zoomInLeft;
2627
+ }
2628
+
2629
+ @-webkit-keyframes zoomInRight {
2630
+ 0% {
2631
+ opacity: 0;
2632
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
2633
+ transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
2634
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2635
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2636
+ }
2637
+
2638
+ 60% {
2639
+ opacity: 1;
2640
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
2641
+ transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
2642
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2643
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2644
+ }
2645
+ }
2646
+
2647
+ @keyframes zoomInRight {
2648
+ 0% {
2649
+ opacity: 0;
2650
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
2651
+ transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
2652
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2653
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2654
+ }
2655
+
2656
+ 60% {
2657
+ opacity: 1;
2658
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
2659
+ transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
2660
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2661
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2662
+ }
2663
+ }
2664
+
2665
+ .zoomInRight {
2666
+ -webkit-animation-name: zoomInRight;
2667
+ animation-name: zoomInRight;
2668
+ }
2669
+
2670
+ @-webkit-keyframes zoomInUp {
2671
+ 0% {
2672
+ opacity: 0;
2673
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
2674
+ transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
2675
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2676
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2677
+ }
2678
+
2679
+ 60% {
2680
+ opacity: 1;
2681
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2682
+ transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2683
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2684
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2685
+ }
2686
+ }
2687
+
2688
+ @keyframes zoomInUp {
2689
+ 0% {
2690
+ opacity: 0;
2691
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
2692
+ transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
2693
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2694
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2695
+ }
2696
+
2697
+ 60% {
2698
+ opacity: 1;
2699
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2700
+ transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2701
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2702
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2703
+ }
2704
+ }
2705
+
2706
+ .zoomInUp {
2707
+ -webkit-animation-name: zoomInUp;
2708
+ animation-name: zoomInUp;
2709
+ }
2710
+
2711
+ @-webkit-keyframes zoomOut {
2712
+ 0% {
2713
+ opacity: 1;
2714
+ }
2715
+
2716
+ 50% {
2717
+ opacity: 0;
2718
+ -webkit-transform: scale3d(.3, .3, .3);
2719
+ transform: scale3d(.3, .3, .3);
2720
+ }
2721
+
2722
+ 100% {
2723
+ opacity: 0;
2724
+ }
2725
+ }
2726
+
2727
+ @keyframes zoomOut {
2728
+ 0% {
2729
+ opacity: 1;
2730
+ }
2731
+
2732
+ 50% {
2733
+ opacity: 0;
2734
+ -webkit-transform: scale3d(.3, .3, .3);
2735
+ transform: scale3d(.3, .3, .3);
2736
+ }
2737
+
2738
+ 100% {
2739
+ opacity: 0;
2740
+ }
2741
+ }
2742
+
2743
+ .zoomOut {
2744
+ -webkit-animation-name: zoomOut;
2745
+ animation-name: zoomOut;
2746
+ }
2747
+
2748
+ @-webkit-keyframes zoomOutDown {
2749
+ 40% {
2750
+ opacity: 1;
2751
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2752
+ transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2753
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2754
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2755
+ }
2756
+
2757
+ 100% {
2758
+ opacity: 0;
2759
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
2760
+ transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
2761
+ -webkit-transform-origin: center bottom;
2762
+ transform-origin: center bottom;
2763
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2764
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2765
+ }
2766
+ }
2767
+
2768
+ @keyframes zoomOutDown {
2769
+ 40% {
2770
+ opacity: 1;
2771
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2772
+ transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2773
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2774
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2775
+ }
2776
+
2777
+ 100% {
2778
+ opacity: 0;
2779
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
2780
+ transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
2781
+ -webkit-transform-origin: center bottom;
2782
+ transform-origin: center bottom;
2783
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2784
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2785
+ }
2786
+ }
2787
+
2788
+ .zoomOutDown {
2789
+ -webkit-animation-name: zoomOutDown;
2790
+ animation-name: zoomOutDown;
2791
+ }
2792
+
2793
+ @-webkit-keyframes zoomOutLeft {
2794
+ 40% {
2795
+ opacity: 1;
2796
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
2797
+ transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
2798
+ }
2799
+
2800
+ 100% {
2801
+ opacity: 0;
2802
+ -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
2803
+ transform: scale(.1) translate3d(-2000px, 0, 0);
2804
+ -webkit-transform-origin: left center;
2805
+ transform-origin: left center;
2806
+ }
2807
+ }
2808
+
2809
+ @keyframes zoomOutLeft {
2810
+ 40% {
2811
+ opacity: 1;
2812
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
2813
+ transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
2814
+ }
2815
+
2816
+ 100% {
2817
+ opacity: 0;
2818
+ -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
2819
+ transform: scale(.1) translate3d(-2000px, 0, 0);
2820
+ -webkit-transform-origin: left center;
2821
+ transform-origin: left center;
2822
+ }
2823
+ }
2824
+
2825
+ .zoomOutLeft {
2826
+ -webkit-animation-name: zoomOutLeft;
2827
+ animation-name: zoomOutLeft;
2828
+ }
2829
+
2830
+ @-webkit-keyframes zoomOutRight {
2831
+ 40% {
2832
+ opacity: 1;
2833
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
2834
+ transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
2835
+ }
2836
+
2837
+ 100% {
2838
+ opacity: 0;
2839
+ -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
2840
+ transform: scale(.1) translate3d(2000px, 0, 0);
2841
+ -webkit-transform-origin: right center;
2842
+ transform-origin: right center;
2843
+ }
2844
+ }
2845
+
2846
+ @keyframes zoomOutRight {
2847
+ 40% {
2848
+ opacity: 1;
2849
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
2850
+ transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
2851
+ }
2852
+
2853
+ 100% {
2854
+ opacity: 0;
2855
+ -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
2856
+ transform: scale(.1) translate3d(2000px, 0, 0);
2857
+ -webkit-transform-origin: right center;
2858
+ transform-origin: right center;
2859
+ }
2860
+ }
2861
+
2862
+ .zoomOutRight {
2863
+ -webkit-animation-name: zoomOutRight;
2864
+ animation-name: zoomOutRight;
2865
+ }
2866
+
2867
+ @-webkit-keyframes zoomOutUp {
2868
+ 40% {
2869
+ opacity: 1;
2870
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2871
+ transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2872
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2873
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2874
+ }
2875
+
2876
+ 100% {
2877
+ opacity: 0;
2878
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
2879
+ transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
2880
+ -webkit-transform-origin: center bottom;
2881
+ transform-origin: center bottom;
2882
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2883
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2884
+ }
2885
+ }
2886
+
2887
+ @keyframes zoomOutUp {
2888
+ 40% {
2889
+ opacity: 1;
2890
+ -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2891
+ transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2892
+ -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2893
+ animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
2894
+ }
2895
+
2896
+ 100% {
2897
+ opacity: 0;
2898
+ -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
2899
+ transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
2900
+ -webkit-transform-origin: center bottom;
2901
+ transform-origin: center bottom;
2902
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2903
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
2904
+ }
2905
+ }
2906
+
2907
+ .zoomOutUp {
2908
+ -webkit-animation-name: zoomOutUp;
2909
+ animation-name: zoomOutUp;
2910
+ }
2911
+
2912
+ @-webkit-keyframes slideInDown {
2913
+ 0% {
2914
+ -webkit-transform: translateY(-100%);
2915
+ transform: translateY(-100%);
2916
+ visibility: visible;
2917
+ }
2918
+
2919
+ 100% {
2920
+ -webkit-transform: translateY(0);
2921
+ transform: translateY(0);
2922
+ }
2923
+ }
2924
+
2925
+ @keyframes slideInDown {
2926
+ 0% {
2927
+ -webkit-transform: translateY(-100%);
2928
+ transform: translateY(-100%);
2929
+ visibility: visible;
2930
+ }
2931
+
2932
+ 100% {
2933
+ -webkit-transform: translateY(0);
2934
+ transform: translateY(0);
2935
+ }
2936
+ }
2937
+
2938
+ .slideInDown {
2939
+ -webkit-animation-name: slideInDown;
2940
+ animation-name: slideInDown;
2941
+ }
2942
+
2943
+ @-webkit-keyframes slideInLeft {
2944
+ 0% {
2945
+ -webkit-transform: translateX(-100%);
2946
+ transform: translateX(-100%);
2947
+ visibility: visible;
2948
+ }
2949
+
2950
+ 100% {
2951
+ -webkit-transform: translateX(0);
2952
+ transform: translateX(0);
2953
+ }
2954
+ }
2955
+
2956
+ @keyframes slideInLeft {
2957
+ 0% {
2958
+ -webkit-transform: translateX(-100%);
2959
+ transform: translateX(-100%);
2960
+ visibility: visible;
2961
+ }
2962
+
2963
+ 100% {
2964
+ -webkit-transform: translateX(0);
2965
+ transform: translateX(0);
2966
+ }
2967
+ }
2968
+
2969
+ .slideInLeft {
2970
+ -webkit-animation-name: slideInLeft;
2971
+ animation-name: slideInLeft;
2972
+ }
2973
+
2974
+ @-webkit-keyframes slideInRight {
2975
+ 0% {
2976
+ -webkit-transform: translateX(100%);
2977
+ transform: translateX(100%);
2978
+ visibility: visible;
2979
+ }
2980
+
2981
+ 100% {
2982
+ -webkit-transform: translateX(0);
2983
+ transform: translateX(0);
2984
+ }
2985
+ }
2986
+
2987
+ @keyframes slideInRight {
2988
+ 0% {
2989
+ -webkit-transform: translateX(100%);
2990
+ transform: translateX(100%);
2991
+ visibility: visible;
2992
+ }
2993
+
2994
+ 100% {
2995
+ -webkit-transform: translateX(0);
2996
+ transform: translateX(0);
2997
+ }
2998
+ }
2999
+
3000
+ .slideInRight {
3001
+ -webkit-animation-name: slideInRight;
3002
+ animation-name: slideInRight;
3003
+ }
3004
+
3005
+ @-webkit-keyframes slideInUp {
3006
+ 0% {
3007
+ -webkit-transform: translateY(100%);
3008
+ transform: translateY(100%);
3009
+ visibility: visible;
3010
+ }
3011
+
3012
+ 100% {
3013
+ -webkit-transform: translateY(0);
3014
+ transform: translateY(0);
3015
+ }
3016
+ }
3017
+
3018
+ @keyframes slideInUp {
3019
+ 0% {
3020
+ -webkit-transform: translateY(100%);
3021
+ transform: translateY(100%);
3022
+ visibility: visible;
3023
+ }
3024
+
3025
+ 100% {
3026
+ -webkit-transform: translateY(0);
3027
+ transform: translateY(0);
3028
+ }
3029
+ }
3030
+
3031
+ .slideInUp {
3032
+ -webkit-animation-name: slideInUp;
3033
+ animation-name: slideInUp;
3034
+ }
3035
+
3036
+ @-webkit-keyframes slideOutDown {
3037
+ 0% {
3038
+ -webkit-transform: translateY(0);
3039
+ transform: translateY(0);
3040
+ }
3041
+
3042
+ 100% {
3043
+ visibility: hidden;
3044
+ -webkit-transform: translateY(100%);
3045
+ transform: translateY(100%);
3046
+ }
3047
+ }
3048
+
3049
+ @keyframes slideOutDown {
3050
+ 0% {
3051
+ -webkit-transform: translateY(0);
3052
+ transform: translateY(0);
3053
+ }
3054
+
3055
+ 100% {
3056
+ visibility: hidden;
3057
+ -webkit-transform: translateY(100%);
3058
+ transform: translateY(100%);
3059
+ }
3060
+ }
3061
+
3062
+ .slideOutDown {
3063
+ -webkit-animation-name: slideOutDown;
3064
+ animation-name: slideOutDown;
3065
+ }
3066
+
3067
+ @-webkit-keyframes slideOutLeft {
3068
+ 0% {
3069
+ -webkit-transform: translateX(0);
3070
+ transform: translateX(0);
3071
+ }
3072
+
3073
+ 100% {
3074
+ visibility: hidden;
3075
+ -webkit-transform: translateX(-100%);
3076
+ transform: translateX(-100%);
3077
+ }
3078
+ }
3079
+
3080
+ @keyframes slideOutLeft {
3081
+ 0% {
3082
+ -webkit-transform: translateX(0);
3083
+ transform: translateX(0);
3084
+ }
3085
+
3086
+ 100% {
3087
+ visibility: hidden;
3088
+ -webkit-transform: translateX(-100%);
3089
+ transform: translateX(-100%);
3090
+ }
3091
+ }
3092
+
3093
+ .slideOutLeft {
3094
+ -webkit-animation-name: slideOutLeft;
3095
+ animation-name: slideOutLeft;
3096
+ }
3097
+
3098
+ @-webkit-keyframes slideOutRight {
3099
+ 0% {
3100
+ -webkit-transform: translateX(0);
3101
+ transform: translateX(0);
3102
+ }
3103
+
3104
+ 100% {
3105
+ visibility: hidden;
3106
+ -webkit-transform: translateX(100%);
3107
+ transform: translateX(100%);
3108
+ }
3109
+ }
3110
+
3111
+ @keyframes slideOutRight {
3112
+ 0% {
3113
+ -webkit-transform: translateX(0);
3114
+ transform: translateX(0);
3115
+ }
3116
+
3117
+ 100% {
3118
+ visibility: hidden;
3119
+ -webkit-transform: translateX(100%);
3120
+ transform: translateX(100%);
3121
+ }
3122
+ }
3123
+
3124
+ .slideOutRight {
3125
+ -webkit-animation-name: slideOutRight;
3126
+ animation-name: slideOutRight;
3127
+ }
3128
+
3129
+ @-webkit-keyframes slideOutUp {
3130
+ 0% {
3131
+ -webkit-transform: translateY(0);
3132
+ transform: translateY(0);
3133
+ }
3134
+
3135
+ 100% {
3136
+ visibility: hidden;
3137
+ -webkit-transform: translateY(-100%);
3138
+ transform: translateY(-100%);
3139
+ }
3140
+ }
3141
+
3142
+ @keyframes slideOutUp {
3143
+ 0% {
3144
+ -webkit-transform: translateY(0);
3145
+ transform: translateY(0);
3146
+ }
3147
+
3148
+ 100% {
3149
+ visibility: hidden;
3150
+ -webkit-transform: translateY(-100%);
3151
+ transform: translateY(-100%);
3152
+ }
3153
+ }
3154
+
3155
+ .slideOutUp {
3156
+ -webkit-animation-name: slideOutUp;
3157
+ animation-name: slideOutUp;
3158
+ }