@alicloudfe/components
Version:
A react component library for aliyun
2,006 lines (1,914 loc) • 1.17 MB
CSS
@charset "UTF-8";
:root {
/* button */
--btn-pure-primary-bg-image: linear-gradient(90deg, #1B58F4 0%, #457AFF 100%);
--btn-pure-normal-bg-hover: #E5E5E5;
--btn-pure-normal-border-color-hover: #E5E5E5;
--progress-line-normal-bg-color: linear-gradient(90deg, #1B58F4 0%, #457AFF 100%);
/* nav */
--nav-secondary-item-selected-bg: transparent;
--nav-ver-height: 32px;
--menu-background-selected: transparent;
--nav-normal-item-selected-text-color: #236BEF;
--nav-ver-item-selected-active-line: 0px;
--nav-ver-sub-nav-height: 32px;
--nav-normal-item-selected-text-style: normal;
--nav-primary-item-selected-text-style: normal;
--nav-group-height: 32px;
--nav-group-font-size: 12px;
--menu-padding-title-horizontal: 20px;
/* avatar */
--next-avatar-bg-color: #1B58F4;
/* checkbox */
--checkbox-icon-scale: 0.6;
--checkbox-disabled-only-border-color: #d9d9d9;
--checkbox-disabled-only-bg-color: #f9f9f9;
/* balloon */
--balloon-tooltip-color-bg: #4e4e4e;
--balloon-normal-color-bg: #515151;
--balloon-primary-color-bg: #515151;
--balloon-primary-color-border: #515151;
--balloon-primary-color: #ffffff;
--balloon-size-close-margin-top: 9px;
--balloon-size-close: 8px;
/* menu */
--menu-padding-horizontal-selectable: 32px;
--select-menu-select-icon-ml: -16px;
/* search */
--search-normal-normal-hover-color: #d9d9d9;
--search-normal-normal-btn-hover-bg-color: #f3f3f3;
--search-normal-normal-btn-hover-text-color: #595959;
--search-normal-primary-hover-color: #d9d9d9;
--search-normal-secondary-hover-color: #d9d9d9;
--search-simple-corner: 4px;
/* message */
--message-help-color-icon-toast: #888888;
--message-help-color-icon-inline: #888888;
/* tag */
--tag-cursor: pointer;
--tag-hover-bg: #e5e5e5;
--breadcrumb-icon-color: #727272;
--btn-ghost-light-border-color: #1B59F4;
--btn-ghost-light-color: #1B59F4;
--btn-ghost-dark-border-color: rgba(255,255,255,0.1);
--btn-ghost-dark-color: #457AFF;
--btn-pure-secondary-bg-hover: #F5FAFF;
--btn-pure-secondary-border-color-hover: #154CD9;
--btn-warning-primary-bg: #D32020;
--btn-warning-primary-border-color: #D32020;
--btn-warning-primary-bg-hover: #C11919;
--btn-warning-primary-border-color-hover: #C11919;
--cascader-menu-icon-hover-expand-color: #727272;
--menu-checkbox-mr: 16px;
--calendar-card-table-cell-hover-background: #E5E5E5;
--calendar-card-table-cell-hover-color: #595959;
--calendar-card-table-cell-hover-border-color: #E5E5E5;
--calendar-card-table-cell-normal-background: transparent;
--calendar-card-table-cell-normal-border-color: transparent;
--calendar-card-table-cell-current-background: transparent;
--calendar-card-table-cell-current-border-color: transparent;
--time-picker-menu-item-background: #f9f9f9;
--time-picker-menu-title-background: #f9f9f9;
--collapse-title-height: 18px;
--collapse-icon-color: #737373;
--collapse-title-font-disabled-color:#BEBEBE;
--collapse-title-disabled-bg-color:#F3F3F3;
--collapse-title-hover-bg-color: #e5e5e5;
--radio-hovered-bg-color: transparent;
--radio-checked-bg-color: transparent;
--radio-checked-circle-color: #457AFF;
--radio-circle-size: 8px;
--radio-checked-hovered-bg-color: transparent;
--radio-checked-hovered-border-color: #1B58F4;
--radio-checked-hovered-circle-color: #457AFF;
--radio-checked-disabled-border-color: #bebebe;
--radio-checked-disabled-bg-color: #bebebe;
--radio-checked-disabled-circle-color: #8c8c8c;
--radio-disabled-border-color: #bebebe;
--radio-disabled-bg-color: #bebebe;
--radio-border-color: #8c8c8c;
--radio-button-corner-small: 4px;
--radio-button-corner-medium: 4px;
--radio-button-corner-large: 4px;
--progress-circle-underlay-width: 4px;
--progress-circle-overlay-width: 4px;
--checkbox-disabled-circle-color: #cccccc;
--checkbox-checked-hovered-bg-color: #1752E4;
--checkbox-checked-hovered-border-color: transparent;
--checkbox-checked-hovered-circle-color: #ffffff;
--input-border-color: #d9d9d9;
--input-feedback-error-border-color: #D32020;
--active-shadow: 0 4px 8px 0 rgba(0,0,0,0.01);
--active-transition: 0.3s;
--notification-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
--pagination-item-split: 1px;
--pagination-item-hover-bg: #E5E5E5;
--pagination-item-disabled-bg: #f3f3f3;
--pagination-large-item-split: 1px;
--pagination-small-item-split: 1px;
--tab-wrapped-tab-margin-right: 1px;
--tab-wrapped-tab-margin-bottom: 1px;
--tab-item-padding-tb-size-s: 10px;
--tab-item-padding-lr-size-s: 16px;
--tab-item-padding-tb-size-m: 12px;
--tab-item-padding-lr-size-m: 16px;
--list-size-m-item-media-margin: 16px;
--list-size-m-item-padding-lr: 16px;
--list-size-m-item-title-font-size: 12px;
--list-size-m-item-content-font-size: 12px;
--list-size-s-item-padding-tb: 16px;
--list-size-s-item-padding-lr: 16px;
--list-size-s-item-media-margin: 16px;
--list-size-s-item-title-font-size: 12px;
--badge-color-bg: #C82727;
--dialog-close-width: 12px;
--dialog-close-height: 12px;
--dialog-close-right: 22px;
--dialog-close-top: 22px;
--dialog-close-color: #737373;
--dialog-title-color: #000000;
--message-size-m-border-radius: 4px;
--message-close-icon-color: #737373;
--message-notice-color-bg-inline: #EAF1FE;
--message-notice-color-border-inline: #EAF1FE;
--message-error-color-bg-inline: #FFEBEC;
--message-error-color-border-inline: #FFEBEC;
--message-waring-color-bg-inline: #FFF7E5;
--message-waring-color-border-inline: #FFF7E5;
--message-warning-color-icon-toast: #FFAA14;
--message-warning-color-icon-inline: #FFAA14;
--message-warning-color-icon-addon: #FFAA14;
--message-success-color-icon-toast: #29A64E;
--message-success-color-icon-inline: #29A64E;
--message-success-color-icon-addon: #29A64E;
--message-error-color-icon-toast: #C82728;
--message-error-color-icon-inline: #C82728;
--message-error-color-icon-addon: #C82728;
--drawer-title-border-width: 0px;
--upload-card-add-text-margin-top: 4px;
--range-size-m-track-radius: 2px;
--table-cell-padding-top: 10px;
--table-header-padding-top: 10px;
}
/*!
* @alife/theme-5785@0.4.1 (https://fusion.design)
* @alifd/next@1.21.13 (https://fusion.design)
* Copyright 2018-present Alibaba Group,
* Licensed under MIT (https://github.com/alibaba-fusion/next/blob/master/LICENSE)
*/
/**
* 尺寸 基础尺寸
* 命名能在语义的前提下简单就尽量简单, 这里可以是 size-2x, space-2x, size-base ...
* 不过可以在语义的前提下做的更精简一些, 于是用了s2, s1等
* 可用变量: `$s1 - $s8`
* @example scss - 使用
* .element {
* padding: $s1 !default;
* }
*
* @example css - CSS 输出
* .element {
* padding: 4px !default;
* }
*/
.next-sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
margin: -1px;
}
/* stylelint-disable */
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in
* IE on Windows Phone and in iOS.
*/
html {
line-height: 1.15;
/* 1 */
-ms-text-size-adjust: 100%;
/* 2 */
-webkit-text-size-adjust: 100%;
/* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers (opinionated).
*/
body {
margin: 0;
}
/**
* Add the correct display in IE 9-.
*/
article,
aside,
footer,
header,
nav,
section {
display: block;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* Add the correct display in IE 9-.
* 1. Add the correct display in IE.
*/
figcaption,
figure,
main {
/* 1 */
display: block;
}
/**
* Add the correct margin in IE 8.
*/
figure {
margin: 1em 40px;
}
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
-webkit-box-sizing: content-box;
box-sizing: content-box;
/* 1 */
height: 0;
/* 1 */
overflow: visible;
/* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace;
/* 1 */
font-size: 1em;
/* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* 1. Remove the gray background on active links in IE 10.
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
*/
a {
background-color: transparent;
/* 1 */
-webkit-text-decoration-skip: objects;
/* 2 */
}
/**
* 1. Remove the bottom border in Chrome 57- and Firefox 39-.
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none;
/* 1 */
text-decoration: underline;
/* 2 */
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
/* 2 */
}
/**
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
*/
b,
strong {
font-weight: inherit;
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace;
/* 1 */
font-size: 1em;
/* 2 */
}
/**
* Add the correct font style in Android 4.3-.
*/
dfn {
font-style: italic;
}
/**
* Add the correct background and color in IE 9-.
*/
mark {
background-color: #FF0;
color: #000;
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Add the correct display in IE 9-.
*/
audio,
video {
display: inline-block;
}
/**
* Add the correct display in iOS 4-7.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Remove the border on images inside links in IE 10-.
*/
img {
border-style: none;
}
/**
* Hide the overflow in IE.
*/
svg:not(:root) {
overflow: hidden;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers (opinionated).
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: sans-serif;
/* 1 */
font-size: 100%;
/* 1 */
line-height: 1.15;
/* 1 */
margin: 0;
/* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input {
/* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
/* 1 */
text-transform: none;
}
/**
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
* controls in Android 4.
* 2. Correct the inability to style clickable types in iOS and Safari.
*/
button,
html [type=button],
[type=reset],
[type=submit] {
-webkit-appearance: button;
/* 2 */
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* 1 */
color: inherit;
/* 2 */
display: table;
/* 1 */
max-width: 100%;
/* 1 */
padding: 0;
/* 3 */
white-space: normal;
/* 1 */
}
/**
* 1. Add the correct display in IE 9-.
* 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
display: inline-block;
/* 1 */
vertical-align: baseline;
/* 2 */
}
/**
* Remove the default vertical scrollbar in IE.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10-.
* 2. Remove the padding in IE 10-.
*/
[type=checkbox],
[type=radio] {
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* 1 */
padding: 0;
/* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type=search] {
-webkit-appearance: textfield;
/* 1 */
outline-offset: -2px;
/* 2 */
}
/**
* Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
*/
[type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button;
/* 1 */
font: inherit;
/* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in IE 9-.
* 1. Add the correct display in Edge, IE, and Firefox.
*/
details,
menu {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Scripting
========================================================================== */
/**
* Add the correct display in IE 9-.
*/
canvas {
display: inline-block;
}
/**
* Add the correct display in IE.
*/
template {
display: none;
}
/* Hidden
========================================================================== */
/**
* Add the correct display in IE 10-.
*/
[hidden] {
display: none;
}
*,
*:before,
*:after {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
ul,
ol {
list-style: none;
margin: 0;
padding: 0;
}
li {
margin-left: 0;
}
hr {
border: 0 solid #E5E5E5;
border: 0 var(--line-solid, solid) var(--color-line1-2, #E5E5E5);
border-top-width: 1px;
border-top-width: var(--line-1, 1px);
}
a {
text-decoration: none;
}
a:link {
color: #EBF1FF;
color: var(--color-link-1, #EBF1FF);
}
a:visited {
color: #1B58F4;
color: var(--color-link-2, #1B58F4);
}
a:hover {
color: #1752E4;
color: var(--color-link-3, #1752E4);
}
a:active {
text-decoration: underline;
color: #1752E4;
color: var(--color-link-3, #1752E4);
}
@font-face {
font-family: "Roboto";
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-thin.eot");
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-thin.eot?#iefix") format("embedded-opentype"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-thin.woff2") format("woff2"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-thin.woff") format("woff"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-thin.ttf") format("truetype");
font-weight: 200;
}
@font-face {
font-family: "Roboto";
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-light.eot");
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-light.eot?#iefix") format("embedded-opentype"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-light.woff2") format("woff2"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-light.woff") format("woff"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-light.ttf") format("truetype");
font-weight: 300;
}
@font-face {
font-family: "Roboto";
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-regular.eot");
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-regular.eot?#iefix") format("embedded-opentype"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-regular.woff2") format("woff2"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-regular.woff") format("woff"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-regular.ttf") format("truetype");
font-weight: 400;
}
@font-face {
font-family: "Roboto";
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-medium.eot");
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-medium.eot?#iefix") format("embedded-opentype"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-medium.woff2") format("woff2"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-medium.woff") format("woff"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-medium.ttf") format("truetype");
font-weight: 500;
}
@font-face {
font-family: "Roboto";
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-bold.eot");
src: url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-bold.eot?#iefix") format("embedded-opentype"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-bold.woff2") format("woff2"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-bold.woff") format("woff"), url("//i.alicdn.com/artascope-font/20160419204543/font/roboto-bold.ttf") format("truetype");
font-weight: 700;
}
html {
font-size: 100%;
}
body {
font-family: Roboto, "Helvetica Neue", Helvetica, Tahoma, Arial, "Microsoft YaHei", "PingFang SC";
font-size: 12px;
font-size: var(--font-size-body-1, 12px);
line-height: 1.28571;
color: #1A1A1A;
color: var(--color-text1-4, #1A1A1A);
}
button,
input,
optgroup,
select,
textarea {
font-family: inherit;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
font-weight: inherit;
}
h1 {
margin-bottom: 12px;
margin-bottom: calc(var(--font-size-headline, 24px) * 0.5);
font-size: 24px;
font-size: var(--font-size-headline, 24px);
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
line-height: 36px;
}
h2 {
margin-bottom: 10px;
margin-bottom: calc(var(--font-size-title, 20px) * 0.5);
font-size: 20px;
font-size: var(--font-size-title, 20px);
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
line-height: 30px;
}
h3 {
margin-bottom: 8px;
margin-bottom: calc(var(--font-size-subhead, 16px) * 0.5);
font-size: 16px;
font-size: var(--font-size-subhead, 16px);
font-weight: normal;
font-weight: var(--font-weight-2, normal);
line-height: 24px;
}
h4 {
margin-bottom: 8px;
margin-bottom: calc(var(--font-size-subhead, 16px) * 0.5);
font-size: 16px;
font-size: var(--font-size-subhead, 16px);
font-weight: normal;
font-weight: var(--font-weight-2, normal);
line-height: 24px;
}
h5 {
margin-bottom: 6px;
margin-bottom: calc(var(--font-size-body-1, 12px) * 0.5);
font-size: 14px;
font-size: var(--font-size-body-2, 14px);
font-weight: normal;
font-weight: var(--font-weight-2, normal);
line-height: 24px;
}
h6 {
margin-bottom: 7px;
margin-bottom: calc(var(--font-size-body-2, 14px) * 0.5);
font-size: 12px;
font-size: var(--font-size-body-1, 12px);
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
line-height: 20px;
}
p {
margin-bottom: 6px;
margin-bottom: calc(var(--font-size-body-1, 12px) * 0.5);
font-size: 12px;
font-size: var(--font-size-body-1, 12px);
font-weight: normal;
font-weight: var(--font-weight-2, normal);
line-height: 20px;
}
strong {
font-weight: 500;
}
small {
font-size: 75%;
}
/* stylelint-disable-next-line */
@-webkit-keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-100px);
-ms-transform: translateY(-100px);
transform: translateY(-100px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-100px);
-ms-transform: translateY(-100px);
transform: translateY(-100px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@-webkit-keyframes fadeOutDown {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-100px);
-ms-transform: translateY(-100px);
transform: translateY(-100px);
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-100px);
-ms-transform: translateY(-100px);
transform: translateY(-100px);
}
}
@-webkit-keyframes slideOutDown {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
}
@keyframes slideOutDown {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
}
@-webkit-keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
@keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
@-webkit-keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
}
@keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
}
@-webkit-keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
@keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
@-webkit-keyframes slideInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes slideInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes slideInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes slideInUp {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideInUp {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-ms-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-ms-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@-webkit-keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-ms-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
100% {
opacity: 0;
}
}
@keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-ms-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
100% {
opacity: 0;
}
}
@-webkit-keyframes expandInDown {
0% {
opacity: 0;
-webkit-transform: scaleY(0.6);
-ms-transform: scaleY(0.6);
transform: scaleY(0.6);
-webkit-transform-origin: left top 0;
-ms-transform-origin: left top 0;
transform-origin: left top 0;
}
100% {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transform-origin: left top 0;
-ms-transform-origin: left top 0;
transform-origin: left top 0;
}
}
@keyframes expandInDown {
0% {
opacity: 0;
-webkit-transform: scaleY(0.6);
-ms-transform: scaleY(0.6);
transform: scaleY(0.6);
-webkit-transform-origin: left top 0;
-ms-transform-origin: left top 0;
transform-origin: left top 0;
}
100% {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transform-origin: left top 0;
-ms-transform-origin: left top 0;
transform-origin: left top 0;
}
}
@-webkit-keyframes expandInUp {
0% {
opacity: 0;
-webkit-transform: scaleY(0.6);
-ms-transform: scaleY(0.6);
transform: scaleY(0.6);
-webkit-transform-origin: left bottom 0;
-ms-transform-origin: left bottom 0;
transform-origin: left bottom 0;
}
100% {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transform-origin: left bottom 0;
-ms-transform-origin: left bottom 0;
transform-origin: left bottom 0;
}
}
@keyframes expandInUp {
0% {
opacity: 0;
-webkit-transform: scaleY(0.6);
-ms-transform: scaleY(0.6);
transform: scaleY(0.6);
-webkit-transform-origin: left bottom 0;
-ms-transform-origin: left bottom 0;
transform-origin: left bottom 0;
}
100% {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transform-origin: left bottom 0;
-ms-transform-origin: left bottom 0;
transform-origin: left bottom 0;
}
}
@-webkit-keyframes expandInWithFade {
0% {
opacity: 0;
}
40% {
opacity: 0.1;
}
50% {
opacity: 0.9;
}
100% {
opacity: 1;
}
}
@keyframes expandInWithFade {
0% {
opacity: 0;
}
40% {
opacity: 0.1;
}
50% {
opacity: 0.9;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes expandOutUp {
0% {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transform-origin: left top 0;
-ms-transform-origin: left top 0;
transform-origin: left top 0;
}
100% {
opacity: 0;
-webkit-transform: scaleY(0.6);
-ms-transform: scaleY(0.6);
transform: scaleY(0.6);
-webkit-transform-origin: left top 0;
-ms-transform-origin: left top 0;
transform-origin: left top 0;
}
}
@keyframes expandOutUp {
0% {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transform-origin: left top 0;
-ms-transform-origin: left top 0;
transform-origin: left top 0;
}
100% {
opacity: 0;
-webkit-transform: scaleY(0.6);
-ms-transform: scaleY(0.6);
transform: scaleY(0.6);
-webkit-transform-origin: left top 0;
-ms-transform-origin: left top 0;
transform-origin: left top 0;
}
}
@-webkit-keyframes expandOutDown {
0% {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transform-origin: left bottom 0;
-ms-transform-origin: left bottom 0;
transform-origin: left bottom 0;
}
100% {
opacity: 0;
-webkit-transform: scaleY(0.6);
-ms-transform: scaleY(0.6);
transform: scaleY(0.6);
-webkit-transform-origin: left bottom 0;
-ms-transform-origin: left bottom 0;
transform-origin: left bottom 0;
}
}
@keyframes expandOutDown {
0% {
opacity: 1;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transform-origin: left bottom 0;
-ms-transform-origin: left bottom 0;
transform-origin: left bottom 0;
}
100% {
opacity: 0;
-webkit-transform: scaleY(0.6);
-ms-transform: scaleY(0.6);
transform: scaleY(0.6);
-webkit-transform-origin: left bottom 0;
-ms-transform-origin: left bottom 0;
transform-origin: left bottom 0;
}
}
@-webkit-keyframes expandOutWithFade {
0% {
opacity: 1;
}
70% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@keyframes expandOutWithFade {
0% {
opacity: 1;
}
70% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@-webkit-keyframes pulse {
from {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
20% {
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
}
to {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
}
@keyframes pulse {
from {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
20% {
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
}
to {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
animation-name: fadeOutDown;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
animation-name: fadeOutRight;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slideInUp {
-webkit-animation-name: slideInUp;
animation-name: slideInUp;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slideInDown {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
animation-name: slideInLeft;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
animation-name: slideOutRight;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slideOutDown {
-webkit-animation-name: slideOutDown;
animation-name: slideOutDown;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.zoomIn {
-webkit-animation-name: zoomIn;
animation-name: zoomIn;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.zoomOut {
-webkit-animation-name: zoomOut;
animation-name: zoomOut;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.expandInDown {
-webkit-animation-name: expandInDown;
animation-name: expandInDown;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.expandOutUp {
-webkit-animation-name: expandOutUp;
animation-name: expandOutUp;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.15s;
animation-duration: 0.15s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.expandInUp {
-webkit-animation-name: expandInUp;
animation-name: expandInUp;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.expandOutDown {
-webkit-animation-name: expandOutDown;
animation-name: expandOutDown;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.15s;
animation-duration: 0.15s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.pulse {
-webkit-animation-name: pulse;
animation-name: pulse;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.expand-enter