diff options
| author | wd <wd@wdicc.com> | 2017-04-07 16:50:53 +0300 |
|---|---|---|
| committer | wd <wd@wdicc.com> | 2017-04-07 16:50:53 +0300 |
| commit | cefc99116bc0781b0d0d189afcb09a07d8f803a8 (patch) | |
| tree | c77bc6321a9b5aff2b62b92c2652cab4962b8ea6 /static | |
| parent | f568cef153b1183fd954c8cd8899f7d18212dd3f (diff) | |
Fix 404 not found error when put blog into a subdirectory
Diffstat (limited to 'static')
| -rw-r--r-- | static/css/custom.css | 8 | ||||
| -rw-r--r-- | static/css/screen.css | 4103 |
2 files changed, 0 insertions, 4111 deletions
diff --git a/static/css/custom.css b/static/css/custom.css index 3188a29..f965261 100644 --- a/static/css/custom.css +++ b/static/css/custom.css @@ -1,11 +1,3 @@ -@font-face{ - font-family: 'MyHermit'; - src: url('/font/hermit-medium-webfont.eot'); - src: url('/font/hermit-medium-webfont.eot?#iefix') format('embedded-opentype'), - url('/font/hermit-medium-webfont.woff') format('woff'), - url('/font/hermit-medium-webfont.ttf') format('truetype'); -} - .subtitle { float: right; font-family: 'Slackey',cursive; diff --git a/static/css/screen.css b/static/css/screen.css deleted file mode 100644 index 03d1686..0000000 --- a/static/css/screen.css +++ /dev/null @@ -1,4103 +0,0 @@ -@charset "UTF-8"; -@font-face { - font-family: 'FontAwesome'; - src: url("/font/fontawesome-webfont.eot"); - src: url("/font/fontawesome-webfont.eot?#iefix") format("embedded-opentype"), url("/font/fontawesome-webfont.woff") format("woff"), url("/font/fontawesome-webfont.ttf") format("truetype"), url("/font/fontawesome-webfont.svgz#FontAwesomeRegular") format("svg"), url("/font/fontawesome-webfont.svg#FontAwesomeRegular") format("svg"); - font-weight: normal; - font-style: normal; } - -* { - margin: 0; - padding: 0; } - -body { - font-family: 'PingFang SC', serif; - font-weight: 300; - font-size: 16px; - /*background: url("/images/retina_dust.png");*/ - color: #444; - colori: #666666; } - @media screen and (max-width: 1040px) { - body { - margin: 0 20px; } } - @media screen and (max-width: 600px) { - body { - font-size: 13px; } } - -.bBackground { - position: fixed; - height: 100%; - width: 100%; - background: -moz-radial-gradient(50% 50%, farthest-side, white, #efefef); - background: -webkit-gradient(radial, 50% 50%, 250, 50% 50%, 750, from(white), to(#bbbbbb)); - z-index: -100; } - -h1 { - font-size: 1.8em; } - -h2 { - font-family: 'Fjalla One', sans-serif; - font-size: 1.5em; } - -h3 { - font-size: 1.3em; } - -a { - text-decoration: none; - outline-width: 0; - color: #258fb8; } - -.alignleft { - float: left; } - -.alignright { - float: right; } - -.clearfix { - *zoom: 1; } - .clearfix:after { - content: ""; - display: table; - clear: both; } - -.inner { - width: 800px; - margin: 0 auto; } - @media screen and (max-width: 1040px) { - .inner { - width: 100%; } } - -#w2btoTop { - display: none; - text-decoration: none; - position: fixed; - bottom: 10px; - right: 10px; - overflow: hidden; - width: 51px; - height: 51px; - border: none; - text-indent: -999px; - background: url(/images/totop.png) no-repeat left top; } - -#w2btoTopHover { - background: url(/images/totop.png) no-repeat left -51px; - width: 51px; - height: 51px; - display: block; - overflow: hidden; - float: left; - opacity: 0; - -moz-opacity: 0; - filter: alpha(opacity=0); } - -#w2btoTop:active, #w2btoTop:focus { - outline: none; } - -.basic-alignment.left, article .entry-content img.left, article .entry-content video.left { - float: left; - margin-right: 1.5em; } -.basic-alignment.right, article .entry-content img.right, article .entry-content video.right { - float: right; - margin-left: 1.5em; } -.basic-alignment.center, article .entry-content img.center, article .entry-content video.center { - display: block; - margin: 0 auto 1.5em; } -.basic-alignment.left, article .entry-content img.left, article .entry-content video.left, .basic-alignment.right, article .entry-content img.right, article .entry-content video.right { - margin-bottom: .8em; } - -/* changes tooltip, to use, make elements 'class' as 'tooltip' and 'title' would be shown in tooltip */ -.tooltip { - display: inline; - position: relative; } - -.tooltip:hover { - text-decoration: none; } - -.tooltip:hover:after { - background: #111; - background: rgba(0, 0, 0, 0.8); - border-radius: 5px; - bottom: 18px; - color: #fff; - content: attr(title); - display: block; - left: 50%; - padding: 5px 15px; - position: absolute; - white-space: nowrap; - z-index: 98; } - -.tooltip:hover:before { - border: solid; - border-color: #111 transparent; - border-width: 6px 6px 0 6px; - bottom: 12px; - content: ""; - display: block; - left: 75%; - position: absolute; - z-index: 99; } - -.pullquote-right:before, -.pullquote-left:before { - /* Reset metrics. */ - padding: 0; - border: none; - /* Content */ - content: attr(data-pullquote); - /* Pull out to the right, modular scale based margins. */ - float: right; - width: 45%; - margin: .5em 0 1em 1.5em; - /* Baseline correction */ - position: relative; - top: 7px; - font-size: 1.4em; - line-height: 1.45em; } - -.pullquote-left:before { - /* Make left pullquotes align properly. */ - float: left; - margin: .5em 1.5em 1em 0; } - -#header { - padding: 20px 0 20px 0; } - @media screen and (max-width: 1040px) { - #header { - height: auto; - position: relative; - padding-bottom: 10px; } } - #header a { - color: #666666; - -webkit-transition: compact(compact(color 0.3s, false, false, false, false, false, false, false, false, false) false false); - -moz-transition: compact(compact(color 0.3s, false, false, false, false, false, false, false, false, false) false false false); - -o-transition: compact(compact(color 0.3s, false, false, false, false, false, false, false, false, false) false false false); - transition: compact(color 0.3s, false, false, false, false, false, false, false, false, false); } - #header a:hover { - color: #258fb8; } - #header h1 { - font-family: 'Slackey', cursive; - font-weight: 300; - font-size: 52px; } - @media screen and (max-width: 1040px) { - #header h1 { - float: none; } } - -#headerbg { - text-align: center; - background: #444; - padding: 10px 10px; - display: table; - color: #fff; - margin: 0 auto; - border-radius: 5px; - font-weight: bold; - -webkit-mask-image: -webkit-linear-gradient(black, rgba(0, 0, 0, 0.9)); - -webkit-backface-visibility: hidden; - -moz-backface-visibility: hidden; - -ms-backface-visibility: hidden; - -o-backface-visibility: hidden; - backface-visibility: hidden; - -webkit-animation-duration: 1s; - -webkit-animation-delay: .2s; - -webkit-animation-timing-function: ease; - -webkit-animation-fill-mode: both; - -moz-animation-duration: 1s; - -moz-animation-delay: .2s; - -moz-animation-timing-function: ease; - -moz-animation-fill-mode: both; - -ms-animation-duration: 1s; - -ms-animation-delay: .2s; - -ms-animation-timing-function: ease; - -ms-animation-fill-mode: both; - -o-animation-duration: 1s; - -o-animation-delay: .2s; - -o-animation-timing-function: ease; - -o-animation-fill-mode: both; - animation-duration: 1s; - animation-delay: .2s; - animation-timing-function: ease; - animation-fill-mode: both; } - -#load { - display: none; - position: absolute; - right: 50%; - top: 50%; - background: url("/images/loading.gif"); - width: 50px; - height: 50px; - text-indent: -9999em; } - -#social-links li { - display: inline-block; - width: 35px; - height: 35px; - border-radius: 35px; - margin-top: 20px; - margin-right: 9px; - background-color: #ddd; - text-align: center; - line-height: 35px; - -webkit-transition: compact(compact(background-color 1s ease-in-out, false, false, false, false, false, false, false, false, false) false false); - -moz-transition: compact(compact(background-color 1s ease-in-out, false, false, false, false, false, false, false, false, false) false false false); - -o-transition: compact(compact(background-color 1s ease-in-out, false, false, false, false, false, false, false, false, false) false false false); - transition: compact(background-color 1s ease-in-out, false, false, false, false, false, false, false, false, false); } - #social-links li:hover { - background-color: #555; } -#social-links a { - display: inline-block; - position: relative; - width: 100%; - height: 100%; } - #social-links a svg { - position: absolute; } - #social-links a .github { - top: 3px; - left: 2px; } - #social-links a .sina-weibo { - top: 8px; - left: 6px; } - #social-links a .tencent-weibo { - top: 6px; - left: 4px; } - #social-links a .twitter { - top: 2px; - left: 3px; } - -a.facebook { - background: url("/images/social/Facebook.png") center no-repeat; } - -a.facebook:hover { - background: url("/images/social/FacebookH.png") center no-repeat; } - -a.github { - background: url("/images/social/Github.png") center no-repeat; } - -a.github:hover { - background: url("/images/social/GithubH.png") center no-repeat; } - -a.twitter { - background: url("/images/social/Twitter.png") center no-repeat; } - -a.twitter:hover { - background: url("/images/social/TwitterH.png") center no-repeat; } - -a.google { - background: url("/images/social/Picasa.png") center no-repeat; } - -a.google:hover { - background: url("/images/social/PicasaH.png") center no-repeat; } - -a.skype { - background: url("/images/social/Skype.png") center no-repeat; } - -a.skype:hover { - background: url("/images/social/SkypeH.png") center no-repeat; } - -a.linkedin { - background: url("/images/social/LinkedIn.png") center no-repeat; } - -a.linkedin:hover { - background: url("/images/social/LinkedInH.png") center no-repeat; } - -a.youtube { - background: url("/images/social/Youtube.png") center no-repeat; } - -a.youtube:hover { - background: url("/images/social/YoutubeH.png") center no-repeat; } - -a.lastfm { - background: url("/images/social/LastFM.png") center no-repeat; } - -a.lastfm:hover { - background: url("/images/social/LastFMH.png") center no-repeat; } - -/* search bar */ -#search { - display: inline; } - -#search input[type="text"] { - background: url("/images/search-dark.png") no-repeat 10px 6px #444444; - border: 0 none; - font: bold 12px Arial,Helvetica,Sans-serif; - color: #777; - width: 110px; - padding: 6px 15px 6px 35px; - -webkit-border-radius: 20px; - -moz-border-radius: 20px; - border-radius: 20px; - text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); - -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset; - -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset; - box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset; - -webkit-transition: all 0.7s ease 0s; - -moz-transition: all 0.7s ease 0s; - -o-transition: all 0.7s ease 0s; - transition: all 0.7s ease 0s; } - -#search input[type="text"]:focus { - width: 160px; } - -#dark { - display: inline-block; - height: 70px; } - -#dark #search input[type="text"] { - background: url("/images/search-dark.png") no-repeat 10px 6px #444444; - border: 0 none; - font: bold 12px Arial,Helvetica,Sans-serif; - color: #ddd; - width: 110px; - padding: 6px 15px 6px 35px; - -webkit-border-radius: 20px; - -moz-border-radius: 20px; - border-radius: 20px; - text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); - -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset; - -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset; - box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset; - -webkit-transition: all 0.4s ease 0s; - -moz-transition: all 0.4s ease 0s; - -o-transition: all 0.4s ease 0s; - transition: all 0.4s ease 0s; } - -#dark #search input[type="text"]:focus { - width: 160px; - outline: 0; } - -/* nav */ -#nav { - text-align: center; - position: relative; - margin: 10px auto; } - -ul#nav li { - display: inline-block; } - -ul#nav li { - list-style-type: none; - background-repeat: no-repeat; - overflow: hidden; - margin-right: 1px; } - -ul#nav li a { - display: inline-block; - width: 110px; - height: 40px; - text-align: center; - padding-top: 20px; - padding-bottom: 20px; - color: #222; - font-weight: normal; - text-decoration: none; - font-family: "Lucida Grande", Arial, Helvetica, sans-serif; - text-transform: uppercase; - font-size: 16px; - font-style: normal; - text-shadow: 1px 1px 10px #222; - overflow: hidden; } - -ul#nav li a:hover { - color: #fff; - font-style: normal; - font-weight: normal; - background-image: url("/images/hover.png"); - background-repeat: no-repeat; - background-position: center top; } - -ul#nav li a:active { - position: relative; - top: 2px; } - -ul#nav li#active a { - color: #FFF; - background-image: url("/images/active.png"); - background-repeat: no-repeat; - background-position: center top; } - -#pagenavi { - padding: 20px 0; - height: 20px; - line-height: 20px; - position: relative; - border-top: 1px solid white; - border-bottom: 1px solid #dddddd; } - #pagenavi a:hover { - text-decoration: underline; } - #pagenavi .prev, #pagenavi .next { - position: absolute; } - #pagenavi .prev { - padding-left: 30px; - left: 0; } - #pagenavi .prev:before { - content: "\f060"; - font: 1.3em FontAwesome; - position: absolute; - left: 0; } - #pagenavi .next { - padding-right: 30px; - right: 0; } - #pagenavi .next:before { - content: "\f061"; - font: 1.3em FontAwesome; - position: absolute; - right: 0; } - #pagenavi .center { - text-align: center; - width: 100%; - display: block; } - @media screen and (max-width: 400px) { - #pagenavi .center { - display: none; } } - -article { - border-bottom: 1px solid #dddddd; - padding: 30px 0; - position: relative; } - @media screen and (max-width: 800px) { - article { - padding-bottom: 15px; } } - @media screen and (max-width: 600px) { - article { - padding: 15px 0; } } - article h2.title { - font-family: 'Fjalla One', sans-serif; - font-size: 2em; - font-weight: 300; - line-height: 35px; - margin-bottom: 20px; } - article h2.title a { - color: #1094e8; } - article .title a { - color: #7c7873; - -webkit-transition: all 1s ease-in-out; - -moz-transition: all 1s ease-in-out; - -o-transition: all 1s ease-in-out; - transition: all 1s ease-in-out; } - article .title a:hover { - color: #084B8A; - text-shadow: 3px 3px 12px #888; - -webkit-transform: scale(1.3); - -moz-transform: scale(1.3); } - article .entry-content { - line-height: 2; - text-align: justify; } - article .entry-content a:hover { - text-decoration: underline; } - article .entry-content .more-link { - display: block; - margin-top: 16px; - padding-left: 30px; - position: relative; } - article .entry-content .more-link:before { - content: "\f061"; - font: 1.3em FontAwesome; - line-height: 1.6em; - position: absolute; - left: 0; } - article .entry-content p, article .entry-content blockquote, article .entry-content ul, article .entry-content ol, article .entry-content dl, article .entry-content table, article .entry-content iframe, article .entry-content h1, article .entry-content h2, article .entry-content h3, article .entry-content h4, article .entry-content h5, article .entry-content h6, article .entry-content .video-container { - margin-top: 10px; } - article .entry-content ul, article .entry-content ol, article .entry-content dl { - margin-left: 20px; } - article .entry-content ul ul, article .entry-content ul ol, article .entry-content ul dl, article .entry-content ol ul, article .entry-content ol ol, article .entry-content ol dl, article .entry-content dl ul, article .entry-content dl ol, article .entry-content dl dl { - margin-top: 0; } - article .entry-content strong { - font-weight: bold; } - article .entry-content em { - font-style: italic; } - article .entry-content p { - margin-top: 10px; } - article .entry-content h2 { - font-weight: 300; - border-bottom: 1px solid #dddddd; - position: relative; } - article .entry-content h2:before { - content: ""; - position: absolute; - bottom: -2px; - border-bottom: 1px solid white; - width: 100%; } - article .entry-content img, article .entry-content video { - margin: 10px 0; - max-width: 100%; - height: auto; - -moz-border-radius: 0.3em; - -webkit-border-radius: 0.3em; - -o-border-radius: 0.3em; - -ms-border-radius: 0.3em; - -khtml-border-radius: 0.3em; - border-radius: 0.3em; - -moz-box-shadow: rgba(0, 0, 0, 0.75) 0 1px 4px; - -webkit-box-shadow: rgba(0, 0, 0, 0.75) 0 1px 4px; - -o-box-shadow: rgba(0, 0, 0, 0.75) 0 1px 4px; - box-shadow: rgba(0, 0, 0, 0.75) 0 1px 4px; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -ms-box-sizing: border-box; - box-sizing: border-box; - border: #fff 0.3em solid; } - article .entry-content img.noborder, article .entry-content video.noborder { - border: none; - box-shadow: none; } - article .entry-content blockquote { - background: #dddddd; - border-left: 5px solid #cccccc; - padding: 15px 20px; - margin-top: 10px; } - article .entry-content blockquote > p:first-of-type { - margin-top: 0; } - article .entry-content iframe { - border: none; } - article .entry-content table { - background: #dddddd; - border: 1px solid #cccccc; - border-spacing: 0; - margin-top: 10px; } - article .entry-content table th { - background: #cccccc; - padding: 0 15px; } - article .entry-content table td { - text-align: center; } - article .entry-content table tr:nth-of-type(2n) { - background: #d5d5d5; } - article .entry-content .caption { - display: block; - font-size: 0.9em; - color: #999999; - padding-left: 25px; - position: relative; } - article .entry-content .caption:before { - content: "\f040"; - color: #cccccc; - font: 1.3em FontAwesome; - line-height: 1.6em; - position: absolute; - left: 0; } - article .entry-content .video-container { - position: relative; - padding-bottom: 56.25%; - padding-top: 30px; - height: 0; - overflow: hidden; } - article .entry-content .video-container iframe, article .entry-content .video-container object, article .entry-content .video-container embed { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - margin-top: 0; } - -.share { - padding: 15px 0; - border-top: 1px solid white; - border-bottom: 1px solid #dddddd; } - -@media screen and (max-width: 800px) { - .post h2.title, .post .entry-content { - margin-left: 0; } } -.post .meta { - line-height: 2; - color: #999999; - width: 370px; } - @media screen and (max-width: 800px) { - .post .meta { - margin-top: 15px; - position: static; - width: auto; } } - .post .meta a { - color: #999999; - -webkit-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false); - -moz-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false false); - -o-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false false); - transition: compact(0.3s, false, false, false, false, false, false, false, false, false); } - .post .meta a:hover { - color: #666666; } - .post .meta .date, .post .meta .tags, .post .meta .comments { - padding-left: 30px; - position: relative; } - .post .meta .date:before, .post .meta .tags:before, .post .meta .comments:before { - color: #cccccc; - font: 1.3em FontAwesome; - line-height: 1.6em; - position: absolute; - left: 0; } - @media screen and (max-width: 800px) { - .post .meta .date, .post .meta .tags, .post .meta .comments { - display: -moz-inline-stack; - display: inline-block; - vertical-align: middle; - *vertical-align: auto; - zoom: 1; - *display: inline; - margin-right: 30px; } } - .post .meta .date:before { - content: "\f073"; } - .post .meta .tags:before { - content: "\f02c"; } - .post .meta .comments:before { - content: "\f075"; } - -.archives { - position: relative; } - .archives:last-of-type:before { - content: ""; - position: absolute; - bottom: 0; - width: 200px; - border-top: 1px solid #dddddd; } - .archives .top-border-padding { - border-top: 1px solid #fff; } - .archives .top-border-padding:before { - content: ""; - position: absolute; - top: -1px; - width: 100%; - border-top: 1px solid #dddddd; } - .archives .year { - line-height: 35px; - width: 200px; - position: absolute; - top: 0; - padding-top: 15px; - border-top: 1px solid #fff; } - .archives .year:before { - content: ""; - position: absolute; - top: -2px; - width: 100%; - border-top: 1px solid #dddddd; } - @media screen and (max-width: 600px) { - .archives .year { - position: relative; - width: 100%; } } - .archives article { - margin-left: 200px; - padding: 10px 0; } - @media screen and (max-width: 600px) { - .archives article { - margin-left: 0; } - .archives article:first-of-type { - border-top: none; - padding-top: 30px; } } - .archives article .title { - margin-bottom: 0; - font-size: 25px; } - .archives article .meta { - color: #999999; - font-size: 0.9em; - line-height: 2; - margin-top: 10px; } - @media screen and (max-width: 600px) { - .archives article .meta { - display: none; } } - .archives article .meta span { - margin-right: 30px; - display: -moz-inline-stack; - display: inline-block; - vertical-align: middle; - *vertical-align: auto; - zoom: 1; - *display: inline; } - .archives article .meta span:before { - color: #cccccc; - font: 1.3em FontAwesome; - padding-right: 10px; } - .archives article .meta a { - color: #999999; - -webkit-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false); - -moz-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false false); - -o-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false false); - transition: compact(0.3s, false, false, false, false, false, false, false, false, false); } - .archives article .meta a:hover { - color: #666666; } - .archives article .meta .date:before { - content: "\f073"; } - .archives article .meta .tags:before { - content: "\f02c"; } - .archives article .meta .comments:before { - content: "\f075"; } - -#comment { - padding: 30px 0; - border-top: 1px solid white; - border-bottom: 1px solid #dddddd; } - #comment h2.title { - font-size: 25px; - font-weight: 300; - line-height: 35px; - margin-bottom: 20px; } - -footer { - padding: 20px 0; - text-align: center; - font-size: 0.6em; - color: #666; } - -footer a { - color: #123; } - -footer a:hover { - color: #456; } - -#banner { - color: #999999; - padding: 30px 0; - line-height: 30px; - text-align: center; - position: relative; - display: none; - border-top: 1px solid white; - border-bottom: 1px solid #dddddd; } - #banner:hover a { - color: #258fb8; } - #banner a { - color: #999999; - -webkit-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false); - -moz-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false false); - -o-transition: compact(compact(0.3s, false, false, false, false, false, false, false, false, false) false false false); - transition: compact(0.3s, false, false, false, false, false, false, false, false, false); } - #banner a:hover { - text-decoration: underline; } - #banner small { - position: absolute; - right: 0; - bottom: 0; } - #banner .loading { - background: image-url("loading_pacman.gif") center no-repeat; - text-indent: -9999px; } - #banner .container { - height: 30px; - overflow: hidden; - position: relative; - display: none; } - #banner .container .feed { - list-style: none; - position: absolute; - top: 0; - width: 100%; } - #banner .container .feed li { - position: relative; } - #banner .container .feed li small { - position: absolute; - right: 0; } - -/*! fancyBox v2.0.6 fancyapps.com | fancyapps.com/fancybox/#license */ -.fancybox-tmp iframe, .fancybox-tmp object { - vertical-align: top; - padding: 0; - margin: 0; } - -.fancybox-wrap { - position: absolute; - top: 0; - left: 0; - z-index: 8020; } - -.fancybox-skin { - position: relative; - padding: 0; - margin: 0; - background: #f9f9f9; - color: #444; - text-shadow: none; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - -ms-border-radius: 4px; - -o-border-radius: 4px; - border-radius: 4px; } - -.fancybox-opened { - z-index: 8030; } - -.fancybox-opened .fancybox-skin { - -webkit-box-shadow: compact(0 10px 25px rgba(0, 0, 0, 0.5), false, false, false, false, false, false, false, false, false); - -moz-box-shadow: compact(0 10px 25px rgba(0, 0, 0, 0.5), false, false, false, false, false, false, false, false, false); - box-shadow: compact(0 10px 25px rgba(0, 0, 0, 0.5), false, false, false, false, false, false, false, false, false); } - -.fancybox-outer, .fancybox-inner { - padding: 0; - margin: 0; - position: relative; - outline: none; } - -.fancybox-inner { - overflow: hidden; } - -.fancybox-type-iframe .fancybox-inner { - -webkit-overflow-scrolling: touch; } - -.fancybox-error { - color: #444; - font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; - margin: 0; - padding: 10px; } - -.fancybox-image, .fancybox-iframe { - display: block; - width: 100%; - height: 100%; - border: 0; - padding: 0; - margin: 0; - vertical-align: top; } - -.fancybox-image { - max-width: 100%; - max-height: 100%; } - -#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { - background-image: image-url("fancybox/fancybox_sprite.png"); } - -#fancybox-loading { - position: fixed; - top: 50%; - left: 50%; - margin-top: -22px; - margin-left: -22px; - background-position: 0 -108px; - opacity: 0.8; - cursor: pointer; - z-index: 8020; } - -#fancybox-loading div { - width: 44px; - height: 44px; - background: image-url("fancybox/fancybox_loading.gif") center center no-repeat; } - -.fancybox-close { - position: absolute; - top: -18px; - right: -18px; - width: 36px; - height: 36px; - cursor: pointer; - z-index: 8040; } - -.fancybox-nav { - position: absolute; - top: 0; - width: 40%; - height: 100%; - cursor: pointer; - background: transparent image-url("fancybox/blank.gif"); - /* helps IE */ - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); - z-index: 8040; } - -.fancybox-prev { - left: 0; } - -.fancybox-next { - right: 0; } - -.fancybox-nav span { - position: absolute; - top: 50%; - width: 36px; - height: 34px; - margin-top: -18px; - cursor: pointer; - z-index: 8040; - visibility: hidden; } - -.fancybox-prev span { - left: 20px; - background-position: 0 -36px; } - -.fancybox-next span { - right: 20px; - background-position: 0 -72px; } - -.fancybox-nav:hover span { - visibility: visible; } - -.fancybox-tmp { - position: absolute; - top: -9999px; - left: -9999px; - padding: 0; - overflow: visible; - visibility: hidden; } - -/* Overlay helper */ -#fancybox-overlay { - position: absolute; - top: 0; - left: 0; - overflow: hidden; - display: none; - z-index: 8010; - background: #000; } - -#fancybox-overlay.overlay-fixed { - position: fixed; - bottom: 0; - right: 0; } - -/* Title helper */ -.fancybox-title { - visibility: hidden; - font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; - position: relative; - text-shadow: none; - z-index: 8050; } - -.fancybox-opened .fancybox-title { - visibility: visible; } - -.fancybox-title-float-wrap { - position: absolute; - bottom: 0; - right: 50%; - margin-bottom: -35px; - z-index: 8030; - text-align: center; } - -.fancybox-title-float-wrap .child { - display: inline-block; - margin-right: -100%; - padding: 2px 20px; - background: transparent; - /* Fallback for web browsers that doesn't support RGBa */ - background: rgba(0, 0, 0, 0.8); - text-shadow: 0 1px 2px #222; - color: #FFF; - font-weight: bold; - line-height: 24px; - white-space: nowrap; - -webkit-border-radius: 15px; - -moz-border-radius: 15px; - -ms-border-radius: 15px; - -o-border-radius: 15px; - border-radius: 15px; } - -.fancybox-title-outside-wrap { - position: relative; - margin-top: 10px; - color: #fff; } - -.fancybox-title-inside-wrap { - margin-top: 10px; } - -.fancybox-title-over-wrap { - position: absolute; - bottom: 0; - left: 0; - color: #fff; - padding: 10px; - background: #000; - background: rgba(0, 0, 0, 0.8); } - -/* -Animate.css - http://daneden.me/animate -Licensed under the ☺ license (http://licence.visualidiot.com/) - -Copyright (c) 2012 Dan Eden - -Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -*/ -body { - /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */ - -webkit-backface-visibility: hidden; } - -.animated { - -webkit-animation-duration: 1s; - -moz-animation-duration: 1s; - -o-animation-duration: 1s; - animation-duration: 1s; - -webkit-animation-fill-mode: both; - -moz-animation-fill-mode: both; - -o-animation-fill-mode: both; - animation-fill-mode: both; } - -.animated.hinge { - -webkit-animation-duration: 2s; - -moz-animation-duration: 2s; - -o-animation-duration: 2s; - animation-duration: 2s; } - -@-webkit-keyframes flash { - 0%, 50%, 100% { - opacity: 1; } - - 25%, 75% { - opacity: 0; } } - -@-moz-keyframes flash { - 0%, 50%, 100% { - opacity: 1; } - - 25%, 75% { - opacity: 0; } } - -@-o-keyframes flash { - 0%, 50%, 100% { - opacity: 1; } - - 25%, 75% { - opacity: 0; } } - -@keyframes flash { - 0%, 50%, 100% { - opacity: 1; } - - 25%, 75% { - opacity: 0; } } - -.flash { - -webkit-animation-name: flash; - -moz-animation-name: flash; - -o-animation-name: flash; - animation-name: flash; } - -@-webkit-keyframes shake { - 0%, 100% { - -webkit-transform: translateX(0); } - - 10%, 30%, 50%, 70%, 90% { - -webkit-transform: translateX(-10px); } - - 20%, 40%, 60%, 80% { - -webkit-transform: translateX(10px); } } - -@-moz-keyframes shake { - 0%, 100% { - -moz-transform: translateX(0); } - - 10%, 30%, 50%, 70%, 90% { - -moz-transform: translateX(-10px); } - - 20%, 40%, 60%, 80% { - -moz-transform: translateX(10px); } } - -@-o-keyframes shake { - 0%, 100% { - -o-transform: translateX(0); } - - 10%, 30%, 50%, 70%, 90% { - -o-transform: translateX(-10px); } - - 20%, 40%, 60%, 80% { - -o-transform: translateX(10px); } } - -@keyframes shake { - 0%, 100% { - transform: translateX(0); } - - 10%, 30%, 50%, 70%, 90% { - transform: translateX(-10px); } - - 20%, 40%, 60%, 80% { - transform: translateX(10px); } } - -.shake { - -webkit-animation-name: shake; - -moz-animation-name: shake; - -o-animation-name: shake; - animation-name: shake; } - -@-webkit-keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - -webkit-transform: translateY(0); } - - 40% { - -webkit-transform: translateY(-30px); } - - 60% { - -webkit-transform: translateY(-15px); } } - -@-moz-keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - -moz-transform: translateY(0); } - - 40% { - -moz-transform: translateY(-30px); } - - 60% { - -moz-transform: translateY(-15px); } } - -@-o-keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - -o-transform: translateY(0); } - - 40% { - -o-transform: translateY(-30px); } - - 60% { - -o-transform: translateY(-15px); } } - -@keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - transform: translateY(0); } - - 40% { - transform: translateY(-30px); } - - 60% { - transform: translateY(-15px); } } - -.bounce { - -webkit-animation-name: bounce; - -moz-animation-name: bounce; - -o-animation-name: bounce; - animation-name: bounce; } - -@-webkit-keyframes tada { - 0% { - -webkit-transform: scale(1); } - - 10%, 20% { - -webkit-transform: scale(0.9) rotate(-3deg); } - - 30%, 50%, 70%, 90% { - -webkit-transform: scale(1.1) rotate(3deg); } - - 40%, 60%, 80% { - -webkit-transform: scale(1.1) rotate(-3deg); } - - 100% { - -webkit-transform: scale(1) rotate(0); } } - -@-moz-keyframes tada { - 0% { - -moz-transform: scale(1); } - - 10%, 20% { - -moz-transform: scale(0.9) rotate(-3deg); } - - 30%, 50%, 70%, 90% { - -moz-transform: scale(1.1) rotate(3deg); } - - 40%, 60%, 80% { - -moz-transform: scale(1.1) rotate(-3deg); } - - 100% { - -moz-transform: scale(1) rotate(0); } } - -@-o-keyframes tada { - 0% { - -o-transform: scale(1); } - - 10%, 20% { - -o-transform: scale(0.9) rotate(-3deg); } - - 30%, 50%, 70%, 90% { - -o-transform: scale(1.1) rotate(3deg); } - - 40%, 60%, 80% { - -o-transform: scale(1.1) rotate(-3deg); } - - 100% { - -o-transform: scale(1) rotate(0); } } - -@keyframes tada { - 0% { - transform: scale(1); } - - 10%, 20% { - transform: scale(0.9) rotate(-3deg); } - - 30%, 50%, 70%, 90% { - transform: scale(1.1) rotate(3deg); } - - 40%, 60%, 80% { - transform: scale(1.1) rotate(-3deg); } - - 100% { - transform: scale(1) rotate(0); } } - -.tada { - -webkit-animation-name: tada; - -moz-animation-name: tada; - -o-animation-name: tada; - animation-name: tada; } - -@-webkit-keyframes swing { - 20%, 40%, 60%, 80%, 100% { - -webkit-transform-origin: top center; } - - 20% { - -webkit-transform: rotate(15deg); } - - 40% { - -webkit-transform: rotate(-10deg); } - - 60% { - -webkit-transform: rotate(5deg); } - - 80% { - -webkit-transform: rotate(-5deg); } - - 100% { - -webkit-transform: rotate(0deg); } } - -@-moz-keyframes swing { - 20% { - -moz-transform: rotate(15deg); } - - 40% { - -moz-transform: rotate(-10deg); } - - 60% { - -moz-transform: rotate(5deg); } - - 80% { - -moz-transform: rotate(-5deg); } - - 100% { - -moz-transform: rotate(0deg); } } - -@-o-keyframes swing { - 20% { - -o-transform: rotate(15deg); } - - 40% { - -o-transform: rotate(-10deg); } - - 60% { - -o-transform: rotate(5deg); } - - 80% { - -o-transform: rotate(-5deg); } - - 100% { - -o-transform: rotate(0deg); } } - -@keyframes swing { - 20% { - transform: rotate(15deg); } - - 40% { - transform: rotate(-10deg); } - - 60% { - transform: rotate(5deg); } - - 80% { - transform: rotate(-5deg); } - - 100% { - transform: rotate(0deg); } } - -.swing { - -webkit-transform-origin: top center; - -moz-transform-origin: top center; - -o-transform-origin: top center; - transform-origin: top center; - -webkit-animation-name: swing; - -moz-animation-name: swing; - -o-animation-name: swing; - animation-name: swing; } - -/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ -@-webkit-keyframes wobble { - 0% { - -webkit-transform: translateX(0%); } - - 15% { - -webkit-transform: translateX(-25%) rotate(-5deg); } - - 30% { - -webkit-transform: translateX(20%) rotate(3deg); } - - 45% { - -webkit-transform: translateX(-15%) rotate(-3deg); } - - 60% { - -webkit-transform: translateX(10%) rotate(2deg); } - - 75% { - -webkit-transform: translateX(-5%) rotate(-1deg); } - - 100% { - -webkit-transform: translateX(0%); } } - -@-moz-keyframes wobble { - 0% { - -moz-transform: translateX(0%); } - - 15% { - -moz-transform: translateX(-25%) rotate(-5deg); } - - 30% { - -moz-transform: translateX(20%) rotate(3deg); } - - 45% { - -moz-transform: translateX(-15%) rotate(-3deg); } - - 60% { - -moz-transform: translateX(10%) rotate(2deg); } - - 75% { - -moz-transform: translateX(-5%) rotate(-1deg); } - - 100% { - -moz-transform: translateX(0%); } } - -@-o-keyframes wobble { - 0% { - -o-transform: translateX(0%); } - - 15% { - -o-transform: translateX(-25%) rotate(-5deg); } - - 30% { - -o-transform: translateX(20%) rotate(3deg); } - - 45% { - -o-transform: translateX(-15%) rotate(-3deg); } - - 60% { - -o-transform: translateX(10%) rotate(2deg); } - - 75% { - -o-transform: translateX(-5%) rotate(-1deg); } - - 100% { - -o-transform: translateX(0%); } } - -@keyframes wobble { - 0% { - transform: translateX(0%); } - - 15% { - transform: translateX(-25%) rotate(-5deg); } - - 30% { - transform: translateX(20%) rotate(3deg); } - - 45% { - transform: translateX(-15%) rotate(-3deg); } - - 60% { - transform: translateX(10%) rotate(2deg); } - - 75% { - transform: translateX(-5%) rotate(-1deg); } - - 100% { - transform: translateX(0%); } } - -.wobble { - -webkit-animation-name: wobble; - -moz-animation-name: wobble; - -o-animation-name: wobble; - animation-name: wobble; } - -/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ -@-webkit-keyframes pulse { - 0% { - -webkit-transform: scale(1); } - - 50% { - -webkit-transform: scale(1.1); } - - 100% { - -webkit-transform: scale(1); } } - -@-moz-keyframes pulse { - 0% { - -moz-transform: scale(1); } - - 50% { - -moz-transform: scale(1.1); } - - 100% { - -moz-transform: scale(1); } } - -@-o-keyframes pulse { - 0% { - -o-transform: scale(1); } - - 50% { - -o-transform: scale(1.1); } - - 100% { - -o-transform: scale(1); } } - -@keyframes pulse { - 0% { - transform: scale(1); } - - 50% { - transform: scale(1.1); } - - 100% { - transform: scale(1); } } - -.pulse { - -webkit-animation-name: pulse; - -moz-animation-name: pulse; - -o-animation-name: pulse; - animation-name: pulse; } - -@-webkit-keyframes flip { - 0% { - -webkit-transform: perspective(400px) rotateY(0); - -webkit-animation-timing-function: ease-out; } - - 40% { - -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); - -webkit-animation-timing-function: ease-out; } - - 50% { - -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); - -webkit-animation-timing-function: ease-in; } - - 80% { - -webkit-transform: perspective(400px) rotateY(360deg) scale(0.95); - -webkit-animation-timing-function: ease-in; } - - 100% { - -webkit-transform: perspective(400px) scale(1); - -webkit-animation-timing-function: ease-in; } } - -@-moz-keyframes flip { - 0% { - -moz-transform: perspective(400px) rotateY(0); - -moz-animation-timing-function: ease-out; } - - 40% { - -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg); - -moz-animation-timing-function: ease-out; } - - 50% { - -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); - -moz-animation-timing-function: ease-in; } - - 80% { - -moz-transform: perspective(400px) rotateY(360deg) scale(0.95); - -moz-animation-timing-function: ease-in; } - - 100% { - -moz-transform: perspective(400px) scale(1); - -moz-animation-timing-function: ease-in; } } - -@-o-keyframes flip { - 0% { - -o-transform: perspective(400px) rotateY(0); - -o-animation-timing-function: ease-out; } - - 40% { - -o-transform: perspective(400px) translateZ(150px) rotateY(170deg); - -o-animation-timing-function: ease-out; } - - 50% { - -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); - -o-animation-timing-function: ease-in; } - - 80% { - -o-transform: perspective(400px) rotateY(360deg) scale(0.95); - -o-animation-timing-function: ease-in; } - - 100% { - -o-transform: perspective(400px) scale(1); - -o-animation-timing-function: ease-in; } } - -@keyframes flip { - 0% { - transform: perspective(400px) rotateY(0); - animation-timing-function: ease-out; } - - 40% { - transform: perspective(400px) translateZ(150px) rotateY(170deg); - animation-timing-function: ease-out; } - - 50% { - transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); - animation-timing-function: ease-in; } - - 80% { - transform: perspective(400px) rotateY(360deg) scale(0.95); - animation-timing-function: ease-in; } - - 100% { - transform: perspective(400px) scale(1); - animation-timing-function: ease-in; } } - -.flip { - -webkit-backface-visibility: visible !important; - -webkit-animation-name: flip; - -moz-backface-visibility: visible !important; - -moz-animation-name: flip; - -o-backface-visibility: visible !important; - -o-animation-name: flip; - backface-visibility: visible !important; - animation-name: flip; } - -@-webkit-keyframes flipInX { - 0% { - -webkit-transform: perspective(400px) rotateX(90deg); - opacity: 0; } - - 40% { - -webkit-transform: perspective(400px) rotateX(-10deg); } - - 70% { - -webkit-transform: perspective(400px) rotateX(10deg); } - - 100% { - -webkit-transform: perspective(400px) rotateX(0deg); - opacity: 1; } } - -@-moz-keyframes flipInX { - 0% { - -moz-transform: perspective(400px) rotateX(90deg); - opacity: 0; } - - 40% { - -moz-transform: perspective(400px) rotateX(-10deg); } - - 70% { - -moz-transform: perspective(400px) rotateX(10deg); } - - 100% { - -moz-transform: perspective(400px) rotateX(0deg); - opacity: 1; } } - -@-o-keyframes flipInX { - 0% { - -o-transform: perspective(400px) rotateX(90deg); - opacity: 0; } - - 40% { - -o-transform: perspective(400px) rotateX(-10deg); } - - 70% { - -o-transform: perspective(400px) rotateX(10deg); } - - 100% { - -o-transform: perspective(400px) rotateX(0deg); - opacity: 1; } } - -@keyframes flipInX { - 0% { - transform: perspective(400px) rotateX(90deg); - opacity: 0; } - - 40% { - transform: perspective(400px) rotateX(-10deg); } - - 70% { - transform: perspective(400px) rotateX(10deg); } - - 100% { - transform: perspective(400px) rotateX(0deg); - opacity: 1; } } - -.flipInX { - -webkit-backface-visibility: visible !important; - -webkit-animation-name: flipInX; - -moz-backface-visibility: visible !important; - -moz-animation-name: flipInX; - -o-backface-visibility: visible !important; - -o-animation-name: flipInX; - backface-visibility: visible !important; - animation-name: flipInX; } - -@-webkit-keyframes flipOutX { - 0% { - -webkit-transform: perspective(400px) rotateX(0deg); - opacity: 1; } - - 100% { - -webkit-transform: perspective(400px) rotateX(90deg); - opacity: 0; } } - -@-moz-keyframes flipOutX { - 0% { - -moz-transform: perspective(400px) rotateX(0deg); - opacity: 1; } - - 100% { - -moz-transform: perspective(400px) rotateX(90deg); - opacity: 0; } } - -@-o-keyframes flipOutX { - 0% { - -o-transform: perspective(400px) rotateX(0deg); - opacity: 1; } - - 100% { - -o-transform: perspective(400px) rotateX(90deg); - opacity: 0; } } - -@keyframes flipOutX { - 0% { - transform: perspective(400px) rotateX(0deg); - opacity: 1; } - - 100% { - transform: perspective(400px) rotateX(90deg); - opacity: 0; } } - -.flipOutX { - -webkit-animation-name: flipOutX; - -webkit-backface-visibility: visible !important; - -moz-animation-name: flipOutX; - -moz-backface-visibility: visible !important; - -o-animation-name: flipOutX; - -o-backface-visibility: visible !important; - animation-name: flipOutX; - backface-visibility: visible !important; } - -@-webkit-keyframes flipInY { - 0% { - -webkit-transform: perspective(400px) rotateY(90deg); - opacity: 0; } - - 40% { - -webkit-transform: perspective(400px) rotateY(-10deg); } - - 70% { - -webkit-transform: perspective(400px) rotateY(10deg); } - - 100% { - -webkit-transform: perspective(400px) rotateY(0deg); - opacity: 1; } } - -@-moz-keyframes flipInY { - 0% { - -moz-transform: perspective(400px) rotateY(90deg); - opacity: 0; } - - 40% { - -moz-transform: perspective(400px) rotateY(-10deg); } - - 70% { - -moz-transform: perspective(400px) rotateY(10deg); } - - 100% { - -moz-transform: perspective(400px) rotateY(0deg); - opacity: 1; } } - -@-o-keyframes flipInY { - 0% { - -o-transform: perspective(400px) rotateY(90deg); - opacity: 0; } - - 40% { - -o-transform: perspective(400px) rotateY(-10deg); } - - 70% { - -o-transform: perspective(400px) rotateY(10deg); } - - 100% { - -o-transform: perspective(400px) rotateY(0deg); - opacity: 1; } } - -@keyframes flipInY { - 0% { - transform: perspective(400px) rotateY(90deg); - opacity: 0; } - - 40% { - transform: perspective(400px) rotateY(-10deg); } - - 70% { - transform: perspective(400px) rotateY(10deg); } - - 100% { - transform: perspective(400px) rotateY(0deg); - opacity: 1; } } - -.flipInY { - -webkit-backface-visibility: visible !important; - -webkit-animation-name: flipInY; - -moz-backface-visibility: visible !important; - -moz-animation-name: flipInY; - -o-backface-visibility: visible !important; - -o-animation-name: flipInY; - backface-visibility: visible !important; - animation-name: flipInY; } - -@-webkit-keyframes flipOutY { - 0% { - -webkit-transform: perspective(400px) rotateY(0deg); - opacity: 1; } - - 100% { - -webkit-transform: perspective(400px) rotateY(90deg); - opacity: 0; } } - -@-moz-keyframes flipOutY { - 0% { - -moz-transform: perspective(400px) rotateY(0deg); - opacity: 1; } - - 100% { - -moz-transform: perspective(400px) rotateY(90deg); - opacity: 0; } } - -@-o-keyframes flipOutY { - 0% { - -o-transform: perspective(400px) rotateY(0deg); - opacity: 1; } - - 100% { - -o-transform: perspective(400px) rotateY(90deg); - opacity: 0; } } - -@keyframes flipOutY { - 0% { - transform: perspective(400px) rotateY(0deg); - opacity: 1; } - - 100% { - transform: perspective(400px) rotateY(90deg); - opacity: 0; } } - -.flipOutY { - -webkit-backface-visibility: visible !important; - -webkit-animation-name: flipOutY; - -moz-backface-visibility: visible !important; - -moz-animation-name: flipOutY; - -o-backface-visibility: visible !important; - -o-animation-name: flipOutY; - backface-visibility: visible !important; - animation-name: flipOutY; } - -@-webkit-keyframes fadeIn { - 0% { - opacity: 0; } - - 100% { - opacity: 1; } } - -@-moz-keyframes fadeIn { - 0% { - opacity: 0; } - - 100% { - opacity: 1; } } - -@-o-keyframes fadeIn { - 0% { - opacity: 0; } - - 100% { - opacity: 1; } } - -@keyframes fadeIn { - 0% { - opacity: 0; } - - 100% { - opacity: 1; } } - -.fadeIn { - -webkit-animation-name: fadeIn; - -moz-animation-name: fadeIn; - -o-animation-name: fadeIn; - animation-name: fadeIn; } - -@-webkit-keyframes fadeInUp { - 0% { - opacity: 0; - -webkit-transform: translateY(20px); } - - 100% { - opacity: 1; - -webkit-transform: translateY(0); } } - -@-moz-keyframes fadeInUp { - 0% { - opacity: 0; - -moz-transform: translateY(20px); } - - 100% { - opacity: 1; - -moz-transform: translateY(0); } } - -@-o-keyframes fadeInUp { - 0% { - opacity: 0; - -o-transform: translateY(20px); } - - 100% { - opacity: 1; - -o-transform: translateY(0); } } - -@keyframes fadeInUp { - 0% { - opacity: 0; - transform: translateY(20px); } - - 100% { - opacity: 1; - transform: translateY(0); } } - -.fadeInUp { - -webkit-animation-name: fadeInUp; - -moz-animation-name: fadeInUp; - -o-animation-name: fadeInUp; - animation-name: fadeInUp; } - -@-webkit-keyframes fadeInDown { - 0% { - opacity: 0; - -webkit-transform: translateY(-20px); } - - 100% { - opacity: 1; - -webkit-transform: translateY(0); } } - -@-moz-keyframes fadeInDown { - 0% { - opacity: 0; - -moz-transform: translateY(-20px); } - - 100% { - opacity: 1; - -moz-transform: translateY(0); } } - -@-o-keyframes fadeInDown { - 0% { - opacity: 0; - -o-transform: translateY(-20px); } - - 100% { - opacity: 1; - -o-transform: translateY(0); } } - -@keyframes fadeInDown { - 0% { - opacity: 0; - transform: translateY(-20px); } - - 100% { - opacity: 1; - transform: translateY(0); } } - -.fadeInDown { - -webkit-animation-name: fadeInDown; - -moz-animation-name: fadeInDown; - -o-animation-name: fadeInDown; - animation-name: fadeInDown; } - -@-webkit-keyframes fadeInLeft { - 0% { - opacity: 0; - -webkit-transform: translateX(-20px); } - - 100% { - opacity: 1; - -webkit-transform: translateX(0); } } - -@-moz-keyframes fadeInLeft { - 0% { - opacity: 0; - -moz-transform: translateX(-20px); } - - 100% { - opacity: 1; - -moz-transform: translateX(0); } } - -@-o-keyframes fadeInLeft { - 0% { - opacity: 0; - -o-transform: translateX(-20px); } - - 100% { - opacity: 1; - -o-transform: translateX(0); } } - -@keyframes fadeInLeft { - 0% { - opacity: 0; - transform: translateX(-20px); } - - 100% { - opacity: 1; - transform: translateX(0); } } - -.fadeInLeft { - -webkit-animation-name: fadeInLeft; - -moz-animation-name: fadeInLeft; - -o-animation-name: fadeInLeft; - animation-name: fadeInLeft; } - -@-webkit-keyframes fadeInRight { - 0% { - opacity: 0; - -webkit-transform: translateX(20px); } - - 100% { - opacity: 1; - -webkit-transform: translateX(0); } } - -@-moz-keyframes fadeInRight { - 0% { - opacity: 0; - -moz-transform: translateX(20px); } - - 100% { - opacity: 1; - -moz-transform: translateX(0); } } - -@-o-keyframes fadeInRight { - 0% { - opacity: 0; - -o-transform: translateX(20px); } - - 100% { - opacity: 1; - -o-transform: translateX(0); } } - -@keyframes fadeInRight { - 0% { - opacity: 0; - transform: translateX(20px); } - - 100% { - opacity: 1; - transform: translateX(0); } } - -.fadeInRight { - -webkit-animation-name: fadeInRight; - -moz-animation-name: fadeInRight; - -o-animation-name: fadeInRight; - animation-name: fadeInRight; } - -@-webkit-keyframes fadeInUpBig { - 0% { - opacity: 0; - -webkit-transform: translateY(2000px); } - - 100% { - opacity: 1; - -webkit-transform: translateY(0); } } - -@-moz-keyframes fadeInUpBig { - 0% { - opacity: 0; - -moz-transform: translateY(2000px); } - - 100% { - opacity: 1; - -moz-transform: translateY(0); } } - -@-o-keyframes fadeInUpBig { - 0% { - opacity: 0; - -o-transform: translateY(2000px); } - - 100% { - opacity: 1; - -o-transform: translateY(0); } } - -@keyframes fadeInUpBig { - 0% { - opacity: 0; - transform: translateY(2000px); } - - 100% { - opacity: 1; - transform: translateY(0); } } - -.fadeInUpBig { - -webkit-animation-name: fadeInUpBig; - -moz-animation-name: fadeInUpBig; - -o-animation-name: fadeInUpBig; - animation-name: fadeInUpBig; } - -@-webkit-keyframes fadeInDownBig { - 0% { - opacity: 0; - -webkit-transform: translateY(-2000px); } - - 100% { - opacity: 1; - -webkit-transform: translateY(0); } } - -@-moz-keyframes fadeInDownBig { - 0% { - opacity: 0; - -moz-transform: translateY(-2000px); } - - 100% { - opacity: 1; - -moz-transform: translateY(0); } } - -@-o-keyframes fadeInDownBig { - 0% { - opacity: 0; - -o-transform: translateY(-2000px); } - - 100% { - opacity: 1; - -o-transform: translateY(0); } } - -@keyframes fadeInDownBig { - 0% { - opacity: 0; - transform: translateY(-2000px); } - - 100% { - opacity: 1; - transform: translateY(0); } } - -.fadeInDownBig { - -webkit-animation-name: fadeInDownBig; - -moz-animation-name: fadeInDownBig; - -o-animation-name: fadeInDownBig; - animation-name: fadeInDownBig; } - -@-webkit-keyframes fadeInLeftBig { - 0% { - opacity: 0; - -webkit-transform: translateX(-2000px); } - - 100% { - opacity: 1; - -webkit-transform: translateX(0); } } - -@-moz-keyframes fadeInLeftBig { - 0% { - opacity: 0; - -moz-transform: translateX(-2000px); } - - 100% { - opacity: 1; - -moz-transform: translateX(0); } } - -@-o-keyframes fadeInLeftBig { - 0% { - opacity: 0; - -o-transform: translateX(-2000px); } - - 100% { - opacity: 1; - -o-transform: translateX(0); } } - -@keyframes fadeInLeftBig { - 0% { - opacity: 0; - transform: translateX(-2000px); } - - 100% { - opacity: 1; - transform: translateX(0); } } - -.fadeInLeftBig { - -webkit-animation-name: fadeInLeftBig; - -moz-animation-name: fadeInLeftBig; - -o-animation-name: fadeInLeftBig; - animation-name: fadeInLeftBig; } - -@-webkit-keyframes fadeInRightBig { - 0% { - opacity: 0; - -webkit-transform: translateX(2000px); } - - 100% { - opacity: 1; - -webkit-transform: translateX(0); } } - -@-moz-keyframes fadeInRightBig { - 0% { - opacity: 0; - -moz-transform: translateX(2000px); } - - 100% { - opacity: 1; - -moz-transform: translateX(0); } } - -@-o-keyframes fadeInRightBig { - 0% { - opacity: 0; - -o-transform: translateX(2000px); } - - 100% { - opacity: 1; - -o-transform: translateX(0); } } - -@keyframes fadeInRightBig { - 0% { - opacity: 0; - transform: translateX(2000px); } - - 100% { - opacity: 1; - transform: translateX(0); } } - -.fadeInRightBig { - -webkit-animation-name: fadeInRightBig; - -moz-animation-name: fadeInRightBig; - -o-animation-name: fadeInRightBig; - animation-name: fadeInRightBig; } - -@-webkit-keyframes fadeOut { - 0% { - opacity: 1; } - - 100% { - opacity: 0; } } - -@-moz-keyframes fadeOut { - 0% { - opacity: 1; } - - 100% { - opacity: 0; } } - -@-o-keyframes fadeOut { - 0% { - opacity: 1; } - - 100% { - opacity: 0; } } - -@keyframes fadeOut { - 0% { - opacity: 1; } - - 100% { - opacity: 0; } } - -.fadeOut { - -webkit-animation-name: fadeOut; - -moz-animation-name: fadeOut; - -o-animation-name: fadeOut; - animation-name: fadeOut; } - -@-webkit-keyframes fadeOutUp { - 0% { - opacity: 1; - -webkit-transform: translateY(0); } - - 100% { - opacity: 0; - -webkit-transform: translateY(-20px); } } - -@-moz-keyframes fadeOutUp { - 0% { - opacity: 1; - -moz-transform: translateY(0); } - - 100% { - opacity: 0; - -moz-transform: translateY(-20px); } } - -@-o-keyframes fadeOutUp { - 0% { - opacity: 1; - -o-transform: translateY(0); } - - 100% { - opacity: 0; - -o-transform: translateY(-20px); } } - -@keyframes fadeOutUp { - 0% { - opacity: 1; - transform: translateY(0); } - - 100% { - opacity: 0; - transform: translateY(-20px); } } - -.fadeOutUp { - -webkit-animation-name: fadeOutUp; - -moz-animation-name: fadeOutUp; - -o-animation-name: fadeOutUp; - animation-name: fadeOutUp; } - -@-webkit-keyframes fadeOutDown { - 0% { - opacity: 1; - -webkit-transform: translateY(0); } - - 100% { - opacity: 0; - -webkit-transform: translateY(20px); } } - -@-moz-keyframes fadeOutDown { - 0% { - opacity: 1; - -moz-transform: translateY(0); } - - 100% { - opacity: 0; - -moz-transform: translateY(20px); } } - -@-o-keyframes fadeOutDown { - 0% { - opacity: 1; - -o-transform: translateY(0); } - - 100% { - opacity: 0; - -o-transform: translateY(20px); } } - -@keyframes fadeOutDown { - 0% { - opacity: 1; - transform: translateY(0); } - - 100% { - opacity: 0; - transform: translateY(20px); } } - -.fadeOutDown { - -webkit-animation-name: fadeOutDown; - -moz-animation-name: fadeOutDown; - -o-animation-name: fadeOutDown; - animation-name: fadeOutDown; } - -@-webkit-keyframes fadeOutLeft { - 0% { - opacity: 1; - -webkit-transform: translateX(0); } - - 100% { - opacity: 0; - -webkit-transform: translateX(-20px); } } - -@-moz-keyframes fadeOutLeft { - 0% { - opacity: 1; - -moz-transform: translateX(0); } - - 100% { - opacity: 0; - -moz-transform: translateX(-20px); } } - -@-o-keyframes fadeOutLeft { - 0% { - opacity: 1; - -o-transform: translateX(0); } - - 100% { - opacity: 0; - -o-transform: translateX(-20px); } } - -@keyframes fadeOutLeft { - 0% { - opacity: 1; - transform: translateX(0); } - - 100% { - opacity: 0; - transform: translateX(-20px); } } - -.fadeOutLeft { - -webkit-animation-name: fadeOutLeft; - -moz-animation-name: fadeOutLeft; - -o-animation-name: fadeOutLeft; - animation-name: fadeOutLeft; } - -@-webkit-keyframes fadeOutRight { - 0% { - opacity: 1; - -webkit-transform: translateX(0); } - - 100% { - opacity: 0; - -webkit-transform: translateX(20px); } } - -@-moz-keyframes fadeOutRight { - 0% { - opacity: 1; - -moz-transform: translateX(0); } - - 100% { - opacity: 0; - -moz-transform: translateX(20px); } } - -@-o-keyframes fadeOutRight { - 0% { - opacity: 1; - -o-transform: translateX(0); } - - 100% { - opacity: 0; - -o-transform: translateX(20px); } } - -@keyframes fadeOutRight { - 0% { - opacity: 1; - transform: translateX(0); } - - 100% { - opacity: 0; - transform: translateX(20px); } } - -.fadeOutRight { - -webkit-animation-name: fadeOutRight; - -moz-animation-name: fadeOutRight; - -o-animation-name: fadeOutRight; - animation-name: fadeOutRight; } - -@-webkit-keyframes fadeOutUpBig { - 0% { - opacity: 1; - -webkit-transform: translateY(0); } - - 100% { - opacity: 0; - -webkit-transform: translateY(-2000px); } } - -@-moz-keyframes fadeOutUpBig { - 0% { - opacity: 1; - -moz-transform: translateY(0); } - - 100% { - opacity: 0; - -moz-transform: translateY(-2000px); } } - -@-o-keyframes fadeOutUpBig { - 0% { - opacity: 1; - -o-transform: translateY(0); } - - 100% { - opacity: 0; - -o-transform: translateY(-2000px); } } - -@keyframes fadeOutUpBig { - 0% { - opacity: 1; - transform: translateY(0); } - - 100% { - opacity: 0; - transform: translateY(-2000px); } } - -.fadeOutUpBig { - -webkit-animation-name: fadeOutUpBig; - -moz-animation-name: fadeOutUpBig; - -o-animation-name: fadeOutUpBig; - animation-name: fadeOutUpBig; } - -@-webkit-keyframes fadeOutDownBig { - 0% { - opacity: 1; - -webkit-transform: translateY(0); } - - 100% { - opacity: 0; - -webkit-transform: translateY(2000px); } } - -@-moz-keyframes fadeOutDownBig { - 0% { - opacity: 1; - -moz-transform: translateY(0); } - - 100% { - opacity: 0; - -moz-transform: translateY(2000px); } } - -@-o-keyframes fadeOutDownBig { - 0% { - opacity: 1; - -o-transform: translateY(0); } - - 100% { - opacity: 0; - -o-transform: translateY(2000px); } } - -@keyframes fadeOutDownBig { - 0% { - opacity: 1; - transform: translateY(0); } - - 100% { - opacity: 0; - transform: translateY(2000px); } } - -.fadeOutDownBig { - -webkit-animation-name: fadeOutDownBig; - -moz-animation-name: fadeOutDownBig; - -o-animation-name: fadeOutDownBig; - animation-name: fadeOutDownBig; } - -@-webkit-keyframes fadeOutLeftBig { - 0% { - opacity: 1; - -webkit-transform: translateX(0); } - - 100% { - opacity: 0; - -webkit-transform: translateX(-2000px); } } - -@-moz-keyframes fadeOutLeftBig { - 0% { - opacity: 1; - -moz-transform: translateX(0); } - - 100% { - opacity: 0; - -moz-transform: translateX(-2000px); } } - -@-o-keyframes fadeOutLeftBig { - 0% { - opacity: 1; - -o-transform: translateX(0); } - - 100% { - opacity: 0; - -o-transform: translateX(-2000px); } } - -@keyframes fadeOutLeftBig { - 0% { - opacity: 1; - transform: translateX(0); } - - 100% { - opacity: 0; - transform: translateX(-2000px); } } - -.fadeOutLeftBig { - -webkit-animation-name: fadeOutLeftBig; - -moz-animation-name: fadeOutLeftBig; - -o-animation-name: fadeOutLeftBig; - animation-name: fadeOutLeftBig; } - -@-webkit-keyframes fadeOutRightBig { - 0% { - opacity: 1; - -webkit-transform: translateX(0); } - - 100% { - opacity: 0; - -webkit-transform: translateX(2000px); } } - -@-moz-keyframes fadeOutRightBig { - 0% { - opacity: 1; - -moz-transform: translateX(0); } - - 100% { - opacity: 0; - -moz-transform: translateX(2000px); } } - -@-o-keyframes fadeOutRightBig { - 0% { - opacity: 1; - -o-transform: translateX(0); } - - 100% { - opacity: 0; - -o-transform: translateX(2000px); } } - -@keyframes fadeOutRightBig { - 0% { - opacity: 1; - transform: translateX(0); } - - 100% { - opacity: 0; - transform: translateX(2000px); } } - -.fadeOutRightBig { - -webkit-animation-name: fadeOutRightBig; - -moz-animation-name: fadeOutRightBig; - -o-animation-name: fadeOutRightBig; - animation-name: fadeOutRightBig; } - -@-webkit-keyframes bounceIn { - 0% { - opacity: 0; - -webkit-transform: scale(0.3); } - - 50% { - opacity: 1; - -webkit-transform: scale(1.05); } - - 70% { - -webkit-transform: scale(0.9); } - - 100% { - -webkit-transform: scale(1); } } - -@-moz-keyframes bounceIn { - 0% { - opacity: 0; - -moz-transform: scale(0.3); } - - 50% { - opacity: 1; - -moz-transform: scale(1.05); } - - 70% { - -moz-transform: scale(0.9); } - - 100% { - -moz-transform: scale(1); } } - -@-o-keyframes bounceIn { - 0% { - opacity: 0; - -o-transform: scale(0.3); } - - 50% { - opacity: 1; - -o-transform: scale(1.05); } - - 70% { - -o-transform: scale(0.9); } - - 100% { - -o-transform: scale(1); } } - -@keyframes bounceIn { - 0% { - opacity: 0; - transform: scale(0.3); } - - 50% { - opacity: 1; - transform: scale(1.05); } - - 70% { - transform: scale(0.9); } - - 100% { - transform: scale(1); } } - -.bounceIn { - -webkit-animation-name: bounceIn; - -moz-animation-name: bounceIn; - -o-animation-name: bounceIn; - animation-name: bounceIn; } - -@-webkit-keyframes bounceInUp { - 0% { - opacity: 0; - -webkit-transform: translateY(2000px); } - - 60% { - opacity: 1; - -webkit-transform: translateY(-30px); } - - 80% { - -webkit-transform: translateY(10px); } - - 100% { - -webkit-transform: translateY(0); } } - -@-moz-keyframes bounceInUp { - 0% { - opacity: 0; - -moz-transform: translateY(2000px); } - - 60% { - opacity: 1; - -moz-transform: translateY(-30px); } - - 80% { - -moz-transform: translateY(10px); } - - 100% { - -moz-transform: translateY(0); } } - -@-o-keyframes bounceInUp { - 0% { - opacity: 0; - -o-transform: translateY(2000px); } - - 60% { - opacity: 1; - -o-transform: translateY(-30px); } - - 80% { - -o-transform: translateY(10px); } - - 100% { - -o-transform: translateY(0); } } - -@keyframes bounceInUp { - 0% { - opacity: 0; - transform: translateY(2000px); } - - 60% { - opacity: 1; - transform: translateY(-30px); } - - 80% { - transform: translateY(10px); } - - 100% { - transform: translateY(0); } } - -.bounceInUp { - -webkit-animation-name: bounceInUp; - -moz-animation-name: bounceInUp; - -o-animation-name: bounceInUp; - animation-name: bounceInUp; } - -@-webkit-keyframes bounceInDown { - 0% { - opacity: 0; - -webkit-transform: translateY(-2000px); } - - 60% { - opacity: 1; - -webkit-transform: translateY(30px); } - - 80% { - -webkit-transform: translateY(-10px); } - - 100% { - -webkit-transform: translateY(0); } } - -@-moz-keyframes bounceInDown { - 0% { - opacity: 0; - -moz-transform: translateY(-2000px); } - - 60% { - opacity: 1; - -moz-transform: translateY(30px); } - - 80% { - -moz-transform: translateY(-10px); } - - 100% { - -moz-transform: translateY(0); } } - -@-o-keyframes bounceInDown { - 0% { - opacity: 0; - -o-transform: translateY(-2000px); } - - 60% { - opacity: 1; - -o-transform: translateY(30px); } - - 80% { - -o-transform: translateY(-10px); } - - 100% { - -o-transform: translateY(0); } } - -@keyframes bounceInDown { - 0% { - opacity: 0; - transform: translateY(-2000px); } - - 60% { - opacity: 1; - transform: translateY(30px); } - - 80% { - transform: translateY(-10px); } - - 100% { - transform: translateY(0); } } - -.bounceInDown { - -webkit-animation-name: bounceInDown; - -moz-animation-name: bounceInDown; - -o-animation-name: bounceInDown; - animation-name: bounceInDown; } - -@-webkit-keyframes bounceInLeft { - 0% { - opacity: 0; - -webkit-transform: translateX(-2000px); } - - 60% { - opacity: 1; - -webkit-transform: translateX(30px); } - - 80% { - -webkit-transform: translateX(-10px); } - - 100% { - -webkit-transform: translateX(0); } } - -@-moz-keyframes bounceInLeft { - 0% { - opacity: 0; - -moz-transform: translateX(-2000px); } - - 60% { - opacity: 1; - -moz-transform: translateX(30px); } - - 80% { - -moz-transform: translateX(-10px); } - - 100% { - -moz-transform: translateX(0); } } - -@-o-keyframes bounceInLeft { - 0% { - opacity: 0; - -o-transform: translateX(-2000px); } - - 60% { - opacity: 1; - -o-transform: translateX(30px); } - - 80% { - -o-transform: translateX(-10px); } - - 100% { - -o-transform: translateX(0); } } - -@keyframes bounceInLeft { - 0% { - opacity: 0; - transform: translateX(-2000px); } - - 60% { - opacity: 1; - transform: translateX(30px); } - - 80% { - transform: translateX(-10px); } - - 100% { - transform: translateX(0); } } - -.bounceInLeft { - -webkit-animation-name: bounceInLeft; - -moz-animation-name: bounceInLeft; - -o-animation-name: bounceInLeft; - animation-name: bounceInLeft; } - -@-webkit-keyframes bounceInRight { - 0% { - opacity: 0; - -webkit-transform: translateX(2000px); } - - 60% { - opacity: 1; - -webkit-transform: translateX(-30px); } - - 80% { - -webkit-transform: translateX(10px); } - - 100% { - -webkit-transform: translateX(0); } } - -@-moz-keyframes bounceInRight { - 0% { - opacity: 0; - -moz-transform: translateX(2000px); } - - 60% { - opacity: 1; - -moz-transform: translateX(-30px); } - - 80% { - -moz-transform: translateX(10px); } - - 100% { - -moz-transform: translateX(0); } } - -@-o-keyframes bounceInRight { - 0% { - opacity: 0; - -o-transform: translateX(2000px); } - - 60% { - opacity: 1; - -o-transform: translateX(-30px); } - - 80% { - -o-transform: translateX(10px); } - - 100% { - -o-transform: translateX(0); } } - -@keyframes bounceInRight { - 0% { - opacity: 0; - transform: translateX(2000px); } - - 60% { - opacity: 1; - transform: translateX(-30px); } - - 80% { - transform: translateX(10px); } - - 100% { - transform: translateX(0); } } - -.bounceInRight { - -webkit-animation-name: bounceInRight; - -moz-animation-name: bounceInRight; - -o-animation-name: bounceInRight; - animation-name: bounceInRight; } - -@-webkit-keyframes bounceOut { - 0% { - -webkit-transform: scale(1); } - - 25% { - -webkit-transform: scale(0.95); } - - 50% { - opacity: 1; - -webkit-transform: scale(1.1); } - - 100% { - opacity: 0; - -webkit-transform: scale(0.3); } } - -@-moz-keyframes bounceOut { - 0% { - -moz-transform: scale(1); } - - 25% { - -moz-transform: scale(0.95); } - - 50% { - opacity: 1; - -moz-transform: scale(1.1); } - - 100% { - opacity: 0; - -moz-transform: scale(0.3); } } - -@-o-keyframes bounceOut { - 0% { - -o-transform: scale(1); } - - 25% { - -o-transform: scale(0.95); } - - 50% { - opacity: 1; - -o-transform: scale(1.1); } - - 100% { - opacity: 0; - -o-transform: scale(0.3); } } - -@keyframes bounceOut { - 0% { - transform: scale(1); } - - 25% { - transform: scale(0.95); } - - 50% { - opacity: 1; - transform: scale(1.1); } - - 100% { - opacity: 0; - transform: scale(0.3); } } - -.bounceOut { - -webkit-animation-name: bounceOut; - -moz-animation-name: bounceOut; - -o-animation-name: bounceOut; - animation-name: bounceOut; } - -@-webkit-keyframes bounceOutUp { - 0% { - -webkit-transform: translateY(0); } - - 20% { - opacity: 1; - -webkit-transform: translateY(20px); } - - 100% { - opacity: 0; - -webkit-transform: translateY(-2000px); } } - -@-moz-keyframes bounceOutUp { - 0% { - -moz-transform: translateY(0); } - - 20% { - opacity: 1; - -moz-transform: translateY(20px); } - - 100% { - opacity: 0; - -moz-transform: translateY(-2000px); } } - -@-o-keyframes bounceOutUp { - 0% { - -o-transform: translateY(0); } - - 20% { - opacity: 1; - -o-transform: translateY(20px); } - - 100% { - opacity: 0; - -o-transform: translateY(-2000px); } } - -@keyframes bounceOutUp { - 0% { - transform: translateY(0); } - - 20% { - opacity: 1; - transform: translateY(20px); } - - 100% { - opacity: 0; - transform: translateY(-2000px); } } - -.bounceOutUp { - -webkit-animation-name: bounceOutUp; - -moz-animation-name: bounceOutUp; - -o-animation-name: bounceOutUp; - animation-name: bounceOutUp; } - -@-webkit-keyframes bounceOutDown { - 0% { - -webkit-transform: translateY(0); } - - 20% { - opacity: 1; - -webkit-transform: translateY(-20px); } - - 100% { - opacity: 0; - -webkit-transform: translateY(2000px); } } - -@-moz-keyframes bounceOutDown { - 0% { - -moz-transform: translateY(0); } - - 20% { - opacity: 1; - -moz-transform: translateY(-20px); } - - 100% { - opacity: 0; - -moz-transform: translateY(2000px); } } - -@-o-keyframes bounceOutDown { - 0% { - -o-transform: translateY(0); } - - 20% { - opacity: 1; - -o-transform: translateY(-20px); } - - 100% { - opacity: 0; - -o-transform: translateY(2000px); } } - -@keyframes bounceOutDown { - 0% { - transform: translateY(0); } - - 20% { - opacity: 1; - transform: translateY(-20px); } - - 100% { - opacity: 0; - transform: translateY(2000px); } } - -.bounceOutDown { - -webkit-animation-name: bounceOutDown; - -moz-animation-name: bounceOutDown; - -o-animation-name: bounceOutDown; - animation-name: bounceOutDown; } - -@-webkit-keyframes bounceOutLeft { - 0% { - -webkit-transform: translateX(0); } - - 20% { - opacity: 1; - -webkit-transform: translateX(20px); } - - 100% { - opacity: 0; - -webkit-transform: translateX(-2000px); } } - -@-moz-keyframes bounceOutLeft { - 0% { - -moz-transform: translateX(0); } - - 20% { - opacity: 1; - -moz-transform: translateX(20px); } - - 100% { - opacity: 0; - -moz-transform: translateX(-2000px); } } - -@-o-keyframes bounceOutLeft { - 0% { - -o-transform: translateX(0); } - - 20% { - opacity: 1; - -o-transform: translateX(20px); } - - 100% { - opacity: 0; - -o-transform: translateX(-2000px); } } - -@keyframes bounceOutLeft { - 0% { - transform: translateX(0); } - - 20% { - opacity: 1; - transform: translateX(20px); } - - 100% { - opacity: 0; - transform: translateX(-2000px); } } - -.bounceOutLeft { - -webkit-animation-name: bounceOutLeft; - -moz-animation-name: bounceOutLeft; - -o-animation-name: bounceOutLeft; - animation-name: bounceOutLeft; } - -@-webkit-keyframes bounceOutRight { - 0% { - -webkit-transform: translateX(0); } - - 20% { - opacity: 1; - -webkit-transform: translateX(-20px); } - - 100% { - opacity: 0; - -webkit-transform: translateX(2000px); } } - -@-moz-keyframes bounceOutRight { - 0% { - -moz-transform: translateX(0); } - - 20% { - opacity: 1; - -moz-transform: translateX(-20px); } - - 100% { - opacity: 0; - -moz-transform: translateX(2000px); } } - -@-o-keyframes bounceOutRight { - 0% { - -o-transform: translateX(0); } - - 20% { - opacity: 1; - -o-transform: translateX(-20px); } - - 100% { - opacity: 0; - -o-transform: translateX(2000px); } } - -@keyframes bounceOutRight { - 0% { - transform: translateX(0); } - - 20% { - opacity: 1; - transform: translateX(-20px); } - - 100% { - opacity: 0; - transform: translateX(2000px); } } - -.bounceOutRight { - -webkit-animation-name: bounceOutRight; - -moz-animation-name: bounceOutRight; - -o-animation-name: bounceOutRight; - animation-name: bounceOutRight; } - -@-webkit-keyframes rotateIn { - 0% { - -webkit-transform-origin: center center; - -webkit-transform: rotate(-200deg); - opacity: 0; } - - 100% { - -webkit-transform-origin: center center; - -webkit-transform: rotate(0); - opacity: 1; } } - -@-moz-keyframes rotateIn { - 0% { - -moz-transform-origin: center center; - -moz-transform: rotate(-200deg); - opacity: 0; } - - 100% { - -moz-transform-origin: center center; - -moz-transform: rotate(0); - opacity: 1; } } - -@-o-keyframes rotateIn { - 0% { - -o-transform-origin: center center; - -o-transform: rotate(-200deg); - opacity: 0; } - - 100% { - -o-transform-origin: center center; - -o-transform: rotate(0); - opacity: 1; } } - -@keyframes rotateIn { - 0% { - transform-origin: center center; - transform: rotate(-200deg); - opacity: 0; } - - 100% { - transform-origin: center center; - transform: rotate(0); - opacity: 1; } } - -.rotateIn { - -webkit-animation-name: rotateIn; - -moz-animation-name: rotateIn; - -o-animation-name: rotateIn; - animation-name: rotateIn; } - -@-webkit-keyframes rotateInUpLeft { - 0% { - -webkit-transform-origin: left bottom; - -webkit-transform: rotate(90deg); - opacity: 0; } - - 100% { - -webkit-transform-origin: left bottom; - -webkit-transform: rotate(0); - opacity: 1; } } - -@-moz-keyframes rotateInUpLeft { - 0% { - -moz-transform-origin: left bottom; - -moz-transform: rotate(90deg); - opacity: 0; } - - 100% { - -moz-transform-origin: left bottom; - -moz-transform: rotate(0); - opacity: 1; } } - -@-o-keyframes rotateInUpLeft { - 0% { - -o-transform-origin: left bottom; - -o-transform: rotate(90deg); - opacity: 0; } - - 100% { - -o-transform-origin: left bottom; - -o-transform: rotate(0); - opacity: 1; } } - -@keyframes rotateInUpLeft { - 0% { - transform-origin: left bottom; - transform: rotate(90deg); - opacity: 0; } - - 100% { - transform-origin: left bottom; - transform: rotate(0); - opacity: 1; } } - -.rotateInUpLeft { - -webkit-animation-name: rotateInUpLeft; - -moz-animation-name: rotateInUpLeft; - -o-animation-name: rotateInUpLeft; - animation-name: rotateInUpLeft; } - -@-webkit-keyframes rotateInDownLeft { - 0% { - -webkit-transform-origin: left bottom; - -webkit-transform: rotate(-90deg); - opacity: 0; } - - 100% { - -webkit-transform-origin: left bottom; - -webkit-transform: rotate(0); - opacity: 1; } } - -@-moz-keyframes rotateInDownLeft { - 0% { - -moz-transform-origin: left bottom; - -moz-transform: rotate(-90deg); - opacity: 0; } - - 100% { - -moz-transform-origin: left bottom; - -moz-transform: rotate(0); - opacity: 1; } } - -@-o-keyframes rotateInDownLeft { - 0% { - -o-transform-origin: left bottom; - -o-transform: rotate(-90deg); - opacity: 0; } - - 100% { - -o-transform-origin: left bottom; - -o-transform: rotate(0); - opacity: 1; } } - -@keyframes rotateInDownLeft { - 0% { - transform-origin: left bottom; - transform: rotate(-90deg); - opacity: 0; } - - 100% { - transform-origin: left bottom; - transform: rotate(0); - opacity: 1; } } - -.rotateInDownLeft { - -webkit-animation-name: rotateInDownLeft; - -moz-animation-name: rotateInDownLeft; - -o-animation-name: rotateInDownLeft; - animation-name: rotateInDownLeft; } - -@-webkit-keyframes rotateInUpRight { - 0% { - -webkit-transform-origin: right bottom; - -webkit-transform: rotate(-90deg); - opacity: 0; } - - 100% { - -webkit-transform-origin: right bottom; - -webkit-transform: rotate(0); - opacity: 1; } } - -@-moz-keyframes rotateInUpRight { - 0% { - -moz-transform-origin: right bottom; - -moz-transform: rotate(-90deg); - opacity: 0; } - - 100% { - -moz-transform-origin: right bottom; - -moz-transform: rotate(0); - opacity: 1; } } - -@-o-keyframes rotateInUpRight { - 0% { - -o-transform-origin: right bottom; - -o-transform: rotate(-90deg); - opacity: 0; } - - 100% { - -o-transform-origin: right bottom; - -o-transform: rotate(0); - opacity: 1; } } - -@keyframes rotateInUpRight { - 0% { - transform-origin: right bottom; - transform: rotate(-90deg); - opacity: 0; } - - 100% { - transform-origin: right bottom; - transform: rotate(0); - opacity: 1; } } - -.rotateInUpRight { - -webkit-animation-name: rotateInUpRight; - -moz-animation-name: rotateInUpRight; - -o-animation-name: rotateInUpRight; - animation-name: rotateInUpRight; } - -@-webkit-keyframes rotateInDownRight { - 0% { - -webkit-transform-origin: right bottom; - -webkit-transform: rotate(90deg); - opacity: 0; } - - 100% { - -webkit-transform-origin: right bottom; - -webkit-transform: rotate(0); - opacity: 1; } } - -@-moz-keyframes rotateInDownRight { - 0% { - -moz-transform-origin: right bottom; - -moz-transform: rotate(90deg); - opacity: 0; } - - 100% { - -moz-transform-origin: right bottom; - -moz-transform: rotate(0); - opacity: 1; } } - -@-o-keyframes rotateInDownRight { - 0% { - -o-transform-origin: right bottom; - -o-transform: rotate(90deg); - opacity: 0; } - - 100% { - -o-transform-origin: right bottom; - -o-transform: rotate(0); - opacity: 1; } } - -@keyframes rotateInDownRight { - 0% { - transform-origin: right bottom; - transform: rotate(90deg); - opacity: 0; } - - 100% { - transform-origin: right bottom; - transform: rotate(0); - opacity: 1; } } - -.rotateInDownRight { - -webkit-animation-name: rotateInDownRight; - -moz-animation-name: rotateInDownRight; - -o-animation-name: rotateInDownRight; - animation-name: rotateInDownRight; } - -@-webkit-keyframes rotateOut { - 0% { - -webkit-transform-origin: center center; - -webkit-transform: rotate(0); - opacity: 1; } - - 100% { - -webkit-transform-origin: center center; - -webkit-transform: rotate(200deg); - opacity: 0; } } - -@-moz-keyframes rotateOut { - 0% { - -moz-transform-origin: center center; - -moz-transform: rotate(0); - opacity: 1; } - - 100% { - -moz-transform-origin: center center; - -moz-transform: rotate(200deg); - opacity: 0; } } - -@-o-keyframes rotateOut { - 0% { - -o-transform-origin: center center; - -o-transform: rotate(0); - opacity: 1; } - - 100% { - -o-transform-origin: center center; - -o-transform: rotate(200deg); - opacity: 0; } } - -@keyframes rotateOut { - 0% { - transform-origin: center center; - transform: rotate(0); - opacity: 1; } - - 100% { - transform-origin: center center; - transform: rotate(200deg); - opacity: 0; } } - -.rotateOut { - -webkit-animation-name: rotateOut; - -moz-animation-name: rotateOut; - -o-animation-name: rotateOut; - animation-name: rotateOut; } - -@-webkit-keyframes rotateOutUpLeft { - 0% { - -webkit-transform-origin: left bottom; - -webkit-transform: rotate(0); - opacity: 1; } - - 100% { - -webkit-transform-origin: left bottom; - -webkit-transform: rotate(-90deg); - opacity: 0; } } - -@-moz-keyframes rotateOutUpLeft { - 0% { - -moz-transform-origin: left bottom; - -moz-transform: rotate(0); - opacity: 1; } - - 100% { - -moz-transform-origin: left bottom; - -moz-transform: rotate(-90deg); - opacity: 0; } } - -@-o-keyframes rotateOutUpLeft { - 0% { - -o-transform-origin: left bottom; - -o-transform: rotate(0); - opacity: 1; } - - 100% { - -o-transform-origin: left bottom; - -o-transform: rotate(-90deg); - opacity: 0; } } - -@keyframes rotateOutUpLeft { - 0% { - transform-origin: left bottom; - transform: rotate(0); - opacity: 1; } - - 100% { - transform-origin: left bottom; - transform: rotate(-90deg); - opacity: 0; } } - -.rotateOutUpLeft { - -webkit-animation-name: rotateOutUpLeft; - -moz-animation-name: rotateOutUpLeft; - -o-animation-name: rotateOutUpLeft; - animation-name: rotateOutUpLeft; } - -@-webkit-keyframes rotateOutDownLeft { - 0% { - -webkit-transform-origin: left bottom; - -webkit-transform: rotate(0); - opacity: 1; } - - 100% { - -webkit-transform-origin: left bottom; - -webkit-transform: rotate(90deg); - opacity: 0; } } - -@-moz-keyframes rotateOutDownLeft { - 0% { - -moz-transform-origin: left bottom; - -moz-transform: rotate(0); - opacity: 1; } - - 100% { - -moz-transform-origin: left bottom; - -moz-transform: rotate(90deg); - opacity: 0; } } - -@-o-keyframes rotateOutDownLeft { - 0% { - -o-transform-origin: left bottom; - -o-transform: rotate(0); - opacity: 1; } - - 100% { - -o-transform-origin: left bottom; - -o-transform: rotate(90deg); - opacity: 0; } } - -@keyframes rotateOutDownLeft { - 0% { - transform-origin: left bottom; - transform: rotate(0); - opacity: 1; } - - 100% { - transform-origin: left bottom; - transform: rotate(90deg); - opacity: 0; } } - -.rotateOutDownLeft { - -webkit-animation-name: rotateOutDownLeft; - -moz-animation-name: rotateOutDownLeft; - -o-animation-name: rotateOutDownLeft; - animation-name: rotateOutDownLeft; } - -@-webkit-keyframes rotateOutUpRight { - 0% { - -webkit-transform-origin: right bottom; - -webkit-transform: rotate(0); - opacity: 1; } - - 100% { - -webkit-transform-origin: right bottom; - -webkit-transform: rotate(90deg); - opacity: 0; } } - -@-moz-keyframes rotateOutUpRight { - 0% { - -moz-transform-origin: right bottom; - -moz-transform: rotate(0); - opacity: 1; } - - 100% { - -moz-transform-origin: right bottom; - -moz-transform: rotate(90deg); - opacity: 0; } } - -@-o-keyframes rotateOutUpRight { - 0% { - -o-transform-origin: right bottom; - -o-transform: rotate(0); - opacity: 1; } - - 100% { - -o-transform-origin: right bottom; - -o-transform: rotate(90deg); - opacity: 0; } } - -@keyframes rotateOutUpRight { - 0% { - transform-origin: right bottom; - transform: rotate(0); - opacity: 1; } - - 100% { - transform-origin: right bottom; - transform: rotate(90deg); - opacity: 0; } } - -.rotateOutUpRight { - -webkit-animation-name: rotateOutUpRight; - -moz-animation-name: rotateOutUpRight; - -o-animation-name: rotateOutUpRight; - animation-name: rotateOutUpRight; } - -@-webkit-keyframes rotateOutDownRight { - 0% { - -webkit-transform-origin: right bottom; - -webkit-transform: rotate(0); - opacity: 1; } - - 100% { - -webkit-transform-origin: right bottom; - -webkit-transform: rotate(-90deg); - opacity: 0; } } - -@-moz-keyframes rotateOutDownRight { - 0% { - -moz-transform-origin: right bottom; - -moz-transform: rotate(0); - opacity: 1; } - - 100% { - -moz-transform-origin: right bottom; - -moz-transform: rotate(-90deg); - opacity: 0; } } - -@-o-keyframes rotateOutDownRight { - 0% { - -o-transform-origin: right bottom; - -o-transform: rotate(0); - opacity: 1; } - - 100% { - -o-transform-origin: right bottom; - -o-transform: rotate(-90deg); - opacity: 0; } } - -@keyframes rotateOutDownRight { - 0% { - transform-origin: right bottom; - transform: rotate(0); - opacity: 1; } - - 100% { - transform-origin: right bottom; - transform: rotate(-90deg); - opacity: 0; } } - -.rotateOutDownRight { - -webkit-animation-name: rotateOutDownRight; - -moz-animation-name: rotateOutDownRight; - -o-animation-name: rotateOutDownRight; - animation-name: rotateOutDownRight; } - -@-webkit-keyframes hinge { - 0% { - -webkit-transform: rotate(0); - -webkit-transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; } - - 20%, 60% { - -webkit-transform: rotate(80deg); - -webkit-transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; } - - 40% { - -webkit-transform: rotate(60deg); - -webkit-transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; } - - 80% { - -webkit-transform: rotate(60deg) translateY(0); - opacity: 1; - -webkit-transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; } - - 100% { - -webkit-transform: translateY(700px); - opacity: 0; } } - -@-moz-keyframes hinge { - 0% { - -moz-transform: rotate(0); - -moz-transform-origin: top left; - -moz-animation-timing-function: ease-in-out; } - - 20%, 60% { - -moz-transform: rotate(80deg); - -moz-transform-origin: top left; - -moz-animation-timing-function: ease-in-out; } - - 40% { - -moz-transform: rotate(60deg); - -moz-transform-origin: top left; - -moz-animation-timing-function: ease-in-out; } - - 80% { - -moz-transform: rotate(60deg) translateY(0); - opacity: 1; - -moz-transform-origin: top left; - -moz-animation-timing-function: ease-in-out; } - - 100% { - -moz-transform: translateY(700px); - opacity: 0; } } - -@-o-keyframes hinge { - 0% { - -o-transform: rotate(0); - -o-transform-origin: top left; - -o-animation-timing-function: ease-in-out; } - - 20%, 60% { - -o-transform: rotate(80deg); - -o-transform-origin: top left; - -o-animation-timing-function: ease-in-out; } - - 40% { - -o-transform: rotate(60deg); - -o-transform-origin: top left; - -o-animation-timing-function: ease-in-out; } - - 80% { - -o-transform: rotate(60deg) translateY(0); - opacity: 1; - -o-transform-origin: top left; - -o-animation-timing-function: ease-in-out; } - - 100% { - -o-transform: translateY(700px); - opacity: 0; } } - -@keyframes hinge { - 0% { - transform: rotate(0); - transform-origin: top left; - animation-timing-function: ease-in-out; } - - 20%, 60% { - transform: rotate(80deg); - transform-origin: top left; - animation-timing-function: ease-in-out; } - - 40% { - transform: rotate(60deg); - transform-origin: top left; - animation-timing-function: ease-in-out; } - - 80% { - transform: rotate(60deg) translateY(0); - opacity: 1; - transform-origin: top left; - animation-timing-function: ease-in-out; } - - 100% { - transform: translateY(700px); - opacity: 0; } } - -.hinge { - -webkit-animation-name: hinge; - -moz-animation-name: hinge; - -o-animation-name: hinge; - animation-name: hinge; } - -/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ -@-webkit-keyframes rollIn { - 0% { - opacity: 0; - -webkit-transform: translateX(-100%) rotate(-120deg); } - - 100% { - opacity: 1; - -webkit-transform: translateX(0px) rotate(0deg); } } - -@-moz-keyframes rollIn { - 0% { - opacity: 0; - -moz-transform: translateX(-100%) rotate(-120deg); } - - 100% { - opacity: 1; - -moz-transform: translateX(0px) rotate(0deg); } } - -@-o-keyframes rollIn { - 0% { - opacity: 0; - -o-transform: translateX(-100%) rotate(-120deg); } - - 100% { - opacity: 1; - -o-transform: translateX(0px) rotate(0deg); } } - -@keyframes rollIn { - 0% { - opacity: 0; - transform: translateX(-100%) rotate(-120deg); } - - 100% { - opacity: 1; - transform: translateX(0px) rotate(0deg); } } - -.rollIn { - -webkit-animation-name: rollIn; - -moz-animation-name: rollIn; - -o-animation-name: rollIn; - animation-name: rollIn; } - -/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ -@-webkit-keyframes rollOut { - 0% { - opacity: 1; - -webkit-transform: translateX(0px) rotate(0deg); } - - 100% { - opacity: 0; - -webkit-transform: translateX(100%) rotate(120deg); } } - -@-moz-keyframes rollOut { - 0% { - opacity: 1; - -moz-transform: translateX(0px) rotate(0deg); } - - 100% { - opacity: 0; - -moz-transform: translateX(100%) rotate(120deg); } } - -@-o-keyframes rollOut { - 0% { - opacity: 1; - -o-transform: translateX(0px) rotate(0deg); } - - 100% { - opacity: 0; - -o-transform: translateX(100%) rotate(120deg); } } - -@keyframes rollOut { - 0% { - opacity: 1; - transform: translateX(0px) rotate(0deg); } - - 100% { - opacity: 0; - transform: translateX(100%) rotate(120deg); } } - -.rollOut { - -webkit-animation-name: rollOut; - -moz-animation-name: rollOut; - -o-animation-name: rollOut; - animation-name: rollOut; } - -/* originally authored by Angelo Rohit - https://github.com/angelorohit */ -@-webkit-keyframes lightSpeedIn { - 0% { - -webkit-transform: translateX(100%) skewX(-30deg); - opacity: 0; } - - 60% { - -webkit-transform: translateX(-20%) skewX(30deg); - opacity: 1; } - - 80% { - -webkit-transform: translateX(0%) skewX(-15deg); - opacity: 1; } - - 100% { - -webkit-transform: translateX(0%) skewX(0deg); - opacity: 1; } } - -@-moz-keyframes lightSpeedIn { - 0% { - -moz-transform: translateX(100%) skewX(-30deg); - opacity: 0; } - - 60% { - -moz-transform: translateX(-20%) skewX(30deg); - opacity: 1; } - - 80% { - -moz-transform: translateX(0%) skewX(-15deg); - opacity: 1; } - - 100% { - -moz-transform: translateX(0%) skewX(0deg); - opacity: 1; } } - -@-o-keyframes lightSpeedIn { - 0% { - -o-transform: translateX(100%) skewX(-30deg); - opacity: 0; } - - 60% { - -o-transform: translateX(-20%) skewX(30deg); - opacity: 1; } - - 80% { - -o-transform: translateX(0%) skewX(-15deg); - opacity: 1; } - - 100% { - -o-transform: translateX(0%) skewX(0deg); - opacity: 1; } } - -@keyframes lightSpeedIn { - 0% { - transform: translateX(100%) skewX(-30deg); - opacity: 0; } - - 60% { - transform: translateX(-20%) skewX(30deg); - opacity: 1; } - - 80% { - transform: translateX(0%) skewX(-15deg); - opacity: 1; } - - 100% { - transform: translateX(0%) skewX(0deg); - opacity: 1; } } - -.lightSpeedIn { - -webkit-animation-name: lightSpeedIn; - -moz-animation-name: lightSpeedIn; - -o-animation-name: lightSpeedIn; - animation-name: lightSpeedIn; - -webkit-animation-timing-function: ease-out; - -moz-animation-timing-function: ease-out; - -o-animation-timing-function: ease-out; - animation-timing-function: ease-out; } - -.animated.lightSpeedIn { - -webkit-animation-duration: 0.5s; - -moz-animation-duration: 0.5s; - -o-animation-duration: 0.5s; - animation-duration: 0.5s; } - -/* originally authored by Angelo Rohit - https://github.com/angelorohit */ -@-webkit-keyframes lightSpeedOut { - 0% { - -webkit-transform: translateX(0%) skewX(0deg); - opacity: 1; } - - 100% { - -webkit-transform: translateX(100%) skewX(-30deg); - opacity: 0; } } - -@-moz-keyframes lightSpeedOut { - 0% { - -moz-transform: translateX(0%) skewX(0deg); - opacity: 1; } - - 100% { - -moz-transform: translateX(100%) skewX(-30deg); - opacity: 0; } } - -@-o-keyframes lightSpeedOut { - 0% { - -o-transform: translateX(0%) skewX(0deg); - opacity: 1; } - - 100% { - -o-transform: translateX(100%) skewX(-30deg); - opacity: 0; } } - -@keyframes lightSpeedOut { - 0% { - transform: translateX(0%) skewX(0deg); - opacity: 1; } - - 100% { - transform: translateX(100%) skewX(-30deg); - opacity: 0; } } - -.lightSpeedOut { - -webkit-animation-name: lightSpeedOut; - -moz-animation-name: lightSpeedOut; - -o-animation-name: lightSpeedOut; - animation-name: lightSpeedOut; - -webkit-animation-timing-function: ease-in; - -moz-animation-timing-function: ease-in; - -o-animation-timing-function: ease-in; - animation-timing-function: ease-in; } - -.animated.lightSpeedOut { - -webkit-animation-duration: 0.25s; - -moz-animation-duration: 0.25s; - -o-animation-duration: 0.25s; - animation-duration: 0.25s; } - -/* originally authored by Angelo Rohit - https://github.com/angelorohit */ -@-webkit-keyframes wiggle { - 0% { - -webkit-transform: skewX(9deg); } - - 10% { - -webkit-transform: skewX(-8deg); } - - 20% { - -webkit-transform: skewX(7deg); } - - 30% { - -webkit-transform: skewX(-6deg); } - - 40% { - -webkit-transform: skewX(5deg); } - - 50% { - -webkit-transform: skewX(-4deg); } - - 60% { - -webkit-transform: skewX(3deg); } - - 70% { - -webkit-transform: skewX(-2deg); } - - 80% { - -webkit-transform: skewX(1deg); } - - 90% { - -webkit-transform: skewX(0deg); } - - 100% { - -webkit-transform: skewX(0deg); } } - -@-moz-keyframes wiggle { - 0% { - -moz-transform: skewX(9deg); } - - 10% { - -moz-transform: skewX(-8deg); } - - 20% { - -moz-transform: skewX(7deg); } - - 30% { - -moz-transform: skewX(-6deg); } - - 40% { - -moz-transform: skewX(5deg); } - - 50% { - -moz-transform: skewX(-4deg); } - - 60% { - -moz-transform: skewX(3deg); } - - 70% { - -moz-transform: skewX(-2deg); } - - 80% { - -moz-transform: skewX(1deg); } - - 90% { - -moz-transform: skewX(0deg); } - - 100% { - -moz-transform: skewX(0deg); } } - -@-o-keyframes wiggle { - 0% { - -o-transform: skewX(9deg); } - - 10% { - -o-transform: skewX(-8deg); } - - 20% { - -o-transform: skewX(7deg); } - - 30% { - -o-transform: skewX(-6deg); } - - 40% { - -o-transform: skewX(5deg); } - - 50% { - -o-transform: skewX(-4deg); } - - 60% { - -o-transform: skewX(3deg); } - - 70% { - -o-transform: skewX(-2deg); } - - 80% { - -o-transform: skewX(1deg); } - - 90% { - -o-transform: skewX(0deg); } - - 100% { - -o-transform: skewX(0deg); } } - -@keyframes wiggle { - 0% { - transform: skewX(9deg); } - - 10% { - transform: skewX(-8deg); } - - 20% { - transform: skewX(7deg); } - - 30% { - transform: skewX(-6deg); } - - 40% { - transform: skewX(5deg); } - - 50% { - transform: skewX(-4deg); } - - 60% { - transform: skewX(3deg); } - - 70% { - transform: skewX(-2deg); } - - 80% { - transform: skewX(1deg); } - - 90% { - transform: skewX(0deg); } - - 100% { - transform: skewX(0deg); } } - -.wiggle { - -webkit-animation-name: wiggle; - -moz-animation-name: wiggle; - -o-animation-name: wiggle; - animation-name: wiggle; - -webkit-animation-timing-function: ease-in; - -moz-animation-timing-function: ease-in; - -o-animation-timing-function: ease-in; - animation-timing-function: ease-in; } - -.animated.wiggle { - -webkit-animation-duration: 0.75s; - -moz-animation-duration: 0.75s; - -o-animation-duration: 0.75s; - animation-duration: 0.75s; } |