Countdown, Coming Soon – Countdown & Clock - Version 1.8.0

Version Description

  • Add sticky countdown to version
  • WooCommerce cuopon integration
Download this release

Release Info

Developer adamskaat
Plugin Icon 128x128 Countdown, Coming Soon – Countdown & Clock
Version 1.8.0
Comparing to
See all releases

Code changes from version 1.7.9 to 1.8.0

Files changed (19) hide show
  1. CountdownInit.php +108 -108
  2. assets/css/Css.php +90 -90
  3. assets/css/TimeCircles.css +2784 -2784
  4. assets/css/admin.css +745 -745
  5. assets/css/bootstrap.css +6845 -6845
  6. assets/css/jQueryDialog/jquery-ui.css +477 -477
  7. assets/css/jquery.dateTimePicker.min.css +1 -1
  8. assets/css/timer.css +44 -44
  9. assets/js/Admin.js +939 -939
  10. assets/js/Countdown.js +839 -821
  11. assets/js/Js.php +113 -113
  12. assets/js/Sticky.js +106 -0
  13. assets/js/TimeCircles.js +994 -994
  14. assets/js/YcdGeneral.js +86 -80
  15. assets/js/admin/WpCountdownBlock.js +139 -139
  16. assets/js/admin/WpCountdownBlockMin.js +140 -140
  17. assets/js/admin/ycd-tinymce-plugin.js +14 -14
  18. assets/js/clock/Clock.js +101 -101
  19. assets/js/clock/canvas_clock.js +1094 -1660
CountdownInit.php CHANGED
@@ -1,109 +1,109 @@
1
- <?php
2
- namespace ycd;
3
-
4
- class CountdownInit {
5
-
6
- private static $instance = null;
7
- private $actions;
8
- private $filters;
9
-
10
- private function __construct() {
11
- $this->init();
12
- }
13
-
14
- private function __clone() {
15
- }
16
-
17
- public static function getInstance() {
18
- if(!isset(self::$instance)) {
19
- self::$instance = new self();
20
- }
21
- return self::$instance;
22
- }
23
-
24
- public function init() {
25
- register_activation_hook(YCD_PREFIX, array($this, 'activate'));
26
- register_deactivation_hook(YCD_PREFIX, array($this, 'deactivate'));
27
- $this->includeData();
28
- $this->actions();
29
- $this->filters();
30
- }
31
-
32
- private function includeData() {
33
- if(YCD_PKG_VERSION > YCD_FREE_VERSION) {
34
- require_once YCD_HELPERS_PATH.'AdminHelperPro.php';
35
- require_once YCD_HELPERS_PATH.'CheckerPro.php';
36
- require_once YCD_BLOCKS_PATH.'ProgressBar.php';
37
- require_once(YCD_HELPERS_PATH.'ExtensionRegister.php');
38
- }
39
- require_once(YCD_HELPERS_PATH.'ShowReviewNotice.php');
40
- require_once YCD_HELPERS_PATH.'HelperFunctions.php';
41
- require_once YCD_HELPERS_PATH.'ScriptsIncluder.php';
42
- require_once YCD_HELPERS_PATH.'MultipleChoiceButton.php';
43
- require_once YCD_HELPERS_PATH.'AdminHelper.php';
44
- require_once YCD_CLASSES_PATH.'DisplayRuleChecker.php';
45
- require_once YCD_CLASSES_PATH.'ConditionBuilder.php';
46
- require_once YCD_CLASSES_PATH.'DisplayConditionBuilder.php';
47
- require_once YCD_CLASSES_PATH.'Tickbox.php';
48
- require_once YCD_CLASSES_PATH.'YcdWidget.php';
49
- require_once YCD_CLASSES_PATH.'CountdownType.php';
50
- require_once YCD_COUNTDOWNS_PATH.'CountdownModel.php';
51
- require_once YCD_CLASSES_PATH.'Checker.php';
52
- require_once YCD_COUNTDOWNS_PATH.'Countdown.php';
53
- require_once YCD_CSS_PATH.'Css.php';
54
- require_once YCD_JS_PATH.'Js.php';
55
- require_once YCD_CLASSES_PATH.'RegisterPostType.php';
56
- require_once YCD_CLASSES_PATH.'IncludeManager.php';
57
- require_once YCD_CLASSES_PATH.'Actions.php';
58
- require_once YCD_CLASSES_PATH.'Ajax.php';
59
- require_once YCD_CLASSES_PATH.'Filters.php';
60
- require_once YCD_CLASSES_PATH.'Installer.php';
61
- require_once YCD_COUNTDOWNS_PATH.'ComingSoon.php';
62
- if (YCD_PKG_VERSION > YCD_FREE_VERSION) {
63
- require_once YCD_CLASSES_PATH.'Updates.php';
64
- require_once YCD_CLASSES_PATH.'Subscription.php';
65
- require_once YCD_CLASSES_PATH.'AjaxPro.php';
66
- require_once YCD_CLASSES_PATH.'ActionsPro.php';
67
- require_once YCD_CLASSES_PATH.'FiltersPro.php';
68
- require_once(YCD_HELPERS_PATH.'ExtensionRegister.php');
69
- }
70
- }
71
-
72
- public function actions() {
73
- $this->actions = new Actions();
74
- }
75
-
76
- public function filters() {
77
- $this->filters = new Filters();
78
- }
79
-
80
- public function activate() {
81
-
82
- if (YCD_PKG_VERSION > YCD_FREE_VERSION) {
83
- $pluginName = YCD_FILE_NAME;
84
-
85
- $options = array(
86
- 'licence' => array(
87
- 'key' => YCD_PRO_KEY,
88
- 'storeURL' => YCD_STORE_URL,
89
- 'file' => YCD_FILE_NAME,
90
- 'itemId' => YCD_VERSION_ITEM_ID,
91
- 'itemName' => __(YCD_COUNTDOWN_ITEM_LABEL, YCD_TEXT_DOMAIN),
92
- 'author' => 'Adam',
93
- 'boxLabel' => __('Countdown pro version license', YCD_TEXT_DOMAIN)
94
- )
95
- );
96
- ExtensionRegister::register($pluginName, $options);
97
- }
98
- Installer::install();
99
- }
100
-
101
- public function deactivate() {
102
- if (YCD_PKG_VERSION > YCD_FREE_VERSION) {
103
- $pluginName = YCD_FILE_NAME;
104
- ExtensionRegister::remove($pluginName);
105
- }
106
- }
107
- }
108
-
109
  CountdownInit::getInstance();
1
+ <?php
2
+ namespace ycd;
3
+
4
+ class CountdownInit {
5
+
6
+ private static $instance = null;
7
+ private $actions;
8
+ private $filters;
9
+
10
+ private function __construct() {
11
+ $this->init();
12
+ }
13
+
14
+ private function __clone() {
15
+ }
16
+
17
+ public static function getInstance() {
18
+ if(!isset(self::$instance)) {
19
+ self::$instance = new self();
20
+ }
21
+ return self::$instance;
22
+ }
23
+
24
+ public function init() {
25
+ register_activation_hook(YCD_PREFIX, array($this, 'activate'));
26
+ register_deactivation_hook(YCD_PREFIX, array($this, 'deactivate'));
27
+ $this->includeData();
28
+ $this->actions();
29
+ $this->filters();
30
+ }
31
+
32
+ private function includeData() {
33
+ if(YCD_PKG_VERSION > YCD_FREE_VERSION) {
34
+ require_once YCD_HELPERS_PATH.'AdminHelperPro.php';
35
+ require_once YCD_HELPERS_PATH.'CheckerPro.php';
36
+ require_once YCD_BLOCKS_PATH.'ProgressBar.php';
37
+ require_once(YCD_HELPERS_PATH.'ExtensionRegister.php');
38
+ }
39
+ require_once(YCD_HELPERS_PATH.'ShowReviewNotice.php');
40
+ require_once YCD_HELPERS_PATH.'HelperFunctions.php';
41
+ require_once YCD_HELPERS_PATH.'ScriptsIncluder.php';
42
+ require_once YCD_HELPERS_PATH.'MultipleChoiceButton.php';
43
+ require_once YCD_HELPERS_PATH.'AdminHelper.php';
44
+ require_once YCD_CLASSES_PATH.'DisplayRuleChecker.php';
45
+ require_once YCD_CLASSES_PATH.'ConditionBuilder.php';
46
+ require_once YCD_CLASSES_PATH.'DisplayConditionBuilder.php';
47
+ require_once YCD_CLASSES_PATH.'Tickbox.php';
48
+ require_once YCD_CLASSES_PATH.'YcdWidget.php';
49
+ require_once YCD_CLASSES_PATH.'CountdownType.php';
50
+ require_once YCD_COUNTDOWNS_PATH.'CountdownModel.php';
51
+ require_once YCD_CLASSES_PATH.'Checker.php';
52
+ require_once YCD_COUNTDOWNS_PATH.'Countdown.php';
53
+ require_once YCD_CSS_PATH.'Css.php';
54
+ require_once YCD_JS_PATH.'Js.php';
55
+ require_once YCD_CLASSES_PATH.'RegisterPostType.php';
56
+ require_once YCD_CLASSES_PATH.'IncludeManager.php';
57
+ require_once YCD_CLASSES_PATH.'Actions.php';
58
+ require_once YCD_CLASSES_PATH.'Ajax.php';
59
+ require_once YCD_CLASSES_PATH.'Filters.php';
60
+ require_once YCD_CLASSES_PATH.'Installer.php';
61
+ require_once YCD_COUNTDOWNS_PATH.'ComingSoon.php';
62
+ if (YCD_PKG_VERSION > YCD_FREE_VERSION) {
63
+ require_once YCD_CLASSES_PATH.'Updates.php';
64
+ require_once YCD_CLASSES_PATH.'Subscription.php';
65
+ require_once YCD_CLASSES_PATH.'AjaxPro.php';
66
+ require_once YCD_CLASSES_PATH.'ActionsPro.php';
67
+ require_once YCD_CLASSES_PATH.'FiltersPro.php';
68
+ require_once(YCD_HELPERS_PATH.'ExtensionRegister.php');
69
+ }
70
+ }
71
+
72
+ public function actions() {
73
+ $this->actions = new Actions();
74
+ }
75
+
76
+ public function filters() {
77
+ $this->filters = new Filters();
78
+ }
79
+
80
+ public function activate() {
81
+
82
+ if (YCD_PKG_VERSION > YCD_FREE_VERSION) {
83
+ $pluginName = YCD_FILE_NAME;
84
+
85
+ $options = array(
86
+ 'licence' => array(
87
+ 'key' => YCD_PRO_KEY,
88
+ 'storeURL' => YCD_STORE_URL,
89
+ 'file' => YCD_FILE_NAME,
90
+ 'itemId' => YCD_VERSION_ITEM_ID,
91
+ 'itemName' => __(YCD_COUNTDOWN_ITEM_LABEL, YCD_TEXT_DOMAIN),
92
+ 'author' => 'Adam',
93
+ 'boxLabel' => __('Countdown pro version license', YCD_TEXT_DOMAIN)
94
+ )
95
+ );
96
+ ExtensionRegister::register($pluginName, $options);
97
+ }
98
+ Installer::install();
99
+ }
100
+
101
+ public function deactivate() {
102
+ if (YCD_PKG_VERSION > YCD_FREE_VERSION) {
103
+ $pluginName = YCD_FILE_NAME;
104
+ ExtensionRegister::remove($pluginName);
105
+ }
106
+ }
107
+ }
108
+
109
  CountdownInit::getInstance();
assets/css/Css.php CHANGED
@@ -1,91 +1,91 @@
1
- <?php
2
- namespace ycd;
3
-
4
- class Css {
5
-
6
- public function __construct() {
7
- $this->init();
8
- }
9
-
10
- public function init() {
11
-
12
- add_action('admin_enqueue_scripts', array($this, 'enqueueStyles'));
13
- }
14
-
15
- public function getSettingsPageKey() {
16
- return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_SETTINGS;
17
- }
18
-
19
- public function getComingSoonPage() {
20
- return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_COMING_SOON;
21
- }
22
-
23
- public function getComingSoonMenuPage() {
24
- return 'toplevel_page_'.YCD_COUNTDOWN_COMING_SOON;
25
- }
26
-
27
- public function getSupportPageKey() {
28
- return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_SUPPORT;
29
- }
30
-
31
- public function getSubscribersPageKey() {
32
- return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_SUBSCRIBERS;
33
- }
34
-
35
- public function getMorePluginsPage() {
36
- return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_MORE_PLUGINS;
37
- }
38
-
39
- public function getNewsletterPageKey() {
40
- return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_NEWSLETTER;
41
- }
42
-
43
- public function getLicensePageKey() {
44
- return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_LICENSE;
45
- }
46
-
47
- public function enqueueStyles($hook) {
48
-
49
- ScriptsIncluder::registerStyle('admin.css');
50
- ScriptsIncluder::registerStyle('bootstrap.css');
51
- ScriptsIncluder::registerStyle('colorpicker.css');
52
- ScriptsIncluder::registerStyle('ion.rangeSlider.css');
53
- ScriptsIncluder::registerStyle('ion.rangeSlider.skinFlat.css');
54
- ScriptsIncluder::registerStyle('select2.css');
55
- ScriptsIncluder::registerStyle('jquery.dateTimePicker.min.css');
56
- $settingsKey = $this->getSettingsPageKey();
57
- $supportKey = $this->getSupportPageKey();
58
- $subscriberKey = $this->getSubscribersPageKey();
59
- $newsletterKey = $this->getNewsletterPageKey();
60
- $morePlugins = $this->getMorePluginsPage();
61
- $comingSoonPage = $this->getComingSoonPage();
62
- $comingSoonMenuPage = $this->getComingSoonMenuPage();
63
- $licensePageKey = $this->getLicensePageKey();
64
- $allowedPages = array(
65
- $settingsKey,
66
- $supportKey,
67
- $subscriberKey,
68
- $newsletterKey,
69
- $morePlugins,
70
- $comingSoonPage,
71
- $comingSoonMenuPage,
72
- $licensePageKey,
73
- 'ycdcountdown_page_ycdcountdown',
74
- );
75
- if(in_array($hook, $allowedPages) || get_post_type(@$_GET['post']) == YCD_COUNTDOWN_POST_TYPE) {
76
- ScriptsIncluder::enqueueStyle('bootstrap.css');
77
- ScriptsIncluder::enqueueStyle('admin.css');
78
- ScriptsIncluder::enqueueStyle('colorpicker.css');
79
- ScriptsIncluder::enqueueStyle('ion.rangeSlider.css');
80
- ScriptsIncluder::enqueueStyle('ion.rangeSlider.skinFlat.css');
81
- ScriptsIncluder::enqueueStyle('select2.css');
82
- ScriptsIncluder::enqueueStyle('jquery.dateTimePicker.min.css');
83
-
84
- if (YCD_PKG_VERSION > YCD_FREE_VERSION) {
85
- Subscription::renderStyles();
86
- }
87
- }
88
- }
89
- }
90
-
91
  new Css();
1
+ <?php
2
+ namespace ycd;
3
+
4
+ class Css {
5
+
6
+ public function __construct() {
7
+ $this->init();
8
+ }
9
+
10
+ public function init() {
11
+
12
+ add_action('admin_enqueue_scripts', array($this, 'enqueueStyles'));
13
+ }
14
+
15
+ public function getSettingsPageKey() {
16
+ return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_SETTINGS;
17
+ }
18
+
19
+ public function getComingSoonPage() {
20
+ return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_COMING_SOON;
21
+ }
22
+
23
+ public function getComingSoonMenuPage() {
24
+ return 'toplevel_page_'.YCD_COUNTDOWN_COMING_SOON;
25
+ }
26
+
27
+ public function getSupportPageKey() {
28
+ return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_SUPPORT;
29
+ }
30
+
31
+ public function getSubscribersPageKey() {
32
+ return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_SUBSCRIBERS;
33
+ }
34
+
35
+ public function getMorePluginsPage() {
36
+ return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_MORE_PLUGINS;
37
+ }
38
+
39
+ public function getNewsletterPageKey() {
40
+ return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_NEWSLETTER;
41
+ }
42
+
43
+ public function getLicensePageKey() {
44
+ return YCD_COUNTDOWN_POST_TYPE.'_page_'.YCD_COUNTDOWN_LICENSE;
45
+ }
46
+
47
+ public function enqueueStyles($hook) {
48
+
49
+ ScriptsIncluder::registerStyle('admin.css');
50
+ ScriptsIncluder::registerStyle('bootstrap.css');
51
+ ScriptsIncluder::registerStyle('colorpicker.css');
52
+ ScriptsIncluder::registerStyle('ion.rangeSlider.css');
53
+ ScriptsIncluder::registerStyle('ion.rangeSlider.skinFlat.css');
54
+ ScriptsIncluder::registerStyle('select2.css');
55
+ ScriptsIncluder::registerStyle('jquery.dateTimePicker.min.css');
56
+ $settingsKey = $this->getSettingsPageKey();
57
+ $supportKey = $this->getSupportPageKey();
58
+ $subscriberKey = $this->getSubscribersPageKey();
59
+ $newsletterKey = $this->getNewsletterPageKey();
60
+ $morePlugins = $this->getMorePluginsPage();
61
+ $comingSoonPage = $this->getComingSoonPage();
62
+ $comingSoonMenuPage = $this->getComingSoonMenuPage();
63
+ $licensePageKey = $this->getLicensePageKey();
64
+ $allowedPages = array(
65
+ $settingsKey,
66
+ $supportKey,
67
+ $subscriberKey,
68
+ $newsletterKey,
69
+ $morePlugins,
70
+ $comingSoonPage,
71
+ $comingSoonMenuPage,
72
+ $licensePageKey,
73
+ 'ycdcountdown_page_ycdcountdown',
74
+ );
75
+ if(in_array($hook, $allowedPages) || get_post_type(@$_GET['post']) == YCD_COUNTDOWN_POST_TYPE) {
76
+ ScriptsIncluder::enqueueStyle('bootstrap.css');
77
+ ScriptsIncluder::enqueueStyle('admin.css');
78
+ ScriptsIncluder::enqueueStyle('colorpicker.css');
79
+ ScriptsIncluder::enqueueStyle('ion.rangeSlider.css');
80
+ ScriptsIncluder::enqueueStyle('ion.rangeSlider.skinFlat.css');
81
+ ScriptsIncluder::enqueueStyle('select2.css');
82
+ ScriptsIncluder::enqueueStyle('jquery.dateTimePicker.min.css');
83
+
84
+ if (YCD_PKG_VERSION > YCD_FREE_VERSION) {
85
+ Subscription::renderStyles();
86
+ }
87
+ }
88
+ }
89
+ }
90
+
91
  new Css();
assets/css/TimeCircles.css CHANGED
@@ -1,2785 +1,2785 @@
1
- .ycd-circle-video {
2
- position: absolute !important;
3
- top: 0 !important;
4
- left: 0 !important;
5
- display: block !important;
6
- transform-origin: top left;
7
- }
8
-
9
- .ycd-countdown-wrapper {
10
- position: relative;
11
- }
12
-
13
- .ycd-circle-after-countdown,
14
- .ycd-circle-before-countdown {
15
- position: relative;
16
- z-index: 999999;
17
- }
18
-
19
- .ycd-time-circle {
20
- transform-origin: top left;
21
- }
22
-
23
- .time_circles>div>h4,.time_circles>div>span{margin:0;padding:0;text-align:center;font-family:'Century Gothic',Arial;line-height:1}.time_circles{position:relative;width:100%;height:100%}.time_circles>div{position:absolute;text-align:center}.time_circles>div>h4{text-transform:uppercase}.time_circles>div>span{display:block;width:100%;font-weight:700}
24
-
25
- /*!
26
- Animate.css - http://daneden.me/animate
27
- Licensed under the MIT license - http://opensource.org/licenses/MIT
28
-
29
- Copyright (c) 2015 Daniel Eden
30
- */
31
-
32
- .ycd-animated {
33
- -webkit-animation-duration: 1s;
34
- animation-duration: 1s;
35
- -webkit-animation-fill-mode: none;
36
- animation-fill-mode: none;
37
- }
38
- .ycd-animated.infinite {
39
- -webkit-animation-iteration-count: infinite;
40
- animation-iteration-count: infinite
41
- }
42
- .ycd-animated.hinge {
43
- -webkit-animation-duration: 2s;
44
- animation-duration: 2s
45
- }
46
- .ycd-animated.bounceIn,
47
- .ycd-animated.bounceOut,
48
- .ycd-animated.flipOutX,
49
- .ycd-animated.flipOutY {
50
- -webkit-animation-duration: .75s;
51
- animation-duration: .75s
52
- }
53
- @-webkit-keyframes bounce {
54
- 20%, 53%, 80%, from, to {
55
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
56
- animation-timing-function: cubic-bezier(.215, .61, .355, 1);
57
- -webkit-transform: translate3d(0, 0, 0);
58
- transform: translate3d(0, 0, 0)
59
- }
60
- 40%,
61
- 43% {
62
- -webkit-animation-timing-function: cubic-bezier(.755, .050, .855, .060);
63
- animation-timing-function: cubic-bezier(.755, .050, .855, .060);
64
- -webkit-transform: translate3d(0, -30px, 0);
65
- transform: translate3d(0, -30px, 0)
66
- }
67
- 70% {
68
- -webkit-animation-timing-function: cubic-bezier(.755, .050, .855, .060);
69
- animation-timing-function: cubic-bezier(.755, .050, .855, .060);
70
- -webkit-transform: translate3d(0, -15px, 0);
71
- transform: translate3d(0, -15px, 0)
72
- }
73
- 90% {
74
- -webkit-transform: translate3d(0, -4px, 0);
75
- transform: translate3d(0, -4px, 0)
76
- }
77
- }
78
- @keyframes bounce {
79
- 20%, 53%, 80%, from, to {
80
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
81
- animation-timing-function: cubic-bezier(.215, .61, .355, 1);
82
- -webkit-transform: translate3d(0, 0, 0);
83
- transform: translate3d(0, 0, 0)
84
- }
85
- 40%,
86
- 43% {
87
- -webkit-animation-timing-function: cubic-bezier(.755, .050, .855, .060);
88
- animation-timing-function: cubic-bezier(.755, .050, .855, .060);
89
- -webkit-transform: translate3d(0, -30px, 0);
90
- transform: translate3d(0, -30px, 0)
91
- }
92
- 70% {
93
- -webkit-animation-timing-function: cubic-bezier(.755, .050, .855, .060);
94
- animation-timing-function: cubic-bezier(.755, .050, .855, .060);
95
- -webkit-transform: translate3d(0, -15px, 0);
96
- transform: translate3d(0, -15px, 0)
97
- }
98
- 90% {
99
- -webkit-transform: translate3d(0, -4px, 0);
100
- transform: translate3d(0, -4px, 0)
101
- }
102
- }
103
- .ycd-bounce {
104
- -webkit-animation-name: bounce;
105
- animation-name: bounce;
106
- -webkit-transform-origin: center bottom;
107
- transform-origin: center bottom
108
- }
109
- @-webkit-keyframes flash {
110
- 50%, from, to {
111
- opacity: 1
112
- }
113
- 25%,
114
- 75% {
115
- opacity: 0
116
- }
117
- }
118
- @keyframes flash {
119
- 50%, from, to {
120
- opacity: 1
121
- }
122
- 25%,
123
- 75% {
124
- opacity: 0
125
- }
126
- }
127
- .ycd-flash {
128
- -webkit-animation-name: flash;
129
- animation-name: flash
130
- }
131
- @-webkit-keyframes pulse {
132
- from, to {
133
- -webkit-transform: scale3d(1, 1, 1);
134
- transform: scale3d(1, 1, 1)
135
- }
136
- 50% {
137
- -webkit-transform: scale3d(1.05, 1.05, 1.05);
138
- transform: scale3d(1.05, 1.05, 1.05)
139
- }
140
- }
141
- @keyframes pulse {
142
- from, to {
143
- -webkit-transform: scale3d(1, 1, 1);
144
- transform: scale3d(1, 1, 1)
145
- }
146
- 50% {
147
- -webkit-transform: scale3d(1.05, 1.05, 1.05);
148
- transform: scale3d(1.05, 1.05, 1.05)
149
- }
150
- }
151
- .ycd-pulse {
152
- -webkit-animation-name: pulse;
153
- animation-name: pulse
154
- }
155
- @-webkit-keyframes rubberBand {
156
- from, to {
157
- -webkit-transform: scale3d(1, 1, 1);
158
- transform: scale3d(1, 1, 1)
159
- }
160
- 30% {
161
- -webkit-transform: scale3d(1.25, .75, 1);
162
- transform: scale3d(1.25, .75, 1)
163
- }
164
- 40% {
165
- -webkit-transform: scale3d(.75, 1.25, 1);
166
- transform: scale3d(.75, 1.25, 1)
167
- }
168
- 50% {
169
- -webkit-transform: scale3d(1.15, .85, 1);
170
- transform: scale3d(1.15, .85, 1)
171
- }
172
- 65% {
173
- -webkit-transform: scale3d(.95, 1.05, 1);
174
- transform: scale3d(.95, 1.05, 1)
175
- }
176
- 75% {
177
- -webkit-transform: scale3d(1.05, .95, 1);
178
- transform: scale3d(1.05, .95, 1)
179
- }
180
- }
181
- @keyframes rubberBand {
182
- from, to {
183
- -webkit-transform: scale3d(1, 1, 1);
184
- transform: scale3d(1, 1, 1)
185
- }
186
- 30% {
187
- -webkit-transform: scale3d(1.25, .75, 1);
188
- transform: scale3d(1.25, .75, 1)
189
- }
190
- 40% {
191
- -webkit-transform: scale3d(.75, 1.25, 1);
192
- transform: scale3d(.75, 1.25, 1)
193
- }
194
- 50% {
195
- -webkit-transform: scale3d(1.15, .85, 1);
196
- transform: scale3d(1.15, .85, 1)
197
- }
198
- 65% {
199
- -webkit-transform: scale3d(.95, 1.05, 1);
200
- transform: scale3d(.95, 1.05, 1)
201
- }
202
- 75% {
203
- -webkit-transform: scale3d(1.05, .95, 1);
204
- transform: scale3d(1.05, .95, 1)
205
- }
206
- }
207
- .ycd-rubberBand {
208
- -webkit-animation-name: rubberBand;
209
- animation-name: rubberBand
210
- }
211
- @-webkit-keyframes shake {
212
- from, to {
213
- -webkit-transform: translate3d(0, 0, 0);
214
- transform: translate3d(0, 0, 0)
215
- }
216
- 10%,
217
- 30%,
218
- 50%,
219
- 70%,
220
- 90% {
221
- -webkit-transform: translate3d(-10px, 0, 0);
222
- transform: translate3d(-10px, 0, 0)
223
- }
224
- 20%,
225
- 40%,
226
- 60%,
227
- 80% {
228
- -webkit-transform: translate3d(10px, 0, 0);
229
- transform: translate3d(10px, 0, 0)
230
- }
231
- }
232
- @keyframes shake {
233
- from, to {
234
- -webkit-transform: translate3d(0, 0, 0);
235
- transform: translate3d(0, 0, 0)
236
- }
237
- 10%,
238
- 30%,
239
- 50%,
240
- 70%,
241
- 90% {
242
- -webkit-transform: translate3d(-10px, 0, 0);
243
- transform: translate3d(-10px, 0, 0)
244
- }
245
- 20%,
246
- 40%,
247
- 60%,
248
- 80% {
249
- -webkit-transform: translate3d(10px, 0, 0);
250
- transform: translate3d(10px, 0, 0)
251
- }
252
- }
253
- .ycd-shake {
254
- -webkit-animation-name: shake;
255
- animation-name: shake
256
- }
257
- @-webkit-keyframes swing {
258
- 20% {
259
- -webkit-transform: rotate3d(0, 0, 1, 15deg);
260
- transform: rotate3d(0, 0, 1, 15deg)
261
- }
262
- 40% {
263
- -webkit-transform: rotate3d(0, 0, 1, -10deg);
264
- transform: rotate3d(0, 0, 1, -10deg)
265
- }
266
- 60% {
267
- -webkit-transform: rotate3d(0, 0, 1, 5deg);
268
- transform: rotate3d(0, 0, 1, 5deg)
269
- }
270
- 80% {
271
- -webkit-transform: rotate3d(0, 0, 1, -5deg);
272
- transform: rotate3d(0, 0, 1, -5deg)
273
- }
274
- to {
275
- -webkit-transform: rotate3d(0, 0, 1, 0deg);
276
- transform: rotate3d(0, 0, 1, 0deg)
277
- }
278
- }
279
- @keyframes swing {
280
- 20% {
281
- -webkit-transform: rotate3d(0, 0, 1, 15deg);
282
- transform: rotate3d(0, 0, 1, 15deg)
283
- }
284
- 40% {
285
- -webkit-transform: rotate3d(0, 0, 1, -10deg);
286
- transform: rotate3d(0, 0, 1, -10deg)
287
- }
288
- 60% {
289
- -webkit-transform: rotate3d(0, 0, 1, 5deg);
290
- transform: rotate3d(0, 0, 1, 5deg)
291
- }
292
- 80% {
293
- -webkit-transform: rotate3d(0, 0, 1, -5deg);
294
- transform: rotate3d(0, 0, 1, -5deg)
295
- }
296
- to {
297
- -webkit-transform: rotate3d(0, 0, 1, 0deg);
298
- transform: rotate3d(0, 0, 1, 0deg)
299
- }
300
- }
301
- .ycd-swing {
302
- -webkit-transform-origin: top center;
303
- transform-origin: top center;
304
- -webkit-animation-name: swing;
305
- animation-name: swing
306
- }
307
- @-webkit-keyframes tada {
308
- from, to {
309
- -webkit-transform: scale3d(1, 1, 1);
310
- transform: scale3d(1, 1, 1)
311
- }
312
- 10%,
313
- 20% {
314
- -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
315
- transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
316
- }
317
- 30%,
318
- 50%,
319
- 70%,
320
- 90% {
321
- -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
322
- transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
323
- }
324
- 40%,
325
- 60%,
326
- 80% {
327
- -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
328
- transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
329
- }
330
- }
331
- @keyframes tada {
332
- from, to {
333
- -webkit-transform: scale3d(1, 1, 1);
334
- transform: scale3d(1, 1, 1)
335
- }
336
- 10%,
337
- 20% {
338
- -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
339
- transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
340
- }
341
- 30%,
342
- 50%,
343
- 70%,
344
- 90% {
345
- -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
346
- transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
347
- }
348
- 40%,
349
- 60%,
350
- 80% {
351
- -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
352
- transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
353
- }
354
- }
355
- .ycd-tada {
356
- -webkit-animation-name: tada;
357
- animation-name: tada
358
- }
359
- @-webkit-keyframes wobble {
360
- from, to {
361
- -webkit-transform: none;
362
- transform: none
363
- }
364
- 15% {
365
- -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
366
- transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
367
- }
368
- 30% {
369
- -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
370
- transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
371
- }
372
- 45% {
373
- -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
374
- transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
375
- }
376
- 60% {
377
- -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
378
- transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
379
- }
380
- 75% {
381
- -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
382
- transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
383
- }
384
- }
385
- @keyframes wobble {
386
- from, to {
387
- -webkit-transform: none;
388
- transform: none
389
- }
390
- 15% {
391
- -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
392
- transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
393
- }
394
- 30% {
395
- -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
396
- transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
397
- }
398
- 45% {
399
- -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
400
- transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
401
- }
402
- 60% {
403
- -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
404
- transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
405
- }
406
- 75% {
407
- -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
408
- transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
409
- }
410
- }
411
- .ycd-wobble {
412
- -webkit-animation-name: wobble;
413
- animation-name: wobble
414
- }
415
- @-webkit-keyframes jello {
416
- 11.1%, from, to {
417
- -webkit-transform: none;
418
- transform: none
419
- }
420
- 22.2% {
421
- -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
422
- transform: skewX(-12.5deg) skewY(-12.5deg)
423
- }
424
- 33.3% {
425
- -webkit-transform: skewX(6.25deg) skewY(6.25deg);
426
- transform: skewX(6.25deg) skewY(6.25deg)
427
- }
428
- 44.4% {
429
- -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
430
- transform: skewX(-3.125deg) skewY(-3.125deg)
431
- }
432
- 55.5% {
433
- -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
434
- transform: skewX(1.5625deg) skewY(1.5625deg)
435
- }
436
- 66.6% {
437
- -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
438
- transform: skewX(-.78125deg) skewY(-.78125deg)
439
- }
440
- 77.7% {
441
- -webkit-transform: skewX(.390625deg) skewY(.390625deg);
442
- transform: skewX(.390625deg) skewY(.390625deg)
443
- }
444
- 88.8% {
445
- -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
446
- transform: skewX(-.1953125deg) skewY(-.1953125deg)
447
- }
448
- }
449
- @keyframes jello {
450
- 11.1%, from, to {
451
- -webkit-transform: none;
452
- transform: none
453
- }
454
- 22.2% {
455
- -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
456
- transform: skewX(-12.5deg) skewY(-12.5deg)
457
- }
458
- 33.3% {
459
- -webkit-transform: skewX(6.25deg) skewY(6.25deg);
460
- transform: skewX(6.25deg) skewY(6.25deg)
461
- }
462
- 44.4% {
463
- -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
464
- transform: skewX(-3.125deg) skewY(-3.125deg)
465
- }
466
- 55.5% {
467
- -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
468
- transform: skewX(1.5625deg) skewY(1.5625deg)
469
- }
470
- 66.6% {
471
- -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
472
- transform: skewX(-.78125deg) skewY(-.78125deg)
473
- }
474
- 77.7% {
475
- -webkit-transform: skewX(.390625deg) skewY(.390625deg);
476
- transform: skewX(.390625deg) skewY(.390625deg)
477
- }
478
- 88.8% {
479
- -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
480
- transform: skewX(-.1953125deg) skewY(-.1953125deg)
481
- }
482
- }
483
- .ycd-jello {
484
- -webkit-animation-name: jello;
485
- animation-name: jello;
486
- -webkit-transform-origin: center;
487
- transform-origin: center
488
- }
489
- @-webkit-keyframes bounceIn {
490
- 20%, 40%, 60%, 80%, from, to {
491
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
492
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
493
- }
494
- 0% {
495
- opacity: 0;
496
- -webkit-transform: scale3d(.3, .3, .3);
497
- transform: scale3d(.3, .3, .3)
498
- }
499
- 20% {
500
- -webkit-transform: scale3d(1.1, 1.1, 1.1);
501
- transform: scale3d(1.1, 1.1, 1.1)
502
- }
503
- 40% {
504
- -webkit-transform: scale3d(.9, .9, .9);
505
- transform: scale3d(.9, .9, .9)
506
- }
507
- 60% {
508
- opacity: 1;
509
- -webkit-transform: scale3d(1.03, 1.03, 1.03);
510
- transform: scale3d(1.03, 1.03, 1.03)
511
- }
512
- 80% {
513
- -webkit-transform: scale3d(.97, .97, .97);
514
- transform: scale3d(.97, .97, .97)
515
- }
516
- to {
517
- opacity: 1;
518
- -webkit-transform: scale3d(1, 1, 1);
519
- transform: scale3d(1, 1, 1)
520
- }
521
- }
522
- @keyframes bounceIn {
523
- 20%, 40%, 60%, 80%, from, to {
524
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
525
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
526
- }
527
- 0% {
528
- opacity: 0;
529
- -webkit-transform: scale3d(.3, .3, .3);
530
- transform: scale3d(.3, .3, .3)
531
- }
532
- 20% {
533
- -webkit-transform: scale3d(1.1, 1.1, 1.1);
534
- transform: scale3d(1.1, 1.1, 1.1)
535
- }
536
- 40% {
537
- -webkit-transform: scale3d(.9, .9, .9);
538
- transform: scale3d(.9, .9, .9)
539
- }
540
- 60% {
541
- opacity: 1;
542
- -webkit-transform: scale3d(1.03, 1.03, 1.03);
543
- transform: scale3d(1.03, 1.03, 1.03)
544
- }
545
- 80% {
546
- -webkit-transform: scale3d(.97, .97, .97);
547
- transform: scale3d(.97, .97, .97)
548
- }
549
- to {
550
- opacity: 1;
551
- -webkit-transform: scale3d(1, 1, 1);
552
- transform: scale3d(1, 1, 1)
553
- }
554
- }
555
- .ycd-bounceIn {
556
- -webkit-animation-name: bounceIn;
557
- animation-name: bounceIn
558
- }
559
- @-webkit-keyframes bounceInDown {
560
- 60%, 75%, 90%, from, to {
561
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
562
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
563
- }
564
- 0% {
565
- opacity: 0;
566
- -webkit-transform: translate3d(0, -3000px, 0);
567
- transform: translate3d(0, -3000px, 0)
568
- }
569
- 60% {
570
- opacity: 1;
571
- -webkit-transform: translate3d(0, 25px, 0);
572
- transform: translate3d(0, 25px, 0)
573
- }
574
- 75% {
575
- -webkit-transform: translate3d(0, -10px, 0);
576
- transform: translate3d(0, -10px, 0)
577
- }
578
- 90% {
579
- -webkit-transform: translate3d(0, 5px, 0);
580
- transform: translate3d(0, 5px, 0)
581
- }
582
- to {
583
- -webkit-transform: none;
584
- transform: none
585
- }
586
- }
587
- @keyframes bounceInDown {
588
- 60%, 75%, 90%, from, to {
589
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
590
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
591
- }
592
- 0% {
593
- opacity: 0;
594
- -webkit-transform: translate3d(0, -3000px, 0);
595
- transform: translate3d(0, -3000px, 0)
596
- }
597
- 60% {
598
- opacity: 1;
599
- -webkit-transform: translate3d(0, 25px, 0);
600
- transform: translate3d(0, 25px, 0)
601
- }
602
- 75% {
603
- -webkit-transform: translate3d(0, -10px, 0);
604
- transform: translate3d(0, -10px, 0)
605
- }
606
- 90% {
607
- -webkit-transform: translate3d(0, 5px, 0);
608
- transform: translate3d(0, 5px, 0)
609
- }
610
- to {
611
- -webkit-transform: none;
612
- transform: none
613
- }
614
- }
615
- .bounceInDown {
616
- -webkit-animation-name: bounceInDown;
617
- animation-name: bounceInDown
618
- }
619
- @-webkit-keyframes bounceInLeft {
620
- 60%, 75%, 90%, from, to {
621
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
622
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
623
- }
624
- 0% {
625
- opacity: 0;
626
- -webkit-transform: translate3d(-3000px, 0, 0);
627
- transform: translate3d(-3000px, 0, 0)
628
- }
629
- 60% {
630
- opacity: 1;
631
- -webkit-transform: translate3d(25px, 0, 0);
632
- transform: translate3d(25px, 0, 0)
633
- }
634
- 75% {
635
- -webkit-transform: translate3d(-10px, 0, 0);
636
- transform: translate3d(-10px, 0, 0)
637
- }
638
- 90% {
639
- -webkit-transform: translate3d(5px, 0, 0);
640
- transform: translate3d(5px, 0, 0)
641
- }
642
- to {
643
- -webkit-transform: none;
644
- transform: none
645
- }
646
- }
647
- @keyframes bounceInLeft {
648
- 60%, 75%, 90%, from, to {
649
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
650
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
651
- }
652
- 0% {
653
- opacity: 0;
654
- -webkit-transform: translate3d(-3000px, 0, 0);
655
- transform: translate3d(-3000px, 0, 0)
656
- }
657
- 60% {
658
- opacity: 1;
659
- -webkit-transform: translate3d(25px, 0, 0);
660
- transform: translate3d(25px, 0, 0)
661
- }
662
- 75% {
663
- -webkit-transform: translate3d(-10px, 0, 0);
664
- transform: translate3d(-10px, 0, 0)
665
- }
666
- 90% {
667
- -webkit-transform: translate3d(5px, 0, 0);
668
- transform: translate3d(5px, 0, 0)
669
- }
670
- to {
671
- -webkit-transform: none;
672
- transform: none
673
- }
674
- }
675
- .ycd-bounceInLeft {
676
- -webkit-animation-name: bounceInLeft;
677
- animation-name: bounceInLeft
678
- }
679
- @-webkit-keyframes bounceInRight {
680
- 60%, 75%, 90%, from, to {
681
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
682
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
683
- }
684
- from {
685
- opacity: 0;
686
- -webkit-transform: translate3d(3000px, 0, 0);
687
- transform: translate3d(3000px, 0, 0)
688
- }
689
- 60% {
690
- opacity: 1;
691
- -webkit-transform: translate3d(-25px, 0, 0);
692
- transform: translate3d(-25px, 0, 0)
693
- }
694
- 75% {
695
- -webkit-transform: translate3d(10px, 0, 0);
696
- transform: translate3d(10px, 0, 0)
697
- }
698
- 90% {
699
- -webkit-transform: translate3d(-5px, 0, 0);
700
- transform: translate3d(-5px, 0, 0)
701
- }
702
- to {
703
- -webkit-transform: none;
704
- transform: none
705
- }
706
- }
707
- @keyframes bounceInRight {
708
- 60%, 75%, 90%, from, to {
709
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
710
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
711
- }
712
- from {
713
- opacity: 0;
714
- -webkit-transform: translate3d(3000px, 0, 0);
715
- transform: translate3d(3000px, 0, 0)
716
- }
717
- 60% {
718
- opacity: 1;
719
- -webkit-transform: translate3d(-25px, 0, 0);
720
- transform: translate3d(-25px, 0, 0)
721
- }
722
- 75% {
723
- -webkit-transform: translate3d(10px, 0, 0);
724
- transform: translate3d(10px, 0, 0)
725
- }
726
- 90% {
727
- -webkit-transform: translate3d(-5px, 0, 0);
728
- transform: translate3d(-5px, 0, 0)
729
- }
730
- to {
731
- -webkit-transform: none;
732
- transform: none
733
- }
734
- }
735
- .ycd-bounceInRight {
736
- -webkit-animation-name: bounceInRight;
737
- animation-name: bounceInRight
738
- }
739
- @-webkit-keyframes bounceInUp {
740
- 60%, 75%, 90%, from, to {
741
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
742
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
743
- }
744
- from {
745
- opacity: 0;
746
- -webkit-transform: translate3d(0, 3000px, 0);
747
- transform: translate3d(0, 3000px, 0)
748
- }
749
- 60% {
750
- opacity: 1;
751
- -webkit-transform: translate3d(0, -20px, 0);
752
- transform: translate3d(0, -20px, 0)
753
- }
754
- 75% {
755
- -webkit-transform: translate3d(0, 10px, 0);
756
- transform: translate3d(0, 10px, 0)
757
- }
758
- 90% {
759
- -webkit-transform: translate3d(0, -5px, 0);
760
- transform: translate3d(0, -5px, 0)
761
- }
762
- to {
763
- -webkit-transform: translate3d(0, 0, 0);
764
- transform: translate3d(0, 0, 0)
765
- }
766
- }
767
- @keyframes bounceInUp {
768
- 60%, 75%, 90%, from, to {
769
- -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
770
- animation-timing-function: cubic-bezier(.215, .61, .355, 1)
771
- }
772
- from {
773
- opacity: 0;
774
- -webkit-transform: translate3d(0, 3000px, 0);
775
- transform: translate3d(0, 3000px, 0)
776
- }
777
- 60% {
778
- opacity: 1;
779
- -webkit-transform: translate3d(0, -20px, 0);
780
- transform: translate3d(0, -20px, 0)
781
- }
782
- 75% {
783
- -webkit-transform: translate3d(0, 10px, 0);
784
- transform: translate3d(0, 10px, 0)
785
- }
786
- 90% {
787
- -webkit-transform: translate3d(0, -5px, 0);
788
- transform: translate3d(0, -5px, 0)
789
- }
790
- to {
791
- -webkit-transform: translate3d(0, 0, 0);
792
- transform: translate3d(0, 0, 0)
793
- }
794
- }
795
- .ycd-bounceInUp {
796
- -webkit-animation-name: bounceInUp;
797
- animation-name: bounceInUp
798
- }
799
-
800
- @-webkit-keyframes bounceOut {
801
- 20% {
802
- -webkit-transform: scale3d(.9, .9, .9);
803
- transform: scale3d(.9, .9, .9)
804
- }
805
- 50%,
806
- 55% {
807
- opacity: 1;
808
- -webkit-transform: scale3d(1.1, 1.1, 1.1);
809
- transform: scale3d(1.1, 1.1, 1.1)
810
- }
811
- to {
812
- opacity: 0;
813
- -webkit-transform: scale3d(.3, .3, .3);
814
- transform: scale3d(.3, .3, .3)
815
- }
816
- }
817
- @keyframes bounceOut {
818
- 20% {
819
- -webkit-transform: scale3d(.9, .9, .9);
820
- transform: scale3d(.9, .9, .9)
821
- }
822
- 50%,
823
- 55% {
824
- opacity: 1;
825
- -webkit-transform: scale3d(1.1, 1.1, 1.1);
826
- transform: scale3d(1.1, 1.1, 1.1)
827
- }
828
- to {
829
- opacity: 0;
830
- -webkit-transform: scale3d(.3, .3, .3);
831
- transform: scale3d(.3, .3, .3)
832
- }
833
- }
834
- .ycd-bounceOut {
835
- -webkit-animation-name: bounceOut;
836
- animation-name: bounceOut
837
- }
838
- @-webkit-keyframes bounceOutDown {
839
- 20% {
840
- -webkit-transform: translate3d(0, 10px, 0);
841
- transform: translate3d(0, 10px, 0)
842
- }
843
- 40%,
844
- 45% {
845
- opacity: 1;
846
- -webkit-transform: translate3d(0, -20px, 0);
847
- transform: translate3d(0, -20px, 0)
848
- }
849
- to {
850
- opacity: 0;
851
- -webkit-transform: translate3d(0, 2000px, 0);
852
- transform: translate3d(0, 2000px, 0)
853
- }
854
- }
855
- @keyframes bounceOutDown {
856
- 20% {
857
- -webkit-transform: translate3d(0, 10px, 0);
858
- transform: translate3d(0, 10px, 0)
859
- }
860
- 40%,
861
- 45% {
862
- opacity: 1;
863
- -webkit-transform: translate3d(0, -20px, 0);
864
- transform: translate3d(0, -20px, 0)
865
- }
866
- to {
867
- opacity: 0;
868
- -webkit-transform: translate3d(0, 2000px, 0);
869
- transform: translate3d(0, 2000px, 0)
870
- }
871
- }
872
- .bounceOutDown {
873
- -webkit-animation-name: bounceOutDown;
874
- animation-name: bounceOutDown
875
- }
876
- @-webkit-keyframes bounceOutLeft {
877
- 20% {
878
- opacity: 1;
879
- -webkit-transform: translate3d(20px, 0, 0);
880
- transform: translate3d(20px, 0, 0)
881
- }
882
- to {
883
- opacity: 0;
884
- -webkit-transform: translate3d(-2000px, 0, 0);
885
- transform: translate3d(-2000px, 0, 0)
886
- }
887
- }
888
- @keyframes bounceOutLeft {
889
- 20% {
890
- opacity: 1;
891
- -webkit-transform: translate3d(20px, 0, 0);
892
- transform: translate3d(20px, 0, 0)
893
- }
894
- to {
895
- opacity: 0;
896
- -webkit-transform: translate3d(-2000px, 0, 0);
897
- transform: translate3d(-2000px, 0, 0)
898
- }
899
- }
900
- .ycd-bounceOutLeft {
901
- -webkit-animation-name: bounceOutLeft;
902
- animation-name: bounceOutLeft
903
- }
904
- @-webkit-keyframes bounceOutRight {
905
- 20% {
906
- opacity: 1;
907
- -webkit-transform: translate3d(-20px, 0, 0);
908
- transform: translate3d(-20px, 0, 0)
909
- }
910
- to {
911
- opacity: 0;
912
- -webkit-transform: translate3d(2000px, 0, 0);
913
- transform: translate3d(2000px, 0, 0)
914
- }
915
- }
916
- @keyframes bounceOutRight {
917
- 20% {
918
- opacity: 1;
919
- -webkit-transform: translate3d(-20px, 0, 0);
920
- transform: translate3d(-20px, 0, 0)
921
- }
922
- to {
923
- opacity: 0;
924
- -webkit-transform: translate3d(2000px, 0, 0);
925
- transform: translate3d(2000px, 0, 0)
926
- }
927
- }
928
- .bounceOutRight {
929
- -webkit-animation-name: bounceOutRight;
930
- animation-name: bounceOutRight
931
- }
932
- @-webkit-keyframes bounceOutUp {
933
- 20% {
934
- -webkit-transform: translate3d(0, -10px, 0);
935
- transform: translate3d(0, -10px, 0)
936
- }
937
- 40%,
938
- 45% {
939
- opacity: 1;
940
- -webkit-transform: translate3d(0, 20px, 0);
941
- transform: translate3d(0, 20px, 0)
942
- }
943
- to {
944
- opacity: 0;
945
- -webkit-transform: translate3d(0, -2000px, 0);
946
- transform: translate3d(0, -2000px, 0)
947
- }
948
- }
949
- @keyframes bounceOutUp {
950
- 20% {
951
- -webkit-transform: translate3d(0, -10px, 0);
952
- transform: translate3d(0, -10px, 0)
953
- }
954
- 40%,
955
- 45% {
956
- opacity: 1;
957
- -webkit-transform: translate3d(0, 20px, 0);
958
- transform: translate3d(0, 20px, 0)
959
- }
960
- to {
961
- opacity: 0;
962
- -webkit-transform: translate3d(0, -2000px, 0);
963
- transform: translate3d(0, -2000px, 0)
964
- }
965
- }
966
- .bounceOutUp {
967
- -webkit-animation-name: bounceOutUp;
968
- animation-name: bounceOutUp
969
- }
970
- @-webkit-keyframes fadeIn {
971
- from {
972
- opacity: 0
973
- }
974
- to {
975
- opacity: 1
976
- }
977
- }
978
- @keyframes fadeIn {
979
- from {
980
- opacity: 0
981
- }
982
- to {
983
- opacity: 1
984
- }
985
- }
986
- .ycd-fadeIn {
987
- -webkit-animation-name: fadeIn;
988
- animation-name: fadeIn
989
- }
990
- @-webkit-keyframes fadeInDown {
991
- from {
992
- opacity: 0;
993
- -webkit-transform: translate3d(0, -100%, 0);
994
- transform: translate3d(0, -100%, 0)
995
- }
996
- to {
997
- opacity: 1;
998
- -webkit-transform: none;
999
- transform: none
1000
- }
1001
- }
1002
- @keyframes fadeInDown {
1003
- from {
1004
- opacity: 0;
1005
- -webkit-transform: translate3d(0, -100%, 0);
1006
- transform: translate3d(0, -100%, 0)
1007
- }
1008
- to {
1009
- opacity: 1;
1010
- -webkit-transform: none;
1011
- transform: none
1012
- }
1013
- }
1014
- .fadeInDown {
1015
- -webkit-animation-name: fadeInDown;
1016
- animation-name: fadeInDown
1017
- }
1018
- @-webkit-keyframes fadeInDownBig {
1019
- from {
1020
- opacity: 0;
1021
- -webkit-transform: translate3d(0, -2000px, 0);
1022
- transform: translate3d(0, -2000px, 0)
1023
- }
1024
- to {
1025
- opacity: 1;
1026
- -webkit-transform: none;
1027
- transform: none
1028
- }
1029
- }
1030
- @keyframes fadeInDownBig {
1031
- from {
1032
- opacity: 0;
1033
- -webkit-transform: translate3d(0, -2000px, 0);
1034
- transform: translate3d(0, -2000px, 0)
1035
- }
1036
- to {
1037
- opacity: 1;
1038
- -webkit-transform: none;
1039
- transform: none
1040
- }
1041
- }
1042
- .fadeInDownBig {
1043
- -webkit-animation-name: fadeInDownBig;
1044
- animation-name: fadeInDownBig
1045
- }
1046
- @-webkit-keyframes fadeInLeft {
1047
- from {
1048
- opacity: 0;
1049
- -webkit-transform: translate3d(-100%, 0, 0);
1050
- transform: translate3d(-100%, 0, 0)
1051
- }
1052
- to {
1053
- opacity: 1;
1054
- -webkit-transform: none;
1055
- transform: none
1056
- }
1057
- }
1058
- @keyframes fadeInLeft {
1059
- from {
1060
- opacity: 0;
1061
- -webkit-transform: translate3d(-100%, 0, 0);
1062
- transform: translate3d(-100%, 0, 0)
1063
- }
1064
- to {
1065
- opacity: 1;
1066
- -webkit-transform: none;
1067
- transform: none
1068
- }
1069
- }
1070
- .fadeInLeft {
1071
- -webkit-animation-name: fadeInLeft;
1072
- animation-name: fadeInLeft
1073
- }
1074
- @-webkit-keyframes fadeInLeftBig {
1075
- from {
1076
- opacity: 0;
1077
- -webkit-transform: translate3d(-2000px, 0, 0);
1078
- transform: translate3d(-2000px, 0, 0)
1079
- }
1080
- to {
1081
- opacity: 1;
1082
- -webkit-transform: none;
1083
- transform: none
1084
- }
1085
- }
1086
- @keyframes fadeInLeftBig {
1087
- from {
1088
- opacity: 0;
1089
- -webkit-transform: translate3d(-2000px, 0, 0);
1090
- transform: translate3d(-2000px, 0, 0)
1091
- }
1092
- to {
1093
- opacity: 1;
1094
- -webkit-transform: none;
1095
- transform: none
1096
- }
1097
- }
1098
- .fadeInLeftBig {
1099
- -webkit-animation-name: fadeInLeftBig;
1100
- animation-name: fadeInLeftBig
1101
- }
1102
- @-webkit-keyframes fadeInRight {
1103
- from {
1104
- opacity: 0;
1105
- -webkit-transform: translate3d(100%, 0, 0);
1106
- transform: translate3d(100%, 0, 0)
1107
- }
1108
- to {
1109
- opacity: 1;
1110
- -webkit-transform: none;
1111
- transform: none
1112
- }
1113
- }
1114
- @keyframes fadeInRight {
1115
- from {
1116
- opacity: 0;
1117
- -webkit-transform: translate3d(100%, 0, 0);
1118
- transform: translate3d(100%, 0, 0)
1119
- }
1120
- to {
1121
- opacity: 1;
1122
- -webkit-transform: none;
1123
- transform: none
1124
- }
1125
- }
1126
- .fadeInRight {
1127
- -webkit-animation-name: fadeInRight;
1128
- animation-name: fadeInRight
1129
- }
1130
- @-webkit-keyframes fadeInRightBig {
1131
- from {
1132
- opacity: 0;
1133
- -webkit-transform: translate3d(2000px, 0, 0);
1134
- transform: translate3d(2000px, 0, 0)
1135
- }
1136
- to {
1137
- opacity: 1;
1138
- -webkit-transform: none;
1139
- transform: none
1140
- }
1141
- }
1142
- @keyframes fadeInRightBig {
1143
- from {
1144
- opacity: 0;
1145
- -webkit-transform: translate3d(2000px, 0, 0);
1146
- transform: translate3d(2000px, 0, 0)
1147
- }
1148
- to {
1149
- opacity: 1;
1150
- -webkit-transform: none;
1151
- transform: none
1152
- }
1153
- }
1154
- .fadeInRightBig {
1155
- -webkit-animation-name: fadeInRightBig;
1156
- animation-name: fadeInRightBig
1157
- }
1158
- @-webkit-keyframes fadeInUp {
1159
- from {
1160
- opacity: 0;
1161
- -webkit-transform: translate3d(0, 100%, 0);
1162
- transform: translate3d(0, 100%, 0)
1163
- }
1164
- to {
1165
- opacity: 1;
1166
- -webkit-transform: none;
1167
- transform: none
1168
- }
1169
- }
1170
- @keyframes fadeInUp {
1171
- from {
1172
- opacity: 0;
1173
- -webkit-transform: translate3d(0, 100%, 0);
1174
- transform: translate3d(0, 100%, 0)
1175
- }
1176
- to {
1177
- opacity: 1;
1178
- -webkit-transform: none;
1179
- transform: none
1180
- }
1181
- }
1182
- .fadeInUp {
1183
- -webkit-animation-name: fadeInUp;
1184
- animation-name: fadeInUp
1185
- }
1186
- @-webkit-keyframes fadeInUpBig {
1187
- from {
1188
- opacity: 0;
1189
- -webkit-transform: translate3d(0, 2000px, 0);
1190
- transform: translate3d(0, 2000px, 0)
1191
- }
1192
- to {
1193
- opacity: 1;
1194
- -webkit-transform: none;
1195
- transform: none
1196
- }
1197
- }
1198
- @keyframes fadeInUpBig {
1199
- from {
1200
- opacity: 0;
1201
- -webkit-transform: translate3d(0, 2000px, 0);
1202
- transform: translate3d(0, 2000px, 0)
1203
- }
1204
- to {
1205
- opacity: 1;
1206
- -webkit-transform: none;
1207
- transform: none
1208
- }
1209
- }
1210
- .fadeInUpBig {
1211
- -webkit-animation-name: fadeInUpBig;
1212
- animation-name: fadeInUpBig
1213
- }
1214
- @-webkit-keyframes fadeOut {
1215
- from {
1216
- opacity: 1
1217
- }
1218
- to {
1219
- opacity: 0
1220
- }
1221
- }
1222
- @keyframes fadeOut {
1223
- from {
1224
- opacity: 1
1225
- }
1226
- to {
1227
- opacity: 0
1228
- }
1229
- }
1230
- .ycd-fadeOut {
1231
- -webkit-animation-name: fadeOut;
1232
- animation-name: fadeOut
1233
- }
1234
- @-webkit-keyframes fadeOutDown {
1235
- from {
1236
- opacity: 1
1237
- }
1238
- to {
1239
- opacity: 0;
1240
- -webkit-transform: translate3d(0, 100%, 0);
1241
- transform: translate3d(0, 100%, 0)
1242
- }
1243
- }
1244
- @keyframes fadeOutDown {
1245
- from {
1246
- opacity: 1
1247
- }
1248
- to {
1249
- opacity: 0;
1250
- -webkit-transform: translate3d(0, 100%, 0);
1251
- transform: translate3d(0, 100%, 0)
1252
- }
1253
- }
1254
- .fadeOutDown {
1255
- -webkit-animation-name: fadeOutDown;
1256
- animation-name: fadeOutDown
1257
- }
1258
- @-webkit-keyframes fadeOutDownBig {
1259
- from {
1260
- opacity: 1
1261
- }
1262
- to {
1263
- opacity: 0;
1264
- -webkit-transform: translate3d(0, 2000px, 0);
1265
- transform: translate3d(0, 2000px, 0)
1266
- }
1267
- }
1268
- @keyframes fadeOutDownBig {
1269
- from {
1270
- opacity: 1
1271
- }
1272
- to {
1273
- opacity: 0;
1274
- -webkit-transform: translate3d(0, 2000px, 0);
1275
- transform: translate3d(0, 2000px, 0)
1276
- }
1277
- }
1278
- .fadeOutDownBig {
1279
- -webkit-animation-name: fadeOutDownBig;
1280
- animation-name: fadeOutDownBig
1281
- }
1282
- @-webkit-keyframes fadeOutLeft {
1283
- from {
1284
- opacity: 1
1285
- }
1286
- to {
1287
- opacity: 0;
1288
- -webkit-transform: translate3d(-100%, 0, 0);
1289
- transform: translate3d(-100%, 0, 0)
1290
- }
1291
- }
1292
- @keyframes fadeOutLeft {
1293
- from {
1294
- opacity: 1
1295
- }
1296
- to {
1297
- opacity: 0;
1298
- -webkit-transform: translate3d(-100%, 0, 0);
1299
- transform: translate3d(-100%, 0, 0)
1300
- }
1301
- }
1302
- .fadeOutLeft {
1303
- -webkit-animation-name: fadeOutLeft;
1304
- animation-name: fadeOutLeft
1305
- }
1306
- @-webkit-keyframes fadeOutLeftBig {
1307
- from {
1308
- opacity: 1
1309
- }
1310
- to {
1311
- opacity: 0;
1312
- -webkit-transform: translate3d(-2000px, 0, 0);
1313
- transform: translate3d(-2000px, 0, 0)
1314
- }
1315
- }
1316
- @keyframes fadeOutLeftBig {
1317
- from {
1318
- opacity: 1
1319
- }
1320
- to {
1321
- opacity: 0;
1322
- -webkit-transform: translate3d(-2000px, 0, 0);
1323
- transform: translate3d(-2000px, 0, 0)
1324
- }
1325
- }
1326
- .fadeOutLeftBig {
1327
- -webkit-animation-name: fadeOutLeftBig;
1328
- animation-name: fadeOutLeftBig
1329
- }
1330
- @-webkit-keyframes fadeOutRight {
1331
- from {
1332
- opacity: 1
1333
- }
1334
- to {
1335
- opacity: 0;
1336
- -webkit-transform: translate3d(100%, 0, 0);
1337
- transform: translate3d(100%, 0, 0)
1338
- }
1339
- }
1340
- @keyframes fadeOutRight {
1341
- from {
1342
- opacity: 1
1343
- }
1344
- to {
1345
- opacity: 0;
1346
- -webkit-transform: translate3d(100%, 0, 0);
1347
- transform: translate3d(100%, 0, 0)
1348
- }
1349
- }
1350
- .fadeOutRight {
1351
- -webkit-animation-name: fadeOutRight;
1352
- animation-name: fadeOutRight
1353
- }
1354
- @-webkit-keyframes fadeOutRightBig {
1355
- from {
1356
- opacity: 1
1357
- }
1358
- to {
1359
- opacity: 0;
1360
- -webkit-transform: translate3d(2000px, 0, 0);
1361
- transform: translate3d(2000px, 0, 0)
1362
- }
1363
- }
1364
- @keyframes fadeOutRightBig {
1365
- from {
1366
- opacity: 1
1367
- }
1368
- to {
1369
- opacity: 0;
1370
- -webkit-transform: translate3d(2000px, 0, 0);
1371
- transform: translate3d(2000px, 0, 0)
1372
- }
1373
- }
1374
- .fadeOutRightBig {
1375
- -webkit-animation-name: fadeOutRightBig;
1376
- animation-name: fadeOutRightBig
1377
- }
1378
- @-webkit-keyframes fadeOutUp {
1379
- from {
1380
- opacity: 1
1381
- }
1382
- to {
1383
- opacity: 0;
1384
- -webkit-transform: translate3d(0, -100%, 0);
1385
- transform: translate3d(0, -100%, 0)
1386
- }
1387
- }
1388
- @keyframes fadeOutUp {
1389
- from {
1390
- opacity: 1
1391
- }
1392
- to {
1393
- opacity: 0;
1394
- -webkit-transform: translate3d(0, -100%, 0);
1395
- transform: translate3d(0, -100%, 0)
1396
- }
1397
- }
1398
- .fadeOutUp {
1399
- -webkit-animation-name: fadeOutUp;
1400
- animation-name: fadeOutUp
1401
- }
1402
- @-webkit-keyframes fadeOutUpBig {
1403
- from {
1404
- opacity: 1
1405
- }
1406
- to {
1407
- opacity: 0;
1408
- -webkit-transform: translate3d(0, -2000px, 0);
1409
- transform: translate3d(0, -2000px, 0)
1410
- }
1411
- }
1412
- @keyframes fadeOutUpBig {
1413
- from {
1414
- opacity: 1
1415
- }
1416
- to {
1417
- opacity: 0;
1418
- -webkit-transform: translate3d(0, -2000px, 0);
1419
- transform: translate3d(0, -2000px, 0)
1420
- }
1421
- }
1422
- .fadeOutUpBig {
1423
- -webkit-animation-name: fadeOutUpBig;
1424
- animation-name: fadeOutUpBig
1425
- }
1426
- @-webkit-keyframes flip {
1427
- from {
1428
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1429
- transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1430
- -webkit-animation-timing-function: ease-out;
1431
- animation-timing-function: ease-out
1432
- }
1433
- 40% {
1434
- -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1435
- transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1436
- -webkit-animation-timing-function: ease-out;
1437
- animation-timing-function: ease-out
1438
- }
1439
- 50% {
1440
- -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1441
- transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1442
- -webkit-animation-timing-function: ease-in;
1443
- animation-timing-function: ease-in
1444
- }
1445
- 80% {
1446
- -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
1447
- transform: perspective(400px) scale3d(.95, .95, .95);
1448
- -webkit-animation-timing-function: ease-in;
1449
- animation-timing-function: ease-in
1450
- }
1451
- to {
1452
- -webkit-transform: perspective(400px);
1453
- transform: perspective(400px);
1454
- -webkit-animation-timing-function: ease-in;
1455
- animation-timing-function: ease-in
1456
- }
1457
- }
1458
- @keyframes flip {
1459
- from {
1460
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1461
- transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1462
- -webkit-animation-timing-function: ease-out;
1463
- animation-timing-function: ease-out
1464
- }
1465
- 40% {
1466
- -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1467
- transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1468
- -webkit-animation-timing-function: ease-out;
1469
- animation-timing-function: ease-out
1470
- }
1471
- 50% {
1472
- -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1473
- transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1474
- -webkit-animation-timing-function: ease-in;
1475
- animation-timing-function: ease-in
1476
- }
1477
- 80% {
1478
- -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
1479
- transform: perspective(400px) scale3d(.95, .95, .95);
1480
- -webkit-animation-timing-function: ease-in;
1481
- animation-timing-function: ease-in
1482
- }
1483
- to {
1484
- -webkit-transform: perspective(400px);
1485
- transform: perspective(400px);
1486
- -webkit-animation-timing-function: ease-in;
1487
- animation-timing-function: ease-in
1488
- }
1489
- }
1490
- .ycd-animated.ycd-flip {
1491
- -webkit-backface-visibility: visible;
1492
- backface-visibility: visible;
1493
- -webkit-animation-name: flip;
1494
- animation-name: flip
1495
- }
1496
- @-webkit-keyframes flipInX {
1497
- from {
1498
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1499
- transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1500
- -webkit-animation-timing-function: ease-in;
1501
- animation-timing-function: ease-in;
1502
- opacity: 0
1503
- }
1504
- 40% {
1505
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1506
- transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1507
- -webkit-animation-timing-function: ease-in;
1508
- animation-timing-function: ease-in
1509
- }
1510
- 60% {
1511
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1512
- transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1513
- opacity: 1
1514
- }
1515
- 80% {
1516
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
1517
- transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
1518
- }
1519
- to {
1520
- -webkit-transform: perspective(400px);
1521
- transform: perspective(400px)
1522
- }
1523
- }
1524
- @keyframes flipInX {
1525
- from {
1526
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1527
- transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1528
- -webkit-animation-timing-function: ease-in;
1529
- animation-timing-function: ease-in;
1530
- opacity: 0
1531
- }
1532
- 40% {
1533
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1534
- transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1535
- -webkit-animation-timing-function: ease-in;
1536
- animation-timing-function: ease-in
1537
- }
1538
- 60% {
1539
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1540
- transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1541
- opacity: 1
1542
- }
1543
- 80% {
1544
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
1545
- transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
1546
- }
1547
- to {
1548
- -webkit-transform: perspective(400px);
1549
- transform: perspective(400px)
1550
- }
1551
- }
1552
- .ycd-flipInX {
1553
- backface-visibility: visible!important;
1554
- -webkit-animation-name: flipInX;
1555
- animation-name: flipInX
1556
- }
1557
- .flipInX,
1558
- .flipInY {
1559
- -webkit-backface-visibility: visible!important
1560
- }
1561
- @-webkit-keyframes flipInY {
1562
- from {
1563
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1564
- transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1565
- -webkit-animation-timing-function: ease-in;
1566
- animation-timing-function: ease-in;
1567
- opacity: 0
1568
- }
1569
- 40% {
1570
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1571
- transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1572
- -webkit-animation-timing-function: ease-in;
1573
- animation-timing-function: ease-in
1574
- }
1575
- 60% {
1576
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1577
- transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1578
- opacity: 1
1579
- }
1580
- 80% {
1581
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
1582
- transform: perspective(400px) rotate3d(0, 1, 0, -5deg)
1583
- }
1584
- to {
1585
- -webkit-transform: perspective(400px);
1586
- transform: perspective(400px)
1587
- }
1588
- }
1589
- @keyframes flipInY {
1590
- from {
1591
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1592
- transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1593
- -webkit-animation-timing-function: ease-in;
1594
- animation-timing-function: ease-in;
1595
- opacity: 0
1596
- }
1597
- 40% {
1598
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1599
- transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1600
- -webkit-animation-timing-function: ease-in;
1601
- animation-timing-function: ease-in
1602
- }
1603
- 60% {
1604
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1605
- transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1606
- opacity: 1
1607
- }
1608
- 80% {
1609
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
1610
- transform: perspective(400px) rotate3d(0, 1, 0, -5deg)
1611
- }
1612
- to {
1613
- -webkit-transform: perspective(400px);
1614
- transform: perspective(400px)
1615
- }
1616
- }
1617
- .flipInY {
1618
- backface-visibility: visible!important;
1619
- -webkit-animation-name: flipInY;
1620
- animation-name: flipInY
1621
- }
1622
- @-webkit-keyframes flipOutX {
1623
- from {
1624
- -webkit-transform: perspective(400px);
1625
- transform: perspective(400px)
1626
- }
1627
- 30% {
1628
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1629
- transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1630
- opacity: 1
1631
- }
1632
- to {
1633
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1634
- transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1635
- opacity: 0
1636
- }
1637
- }
1638
- @keyframes flipOutX {
1639
- from {
1640
- -webkit-transform: perspective(400px);
1641
- transform: perspective(400px)
1642
- }
1643
- 30% {
1644
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1645
- transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1646
- opacity: 1
1647
- }
1648
- to {
1649
- -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1650
- transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1651
- opacity: 0
1652
- }
1653
- }
1654
- .flipOutX {
1655
- -webkit-animation-name: flipOutX;
1656
- animation-name: flipOutX;
1657
- backface-visibility: visible!important
1658
- }
1659
- .flipOutX,
1660
- .flipOutY {
1661
- -webkit-backface-visibility: visible!important
1662
- }
1663
- @-webkit-keyframes flipOutY {
1664
- from {
1665
- -webkit-transform: perspective(400px);
1666
- transform: perspective(400px)
1667
- }
1668
- 30% {
1669
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1670
- transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1671
- opacity: 1
1672
- }
1673
- to {
1674
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1675
- transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1676
- opacity: 0
1677
- }
1678
- }
1679
- @keyframes flipOutY {
1680
- from {
1681
- -webkit-transform: perspective(400px);
1682
- transform: perspective(400px)
1683
- }
1684
- 30% {
1685
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1686
- transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1687
- opacity: 1
1688
- }
1689
- to {
1690
- -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1691
- transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1692
- opacity: 0
1693
- }
1694
- }
1695
- .flipOutY {
1696
- backface-visibility: visible!important;
1697
- -webkit-animation-name: flipOutY;
1698
- animation-name: flipOutY
1699
- }
1700
- @-webkit-keyframes lightSpeedIn {
1701
- from {
1702
- -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
1703
- transform: translate3d(100%, 0, 0) skewX(-30deg);
1704
- opacity: 0
1705
- }
1706
- 60% {
1707
- -webkit-transform: skewX(20deg);
1708
- transform: skewX(20deg);
1709
- opacity: 1
1710
- }
1711
- 80% {
1712
- -webkit-transform: skewX(-5deg);
1713
- transform: skewX(-5deg);
1714
- opacity: 1
1715
- }
1716
- to {
1717
- -webkit-transform: none;
1718
- transform: none;
1719
- opacity: 1
1720
- }
1721
- }
1722
- @keyframes lightSpeedIn {
1723
- from {
1724
- -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
1725
- transform: translate3d(100%, 0, 0) skewX(-30deg);
1726
- opacity: 0
1727
- }
1728
- 60% {
1729
- -webkit-transform: skewX(20deg);
1730
- transform: skewX(20deg);
1731
- opacity: 1
1732
- }
1733
- 80% {
1734
- -webkit-transform: skewX(-5deg);
1735
- transform: skewX(-5deg);
1736
- opacity: 1
1737
- }
1738
- to {
1739
- -webkit-transform: none;
1740
- transform: none;
1741
- opacity: 1
1742
- }
1743
- }
1744
- .lightSpeedIn {
1745
- -webkit-animation-name: lightSpeedIn;
1746
- animation-name: lightSpeedIn;
1747
- -webkit-animation-timing-function: ease-out;
1748
- animation-timing-function: ease-out
1749
- }
1750
- @-webkit-keyframes lightSpeedOut {
1751
- from {
1752
- opacity: 1
1753
- }
1754
- to {
1755
- -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
1756
- transform: translate3d(100%, 0, 0) skewX(30deg);
1757
- opacity: 0
1758
- }
1759
- }
1760
- @keyframes lightSpeedOut {
1761
- from {
1762
- opacity: 1
1763
- }
1764
- to {
1765
- -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
1766
- transform: translate3d(100%, 0, 0) skewX(30deg);
1767
- opacity: 0
1768
- }
1769
- }
1770
- .lightSpeedOut {
1771
- -webkit-animation-name: lightSpeedOut;
1772
- animation-name: lightSpeedOut;
1773
- -webkit-animation-timing-function: ease-in;
1774
- animation-timing-function: ease-in
1775
- }
1776
- @-webkit-keyframes rotateIn {
1777
- from {
1778
- -webkit-transform-origin: center;
1779
- transform-origin: center;
1780
- -webkit-transform: rotate3d(0, 0, 1, -200deg);
1781
- transform: rotate3d(0, 0, 1, -200deg);
1782
- opacity: 0
1783
- }
1784
- to {
1785
- -webkit-transform-origin: center;
1786
- transform-origin: center;
1787
- -webkit-transform: none;
1788
- transform: none;
1789
- opacity: 1
1790
- }
1791
- }
1792
- @keyframes rotateIn {
1793
- from {
1794
- -webkit-transform-origin: center;
1795
- transform-origin: center;
1796
- -webkit-transform: rotate3d(0, 0, 1, -200deg);
1797
- transform: rotate3d(0, 0, 1, -200deg);
1798
- opacity: 0
1799
- }
1800
- to {
1801
- -webkit-transform-origin: center;
1802
- transform-origin: center;
1803
- -webkit-transform: none;
1804
- transform: none;
1805
- opacity: 1
1806
- }
1807
- }
1808
- .ycd-rotateIn {
1809
- -webkit-animation-name: rotateIn;
1810
- animation-name: rotateIn
1811
- }
1812
- @-webkit-keyframes rotateInDownLeft {
1813
- from {
1814
- -webkit-transform-origin: left bottom;
1815
- transform-origin: left bottom;
1816
- -webkit-transform: rotate3d(0, 0, 1, -45deg);
1817
- transform: rotate3d(0, 0, 1, -45deg);
1818
- opacity: 0
1819
- }
1820
- to {
1821
- -webkit-transform-origin: left bottom;
1822
- transform-origin: left bottom;
1823
- -webkit-transform: none;
1824
- transform: none;
1825
- opacity: 1
1826
- }
1827
- }
1828
- @keyframes rotateInDownLeft {
1829
- from {
1830
- -webkit-transform-origin: left bottom;
1831
- transform-origin: left bottom;
1832
- -webkit-transform: rotate3d(0, 0, 1, -45deg);
1833
- transform: rotate3d(0, 0, 1, -45deg);
1834
- opacity: 0
1835
- }
1836
- to {
1837
- -webkit-transform-origin: left bottom;
1838
- transform-origin: left bottom;
1839
- -webkit-transform: none;
1840
- transform: none;
1841
- opacity: 1
1842
- }
1843
- }
1844
- .ycd-rotateInDownLeft {
1845
- -webkit-animation-name: rotateInDownLeft;
1846
- animation-name: rotateInDownLeft
1847
- }
1848
- @-webkit-keyframes rotateInDownRight {
1849
- from {
1850
- -webkit-transform-origin: right bottom;
1851
- transform-origin: right bottom;
1852
- -webkit-transform: rotate3d(0, 0, 1, 45deg);
1853
- transform: rotate3d(0, 0, 1, 45deg);
1854
- opacity: 0
1855
- }
1856
- to {
1857
- -webkit-transform-origin: right bottom;
1858
- transform-origin: right bottom;
1859
- -webkit-transform: none;
1860
- transform: none;
1861
- opacity: 1
1862
- }
1863
- }
1864
- @keyframes rotateInDownRight {
1865
- from {
1866
- -webkit-transform-origin: right bottom;
1867
- transform-origin: right bottom;
1868
- -webkit-transform: rotate3d(0, 0, 1, 45deg);
1869
- transform: rotate3d(0, 0, 1, 45deg);
1870
- opacity: 0
1871
- }
1872
- to {
1873
- -webkit-transform-origin: right bottom;
1874
- transform-origin: right bottom;
1875
- -webkit-transform: none;
1876
- transform: none;
1877
- opacity: 1
1878
- }
1879
- }
1880
- .rotateInDownRight {
1881
- -webkit-animation-name: rotateInDownRight;
1882
- animation-name: rotateInDownRight
1883
- }
1884
- @-webkit-keyframes rotateInUpLeft {
1885
- from {
1886
- -webkit-transform-origin: left bottom;
1887
- transform-origin: left bottom;
1888
- -webkit-transform: rotate3d(0, 0, 1, 45deg);
1889
- transform: rotate3d(0, 0, 1, 45deg);
1890
- opacity: 0
1891
- }
1892
- to {
1893
- -webkit-transform-origin: left bottom;
1894
- transform-origin: left bottom;
1895
- -webkit-transform: none;
1896
- transform: none;
1897
- opacity: 1
1898
- }
1899
- }
1900
- @keyframes rotateInUpLeft {
1901
- from {
1902
- -webkit-transform-origin: left bottom;
1903
- transform-origin: left bottom;
1904
- -webkit-transform: rotate3d(0, 0, 1, 45deg);
1905
- transform: rotate3d(0, 0, 1, 45deg);
1906
- opacity: 0
1907
- }
1908
- to {
1909
- -webkit-transform-origin: left bottom;
1910
- transform-origin: left bottom;
1911
- -webkit-transform: none;
1912
- transform: none;
1913
- opacity: 1
1914
- }
1915
- }
1916
- .rotateInUpLeft {
1917
- -webkit-animation-name: rotateInUpLeft;
1918
- animation-name: rotateInUpLeft
1919
- }
1920
- @-webkit-keyframes rotateInUpRight {
1921
- from {
1922
- -webkit-transform-origin: right bottom;
1923
- transform-origin: right bottom;
1924
- -webkit-transform: rotate3d(0, 0, 1, -90deg);
1925
- transform: rotate3d(0, 0, 1, -90deg);
1926
- opacity: 0
1927
- }
1928
- to {
1929
- -webkit-transform-origin: right bottom;
1930
- transform-origin: right bottom;
1931
- -webkit-transform: none;
1932
- transform: none;
1933
- opacity: 1
1934
- }
1935
- }
1936
- @keyframes rotateInUpRight {
1937
- from {
1938
- -webkit-transform-origin: right bottom;
1939
- transform-origin: right bottom;
1940
- -webkit-transform: rotate3d(0, 0, 1, -90deg);
1941
- transform: rotate3d(0, 0, 1, -90deg);
1942
- opacity: 0
1943
- }
1944
- to {
1945
- -webkit-transform-origin: right bottom;
1946
- transform-origin: right bottom;
1947
- -webkit-transform: none;
1948
- transform: none;
1949
- opacity: 1
1950
- }
1951
- }
1952
- .rotateInUpRight {
1953
- -webkit-animation-name: rotateInUpRight;
1954
- animation-name: rotateInUpRight
1955
- }
1956
- @-webkit-keyframes rotateOut {
1957
- from {
1958
- -webkit-transform-origin: center;
1959
- transform-origin: center;
1960
- opacity: 1
1961
- }
1962
- to {
1963
- -webkit-transform-origin: center;
1964
- transform-origin: center;
1965
- -webkit-transform: rotate3d(0, 0, 1, 200deg);
1966
- transform: rotate3d(0, 0, 1, 200deg);
1967
- opacity: 0
1968
- }
1969
- }
1970
- @keyframes rotateOut {
1971
- from {
1972
- -webkit-transform-origin: center;
1973
- transform-origin: center;
1974
- opacity: 1
1975
- }
1976
- to {
1977
- -webkit-transform-origin: center;
1978
- transform-origin: center;
1979
- -webkit-transform: rotate3d(0, 0, 1, 200deg);
1980
- transform: rotate3d(0, 0, 1, 200deg);
1981
- opacity: 0
1982
- }
1983
- }
1984
- .ycd-rotateOut {
1985
- -webkit-animation-name: rotateOut;
1986
- animation-name: rotateOut
1987
- }
1988
- @-webkit-keyframes rotateOutDownLeft {
1989
- from {
1990
- -webkit-transform-origin: left bottom;
1991
- transform-origin: left bottom;
1992
- opacity: 1
1993
- }
1994
- to {
1995
- -webkit-transform-origin: left bottom;
1996
- transform-origin: left bottom;
1997
- -webkit-transform: rotate3d(0, 0, 1, 45deg);
1998
- transform: rotate3d(0, 0, 1, 45deg);
1999
- opacity: 0
2000
- }
2001
- }
2002
- @keyframes rotateOutDownLeft {
2003
- from {
2004
- -webkit-transform-origin: left bottom;
2005
- transform-origin: left bottom;
2006
- opacity: 1
2007
- }
2008
- to {
2009
- -webkit-transform-origin: left bottom;
2010
- transform-origin: left bottom;
2011
- -webkit-transform: rotate3d(0, 0, 1, 45deg);
2012
- transform: rotate3d(0, 0, 1, 45deg);
2013
- opacity: 0
2014
- }
2015
- }
2016
- .rotateOutDownLeft {
2017
- -webkit-animation-name: rotateOutDownLeft;
2018
- animation-name: rotateOutDownLeft
2019
- }
2020
- @-webkit-keyframes rotateOutDownRight {
2021
- from {
2022
- -webkit-transform-origin: right bottom;
2023
- transform-origin: right bottom;
2024
- opacity: 1
2025
- }
2026
- to {
2027
- -webkit-transform-origin: right bottom;
2028
- transform-origin: right bottom;
2029
- -webkit-transform: rotate3d(0, 0, 1, -45deg);
2030
- transform: rotate3d(0, 0, 1, -45deg);
2031
- opacity: 0
2032
- }
2033
- }
2034
- @keyframes rotateOutDownRight {
2035
- from {
2036
- -webkit-transform-origin: right bottom;
2037
- transform-origin: right bottom;
2038
- opacity: 1
2039
- }
2040
- to {
2041
- -webkit-transform-origin: right bottom;
2042
- transform-origin: right bottom;
2043
- -webkit-transform: rotate3d(0, 0, 1, -45deg);
2044
- transform: rotate3d(0, 0, 1, -45deg);
2045
- opacity: 0
2046
- }
2047
- }
2048
- .rotateOutDownRight {
2049
- -webkit-animation-name: rotateOutDownRight;
2050
- animation-name: rotateOutDownRight
2051
- }
2052
- @-webkit-keyframes rotateOutUpLeft {
2053
- from {
2054
- -webkit-transform-origin: left bottom;
2055
- transform-origin: left bottom;
2056
- opacity: 1
2057
- }
2058
- to {
2059
- -webkit-transform-origin: left bottom;
2060
- transform-origin: left bottom;
2061
- -webkit-transform: rotate3d(0, 0, 1, -45deg);
2062
- transform: rotate3d(0, 0, 1, -45deg);
2063
- opacity: 0
2064
- }
2065
- }
2066
- @keyframes rotateOutUpLeft {
2067
- from {
2068
- -webkit-transform-origin: left bottom;
2069
- transform-origin: left bottom;
2070
- opacity: 1
2071
- }
2072
- to {
2073
- -webkit-transform-origin: left bottom;
2074
- transform-origin: left bottom;
2075
- -webkit-transform: rotate3d(0, 0, 1, -45deg);
2076
- transform: rotate3d(0, 0, 1, -45deg);
2077
- opacity: 0
2078
- }
2079
- }
2080
- .rotateOutUpLeft {
2081
- -webkit-animation-name: rotateOutUpLeft;
2082
- animation-name: rotateOutUpLeft
2083
- }
2084
- @-webkit-keyframes rotateOutUpRight {
2085
- from {
2086
- -webkit-transform-origin: right bottom;
2087
- transform-origin: right bottom;
2088
- opacity: 1
2089
- }
2090
- to {
2091
- -webkit-transform-origin: right bottom;
2092
- transform-origin: right bottom;
2093
- -webkit-transform: rotate3d(0, 0, 1, 90deg);
2094
- transform: rotate3d(0, 0, 1, 90deg);
2095
- opacity: 0
2096
- }
2097
- }
2098
- @keyframes rotateOutUpRight {
2099
- from {
2100
- -webkit-transform-origin: right bottom;
2101
- transform-origin: right bottom;
2102
- opacity: 1
2103
- }
2104
- to {
2105
- -webkit-transform-origin: right bottom;
2106
- transform-origin: right bottom;
2107
- -webkit-transform: rotate3d(0, 0, 1, 90deg);
2108
- transform: rotate3d(0, 0, 1, 90deg);
2109
- opacity: 0
2110
- }
2111
- }
2112
- .rotateOutUpRight {
2113
- -webkit-animation-name: rotateOutUpRight;
2114
- animation-name: rotateOutUpRight
2115
- }
2116
- @-webkit-keyframes hinge {
2117
- 0% {
2118
- -webkit-transform-origin: top left;
2119
- transform-origin: top left;
2120
- -webkit-animation-timing-function: ease-in-out;
2121
- animation-timing-function: ease-in-out
2122
- }
2123
- 20%,
2124
- 60% {
2125
- -webkit-transform: rotate3d(0, 0, 1, 80deg);
2126
- transform: rotate3d(0, 0, 1, 80deg);
2127
- -webkit-transform-origin: top left;
2128
- transform-origin: top left;
2129
- -webkit-animation-timing-function: ease-in-out;
2130
- animation-timing-function: ease-in-out
2131
- }
2132
- 40%,
2133
- 80% {
2134
- -webkit-transform: rotate3d(0, 0, 1, 60deg);
2135
- transform: rotate3d(0, 0, 1, 60deg);
2136
- -webkit-transform-origin: top left;
2137
- transform-origin: top left;
2138
- -webkit-animation-timing-function: ease-in-out;
2139
- animation-timing-function: ease-in-out;
2140
- opacity: 1
2141
- }
2142
- to {
2143
- -webkit-transform: translate3d(0, 700px, 0);
2144
- transform: translate3d(0, 700px, 0);
2145
- opacity: 0
2146
- }
2147
- }
2148
- @keyframes hinge {
2149
- 0% {
2150
- -webkit-transform-origin: top left;
2151
- transform-origin: top left;
2152
- -webkit-animation-timing-function: ease-in-out;
2153
- animation-timing-function: ease-in-out
2154
- }
2155
- 20%,
2156
- 60% {
2157
- -webkit-transform: rotate3d(0, 0, 1, 80deg);
2158
- transform: rotate3d(0, 0, 1, 80deg);
2159
- -webkit-transform-origin: top left;
2160
- transform-origin: top left;
2161
- -webkit-animation-timing-function: ease-in-out;
2162
- animation-timing-function: ease-in-out
2163
- }
2164
- 40%,
2165
- 80% {
2166
- -webkit-transform: rotate3d(0, 0, 1, 60deg);
2167
- transform: rotate3d(0, 0, 1, 60deg);
2168
- -webkit-transform-origin: top left;
2169
- transform-origin: top left;
2170
- -webkit-animation-timing-function: ease-in-out;
2171
- animation-timing-function: ease-in-out;
2172
- opacity: 1
2173
- }
2174
- to {
2175
- -webkit-transform: translate3d(0, 700px, 0);
2176
- transform: translate3d(0, 700px, 0);
2177
- opacity: 0
2178
- }
2179
- }
2180
- .hinge {
2181
- -webkit-animation-name: hinge;
2182
- animation-name: hinge
2183
- }
2184
- @-webkit-keyframes rollIn {
2185
- from {
2186
- opacity: 0;
2187
- -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
2188
- transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
2189
- }
2190
- to {
2191
- opacity: 1;
2192
- -webkit-transform: none;
2193
- transform: none
2194
- }
2195
- }
2196
- @keyframes rollIn {
2197
- from {
2198
- opacity: 0;
2199
- -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
2200
- transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
2201
- }
2202
- to {
2203
- opacity: 1;
2204
- -webkit-transform: none;
2205
- transform: none
2206
- }
2207
- }
2208
- .rollIn {
2209
- -webkit-animation-name: rollIn;
2210
- animation-name: rollIn
2211
- }
2212
- @-webkit-keyframes rollOut {
2213
- from {
2214
- opacity: 1
2215
- }
2216
- to {
2217
- opacity: 0;
2218
- -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
2219
- transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)
2220
- }
2221
- }
2222
- @keyframes rollOut {
2223
- from {
2224
- opacity: 1
2225
- }
2226
- to {
2227
- opacity: 0;
2228
- -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
2229
- transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)
2230
- }
2231
- }
2232
- .rollOut {
2233
- -webkit-animation-name: rollOut;
2234
- animation-name: rollOut
2235
- }
2236
- @-webkit-keyframes zoomIn {
2237
- from {
2238
- opacity: 0;
2239
- -webkit-transform: scale3d(.3, .3, .3);
2240
- transform: scale3d(.3, .3, .3)
2241
- }
2242
- 50% {
2243
- opacity: 1
2244
- }
2245
- }
2246
- @keyframes zoomIn {
2247
- from {
2248
- opacity: 0;
2249
- -webkit-transform: scale3d(.3, .3, .3);
2250
- transform: scale3d(.3, .3, .3)
2251
- }
2252
- 50% {
2253
- opacity: 1
2254
- }
2255
- }
2256
- .zoomIn {
2257
- -webkit-animation-name: zoomIn;
2258
- animation-name: zoomIn
2259
- }
2260
- @-webkit-keyframes zoomInDown {
2261
- from {
2262
- opacity: 0;
2263
- -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
2264
- transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
2265
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2266
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2267
- }
2268
- 60% {
2269
- opacity: 1;
2270
- -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2271
- transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2272
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2273
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2274
- }
2275
- }
2276
- @keyframes zoomInDown {
2277
- from {
2278
- opacity: 0;
2279
- -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
2280
- transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
2281
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2282
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2283
- }
2284
- 60% {
2285
- opacity: 1;
2286
- -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2287
- transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
2288
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2289
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2290
- }
2291
- }
2292
- .zoomInDown {
2293
- -webkit-animation-name: zoomInDown;
2294
- animation-name: zoomInDown
2295
- }
2296
- @-webkit-keyframes zoomInLeft {
2297
- from {
2298
- opacity: 0;
2299
- -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
2300
- transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
2301
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2302
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2303
- }
2304
- 60% {
2305
- opacity: 1;
2306
- -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
2307
- transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
2308
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2309
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2310
- }
2311
- }
2312
- @keyframes zoomInLeft {
2313
- from {
2314
- opacity: 0;
2315
- -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
2316
- transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
2317
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2318
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2319
- }
2320
- 60% {
2321
- opacity: 1;
2322
- -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
2323
- transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
2324
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2325
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2326
- }
2327
- }
2328
- .zoomInLeft {
2329
- -webkit-animation-name: zoomInLeft;
2330
- animation-name: zoomInLeft
2331
- }
2332
- @-webkit-keyframes zoomInRight {
2333
- from {
2334
- opacity: 0;
2335
- -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
2336
- transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
2337
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2338
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2339
- }
2340
- 60% {
2341
- opacity: 1;
2342
- -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
2343
- transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
2344
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2345
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2346
- }
2347
- }
2348
- @keyframes zoomInRight {
2349
- from {
2350
- opacity: 0;
2351
- -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
2352
- transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
2353
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2354
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2355
- }
2356
- 60% {
2357
- opacity: 1;
2358
- -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
2359
- transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
2360
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2361
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2362
- }
2363
- }
2364
- .zoomInRight {
2365
- -webkit-animation-name: zoomInRight;
2366
- animation-name: zoomInRight
2367
- }
2368
- @-webkit-keyframes zoomInUp {
2369
- from {
2370
- opacity: 0;
2371
- -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
2372
- transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
2373
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2374
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2375
- }
2376
- 60% {
2377
- opacity: 1;
2378
- -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2379
- transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2380
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2381
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2382
- }
2383
- }
2384
- @keyframes zoomInUp {
2385
- from {
2386
- opacity: 0;
2387
- -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
2388
- transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
2389
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2390
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2391
- }
2392
- 60% {
2393
- opacity: 1;
2394
- -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2395
- transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2396
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2397
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2398
- }
2399
- }
2400
- .zoomInUp {
2401
- -webkit-animation-name: zoomInUp;
2402
- animation-name: zoomInUp
2403
- }
2404
- @-webkit-keyframes zoomOut {
2405
- from {
2406
- opacity: 1
2407
- }
2408
- 50% {
2409
- opacity: 0;
2410
- -webkit-transform: scale3d(.3, .3, .3);
2411
- transform: scale3d(.3, .3, .3)
2412
- }
2413
- to {
2414
- opacity: 0
2415
- }
2416
- }
2417
- @keyframes zoomOut {
2418
- from {
2419
- opacity: 1
2420
- }
2421
- 50% {
2422
- opacity: 0;
2423
- -webkit-transform: scale3d(.3, .3, .3);
2424
- transform: scale3d(.3, .3, .3)
2425
- }
2426
- to {
2427
- opacity: 0
2428
- }
2429
- }
2430
- .zoomOut {
2431
- -webkit-animation-name: zoomOut;
2432
- animation-name: zoomOut
2433
- }
2434
- @-webkit-keyframes zoomOutDown {
2435
- 40% {
2436
- opacity: 1;
2437
- -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2438
- transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2439
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2440
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2441
- }
2442
- to {
2443
- opacity: 0;
2444
- -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
2445
- transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
2446
- -webkit-transform-origin: center bottom;
2447
- transform-origin: center bottom;
2448
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2449
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2450
- }
2451
- }
2452
- @keyframes zoomOutDown {
2453
- 40% {
2454
- opacity: 1;
2455
- -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2456
- transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
2457
- -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
2458
- animation-timing-function: cubic-bezier(.55, .055, .675, .19)
2459
- }
2460
- to {
2461
- opacity: 0;
2462
- -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
2463
- transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
2464
- -webkit-transform-origin: center bottom;
2465
- transform-origin: center bottom;
2466
- -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
2467
- animation-timing-function: cubic-bezier(.175, .885, .32, 1)
2468
- }
2469
- }
2470
- .zoomOutDown {
2471
- -webkit-animation-name: zoomOutDown;
2472
- animation-name: zoomOutDown
2473
- }
2474
- @-webkit-keyframes zoomOutLeft {
2475
- 40% {
2476
- opacity: 1;
2477
- -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
2478
- transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
2479
- }
2480
- to {
2481
- opacity: 0;
2482
- -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
2483
- transform: scale(.1) translate3d(-2000px, 0, 0);
2484
- -webkit-transform-origin: left center;
2485
- transform-origin: left center
2486
- }
2487
- }
2488
- @keyframes zoomOutLeft {
2489
- 40% {
2490
- opacity: 1;
2491
- -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
2492
- transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
2493
- }
2494
- to {
2495
- opacity: 0;
2496
- -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
2497
- transform: scale(.1) translate3d(-2000px, 0, 0);
2498
- -webkit-transform-origin: left center;
2499
- transform-origin: left center
2500
- }
2501
- }
2502
- .zoomOutLeft {
2503