From 50754afdf05da0c3d14e5806fc6d97ae043dbdd7 Mon Sep 17 00:00:00 2001 From: wd Date: Fri, 10 Mar 2017 19:12:39 +0800 Subject: First version --- archetypes/default.md | 2 + layouts/404.html | 0 layouts/_default/baseof.html | 27 + layouts/_default/list.html | 3 + layouts/_default/single.html | 16 + layouts/_default/terms.html | 7 + layouts/archives/single.html | 4 + layouts/index.html | 22 + layouts/partials/archive.html | 27 + layouts/partials/article.html | 24 + layouts/partials/author.html | 8 + layouts/partials/categories.html | 8 + layouts/partials/disqus.html | 19 + layouts/partials/footer.html | 9 + layouts/partials/head.html | 47 + layouts/partials/header.html | 13 + layouts/partials/navigation.html | 14 + layouts/partials/post/author.html | 8 + layouts/partials/post/categories.html | 8 + layouts/partials/post/date.html | 1 + layouts/partials/post/sharing.html | 15 + layouts/partials/post/tags.html | 5 + layouts/partials/social.html | 50 + layouts/partials/tags.html | 25 + static/css/custom.css | 98 + static/css/github.css | 125 + static/css/hljs.css | 125 + static/css/screen.css | 4103 +++++++++++++++++++++++++++++++++ static/font/fontawesome-webfont.eot | Bin 0 -> 42272 bytes static/font/fontawesome-webfont.svg | 175 ++ static/font/fontawesome-webfont.svgz | Bin 0 -> 21845 bytes static/font/fontawesome-webfont.ttf | Bin 0 -> 41916 bytes static/font/fontawesome-webfont.woff | Bin 0 -> 23416 bytes static/images/active.png | Bin 0 -> 1292 bytes static/images/bg-gradient.png | Bin 0 -> 12615 bytes static/images/hover.png | Bin 0 -> 3824 bytes static/images/html5css3.png | Bin 0 -> 1660 bytes static/images/loading.gif | Bin 0 -> 6957 bytes static/images/loading_pacman.gif | Bin 0 -> 1928 bytes static/images/retina_dust.png | Bin 0 -> 17670 bytes static/images/search-dark.png | Bin 0 -> 515 bytes static/images/search-white.png | Bin 0 -> 363 bytes static/images/social/Facebook.png | Bin 0 -> 3152 bytes static/images/social/FacebookH.png | Bin 0 -> 3755 bytes static/images/social/Github.png | Bin 0 -> 3702 bytes static/images/social/GithubH.png | Bin 0 -> 4324 bytes static/images/social/LastFM.png | Bin 0 -> 4055 bytes static/images/social/LastFMH.png | Bin 0 -> 4834 bytes static/images/social/LinkedIn.png | Bin 0 -> 3445 bytes static/images/social/LinkedInH.png | Bin 0 -> 4362 bytes static/images/social/Picasa.png | Bin 0 -> 3856 bytes static/images/social/PicasaH.png | Bin 0 -> 4474 bytes static/images/social/Skype.png | Bin 0 -> 4033 bytes static/images/social/SkypeH.png | Bin 0 -> 4767 bytes static/images/social/Twitter.png | Bin 0 -> 3728 bytes static/images/social/TwitterH.png | Bin 0 -> 4357 bytes static/images/social/Youtube.png | Bin 0 -> 3682 bytes static/images/social/YoutubeH.png | Bin 0 -> 4510 bytes static/images/totop.png | Bin 0 -> 1752 bytes static/js/fabric.js | 62 + static/js/jquery-tapir.js | 60 + static/js/jquery.ui.totop.js | 200 ++ theme.toml | 21 + 63 files changed, 5331 insertions(+) create mode 100644 archetypes/default.md create mode 100644 layouts/404.html create mode 100644 layouts/_default/baseof.html create mode 100644 layouts/_default/list.html create mode 100644 layouts/_default/single.html create mode 100644 layouts/_default/terms.html create mode 100644 layouts/archives/single.html create mode 100644 layouts/index.html create mode 100644 layouts/partials/archive.html create mode 100644 layouts/partials/article.html create mode 100644 layouts/partials/author.html create mode 100644 layouts/partials/categories.html create mode 100644 layouts/partials/disqus.html create mode 100644 layouts/partials/footer.html create mode 100644 layouts/partials/head.html create mode 100644 layouts/partials/header.html create mode 100644 layouts/partials/navigation.html create mode 100644 layouts/partials/post/author.html create mode 100644 layouts/partials/post/categories.html create mode 100644 layouts/partials/post/date.html create mode 100644 layouts/partials/post/sharing.html create mode 100644 layouts/partials/post/tags.html create mode 100644 layouts/partials/social.html create mode 100644 layouts/partials/tags.html create mode 100644 static/css/custom.css create mode 100644 static/css/github.css create mode 100644 static/css/hljs.css create mode 100644 static/css/screen.css create mode 100644 static/font/fontawesome-webfont.eot create mode 100644 static/font/fontawesome-webfont.svg create mode 100644 static/font/fontawesome-webfont.svgz create mode 100644 static/font/fontawesome-webfont.ttf create mode 100644 static/font/fontawesome-webfont.woff create mode 100644 static/images/active.png create mode 100644 static/images/bg-gradient.png create mode 100644 static/images/hover.png create mode 100644 static/images/html5css3.png create mode 100644 static/images/loading.gif create mode 100644 static/images/loading_pacman.gif create mode 100644 static/images/retina_dust.png create mode 100644 static/images/search-dark.png create mode 100644 static/images/search-white.png create mode 100644 static/images/social/Facebook.png create mode 100644 static/images/social/FacebookH.png create mode 100644 static/images/social/Github.png create mode 100644 static/images/social/GithubH.png create mode 100644 static/images/social/LastFM.png create mode 100644 static/images/social/LastFMH.png create mode 100644 static/images/social/LinkedIn.png create mode 100644 static/images/social/LinkedInH.png create mode 100644 static/images/social/Picasa.png create mode 100644 static/images/social/PicasaH.png create mode 100644 static/images/social/Skype.png create mode 100644 static/images/social/SkypeH.png create mode 100644 static/images/social/Twitter.png create mode 100644 static/images/social/TwitterH.png create mode 100644 static/images/social/Youtube.png create mode 100644 static/images/social/YoutubeH.png create mode 100644 static/images/totop.png create mode 100644 static/js/fabric.js create mode 100644 static/js/jquery-tapir.js create mode 100644 static/js/jquery.ui.totop.js create mode 100644 theme.toml diff --git a/archetypes/default.md b/archetypes/default.md new file mode 100644 index 0000000..ac36e06 --- /dev/null +++ b/archetypes/default.md @@ -0,0 +1,2 @@ ++++ ++++ diff --git a/layouts/404.html b/layouts/404.html new file mode 100644 index 0000000..e69de29 diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html new file mode 100644 index 0000000..3b77125 --- /dev/null +++ b/layouts/_default/baseof.html @@ -0,0 +1,27 @@ +{{ partial "head.html" . }} + + +
+ + +
+ +
+ {{ block "body" . }}{{ end }} +
+
+ {{ partial "footer.html" . }} +
+ + + +
+
+ + + + diff --git a/layouts/_default/list.html b/layouts/_default/list.html new file mode 100644 index 0000000..6fa6844 --- /dev/null +++ b/layouts/_default/list.html @@ -0,0 +1,3 @@ +{{ define "body" }} +{{ partial "tags.html" . }} +{{ end }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html new file mode 100644 index 0000000..74d61d3 --- /dev/null +++ b/layouts/_default/single.html @@ -0,0 +1,16 @@ +{{ define "body" }} +
{{ partial "article.html" (dict "post" . "index" false) }}
+ +{{ partial "post/sharing.html" (dict "theme" $.Site.Params.theme) }} + +{{ partial "disqus.html" (dict "shortname" $.Site.Params.theme.disqus_shortname "index" false "post" .) }} + +{{ if $.Site.Params.theme.disqus_shortname }} +
+

Comments

+
+ +
+
+{{ end }} +{{ end }} diff --git a/layouts/_default/terms.html b/layouts/_default/terms.html new file mode 100644 index 0000000..22ee845 --- /dev/null +++ b/layouts/_default/terms.html @@ -0,0 +1,7 @@ +{{ define "body" }} +{{ $site := .Site }} +{{ $data := .Data }} +{{ range $key, $value := .Data.Terms.Alphabetical }} +{{ $value.Name }}({{ $value.Count }}) +{{ end }} +{{ end }} diff --git a/layouts/archives/single.html b/layouts/archives/single.html new file mode 100644 index 0000000..ff22477 --- /dev/null +++ b/layouts/archives/single.html @@ -0,0 +1,4 @@ +{{ define "body" }} +{{ partial "disqus.html" (dict "index" true) }} +{{ partial "archive.html" . }} +{{ end }} diff --git a/layouts/index.html b/layouts/index.html new file mode 100644 index 0000000..8d74656 --- /dev/null +++ b/layouts/index.html @@ -0,0 +1,22 @@ +{{ define "body" }} +{{ $index := true }} +{{ $pag := $.Paginator }} + +{{ partial "disqus.html" (dict "shortname" $.Site.Params.theme.disqus_shortname "index" $index) }} + +{{ range where $pag.Pages "Type" "ne" $.Site.Params.theme.archive_post_type }} +
{{ partial "article.html" (dict "post" . "index" $index "theme" $.Site.Params.theme) }}
+{{ end }} + +{{ if gt $pag.TotalPages 1 }} + +{{ end }} +{{ end }} diff --git a/layouts/partials/archive.html b/layouts/partials/archive.html new file mode 100644 index 0000000..d835dc2 --- /dev/null +++ b/layouts/partials/archive.html @@ -0,0 +1,27 @@ +{{ $.Scratch.Add "last" 0 }} +{{ range (where $.Site.Pages "Kind" $.Site.Params.theme.post_type) }} + {{ if ne .Type $.Site.Params.theme.archive_post_type }} + {{ $year := .Date.Format "2006" | int }} + {{ $post_date := .Date.Format "01-02" }} + {{ $last := $.Scratch.Get "last" }} + {{ if ne $last $year }} + {{ if ne $last 0 }} + + {{ end }} + {{ $.Scratch.Set "last" $year }} +

{{ $year }}

+ {{ end }} + +
+

{{ .Title }}

+
+ {{ $post_date }} + {{ partial "post/tags.html" . }} + {{ if $.Site.Params.theme.disqus_shortname }} + Comments + {{ end }} +
+
+ {{ end }} +{{ end }} +
diff --git a/layouts/partials/article.html b/layouts/partials/article.html new file mode 100644 index 0000000..a3d7133 --- /dev/null +++ b/layouts/partials/article.html @@ -0,0 +1,24 @@ +{{ if .index }} +

+ {{ .post.Title }} +

+
+
+
Published on: {{ partial "post/date.html" .post }}
+
Tags: {{ partial "post/tags.html" .post }}
+
+ {{ .post.Content }} +
+{{ else }} +

{{ .post.Title }}

+
+
Published on: {{ partial "post/date.html" .post }}
+
Tags: {{ partial "post/tags.html" .post }}
+
+
{{ .post.Content }}
+{{ end }} +
+ {{ if .theme.disqus_shortname }} + Comments + {{ end }} +
diff --git a/layouts/partials/author.html b/layouts/partials/author.html new file mode 100644 index 0000000..5d04424 --- /dev/null +++ b/layouts/partials/author.html @@ -0,0 +1,8 @@ +<% if post.author %> + <% assign author = post.author %> +<% elsif page.author %> + <% assign author = page.author %> +<% else %> + <% assign author = theme.author %> +<% } %> +<% if author %>Posted by <%= author %><% } %> diff --git a/layouts/partials/categories.html b/layouts/partials/categories.html new file mode 100644 index 0000000..7638fbf --- /dev/null +++ b/layouts/partials/categories.html @@ -0,0 +1,8 @@ +<% capture category %><% if post %><%= post.categories | category_links | size %><% else %><%= page.categories | category_links | size %><% } %><% endcapture %> +<% unless category == '0' %> +<% if post %> + <%= post.categories | category_links %> +<% else %> + <%= page.categories | category_links %> +<% } %> +<% endunless %> diff --git a/layouts/partials/disqus.html b/layouts/partials/disqus.html new file mode 100644 index 0000000..9da7440 --- /dev/null +++ b/layouts/partials/disqus.html @@ -0,0 +1,19 @@ +{{ if .shortname }} + {{ if (not .index) }} + + {{ else }} + + {{ end }} +{{ end }} diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html new file mode 100644 index 0000000..0f8f808 --- /dev/null +++ b/layouts/partials/footer.html @@ -0,0 +1,9 @@ +
+ Copyright © {{ now | dateFormat "2006" }} + {{ if .Site.Params.author }} + {{ .Site.Params.author }} + {{ else }} + {{ .Site.Title }} + {{ end }}. Powered by Hugo | + Theme is hugo-fabric, fork from hexo-fabric by me +
diff --git a/layouts/partials/head.html b/layouts/partials/head.html new file mode 100644 index 0000000..36e3edb --- /dev/null +++ b/layouts/partials/head.html @@ -0,0 +1,47 @@ + + + + + + {{ $.Scratch.Add "title" "" }} + {{ if eq .Type "Archives" }} + {{ $.Scratch.Set "title" "Archives" }} + {{ end }} + {{ if $.Scratch.Get "title" }}{{ $.Scratch.Get "title" }} - {{ end }}{{ .Title }} + + + + + + + + + + + + + + + + + + + + {{ template "_internal/google_analytics_async.html" . }} + diff --git a/layouts/partials/header.html b/layouts/partials/header.html new file mode 100644 index 0000000..78bf8a4 --- /dev/null +++ b/layouts/partials/header.html @@ -0,0 +1,13 @@ + +

+
+ {{ .Site.Title }} +
+

+{{ $theme := .Site.Params.theme }} +{{ if $theme.subtitle }}{{ $theme.subtitle }}{{ end }} +
+ +{{ partial "social.html" (dict "theme" $theme) }} + +{{ partial "navigation.html" . }} diff --git a/layouts/partials/navigation.html b/layouts/partials/navigation.html new file mode 100644 index 0000000..fe34abd --- /dev/null +++ b/layouts/partials/navigation.html @@ -0,0 +1,14 @@ + diff --git a/layouts/partials/post/author.html b/layouts/partials/post/author.html new file mode 100644 index 0000000..5d04424 --- /dev/null +++ b/layouts/partials/post/author.html @@ -0,0 +1,8 @@ +<% if post.author %> + <% assign author = post.author %> +<% elsif page.author %> + <% assign author = page.author %> +<% else %> + <% assign author = theme.author %> +<% } %> +<% if author %>Posted by <%= author %><% } %> diff --git a/layouts/partials/post/categories.html b/layouts/partials/post/categories.html new file mode 100644 index 0000000..7638fbf --- /dev/null +++ b/layouts/partials/post/categories.html @@ -0,0 +1,8 @@ +<% capture category %><% if post %><%= post.categories | category_links | size %><% else %><%= page.categories | category_links | size %><% } %><% endcapture %> +<% unless category == '0' %> +<% if post %> + <%= post.categories | category_links %> +<% else %> + <%= page.categories | category_links %> +<% } %> +<% endunless %> diff --git a/layouts/partials/post/date.html b/layouts/partials/post/date.html new file mode 100644 index 0000000..359aeef --- /dev/null +++ b/layouts/partials/post/date.html @@ -0,0 +1 @@ + diff --git a/layouts/partials/post/sharing.html b/layouts/partials/post/sharing.html new file mode 100644 index 0000000..34e6a60 --- /dev/null +++ b/layouts/partials/post/sharing.html @@ -0,0 +1,15 @@ +
+
+ {{ if .theme.facebook_like }} + + {{ end }} + {{ if .theme.twitter_tweet_button }} + + {{ end }} + {{ if .theme.google_plus_one }} + + {{ end }} + +
+ +
diff --git a/layouts/partials/post/tags.html b/layouts/partials/post/tags.html new file mode 100644 index 0000000..970d7c3 --- /dev/null +++ b/layouts/partials/post/tags.html @@ -0,0 +1,5 @@ +{{ if .Params.tags }} +{{ range .Params.tags }} +{{ . }} +{{ end }} +{{ end }} diff --git a/layouts/partials/social.html b/layouts/partials/social.html new file mode 100644 index 0000000..b4c9407 --- /dev/null +++ b/layouts/partials/social.html @@ -0,0 +1,50 @@ + diff --git a/layouts/partials/tags.html b/layouts/partials/tags.html new file mode 100644 index 0000000..f1924b8 --- /dev/null +++ b/layouts/partials/tags.html @@ -0,0 +1,25 @@ +{{ $.Scratch.Add "last" 0 }} +{{ range .Data.Pages }} + {{ $year := .Date.Format "2006" | int }} + {{ $post_date := .Date.Format "01-02" }} + {{ $last := $.Scratch.Get "last" }} + {{ if ne $last $year }} + {{ if ne $last 0 }} + + {{ end }} + {{ $.Scratch.Set "last" $year }} +

{{ $year }}

+ {{ end }} + +
+

{{ .Title }}

+
+ {{ $post_date }} + {{ partial "post/tags.html" . }} + {{ if $.Site.Params.theme.disqus_shortname }} + Comments + {{ end }} +
+
+{{ end }} +
diff --git a/static/css/custom.css b/static/css/custom.css new file mode 100644 index 0000000..96fa0a0 --- /dev/null +++ b/static/css/custom.css @@ -0,0 +1,98 @@ +.subtitle { + float: right; + font-family: 'Slackey',cursive; + font-size: 1.5em; + margin-right: 100px; +} + +/* for code */ +article code, article pre { + background: oldlace; + border: 1px solid oldlace; + font-family: "Hermit", Monaco, "Andale Mono", "lucida console", "Courier New", monospace; } +article code { + font-size: 0.9em; + padding: 1px 3px; + margin: 0 3px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + -ms-border-radius: 5px; + -o-border-radius: 5px; + border-radius: 5px; } +article pre { + font-size: 1 / 0.9em; + line-height: 1.5; + margin-top: 10px; + padding: 5px 15px; + overflow-x: auto; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + -ms-border-radius: 5px; + -o-border-radius: 5px; + border-radius: 5px; } + article pre code { + background: none; + border: none; + padding: 0; + margin: 0; + word-wrap: break-word; + word-break: normal; + -webkit-border-radius: 0; + -moz-border-radius: 0; + -ms-border-radius: 0; + -o-border-radius: 0; + border-radius: 0; } + +figure.highlight { + background: #dddddd; + border: 1px solid #cccccc; + margin-top: 10px; + padding: 5px 15px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + -ms-border-radius: 5px; + -o-border-radius: 5px; + border-radius: 5px; } + figure.highlight figcaption { + font-size: 0.9em; + position: relative; } + figure.highlight figcaption span { + margin: -5px -15px 0; + padding: 5px 15px; + display: block; } + figure.highlight figcaption span:empty { + display: none; } + figure.highlight figcaption a { + position: absolute; + top: 5px; + right: 0; } + figure.highlight code, figure.highlight pre { + font-size: 0.9em; + background: none; + border: none; + padding: 0; + margin: 0; + -webkit-border-radius: 0; + -moz-border-radius: 0; + -ms-border-radius: 0; + -o-border-radius: 0; + border-radius: 0; } + figure.highlight { + overflow-x: auto; } + figure.highlight .gutter { + border-right: 1px solid #cccccc; + font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; + padding-right: 15px; + text-align: right; } + figure.highlight table { + border: none; + text-align: left; + margin-top: 0; } + figure.highlight table td { + text-align: left; } + figure.highlight td.highlight { + width: 100%; + padding-left: 15px; + overflow-x: auto; } + figure.highlight .line { + height: 18px;} diff --git a/static/css/github.css b/static/css/github.css new file mode 100644 index 0000000..a8f730d --- /dev/null +++ b/static/css/github.css @@ -0,0 +1,125 @@ +/* + +github.com style (c) Vasily Polovnyov + +*/ + +.hljs { + display: block; padding: 0.5em; + color: #333; + background: #f8f8f8 +} + +.code .comment, +.code .template_comment, +.diff .code .header, +.code .javadoc { + color: #998; + font-style: italic +} + +.code .keyword, +.css .rule .code .keyword, +.code .winutils, +.javascript .code .title, +.nginx .code .title, +.code .subst, +.code .request, +.code .status { + color: #333; + font-weight: bold +} + +.code .number, +.code .hexcolor, +.ruby .code .constant { + color: #099; +} + +.code .string, +.code .tag .code .value, +.code .phpdoc, +.tex .code .formula { + color: #d14 +} + +.code .title, +.code .id, +.coffeescript .code .params, +.scss .code .preprocessor { + color: #900; + font-weight: bold +} + +.javascript .code .title, +.lisp .code .title, +.clojure .code .title, +.code .subst { + font-weight: normal +} + +.code .class .code .title, +.haskell .code .type, +.vhdl .code .literal, +.tex .code .command { + color: #458; + font-weight: bold +} + +.code .tag, +.code .tag .code .title, +.code .rules .code .property, +.django .code .tag .code .keyword { + color: #000080; + font-weight: normal +} + +.code .attribute, +.code .variable, +.lisp .code .body { + color: #008080 +} + +.code .regexp { + color: #009926 +} + +.code .symbol, +.ruby .code .symbol .code .string, +.lisp .code .keyword, +.tex .code .special, +.code .prompt { + color: #990073 +} + +.code .built_in, +.lisp .code .title, +.clojure .code .built_in { + color: #0086b3 +} + +.code .preprocessor, +.code .pragma, +.code .pi, +.code .doctype, +.code .shebang, +.code .cdata { + color: #999; + font-weight: bold +} + +.code .deletion { + background: #fdd +} + +.code .addition { + background: #dfd +} + +.diff .code .change { + background: #0086b3 +} + +.code .chunk { + color: #aaa +} diff --git a/static/css/hljs.css b/static/css/hljs.css new file mode 100644 index 0000000..a8f730d --- /dev/null +++ b/static/css/hljs.css @@ -0,0 +1,125 @@ +/* + +github.com style (c) Vasily Polovnyov + +*/ + +.hljs { + display: block; padding: 0.5em; + color: #333; + background: #f8f8f8 +} + +.code .comment, +.code .template_comment, +.diff .code .header, +.code .javadoc { + color: #998; + font-style: italic +} + +.code .keyword, +.css .rule .code .keyword, +.code .winutils, +.javascript .code .title, +.nginx .code .title, +.code .subst, +.code .request, +.code .status { + color: #333; + font-weight: bold +} + +.code .number, +.code .hexcolor, +.ruby .code .constant { + color: #099; +} + +.code .string, +.code .tag .code .value, +.code .phpdoc, +.tex .code .formula { + color: #d14 +} + +.code .title, +.code .id, +.coffeescript .code .params, +.scss .code .preprocessor { + color: #900; + font-weight: bold +} + +.javascript .code .title, +.lisp .code .title, +.clojure .code .title, +.code .subst { + font-weight: normal +} + +.code .class .code .title, +.haskell .code .type, +.vhdl .code .literal, +.tex .code .command { + color: #458; + font-weight: bold +} + +.code .tag, +.code .tag .code .title, +.code .rules .code .property, +.django .code .tag .code .keyword { + color: #000080; + font-weight: normal +} + +.code .attribute, +.code .variable, +.lisp .code .body { + color: #008080 +} + +.code .regexp { + color: #009926 +} + +.code .symbol, +.ruby .code .symbol .code .string, +.lisp .code .keyword, +.tex .code .special, +.code .prompt { + color: #990073 +} + +.code .built_in, +.lisp .code .title, +.clojure .code .built_in { + color: #0086b3 +} + +.code .preprocessor, +.code .pragma, +.code .pi, +.code .doctype, +.code .shebang, +.code .cdata { + color: #999; + font-weight: bold +} + +.code .deletion { + background: #fdd +} + +.code .addition { + background: #dfd +} + +.diff .code .change { + background: #0086b3 +} + +.code .chunk { + color: #aaa +} diff --git a/static/css/screen.css b/static/css/screen.css new file mode 100644 index 0000000..03d1686 --- /dev/null +++ b/static/css/screen.css @@ -0,0 +1,4103 @@ +@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; } diff --git a/static/font/fontawesome-webfont.eot b/static/font/fontawesome-webfont.eot new file mode 100644 index 0000000..3f669a7 Binary files /dev/null and b/static/font/fontawesome-webfont.eot differ diff --git a/static/font/fontawesome-webfont.svg b/static/font/fontawesome-webfont.svg new file mode 100644 index 0000000..73c0ad9 --- /dev/null +++ b/static/font/fontawesome-webfont.svg @@ -0,0 +1,175 @@ + + + + +This is a custom SVG webfont generated by Font Squirrel. +Designer : Dave Gandy +Foundry : Fort Awesome + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/static/font/fontawesome-webfont.svgz b/static/font/fontawesome-webfont.svgz new file mode 100644 index 0000000..2a73cd7 Binary files /dev/null and b/static/font/fontawesome-webfont.svgz differ diff --git a/static/font/fontawesome-webfont.ttf b/static/font/fontawesome-webfont.ttf new file mode 100644 index 0000000..4972eb4 Binary files /dev/null and b/static/font/fontawesome-webfont.ttf differ diff --git a/static/font/fontawesome-webfont.woff b/static/font/fontawesome-webfont.woff new file mode 100644 index 0000000..6e4cb41 Binary files /dev/null and b/static/font/fontawesome-webfont.woff differ diff --git a/static/images/active.png b/static/images/active.png new file mode 100644 index 0000000..e9b34b2 Binary files /dev/null and b/static/images/active.png differ diff --git a/static/images/bg-gradient.png b/static/images/bg-gradient.png new file mode 100644 index 0000000..de54997 Binary files /dev/null and b/static/images/bg-gradient.png differ diff --git a/static/images/hover.png b/static/images/hover.png new file mode 100644 index 0000000..e624593 Binary files /dev/null and b/static/images/hover.png differ diff --git a/static/images/html5css3.png b/static/images/html5css3.png new file mode 100644 index 0000000..eb7a76e Binary files /dev/null and b/static/images/html5css3.png differ diff --git a/static/images/loading.gif b/static/images/loading.gif new file mode 100644 index 0000000..d771224 Binary files /dev/null and b/static/images/loading.gif differ diff --git a/static/images/loading_pacman.gif b/static/images/loading_pacman.gif new file mode 100644 index 0000000..8f61add Binary files /dev/null and b/static/images/loading_pacman.gif differ diff --git a/static/images/retina_dust.png b/static/images/retina_dust.png new file mode 100644 index 0000000..c9278ee Binary files /dev/null and b/static/images/retina_dust.png differ diff --git a/static/images/search-dark.png b/static/images/search-dark.png new file mode 100644 index 0000000..490f8b8 Binary files /dev/null and b/static/images/search-dark.png differ diff --git a/static/images/search-white.png b/static/images/search-white.png new file mode 100644 index 0000000..90b54de Binary files /dev/null and b/static/images/search-white.png differ diff --git a/static/images/social/Facebook.png b/static/images/social/Facebook.png new file mode 100644 index 0000000..ddf68e9 Binary files /dev/null and b/static/images/social/Facebook.png differ diff --git a/static/images/social/FacebookH.png b/static/images/social/FacebookH.png new file mode 100644 index 0000000..19f9af4 Binary files /dev/null and b/static/images/social/FacebookH.png differ diff --git a/static/images/social/Github.png b/static/images/social/Github.png new file mode 100644 index 0000000..05e132f Binary files /dev/null and b/static/images/social/Github.png differ diff --git a/static/images/social/GithubH.png b/static/images/social/GithubH.png new file mode 100644 index 0000000..b1b4d66 Binary files /dev/null and b/static/images/social/GithubH.png differ diff --git a/static/images/social/LastFM.png b/static/images/social/LastFM.png new file mode 100644 index 0000000..88b1f31 Binary files /dev/null and b/static/images/social/LastFM.png differ diff --git a/static/images/social/LastFMH.png b/static/images/social/LastFMH.png new file mode 100644 index 0000000..fdf8b31 Binary files /dev/null and b/static/images/social/LastFMH.png differ diff --git a/static/images/social/LinkedIn.png b/static/images/social/LinkedIn.png new file mode 100644 index 0000000..7f374f1 Binary files /dev/null and b/static/images/social/LinkedIn.png differ diff --git a/static/images/social/LinkedInH.png b/static/images/social/LinkedInH.png new file mode 100644 index 0000000..1103a54 Binary files /dev/null and b/static/images/social/LinkedInH.png differ diff --git a/static/images/social/Picasa.png b/static/images/social/Picasa.png new file mode 100644 index 0000000..648251e Binary files /dev/null and b/static/images/social/Picasa.png differ diff --git a/static/images/social/PicasaH.png b/static/images/social/PicasaH.png new file mode 100644 index 0000000..8297f19 Binary files /dev/null and b/static/images/social/PicasaH.png differ diff --git a/static/images/social/Skype.png b/static/images/social/Skype.png new file mode 100644 index 0000000..de730b4 Binary files /dev/null and b/static/images/social/Skype.png differ diff --git a/static/images/social/SkypeH.png b/static/images/social/SkypeH.png new file mode 100644 index 0000000..937ccaf Binary files /dev/null and b/static/images/social/SkypeH.png differ diff --git a/static/images/social/Twitter.png b/static/images/social/Twitter.png new file mode 100644 index 0000000..bdde5d9 Binary files /dev/null and b/static/images/social/Twitter.png differ diff --git a/static/images/social/TwitterH.png b/static/images/social/TwitterH.png new file mode 100644 index 0000000..11fa3c1 Binary files /dev/null and b/static/images/social/TwitterH.png differ diff --git a/static/images/social/Youtube.png b/static/images/social/Youtube.png new file mode 100644 index 0000000..7c1bacb Binary files /dev/null and b/static/images/social/Youtube.png differ diff --git a/static/images/social/YoutubeH.png b/static/images/social/YoutubeH.png new file mode 100644 index 0000000..040823c Binary files /dev/null and b/static/images/social/YoutubeH.png differ diff --git a/static/images/totop.png b/static/images/totop.png new file mode 100644 index 0000000..7a668e0 Binary files /dev/null and b/static/images/totop.png differ diff --git a/static/js/fabric.js b/static/js/fabric.js new file mode 100644 index 0000000..5288572 --- /dev/null +++ b/static/js/fabric.js @@ -0,0 +1,62 @@ +(function($){ + // Open external links in new window + var externalLinks = function(){ + var host = location.host; + + $('body').on('click', 'a', function(e){ + var href = this.href, + link = href.replace(/https?:\/\/([^\/]+)(.*)/, '$1'); + + if (link != '' && link != host && !$(this).hasClass('fancybox')){ + window.open(href); + e.preventDefault(); + } + }); + }; + + // Append caption after pictures + var appendCaption = function(){ + $('.entry-content').each(function(i){ + var _i = i; + $(this).find('img').each(function(){ + var alt = this.alt; + + if (alt != ''){ + $(this).after(''+alt+''); + } + + $(this).wrap(''); + }); + }); + }; + + externalLinks(); // Delete or comment this line to disable opening external links in new window + appendCaption(); // Delete or comment this line to disable caption + + var mobilenav = $('#mobile-nav'); + + $('html').click(function(){ + mobilenav.find('.on').each(function(){ + $(this).removeClass('on').next().hide(); + }); + }); + + mobilenav.on('click', '.menu .button', function(){ + if (!$(this).hasClass('on')){ + var width = $(this).width() + 42; + $(this).addClass('on').next().show().css({width: width}); + } else { + $(this).removeClass('on').next().hide(); + } + }).on('click', '.search .button', function(){ + if (!$(this).hasClass('on')){ + var width = mobilenav.width() - 51; + mobilenav.children('.menu').children().eq(0).removeClass('on').next().hide(); + $(this).addClass('on').next().show().css({width: width}).children().children().eq(0).focus(); + } else { + $(this).removeClass('on').next().hide().children().children().eq(0).val(''); + } + }).click(function(e){ + e.stopPropagation(); + }); +})(jQuery); \ No newline at end of file diff --git a/static/js/jquery-tapir.js b/static/js/jquery-tapir.js new file mode 100644 index 0000000..4ccbefe --- /dev/null +++ b/static/js/jquery-tapir.js @@ -0,0 +1,60 @@ +(function($){ + var el; + var settings = {}; + + var methods = { + init: function(options) { + el = this; + + settings = { + token: false, + query_param: 'query' + }; + + if (options) { + $.extend(settings, options); + } + + if (!settings.token || settings.query_param == '') { + return this; + } + + $.getJSON( + 'http://tapirgo.com/api/1/search.json?token=' + settings.token + '&query=' + paramValue(settings.query_param) + '&callback=?', function(data){ + if(settings['complete']) { settings.complete() } + $.each(data, function(key, val) { + document.getElementById('search_results').style.display="block"; + document.getElementById('search_results').style.height="100%"; + document.getElementById('search_results').style.overflow="hidden"; + var str1 = val.content; + var str2 = str1.substr(1, 250); + str2 = str2.substr(0, Math.min(str2.length, str2.lastIndexOf(" "))); + el.append('
'); + if(key >= (data.length-1)){ + el.append('

Result ends



'); + } + }); + } + ); + + return this; + } + }; + + // Extract the param value from the URL. + function paramValue(query_param) { + var results = new RegExp('[\\?&]' + query_param + '=([^&#]*)').exec(window.location.href); + return results ? results[1] : false; + } + + $.fn.tapir = function(method) { + if (methods[method]) { + return methods[ method ].apply(this, Array.prototype.slice.call(arguments, 1)); + } else if (typeof method === 'object' || ! method) { + return methods.init.apply(this, arguments); + } else { + $.error('Method ' + method + ' does not exist on jQuery.tapir'); + } + }; + +})( jQuery ); diff --git a/static/js/jquery.ui.totop.js b/static/js/jquery.ui.totop.js new file mode 100644 index 0000000..9ecb3c9 --- /dev/null +++ b/static/js/jquery.ui.totop.js @@ -0,0 +1,200 @@ +/* + * jQuery EasIng v1.1.2 - http://gsgd.co.uk/sandbox/jquery.easIng.php + * + * Uses the built In easIng capabilities added In jQuery 1.1 + * to offer multiple easIng options + * + * Copyright (c) 2007 George Smith + * Licensed under the MIT License: + * http://www.opensource.org/licenses/mit-license.php + */ + +// t: current time, b: begInnIng value, c: change In value, d: duration + +jQuery.extend( jQuery.easing, +{ + easeInQuad: function (x, t, b, c, d) { + return c*(t/=d)*t + b; + }, + easeOutQuad: function (x, t, b, c, d) { + return -c *(t/=d)*(t-2) + b; + }, + easeInOutQuad: function (x, t, b, c, d) { + if ((t/=d/2) < 1) return c/2*t*t + b; + return -c/2 * ((--t)*(t-2) - 1) + b; + }, + easeInCubic: function (x, t, b, c, d) { + return c*(t/=d)*t*t + b; + }, + easeOutCubic: function (x, t, b, c, d) { + return c*((t=t/d-1)*t*t + 1) + b; + }, + easeInOutCubic: function (x, t, b, c, d) { + if ((t/=d/2) < 1) return c/2*t*t*t + b; + return c/2*((t-=2)*t*t + 2) + b; + }, + easeInQuart: function (x, t, b, c, d) { + return c*(t/=d)*t*t*t + b; + }, + easeOutQuart: function (x, t, b, c, d) { + return -c * ((t=t/d-1)*t*t*t - 1) + b; + }, + easeInOutQuart: function (x, t, b, c, d) { + if ((t/=d/2) < 1) return c/2*t*t*t*t + b; + return -c/2 * ((t-=2)*t*t*t - 2) + b; + }, + easeInQuint: function (x, t, b, c, d) { + return c*(t/=d)*t*t*t*t + b; + }, + easeOutQuint: function (x, t, b, c, d) { + return c*((t=t/d-1)*t*t*t*t + 1) + b; + }, + easeInOutQuint: function (x, t, b, c, d) { + if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b; + return c/2*((t-=2)*t*t*t*t + 2) + b; + }, + easeInSine: function (x, t, b, c, d) { + return -c * Math.cos(t/d * (Math.PI/2)) + c + b; + }, + easeOutSine: function (x, t, b, c, d) { + return c * Math.sin(t/d * (Math.PI/2)) + b; + }, + easeInOutSine: function (x, t, b, c, d) { + return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b; + }, + easeInExpo: function (x, t, b, c, d) { + return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; + }, + easeOutExpo: function (x, t, b, c, d) { + return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b; + }, + easeInOutExpo: function (x, t, b, c, d) { + if (t==0) return b; + if (t==d) return b+c; + if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b; + return c/2 * (-Math.pow(2, -10 * --t) + 2) + b; + }, + easeInCirc: function (x, t, b, c, d) { + return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b; + }, + easeOutCirc: function (x, t, b, c, d) { + return c * Math.sqrt(1 - (t=t/d-1)*t) + b; + }, + easeInOutCirc: function (x, t, b, c, d) { + if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b; + return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b; + }, + easeInElastic: function (x, t, b, c, d) { + var s=1.70158;var p=0;var a=c; + if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3; + if (a < Math.abs(c)) { a=c; var s=p/4; } + else var s = p/(2*Math.PI) * Math.asin (c/a); + return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; + }, + easeOutElastic: function (x, t, b, c, d) { + var s=1.70158;var p=0;var a=c; + if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3; + if (a < Math.abs(c)) { a=c; var s=p/4; } + else var s = p/(2*Math.PI) * Math.asin (c/a); + return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b; + }, + easeInOutElastic: function (x, t, b, c, d) { + var s=1.70158;var p=0;var a=c; + if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5); + if (a < Math.abs(c)) { a=c; var s=p/4; } + else var s = p/(2*Math.PI) * Math.asin (c/a); + if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; + return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b; + }, + easeInBack: function (x, t, b, c, d, s) { + if (s == undefined) s = 1.70158; + return c*(t/=d)*t*((s+1)*t - s) + b; + }, + easeOutBack: function (x, t, b, c, d, s) { + if (s == undefined) s = 1.70158; + return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b; + }, + easeInOutBack: function (x, t, b, c, d, s) { + if (s == undefined) s = 1.70158; + if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b; + return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b; + }, + easeInBounce: function (x, t, b, c, d) { + return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b; + }, + easeOutBounce: function (x, t, b, c, d) { + if ((t/=d) < (1/2.75)) { + return c*(7.5625*t*t) + b; + } else if (t < (2/2.75)) { + return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b; + } else if (t < (2.5/2.75)) { + return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b; + } else { + return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b; + } + }, + easeInOutBounce: function (x, t, b, c, d) { + if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b; + return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b; + } +}); + + +/* +|-------------------------------------------------------------------------- +| UItoTop jQuery Plugin 1.1 +| http://www.mattvarone.com/web-design/uitotop-jquery-plugin/ +|-------------------------------------------------------------------------- +*/ + +(function($){ + $.fn.UItoTop = function(options) { + + var defaults = { + text: 'To Top', + min: 200, + inDelay:600, + outDelay:400, + containerID: 'w2btoTop', + containerHoverID: 'w2btoTopHover', + scrollSpeed: 1200, + easingType: 'linear' + }; + + var settings = $.extend(defaults, options); + var containerIDhash = '#' + settings.containerID; + var containerHoverIDHash = '#'+settings.containerHoverID; + + $('body').append(''+settings.text+''); + $(containerIDhash).hide().click(function(){ + $('html, body').animate({scrollTop:0}, settings.scrollSpeed, settings.easingType); + $('#'+settings.containerHoverID, this).stop().animate({'opacity': 0 }, settings.inDelay, settings.easingType); + return false; + }) + .prepend('') + .hover(function() { + $(containerHoverIDHash, this).stop().animate({ + 'opacity': 1 + }, 600, 'linear'); + }, function() { + $(containerHoverIDHash, this).stop().animate({ + 'opacity': 0 + }, 700, 'linear'); + }); + + $(window).scroll(function() { + var sd = $(window).scrollTop(); + if(typeof document.body.style.maxHeight === "undefined") { + $(containerIDhash).css({ + 'position': 'absolute', + 'top': $(window).scrollTop() + $(window).height() - 50 + }); + } + if ( sd > settings.min ) + $(containerIDhash).fadeIn(settings.inDelay); + else + $(containerIDhash).fadeOut(settings.Outdelay); + }); + +}; +})(jQuery); \ No newline at end of file diff --git a/theme.toml b/theme.toml new file mode 100644 index 0000000..1769d8b --- /dev/null +++ b/theme.toml @@ -0,0 +1,21 @@ +# theme.toml template for a Hugo theme +# See https://github.com/spf13/hugoThemes#themetoml for an example + +name = "Hugo Fabric" +license = "MIT" +licenselink = "https://github.com/wd/hugo-fabric/blob/master/LICENSE" +description = "A theme for hugo, forked from hexo-fabric" +homepage = "https://github.com/wd/hugo-fabric" +tags = ["blog", "archives", "tags"] +features = ["blog"] +min_version = 0.19 + +[author] + name = "wd" + homepage = "https://wdicc.com" + +# If porting an existing theme +[original] + name = "Hexo Fabric" + homepage = "https://github.com/wd/hexo-fabric" + repo = "https://github.com/wd/hexo-fabric" -- cgit v1.2.3