commit b202ee2eb90a8f0efd6bfc0794a7f6300d840b93 Author: igna Date: Tue Aug 31 11:30:22 2021 -0400 mega hiper update cool diff --git a/assets/bg.png b/assets/bg.png new file mode 100644 index 0000000..23bf643 Binary files /dev/null and b/assets/bg.png differ diff --git a/assets/discord.webp b/assets/discord.webp new file mode 100644 index 0000000..f2cee72 Binary files /dev/null and b/assets/discord.webp differ diff --git a/assets/js/.editorconfig b/assets/js/.editorconfig new file mode 100644 index 0000000..c642349 --- /dev/null +++ b/assets/js/.editorconfig @@ -0,0 +1,14 @@ +# editorconfig.org + +root = true + +[*] +charset = utf-8 +end_of_line = lf +indent_size = 2 +indent_style = tab +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +trim_trailing_whitespace = false diff --git a/assets/js/.gitignore b/assets/js/.gitignore new file mode 100644 index 0000000..0a49eab --- /dev/null +++ b/assets/js/.gitignore @@ -0,0 +1,19 @@ +lib-cov +*.seed +*.log +*.csv +*.dat +*.out +*.pid +*.gz + +pids +logs +results + +npm-debug.log +node_modules + +.sass-cache + +.DS_Store \ No newline at end of file diff --git a/assets/js/CONTRIBUTING.md b/assets/js/CONTRIBUTING.md new file mode 100644 index 0000000..8af075b --- /dev/null +++ b/assets/js/CONTRIBUTING.md @@ -0,0 +1,23 @@ +# Contributing to Hover.css + +Thanks for considering to contribute to Hover.css. To improve your chances of having your hard work merged into Hover.css, here's a quick guide. + +## Guidelines for Effects + +1. Effects should work with only one HTML element. This way, developers only need add a class to their element for your fancy effect to work on their page. CSS pseudo-elements are perfectly acceptable as they don't require additional changes to HTML. + +2. Aim to provide subtle effects that enhance user experience. + +3. Hover.css is available in Sass, LESS, and CSS formats. If you can, please submit your effects in as many of these formats as possible. Don't worry if you're unfamiliar with any though, we'll convert them for you. + +4. Try not to use transitions and animations together on the same effect, [we've found this is buggy in Webkit/Blink browsers](https://github.com/IanLunn/Hover/issues/24). + +5. Consider submitting an effect that is paired with an opposite, for example: `Bounce In`/`Bounce Out`, `Float`/`Sink`, `Icon Back`/`Icon Forward`. + +## Browser Testing Effects + +The Hover.css project attempts to deliver effects that work in the latest versions of modern browsers (Firefox, Chrome, Safari, Opera, Internet Explorer 10+), as well as providing simple CSS fixes for older browsers where possible (a fallback color when `rgba()` is used for example). + +Fallbacks for older browsers are the responsibility of the developer adding Hover.css to their page, as described in the README's [Browser Support section](https://github.com/IanLunn/Hover#browser-support). + +Please be certain any effects you submit at least work in the latest versions of modern browsers, and advise us accordingly if that is not the case. diff --git a/assets/js/Gruntfile.js b/assets/js/Gruntfile.js new file mode 100644 index 0000000..6e7dec8 --- /dev/null +++ b/assets/js/Gruntfile.js @@ -0,0 +1,104 @@ +module.exports = function(grunt) { + + grunt.initConfig({ + pkg: grunt.file.readJSON('package.json'), + + version: { + json: { + src: ['package.json'] + }, + + css: { + options: { + prefix: 'Version[:=]\\s*' + }, + src: ['css/hover.css', 'scss/hover.scss', 'less/hover.less'] + } + + }, + + sass: { + dist: { + options: { + style: 'expanded' + }, + files: { + 'css/hover.css': 'scss/hover.scss' + } + } + }, + + less: { + dist: { + options: { + style: 'expanded' + }, + files: { + 'css/hover.css': 'less/hover.less' + } + } + }, + + cssmin: { + combine: { + files: { + 'css/hover-min.css': ['css/hover.css'] + } + } + }, + + + watch: { + options: { + livereload: true, + }, + + reload: { + files: ['*.html', 'css/*.css'], + options: { + spawn: false + } + }, + + scss: { + files: ['scss/**/*.scss'], + tasks: ['sass', 'cssmin'], + options: { + spawn: false + } + }, + + less: { + files: ['less/**/*.less'], + tasks: ['less', 'cssmin'], + options: { + spawn: false + } + }, + + version: { + files: ['package.json'], + tasks: ['version'], + options: { + spawn: false + } + } + }, + + connect: { + server: { + options: { + livereload: true, + hostname: '0.0.0.0', + port: 8000, + base: './' + } + } + }, + + }); + + require('load-grunt-tasks')(grunt); + + grunt.registerTask('default', ['connect', 'watch']); +}; diff --git a/assets/js/HISTORY.md b/assets/js/HISTORY.md new file mode 100644 index 0000000..091dc54 --- /dev/null +++ b/assets/js/HISTORY.md @@ -0,0 +1,24 @@ +## 2.0.2 - Jan 27, 2015 + +- Added `back-pulse` effect + +## 2.0.1 - Jan 26, 2015 + +- Added `includeClasses` option to Sass/LESS so you can now generate CSS with or without Hover.css default class names +- Added `!default` flags to Sass variables in `_options.scss` + +## 2.0.0 - Jan 7, 2015 + +- Added lots of new effects +- Added LESS support +- Prefixed all effect names with `hvr-` (can be changed in `scss/_options.scss`) +- Updated some effects for better performance and/or browser support +- Moved default button styles out of library +- Moved all effects into sub folders with the name of the category they belong to +- Renamed `hover` and `hover shadow` effects to `bob` and `bob shadow` +- Removed `hover shadow` effect due to browser inconsistencies courtesy of [this Webkit/Blink bug](https://github.com/IanLunn/Hover/issues/24) which can't be worked around +- Updated `bob` (formerly `hover`) and `hang` effects to work around [this WebKit/Blink bug](https://github.com/IanLunn/Hover/issues/24) +- Change default `animation-timing-function` and `transition-timing-function` values for various effects +- Changed all instances of 'colour' to 'color' +- Added small amount of JS to demo page to prevent `` elements from navigating (not required for hover.css to work) +- Added "What's Included?" section to README.md diff --git a/assets/js/README.md b/assets/js/README.md new file mode 100644 index 0000000..16bc2d8 --- /dev/null +++ b/assets/js/README.md @@ -0,0 +1,319 @@ +# Hover.css + +[![Join the chat at https://gitter.im/IanLunn/Hover](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/IanLunn/Hover?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) + +A collection of CSS3 powered hover effects to be applied to links, buttons, logos, SVG, featured images and so on. Easily apply to your own elements, modify or just use for inspiration. Available in CSS, Sass, and LESS. + +[Demo](http://ianlunn.github.io/Hover) | +[Tutorial](http://ianlunn.co.uk/articles/hover-css-tutorial-introduction/) + +## Contents +- [Download/Install](#downloadinstall) +- [How To Use](#how-to-use) + - [A. Copy and Paste an Effect](#a-copy-and-paste-an-effect) + - [B. Reference Hover.css](#b-reference-hovercss) + - [A Note on the display property](#a-note-on-the-display-property) + - [Using Icon Effects](#using-icon-effects) +- [What's Included?](#whats-included) + - [css](#css) + - [scss/less](#scssless) + - [Other](#other) +- [Browser Support](#browser-support) +- [Using Grunt for Development](#using-grunt-for-development) +- [Using Sass/LESS for Development](#using-sassless-for-development) + - [_hacks](#\_hacks) + - [_mixins](#\_mixins) + - [_options](#\_options) +- [Contribute to Hover.css](#contribute-to-hovercss) +- [Licenses](#licenses) + - [Commercial License](#commercial-license) + - [Open-Source License](#open-source-license) +- [Hire Ian Lunn](#hire-ian-lunn) + +## Download/Install + +- NPM: `npm install hover.css --save` +- Bower: `bower install hover --save` +- [Download Zip](https://github.com/IanLunn/Hover/archive/master.zip) + +## How To Use +Hover.css can be used in a number of ways; either copy and paste the effect you'd like to use in your own stylesheet or reference the stylesheet. Then just add the class name of the effect to the element you'd like it applied to. + +### A. Copy and Paste an Effect +If you plan on only using one or several effects, it's better practice to copy and paste an effect into your own stylesheet, so a user doesn't have to download `css/hover.css` in its entirety. + +Assuming you want to use the Grow effect: + +1. Download Hover.css +2. In `css/hover.css`, find the Grow CSS (each effect is named using a comment above it): + + ```css + /* Grow */ + .hvr-grow { + display: inline-block; + vertical-align: middle; + transform: translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + backface-visibility: hidden; + -moz-osx-font-smoothing: grayscale; + transition-duration: 0.3s; + transition-property: transform; + } + + .hvr-grow:hover, + .hvr-grow:focus, + .hvr-grow:active { + transform: scale(1.1); + } + ``` +3. Copy this effect and then paste it into your own stylesheet. +4. In the HTML file which you'd like the effect to appear, add the class of `.hvr-grow` to your chosen element. + +Example element before applying Hover.css effect: + +```html +Add to Basket +``` + +Example element after applying Hover.css effect: + +```html +Add to Basket +``` + +**Note**: As of `2.0.0` all Hover.css class names are prefixed with `hvr-` to prevent conflicts with other libraries/stylesheets. If using Sass/LESS, this can easily be changed using the `$nameSpace`/`@nameSpace` variable in `scss/_options.scss` or `less/_options.less`. + +### B. Reference Hover.css + +If you plan on using many Hover.css effects, you may like to reference the entire Hover.css stylesheet. + +1. Download `hover-min.css` +2. Add `hover-min.css` to your websites files, in a directory named `css` for example +3. Reference `hover-min.css` in `` of the HTML page you'd like to add Hover.css effects to: +```html + + + +``` +Alternatively you can add a reference into an existing stylesheet like so (this may be useful to WordPress users who are unable to edit HTML): +```css +@import url("hover-min.css"); +``` +4. Assuming you want to use the Grow effect, in the HTML file you'd like to use this effect, add the class of `.hvr-grow` to your chosen element. + +Example element before applying Hover.css effect: + +```html +Add to Basket +``` + +Example element after applying Hover.css effect: + +```html +Add to Basket +``` + +### A Note on the `display` Property + +To make an element "transformable", Hover.css gives the following to all elements it is applied to: + +```css +display: inline-block; +vertical-align: middle; +``` + +Should you wish to override this behavior, either remove the above CSS from Hover.css or change the `display` property for the element. Be sure to declare the override after the Hover.css declarations so the CSS cascade will take effect. Alternatively, if you are using the Sass/LESS version of Hover.css, you can remove/comment out the `forceBlockLevel()` mixin found in `scss/_hacks.scss` or `less/_hacks.less`. + +For more information about Transformable elements, see the [CSS Transforms Module](http://www.w3.org/TR/css3-transforms/#transformable-element). + +### Using Icon Effects + +To add a Hover.css icon, place the icon HTML inside the element that a Hover.css effect is applied to. For example: + +``` + + Icon Forward + + +``` + +In the above code, we have given a link element a class of `hvr-icon-forward` which will make an icon move forward when the link is hovered over. The icon itself is given a class of `hvr-icon` to let Hover.css know that this is the icon we want to animate. In this example, our icon is from FontAwesome, which we've loaded into the `` of our web page as per FontAwesome's instructions, like so: + +```html + +``` + +Note: As of Hover.css v2.3.0 you can use any method you like for adding icons (previously, only FontAwesome was supported out-of-the-box.) For example, you could use another icon library or instead, use an image like so: + +``` + + Icon Spin + + +``` + +Here, the image will act as the icon because it has the `hvr-icon` class applied to it, and when hovered over, the icon will spin as defined by the `hvr-icon-spin` class on the parent element. + +Position of the icon is entirely in your control. You could place it before the text, like so: + +``` + + + Icon Spin + +``` + +Or use custom CSS to position the icon as you see fit. + +## What's Included? + +The project consists of the following folders and files: + +### css + +- **demo-page.css** - Contains styles to demonstrate Hover. Not required in your projects +- **hover-min.css** - The minified/production version of Hover.css +- **hover.css** - The development version of Hover.css + +### scss/less + +- **effects** - Contains each individual effect sorted into categorized folders +- **_hacks.scss/_hacks.less, _mixins.scss/_mixins.less, _options.scss/_options.less** - Sass/LESS Utilities +- **hover.scss/hover.less** - Development version of Hover.css in Sass and LESS flavours + +### Other + +Other files of note include: + +- **index.html** - Demonstrates all Hover.css effects +- **Gruntfile.js** - Used for [development of Hover.css via Grunt](#using-grunt-for-development). + +## Browser Support +Many Hover.css effects rely on CSS3 features such as transitions, animations, transforms and pseudo-elements, for that reason, effects may not fully work in older browsers. + +- [Transitions](http://caniuse.com/#search=transitions) and [Animations](http://caniuse.com/#search=animations) - not supported below Internet Explorer 10 +- [Transforms](http://caniuse.com/#search=transforms) - not supported below Internet Explorer 9 +- [Generated Content (pseudo-elements)](http://caniuse.com/#search=pseudo-elements) - not supported below Internet Explorer 8 + +Aside from the above mentioned browsers, Hover.css is supported across all major browsers. Please see [caniuse.com](http://caniuse.com/) for full support for many web technologies and test your webpages accordingly. It is recommended to apply fallback effects for older browsers, using CSS supported by those browsers or a feature testing library such as [Modernizr](http://modernizr.com/). + +## Using Grunt for Development + +Grunt is non-essential but can speed up development. With [Grunt installed](http://gruntjs.com/getting-started), run `grunt` from the command line to set up a development server accessed at [http://127.0.0.1:8000/](http://127.0.0.1:8000/) or your local IP for network testing. With Grunt running, Sass or LESS will be preprocessed (depending on whether you work out of the `scss` or `less` folder) and CSS files will be minified. + +**Note:** Originally Grunt was set up to autoprefix CSS properties but to make the project as accessible as possible, this is no longer the case. The `prefixed(property, value)` Sass/LESS mixin should be used for browser prefixing instead. See [Using Sass/LESS for Development](#using-sassless-for-development) and [Using LESS for Development]. + +## Using Sass/LESS for Development + +Sass/LESS are non-essential but can speed up development. Preprocess Sass/LESS with your favourite software or the environment provided via [Grunt](#using-grunt-for-development). + +Sass/LESS is used in the Hover.css project to separate various CSS into specific files. Each effect is within its own file in the `effects` directory. Hover.css also uses the following `.scss` and `.less` files: + +### _hacks +Contains hacks (undesirable but usually necessary lines of code) applied to certain effects. [Hacks explained here](https://github.com/IanLunn/Hover/wiki/Hacks-Explained). + +### _mixins +Contains `prefixed` and `keyframes` mixins that apply the necessary prefixes you specify in `_options.scss` / `_options.less` to properties and keyframes. + +Properties can be prefixed like so: + +- Sass: +```css +@include prefixed(transition-duration, .3s); +``` +- LESS: +```css +.prefixed(transition-duration, .3s); +``` + +The `prefixed` mixin is passed the property you want to prefix, followed by its value. + +Keyframes can be prefixed like so: + +- Sass: +```css +@include keyframes(my-animation) { + to { + color: red; + } +} +``` +The `keyframes` mixin is passed the keyframe name, followed by the content using the @content directive. + + +- LESS: +```css +.keyframes(my-animation, { + to { + color: red; + } +}); +``` +The `keyframes` mixin is passed the keyframe name, followed by the content, both as arguments. + + +### _options +Contains default options, various effect options and the browser prefixes you'd like to use with the `prefixed` mixin. By default, only the `-webkit-` prefix is set to `true` (due to most browsers not requiring prefixes now). + +As of `2.0.0`, `_options` also includes a `$nameSpace` / `@nameSpace` option which allows you to change the name all classes are prefixed with. The default namespace is `hvr`. + +The `$includeClasses` / `@includeClasses` option by default is set to `true` and will generate all Hover.css effects under their own class names, `hvr-grow` for example. Should you wish to add the properties that make up Hover.css effects to your own class names, set this option to `false`. + +## Contribute to Hover.css + +If you'd like to contribute your own effects, please see the [Contributing Guide](https://github.com/IanLunn/Hover/blob/master/CONTRIBUTING.md). + +## Licenses + +Hover.css is made available under a free personal/open source or paid commercial licenses depending on your requirements. To compare licenses please visit the [Ian Lunn Design Limited Store](https://ianlunn.co.uk/store/licenses/) and [purchase a commercial license here](https://ianlunn.co.uk/store/hover-css/). + +### Personal/Open Source + +For personal/open source use, Hover.css is made available under a [MIT license](https://opensource.org/licenses/MIT) + +- Use in unlimited personal applications +- Your application can't be sold +- Your modifications remain open-source +- Free updates + +[Read full license](https://ianlunn.co.uk/store/licenses/personal/) + +### Commercial + +For commercial use, Hover.css is made available under Commercial, Extended Commercial, and OEM Commercial licenses. + +#### Commercial License + +- Use in 1 application +- Sell your application once only (e.g. a website sold to a client) +- Your code is kept proprietary, to yourself +- Free updates to the major version + +[Purchase](https://ianlunn.co.uk/store/hover-css/?attribute_pa_licenses=commercial) | [Read full license](https://ianlunn.co.uk/store/licenses/commercial/) + +#### Extended Commercial License + +- Use in unlimited applications +- Sell your applications an unlimited number of times (e.g. a website template sold on a theme store)* +- Your code is kept proprietary, to yourself +- Free updates to the major version + +*With the exception of applications that allow end users to produce separate applications. See the OEM Commercial License. + +[Purchase](https://ianlunn.co.uk/store/hover-css/?attribute_pa_licenses=extended-commercial) | [Read full license](https://ianlunn.co.uk/store/licenses/extended-commercial/) + +#### OEM Commercial License + +Should your application enable end users to produce separate applications that incorporate Ian Lunn Design Limited's software, for example, a development toolkit, library, or application builder, you must obtain an OEM Commercial License. Please [contact us](https://ianlunn.co.uk/contact/) for more information about the OEM Commercial License. + +### MIT License (Pre v2.2.0 / 24th March 2017) + +Hover.css was previously made available under a MIT License for both commercial and non-commercial use. Anyone that obtained a MIT license for commercial use before v2.2.0 (24th March 2017) may continue to use Hover.css versions prior to v2.2.0 under that same license. + +If you'd like to upgrade to v2.2.0 or above, or would like to simply show your support for Hover.css (we'd much appreciate it!), please purchase an up-to-date commercial license. [Purchase a Commercial License](https://ianlunn.co.uk/store/hover-css/). + +## Hire Ian Lunn + +[Ian Lunn](http://ianlunn.co.uk) is a Freelance Front-end Developer and author of [CSS3 Foundations](http://css3foundations.com/). + +Hire [Ian](http://ianlunn.co.uk) for responsive websites, WordPress websites, JavaScript, animation, and optimization. diff --git a/assets/js/bower.json b/assets/js/bower.json new file mode 100644 index 0000000..56f2676 --- /dev/null +++ b/assets/js/bower.json @@ -0,0 +1,28 @@ +{ + "name": "hover", + "homepage": "http://ianlunn.github.io/Hover", + "authors": [ + "Ian Lunn " + ], + "description": "A collection of CSS3 powered hover effects to be applied to links, buttons, logos, SVG, featured images and so on. Easily apply to your own elements, modify or just use for inspiration. Available in CSS, Sass, and LESS.", + "main": "css/hover.css", + "keywords": [ + "Hover", + "hover", + "hover.css", + "Hover Effects", + "CSS Effects", + "CSS3 Effects", + "CSS Hover Effects", + "CSS3 Hover Effects" + ], + "license": "SEE LICENSE IN LICENSE.txt", + "private": false, + "ignore": [ + "**/.*", + "node_modules", + "bower_components", + "test", + "tests" + ] +} diff --git a/assets/js/css/demo-page.css b/assets/js/css/demo-page.css new file mode 100644 index 0000000..cdfdae5 --- /dev/null +++ b/assets/js/css/demo-page.css @@ -0,0 +1,638 @@ +/* + * Hover.css - Demo Page + * Author: Ian Lunn @IanLunn + * Author URL: http://ianlunn.co.uk/ + * Github: https://github.com/IanLunn/Hover + * Hover.css Copyright Ian Lunn 2017. + */ + +/** + * The following are default styles for the demo page, + * you don't need to include these on your own site. + */ + +@import url(http://fonts.googleapis.com/css?family=Roboto); + +body { + margin: 0; + padding: 40px 0 0 0; + font-family: sans-serif; + color: #333; + line-height: 140%; +} + +hr { + margin-top: 2em; + background-color: #ddd; + border: none; + height: 1px; +} + + +nav ul { + margin: 0; + padding: 0; + text-align: center; + font-size: .875em; + font-weight: 700; +} +nav li { + list-style: none; + display: block; + margin-left: 1em; + margin-right: 1em; +} +@media only screen and (min-width: 768px) { + nav li { + display: inline-block; + } +} + +.sep { + color: #ddd; + margin: 0 4px; +} + +#carbonads { + --width: 180px; + --font-size: 14px; +} + +#carbonads { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif; + display: block; + overflow: hidden; + margin: 0 auto; + margin-bottom: 20px; + max-width: var(--width); + border-radius: 4px; + text-align: center; + box-shadow: 0 0 0 1px hsla(0, 0%, 0%, .1); + background-color: hsl(0, 0%, 98%); + font-size: var(--font-size); + line-height: 1.5; +} + +#carbonads a { + color: inherit; + text-decoration: none; +} + +#carbonads a:hover { + color: inherit; +} + +#carbonads span { + position: relative; + display: block; + overflow: hidden; +} + +.carbon-img { + display: block; + margin-bottom: 8px; + max-width: var(--width); + line-height: 1; +} + +.carbon-img img { + display: block; + margin: 0 auto; + max-width: var(--width) !important; + width: var(--width); + height: auto; +} + +.carbon-text { + display: block; + padding: 0 1em 8px; +} + +.carbon-poweredby { + display: block; + padding: 10px var(--font-size); + background: repeating-linear-gradient(-45deg, transparent, transparent 5px, hsla(0, 0%, 0%, .025) 5px, hsla(0, 0%, 0%, .025) 10px) hsla(203, 11%, 95%, .4); + text-transform: uppercase; + letter-spacing: .5px; + font-weight: 600; + font-size: 9px; + line-height: 0; +} + +@media only screen and (min-width: 320px) and (max-width: 759px) { + #carbonads { + float: none; + margin: 0 auto; + max-width: 330px; + } + #carbonads span { + position: relative; + } + #carbonads > span { + max-width: none; + } + .carbon-img { + float: left; + margin: 0; + } + + .carbon-img img { + max-width: 130px !important; + } + .carbon-text { + float: left; + margin-bottom: 0; + padding: 8px 20px; + text-align: left; + max-width: calc(100% - 130px - 3em); + } + .carbon-poweredby { + left: 130px; + bottom: 0; + display: block; + width: 100%; + } +} + +.main { + max-width: 800px; + margin: 0 auto; + padding: 0 20px; +} + +.browsehappy { + position: absolute; + top: 0; + right: 0; + left: 0; + padding: 1em; + background: black; + color: white; + text-align: center; +} + +img { + border: none; +} + +small { + display: block; +} + +p, +[class^="hvr-"] { + font-family: 'Roboto', sans-serif; +} + +[class^="hvr-"] { + margin: .4em; + padding: 1em; + cursor: pointer; + background: #e1e1e1; + text-decoration: none; + color: #666; + /* Prevent highlight colour when element is tapped */ + -webkit-tap-highlight-color: rgba(0,0,0,0); + + /* Smooth fonts */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.aligncenter { + text-align: center; +} + +.sup { + vertical-align: super; + margin-left: -1em; + padding: .21875em; + line-height: 100%; + font-size: .21875em; + border: #eee solid 1px; + border-radius: 4px; + color: inherit; +} + +.sup:hover { + background: #eee; +} + +a { + color: #2098D1; + text-decoration: none; +} + +.footer a:hover, +.nav:hover { + color: #207AD1; +} + +.nav { + display: inline-block; + font-size: .8em; +} + +.nav.hvr-icon-down, +.nav.hvr-icon-forward { + padding-right: 1.2em; +} + +.nav.hvr-icon-down::before, +.nav.hvr-icon-forward::before { + right: 0; +} + +.nav:hover, +.nav:focus, +.nav:active { + text-decoration: none; +} + +.intro { + max-width: 680px; + margin: 20px auto 0 auto; +} + +.button.cta { + display: inline-block; + position: relative; + margin: 1.2em 0 1em 0; + padding: 1em; + background: #2098D1; + border: none; + text-decoration: none; + font-weight: 700; + color: white; +} + +.effects { + margin-top: 6em; +} + +h1 { + text-align: center; + font-size: 3em; +} + +h2 { + margin-top: 2em; +} + +h3 { + margin: 0; +} + +.about { + border-top: #333 solid 2px; + border-bottom: #333 solid 2px; +} + +.footer { + overflow: hidden; + width: auto; + margin-top: 6em; + font-size: .9em; +} + +.footer a { + text-decoration: none; +} + +.credit { + font-size: .8em; + font-weight: normal; +} + +.licenses { + margin-top: 40px; + margin-bottom: 60px; +} + +.licenses:after { + display: block; + content: ''; + clear: both; +} + +.license { + display: block !important; + margin-bottom: 20px; + text-align: center; + border: #2098D1 solid 1px; +} + +.license:focus, +.license:hover { + border-color: #207AD1; +} + +.license:focus .button, +.license:hover .button { + background-color: #207AD1; + color: white; +} + +.license__content { + padding: 25px 10px; +} + +.license__title { + margin: 0; + font-size: 28px; + line-height: 1.4; +} + +.license__title div { + font-size: 16px; + font-weight: 400; +} + +.license__desc { + margin-top: 30px; + margin-bottom: 0; + font-size: 22px; + font-weight: 700; +} + +.license__button.cta { + display: block; + margin: 0; + font-size: 22px; +} + +@media only screen and (min-width: 568px) { + .license { + width: 48%; + float: left; + } + + .license:nth-child(2) { + float: right; + } + + .license__content { + padding: 40px 10px; + } +} + +.download { + margin-top: 2.6em; +} + +.social-button { + display: inline-block; + vertical-align: middle; +} + +.twitter-follow-button { + display: block; + margin: 0 auto; +} + +.follow { + margin-bottom: 20px; + line-height: 200%; +} + +.made-by { + display: block; + margin-top: 3em; + padding-top: 3em; + padding-bottom: 1em; + font-family: $fontFeature; + font-size: 1.125em; + text-align: center; + line-height: 1.6; + background: #181818; + color: #777; +} + +.made-by svg { + display: block; +} + +.made-by ul, +.made-by p { + margin: 0; + padding: 0; +} + +.made-by ul { + margin-bottom: .25em; +} + +.made-by li { + display: inline-block; + vertical-align: middle; + line-height: 1; +} + +.made-by p { + margin-top: .4em; + font-size: .875em; +} + +.made-by a { + display: inline-block; + padding: 0 .125em; + color: #B1B1B1; + transition-duration: .2s; + transition-property: color; +} + +.made-by a:focus, +.made-by a:hover { + color: white; +} + +.made-by i { + font-size: 26px; + height: 30px; +} + +.made-by .follow { + margin-top: 2em; +} + +.made-by .follow iframe { + display: block; + margin-left: auto; + margin-right: auto; + margin-bottom: .5em; +} + +.made-by small { + display: block; + margin-top: 3em; + font-size: .625em; +} + +@-webkit-keyframes circle { + 50% { + -webkit-transform: scale(1.26923077); + transform: scale(1.26923077); + } +} + +@keyframes circle { + 50% { + transform: scale(1.26923077); + } +} + +@-webkit-keyframes initials { + 50% { + -webkit-transform: translateY(-8px) translateZ(0); + transform: translateY(-8px) translateZ(0); + } +} + +@keyframes initials { + 50% { + transform: translateY(-8px) translateZ(0); + } +} + +.ild-ident { + display: block; +} + +.ild-ident svg { + display: block; + overflow: visible; + transform: scale(1) translateZ(0); +} + +.ild-ident .circle-holder { + transform: translate(-7px, -7px); +} + +.ild-ident .circle { + transform: translate(7px, 7px); +} + +.ild-ident .active .i { + animation: initials .4s ease-in-out; +} + +.ild-ident .active .l { + animation: initials .4s .2s ease-in-out; +} + +.ild-ident .active .circle { + animation: circle .5s .1s ease-in-out; +} + +#forkongithub { + display: none; +} + +#forkongithub a { + background: #000; + color: #fff; + text-decoration: none; + font-family: arial, sans-serif; + text-align: center; + font-weight: bold; + padding: 5px 40px; + font-size: 1rem; + line-height: 2rem; + position: relative; + -webkit-transition: 0.5s; + transition: 0.5s; +} + +#forkongithub a:hover, +#forkongithub a:focus, +#forkongithub a:active { + background: #2098D1; + color: #fff; +} + +#forkongithub a::before, +#forkongithub a::after { + content: ""; + width: 100%; + display: block; + position: absolute; + top: 1px; + left: 0; + height: 1px; + background: #fff; +} + +#forkongithub a::after { + bottom: 1px; + top: auto; +} + +.ad { + margin-top: 3.5em; + padding: 3em 1.5em; + background: #f8f8f8; + text-align: center; +} + +.ad h2 { + margin: 0; + margin-bottom: 2em; + line-height: 1.4; + font-size: 1.2em; +} + +.ad a { + display: inline-block; + margin: 0 auto 2em auto; +} + +.ad__preview { + font-size: 0; +} + +.ad__preview a { + display: block; + width: 75%; +} + +.ad__preview img { + width: 100%; +} + +@media only screen and (min-width: 360px) { + h1 { + font-size: 4em; + } +} + +@media screen and (min-width: 640px) { + #forkongithub { + position: absolute; + display: block; + top: 0; + right: 0; + width: 200px; + overflow: hidden; + height: 200px; + } + + #forkongithub a { + width: 200px; + position: absolute; + top: 60px; + right: -60px; + -webkit-transform: rotate(45deg); + -ms-transform: rotate(45deg); + transform: rotate(45deg); + box-shadow: 4px 4px 10px rgba(0,0,0,0.8); + } + + .ad__preview a { + display: inline-block; + width: 32%; + } + + .ad__preview .second { + margin: 0 2%; + } +} diff --git a/assets/js/css/hover-min.css b/assets/js/css/hover-min.css new file mode 100644 index 0000000..9080816 --- /dev/null +++ b/assets/js/css/hover-min.css @@ -0,0 +1,9 @@ +/*! + * Hover.css (http://ianlunn.github.io/Hover/) + * Version: 2.3.2 + * Author: Ian Lunn @IanLunn + * Author URL: http://ianlunn.co.uk/ + * Github: https://github.com/IanLunn/Hover + + * Hover.css Copyright Ian Lunn 2017. Generated with Sass. + */.hvr-grow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-grow:active,.hvr-grow:focus,.hvr-grow:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.hvr-shrink{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-shrink:active,.hvr-shrink:focus,.hvr-shrink:hover{-webkit-transform:scale(0.9);transform:scale(0.9)}@-webkit-keyframes hvr-pulse{25%{-webkit-transform:scale(1.1);transform:scale(1.1)}75%{-webkit-transform:scale(0.9);transform:scale(0.9)}}@keyframes hvr-pulse{25%{-webkit-transform:scale(1.1);transform:scale(1.1)}75%{-webkit-transform:scale(0.9);transform:scale(0.9)}}.hvr-pulse{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-pulse:active,.hvr-pulse:focus,.hvr-pulse:hover{-webkit-animation-name:hvr-pulse;animation-name:hvr-pulse;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}@-webkit-keyframes hvr-pulse-grow{to{-webkit-transform:scale(1.1);transform:scale(1.1)}}@keyframes hvr-pulse-grow{to{-webkit-transform:scale(1.1);transform:scale(1.1)}}.hvr-pulse-grow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-pulse-grow:active,.hvr-pulse-grow:focus,.hvr-pulse-grow:hover{-webkit-animation-name:hvr-pulse-grow;animation-name:hvr-pulse-grow;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}@-webkit-keyframes hvr-pulse-shrink{to{-webkit-transform:scale(0.9);transform:scale(0.9)}}@keyframes hvr-pulse-shrink{to{-webkit-transform:scale(0.9);transform:scale(0.9)}}.hvr-pulse-shrink{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-pulse-shrink:active,.hvr-pulse-shrink:focus,.hvr-pulse-shrink:hover{-webkit-animation-name:hvr-pulse-shrink;animation-name:hvr-pulse-shrink;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}@-webkit-keyframes hvr-push{50%{-webkit-transform:scale(0.8);transform:scale(0.8)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes hvr-push{50%{-webkit-transform:scale(0.8);transform:scale(0.8)}100%{-webkit-transform:scale(1);transform:scale(1)}}.hvr-push{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-push:active,.hvr-push:focus,.hvr-push:hover{-webkit-animation-name:hvr-push;animation-name:hvr-push;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-pop{50%{-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes hvr-pop{50%{-webkit-transform:scale(1.2);transform:scale(1.2)}}.hvr-pop{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-pop:active,.hvr-pop:focus,.hvr-pop:hover{-webkit-animation-name:hvr-pop;animation-name:hvr-pop;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:1;animation-iteration-count:1}.hvr-bounce-in{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.5s;transition-duration:.5s}.hvr-bounce-in:active,.hvr-bounce-in:focus,.hvr-bounce-in:hover{-webkit-transform:scale(1.2);transform:scale(1.2);-webkit-transition-timing-function:cubic-bezier(0.47,2.02,.31,-.36);transition-timing-function:cubic-bezier(0.47,2.02,.31,-.36)}.hvr-bounce-out{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.5s;transition-duration:.5s}.hvr-bounce-out:active,.hvr-bounce-out:focus,.hvr-bounce-out:hover{-webkit-transform:scale(0.8);transform:scale(0.8);-webkit-transition-timing-function:cubic-bezier(0.47,2.02,.31,-.36);transition-timing-function:cubic-bezier(0.47,2.02,.31,-.36)}.hvr-rotate{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-rotate:active,.hvr-rotate:focus,.hvr-rotate:hover{-webkit-transform:rotate(4deg);transform:rotate(4deg)}.hvr-grow-rotate{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-grow-rotate:active,.hvr-grow-rotate:focus,.hvr-grow-rotate:hover{-webkit-transform:scale(1.1) rotate(4deg);transform:scale(1.1) rotate(4deg)}.hvr-float{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-float:active,.hvr-float:focus,.hvr-float:hover{-webkit-transform:translateY(-8px);transform:translateY(-8px)}.hvr-sink{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-sink:active,.hvr-sink:focus,.hvr-sink:hover{-webkit-transform:translateY(8px);transform:translateY(8px)}@-webkit-keyframes hvr-bob{0%{-webkit-transform:translateY(-8px);transform:translateY(-8px)}50%{-webkit-transform:translateY(-4px);transform:translateY(-4px)}100%{-webkit-transform:translateY(-8px);transform:translateY(-8px)}}@keyframes hvr-bob{0%{-webkit-transform:translateY(-8px);transform:translateY(-8px)}50%{-webkit-transform:translateY(-4px);transform:translateY(-4px)}100%{-webkit-transform:translateY(-8px);transform:translateY(-8px)}}@-webkit-keyframes hvr-bob-float{100%{-webkit-transform:translateY(-8px);transform:translateY(-8px)}}@keyframes hvr-bob-float{100%{-webkit-transform:translateY(-8px);transform:translateY(-8px)}}.hvr-bob{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-bob:active,.hvr-bob:focus,.hvr-bob:hover{-webkit-animation-name:hvr-bob-float,hvr-bob;animation-name:hvr-bob-float,hvr-bob;-webkit-animation-duration:.3s,1.5s;animation-duration:.3s,1.5s;-webkit-animation-delay:0s,.3s;animation-delay:0s,.3s;-webkit-animation-timing-function:ease-out,ease-in-out;animation-timing-function:ease-out,ease-in-out;-webkit-animation-iteration-count:1,infinite;animation-iteration-count:1,infinite;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-direction:normal,alternate;animation-direction:normal,alternate}@-webkit-keyframes hvr-hang{0%{-webkit-transform:translateY(8px);transform:translateY(8px)}50%{-webkit-transform:translateY(4px);transform:translateY(4px)}100%{-webkit-transform:translateY(8px);transform:translateY(8px)}}@keyframes hvr-hang{0%{-webkit-transform:translateY(8px);transform:translateY(8px)}50%{-webkit-transform:translateY(4px);transform:translateY(4px)}100%{-webkit-transform:translateY(8px);transform:translateY(8px)}}@-webkit-keyframes hvr-hang-sink{100%{-webkit-transform:translateY(8px);transform:translateY(8px)}}@keyframes hvr-hang-sink{100%{-webkit-transform:translateY(8px);transform:translateY(8px)}}.hvr-hang{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-hang:active,.hvr-hang:focus,.hvr-hang:hover{-webkit-animation-name:hvr-hang-sink,hvr-hang;animation-name:hvr-hang-sink,hvr-hang;-webkit-animation-duration:.3s,1.5s;animation-duration:.3s,1.5s;-webkit-animation-delay:0s,.3s;animation-delay:0s,.3s;-webkit-animation-timing-function:ease-out,ease-in-out;animation-timing-function:ease-out,ease-in-out;-webkit-animation-iteration-count:1,infinite;animation-iteration-count:1,infinite;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-direction:normal,alternate;animation-direction:normal,alternate}.hvr-skew{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-skew:active,.hvr-skew:focus,.hvr-skew:hover{-webkit-transform:skew(-10deg);transform:skew(-10deg)}.hvr-skew-forward{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transform-origin:0 100%;transform-origin:0 100%}.hvr-skew-forward:active,.hvr-skew-forward:focus,.hvr-skew-forward:hover{-webkit-transform:skew(-10deg);transform:skew(-10deg)}.hvr-skew-backward{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transform-origin:0 100%;transform-origin:0 100%}.hvr-skew-backward:active,.hvr-skew-backward:focus,.hvr-skew-backward:hover{-webkit-transform:skew(10deg);transform:skew(10deg)}@-webkit-keyframes hvr-wobble-vertical{16.65%{-webkit-transform:translateY(8px);transform:translateY(8px)}33.3%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}49.95%{-webkit-transform:translateY(4px);transform:translateY(4px)}66.6%{-webkit-transform:translateY(-2px);transform:translateY(-2px)}83.25%{-webkit-transform:translateY(1px);transform:translateY(1px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes hvr-wobble-vertical{16.65%{-webkit-transform:translateY(8px);transform:translateY(8px)}33.3%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}49.95%{-webkit-transform:translateY(4px);transform:translateY(4px)}66.6%{-webkit-transform:translateY(-2px);transform:translateY(-2px)}83.25%{-webkit-transform:translateY(1px);transform:translateY(1px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}.hvr-wobble-vertical{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-wobble-vertical:active,.hvr-wobble-vertical:focus,.hvr-wobble-vertical:hover{-webkit-animation-name:hvr-wobble-vertical;animation-name:hvr-wobble-vertical;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-wobble-horizontal{16.65%{-webkit-transform:translateX(8px);transform:translateX(8px)}33.3%{-webkit-transform:translateX(-6px);transform:translateX(-6px)}49.95%{-webkit-transform:translateX(4px);transform:translateX(4px)}66.6%{-webkit-transform:translateX(-2px);transform:translateX(-2px)}83.25%{-webkit-transform:translateX(1px);transform:translateX(1px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes hvr-wobble-horizontal{16.65%{-webkit-transform:translateX(8px);transform:translateX(8px)}33.3%{-webkit-transform:translateX(-6px);transform:translateX(-6px)}49.95%{-webkit-transform:translateX(4px);transform:translateX(4px)}66.6%{-webkit-transform:translateX(-2px);transform:translateX(-2px)}83.25%{-webkit-transform:translateX(1px);transform:translateX(1px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}.hvr-wobble-horizontal{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-wobble-horizontal:active,.hvr-wobble-horizontal:focus,.hvr-wobble-horizontal:hover{-webkit-animation-name:hvr-wobble-horizontal;animation-name:hvr-wobble-horizontal;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-wobble-to-bottom-right{16.65%{-webkit-transform:translate(8px,8px);transform:translate(8px,8px)}33.3%{-webkit-transform:translate(-6px,-6px);transform:translate(-6px,-6px)}49.95%{-webkit-transform:translate(4px,4px);transform:translate(4px,4px)}66.6%{-webkit-transform:translate(-2px,-2px);transform:translate(-2px,-2px)}83.25%{-webkit-transform:translate(1px,1px);transform:translate(1px,1px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes hvr-wobble-to-bottom-right{16.65%{-webkit-transform:translate(8px,8px);transform:translate(8px,8px)}33.3%{-webkit-transform:translate(-6px,-6px);transform:translate(-6px,-6px)}49.95%{-webkit-transform:translate(4px,4px);transform:translate(4px,4px)}66.6%{-webkit-transform:translate(-2px,-2px);transform:translate(-2px,-2px)}83.25%{-webkit-transform:translate(1px,1px);transform:translate(1px,1px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}.hvr-wobble-to-bottom-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-wobble-to-bottom-right:active,.hvr-wobble-to-bottom-right:focus,.hvr-wobble-to-bottom-right:hover{-webkit-animation-name:hvr-wobble-to-bottom-right;animation-name:hvr-wobble-to-bottom-right;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-wobble-to-top-right{16.65%{-webkit-transform:translate(8px,-8px);transform:translate(8px,-8px)}33.3%{-webkit-transform:translate(-6px,6px);transform:translate(-6px,6px)}49.95%{-webkit-transform:translate(4px,-4px);transform:translate(4px,-4px)}66.6%{-webkit-transform:translate(-2px,2px);transform:translate(-2px,2px)}83.25%{-webkit-transform:translate(1px,-1px);transform:translate(1px,-1px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes hvr-wobble-to-top-right{16.65%{-webkit-transform:translate(8px,-8px);transform:translate(8px,-8px)}33.3%{-webkit-transform:translate(-6px,6px);transform:translate(-6px,6px)}49.95%{-webkit-transform:translate(4px,-4px);transform:translate(4px,-4px)}66.6%{-webkit-transform:translate(-2px,2px);transform:translate(-2px,2px)}83.25%{-webkit-transform:translate(1px,-1px);transform:translate(1px,-1px)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}.hvr-wobble-to-top-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-wobble-to-top-right:active,.hvr-wobble-to-top-right:focus,.hvr-wobble-to-top-right:hover{-webkit-animation-name:hvr-wobble-to-top-right;animation-name:hvr-wobble-to-top-right;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-wobble-top{16.65%{-webkit-transform:skew(-12deg);transform:skew(-12deg)}33.3%{-webkit-transform:skew(10deg);transform:skew(10deg)}49.95%{-webkit-transform:skew(-6deg);transform:skew(-6deg)}66.6%{-webkit-transform:skew(4deg);transform:skew(4deg)}83.25%{-webkit-transform:skew(-2deg);transform:skew(-2deg)}100%{-webkit-transform:skew(0);transform:skew(0)}}@keyframes hvr-wobble-top{16.65%{-webkit-transform:skew(-12deg);transform:skew(-12deg)}33.3%{-webkit-transform:skew(10deg);transform:skew(10deg)}49.95%{-webkit-transform:skew(-6deg);transform:skew(-6deg)}66.6%{-webkit-transform:skew(4deg);transform:skew(4deg)}83.25%{-webkit-transform:skew(-2deg);transform:skew(-2deg)}100%{-webkit-transform:skew(0);transform:skew(0)}}.hvr-wobble-top{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transform-origin:0 100%;transform-origin:0 100%}.hvr-wobble-top:active,.hvr-wobble-top:focus,.hvr-wobble-top:hover{-webkit-animation-name:hvr-wobble-top;animation-name:hvr-wobble-top;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-wobble-bottom{16.65%{-webkit-transform:skew(-12deg);transform:skew(-12deg)}33.3%{-webkit-transform:skew(10deg);transform:skew(10deg)}49.95%{-webkit-transform:skew(-6deg);transform:skew(-6deg)}66.6%{-webkit-transform:skew(4deg);transform:skew(4deg)}83.25%{-webkit-transform:skew(-2deg);transform:skew(-2deg)}100%{-webkit-transform:skew(0);transform:skew(0)}}@keyframes hvr-wobble-bottom{16.65%{-webkit-transform:skew(-12deg);transform:skew(-12deg)}33.3%{-webkit-transform:skew(10deg);transform:skew(10deg)}49.95%{-webkit-transform:skew(-6deg);transform:skew(-6deg)}66.6%{-webkit-transform:skew(4deg);transform:skew(4deg)}83.25%{-webkit-transform:skew(-2deg);transform:skew(-2deg)}100%{-webkit-transform:skew(0);transform:skew(0)}}.hvr-wobble-bottom{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transform-origin:100% 0;transform-origin:100% 0}.hvr-wobble-bottom:active,.hvr-wobble-bottom:focus,.hvr-wobble-bottom:hover{-webkit-animation-name:hvr-wobble-bottom;animation-name:hvr-wobble-bottom;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-wobble-skew{16.65%{-webkit-transform:skew(-12deg);transform:skew(-12deg)}33.3%{-webkit-transform:skew(10deg);transform:skew(10deg)}49.95%{-webkit-transform:skew(-6deg);transform:skew(-6deg)}66.6%{-webkit-transform:skew(4deg);transform:skew(4deg)}83.25%{-webkit-transform:skew(-2deg);transform:skew(-2deg)}100%{-webkit-transform:skew(0);transform:skew(0)}}@keyframes hvr-wobble-skew{16.65%{-webkit-transform:skew(-12deg);transform:skew(-12deg)}33.3%{-webkit-transform:skew(10deg);transform:skew(10deg)}49.95%{-webkit-transform:skew(-6deg);transform:skew(-6deg)}66.6%{-webkit-transform:skew(4deg);transform:skew(4deg)}83.25%{-webkit-transform:skew(-2deg);transform:skew(-2deg)}100%{-webkit-transform:skew(0);transform:skew(0)}}.hvr-wobble-skew{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-wobble-skew:active,.hvr-wobble-skew:focus,.hvr-wobble-skew:hover{-webkit-animation-name:hvr-wobble-skew;animation-name:hvr-wobble-skew;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-buzz{50%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}100%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}}@keyframes hvr-buzz{50%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}100%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}}.hvr-buzz{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-buzz:active,.hvr-buzz:focus,.hvr-buzz:hover{-webkit-animation-name:hvr-buzz;animation-name:hvr-buzz;-webkit-animation-duration:.15s;animation-duration:.15s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}@-webkit-keyframes hvr-buzz-out{10%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}20%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}30%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}40%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}50%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}60%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}70%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}80%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}90%{-webkit-transform:translateX(1px) rotate(0);transform:translateX(1px) rotate(0)}100%{-webkit-transform:translateX(-1px) rotate(0);transform:translateX(-1px) rotate(0)}}@keyframes hvr-buzz-out{10%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}20%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}30%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}40%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}50%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}60%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}70%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}80%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}90%{-webkit-transform:translateX(1px) rotate(0);transform:translateX(1px) rotate(0)}100%{-webkit-transform:translateX(-1px) rotate(0);transform:translateX(-1px) rotate(0)}}.hvr-buzz-out{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-buzz-out:active,.hvr-buzz-out:focus,.hvr-buzz-out:hover{-webkit-animation-name:hvr-buzz-out;animation-name:hvr-buzz-out;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:1;animation-iteration-count:1}.hvr-forward{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-forward:active,.hvr-forward:focus,.hvr-forward:hover{-webkit-transform:translateX(8px);transform:translateX(8px)}.hvr-backward{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-backward:active,.hvr-backward:focus,.hvr-backward:hover{-webkit-transform:translateX(-8px);transform:translateX(-8px)}.hvr-fade{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);overflow:hidden;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:color,background-color;transition-property:color,background-color}.hvr-fade:active,.hvr-fade:focus,.hvr-fade:hover{background-color:#2098D1;color:#fff}@-webkit-keyframes hvr-back-pulse{50%{background-color:rgba(32,152,209,.75)}}@keyframes hvr-back-pulse{50%{background-color:rgba(32,152,209,.75)}}.hvr-back-pulse{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);overflow:hidden;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:color,background-color;transition-property:color,background-color}.hvr-back-pulse:active,.hvr-back-pulse:focus,.hvr-back-pulse:hover{-webkit-animation-name:hvr-back-pulse;animation-name:hvr-back-pulse;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-delay:.5s;animation-delay:.5s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;background-color:#2098D1;background-color:#2098d1;color:#fff}.hvr-sweep-to-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-sweep-to-right:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:0 50%;transform-origin:0 50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-sweep-to-right:active,.hvr-sweep-to-right:focus,.hvr-sweep-to-right:hover{color:#fff}.hvr-sweep-to-right:active:before,.hvr-sweep-to-right:focus:before,.hvr-sweep-to-right:hover:before{-webkit-transform:scaleX(1);transform:scaleX(1)}.hvr-sweep-to-left{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-sweep-to-left:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:100% 50%;transform-origin:100% 50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-sweep-to-left:active,.hvr-sweep-to-left:focus,.hvr-sweep-to-left:hover{color:#fff}.hvr-sweep-to-left:active:before,.hvr-sweep-to-left:focus:before,.hvr-sweep-to-left:hover:before{-webkit-transform:scaleX(1);transform:scaleX(1)}.hvr-sweep-to-bottom{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-sweep-to-bottom:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-sweep-to-bottom:active,.hvr-sweep-to-bottom:focus,.hvr-sweep-to-bottom:hover{color:#fff}.hvr-sweep-to-bottom:active:before,.hvr-sweep-to-bottom:focus:before,.hvr-sweep-to-bottom:hover:before{-webkit-transform:scaleY(1);transform:scaleY(1)}.hvr-sweep-to-top{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-sweep-to-top:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-sweep-to-top:active,.hvr-sweep-to-top:focus,.hvr-sweep-to-top:hover{color:#fff}.hvr-sweep-to-top:active:before,.hvr-sweep-to-top:focus:before,.hvr-sweep-to-top:hover:before{-webkit-transform:scaleY(1);transform:scaleY(1)}.hvr-bounce-to-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.5s;transition-duration:.5s}.hvr-bounce-to-right:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:0 50%;transform-origin:0 50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-bounce-to-right:active,.hvr-bounce-to-right:focus,.hvr-bounce-to-right:hover{color:#fff}.hvr-bounce-to-right:active:before,.hvr-bounce-to-right:focus:before,.hvr-bounce-to-right:hover:before{-webkit-transform:scaleX(1);transform:scaleX(1);-webkit-transition-timing-function:cubic-bezier(0.52,1.64,.37,.66);transition-timing-function:cubic-bezier(0.52,1.64,.37,.66)}.hvr-bounce-to-left{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.5s;transition-duration:.5s}.hvr-bounce-to-left:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:100% 50%;transform-origin:100% 50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-bounce-to-left:active,.hvr-bounce-to-left:focus,.hvr-bounce-to-left:hover{color:#fff}.hvr-bounce-to-left:active:before,.hvr-bounce-to-left:focus:before,.hvr-bounce-to-left:hover:before{-webkit-transform:scaleX(1);transform:scaleX(1);-webkit-transition-timing-function:cubic-bezier(0.52,1.64,.37,.66);transition-timing-function:cubic-bezier(0.52,1.64,.37,.66)}.hvr-bounce-to-bottom{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.5s;transition-duration:.5s}.hvr-bounce-to-bottom:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-bounce-to-bottom:active,.hvr-bounce-to-bottom:focus,.hvr-bounce-to-bottom:hover{color:#fff}.hvr-bounce-to-bottom:active:before,.hvr-bounce-to-bottom:focus:before,.hvr-bounce-to-bottom:hover:before{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transition-timing-function:cubic-bezier(0.52,1.64,.37,.66);transition-timing-function:cubic-bezier(0.52,1.64,.37,.66)}.hvr-bounce-to-top{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.5s;transition-duration:.5s}.hvr-bounce-to-top:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-bounce-to-top:active,.hvr-bounce-to-top:focus,.hvr-bounce-to-top:hover{color:#fff}.hvr-bounce-to-top:active:before,.hvr-bounce-to-top:focus:before,.hvr-bounce-to-top:hover:before{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transition-timing-function:cubic-bezier(0.52,1.64,.37,.66);transition-timing-function:cubic-bezier(0.52,1.64,.37,.66)}.hvr-radial-out{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden;background:#e1e1e1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-radial-out:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;border-radius:100%;-webkit-transform:scale(0);transform:scale(0);-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-radial-out:active,.hvr-radial-out:focus,.hvr-radial-out:hover{color:#fff}.hvr-radial-out:active:before,.hvr-radial-out:focus:before,.hvr-radial-out:hover:before{-webkit-transform:scale(2);transform:scale(2)}.hvr-radial-in{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden;background:#2098D1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-radial-in:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#e1e1e1;border-radius:100%;-webkit-transform:scale(2);transform:scale(2);-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-radial-in:active,.hvr-radial-in:focus,.hvr-radial-in:hover{color:#fff}.hvr-radial-in:active:before,.hvr-radial-in:focus:before,.hvr-radial-in:hover:before{-webkit-transform:scale(0);transform:scale(0)}.hvr-rectangle-in{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;background:#2098D1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-rectangle-in:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#e1e1e1;-webkit-transform:scale(1);transform:scale(1);-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-rectangle-in:active,.hvr-rectangle-in:focus,.hvr-rectangle-in:hover{color:#fff}.hvr-rectangle-in:active:before,.hvr-rectangle-in:focus:before,.hvr-rectangle-in:hover:before{-webkit-transform:scale(0);transform:scale(0)}.hvr-rectangle-out{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;background:#e1e1e1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-rectangle-out:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#2098D1;-webkit-transform:scale(0);transform:scale(0);-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-rectangle-out:active,.hvr-rectangle-out:focus,.hvr-rectangle-out:hover{color:#fff}.hvr-rectangle-out:active:before,.hvr-rectangle-out:focus:before,.hvr-rectangle-out:hover:before{-webkit-transform:scale(1);transform:scale(1)}.hvr-shutter-in-horizontal{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;background:#2098D1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-shutter-in-horizontal:before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:0;right:0;background:#e1e1e1;-webkit-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:50%;transform-origin:50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-shutter-in-horizontal:active,.hvr-shutter-in-horizontal:focus,.hvr-shutter-in-horizontal:hover{color:#fff}.hvr-shutter-in-horizontal:active:before,.hvr-shutter-in-horizontal:focus:before,.hvr-shutter-in-horizontal:hover:before{-webkit-transform:scaleX(0);transform:scaleX(0)}.hvr-shutter-out-horizontal{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;background:#e1e1e1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-shutter-out-horizontal:before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:0;right:0;background:#2098D1;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:50%;transform-origin:50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-shutter-out-horizontal:active,.hvr-shutter-out-horizontal:focus,.hvr-shutter-out-horizontal:hover{color:#fff}.hvr-shutter-out-horizontal:active:before,.hvr-shutter-out-horizontal:focus:before,.hvr-shutter-out-horizontal:hover:before{-webkit-transform:scaleX(1);transform:scaleX(1)}.hvr-shutter-in-vertical{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;background:#2098D1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-shutter-in-vertical:before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:0;right:0;background:#e1e1e1;-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:50%;transform-origin:50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-shutter-in-vertical:active,.hvr-shutter-in-vertical:focus,.hvr-shutter-in-vertical:hover{color:#fff}.hvr-shutter-in-vertical:active:before,.hvr-shutter-in-vertical:focus:before,.hvr-shutter-in-vertical:hover:before{-webkit-transform:scaleY(0);transform:scaleY(0)}.hvr-shutter-out-vertical{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;background:#e1e1e1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-shutter-out-vertical:before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:0;right:0;background:#2098D1;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:50%;transform-origin:50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-shutter-out-vertical:active,.hvr-shutter-out-vertical:focus,.hvr-shutter-out-vertical:hover{color:#fff}.hvr-shutter-out-vertical:active:before,.hvr-shutter-out-vertical:focus:before,.hvr-shutter-out-vertical:hover:before{-webkit-transform:scaleY(1);transform:scaleY(1)}.hvr-border-fade{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:box-shadow;transition-property:box-shadow;box-shadow:inset 0 0 0 4px #e1e1e1,0 0 1px rgba(0,0,0,0)}.hvr-border-fade:active,.hvr-border-fade:focus,.hvr-border-fade:hover{box-shadow:inset 0 0 0 4px #2098D1,0 0 1px rgba(0,0,0,0)}.hvr-hollow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:background;transition-property:background;box-shadow:inset 0 0 0 4px #e1e1e1,0 0 1px rgba(0,0,0,0)}.hvr-hollow:active,.hvr-hollow:focus,.hvr-hollow:hover{background:0 0}.hvr-trim{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-trim:before{content:'';position:absolute;border:#fff solid 4px;top:4px;left:4px;right:4px;bottom:4px;opacity:0;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:opacity;transition-property:opacity}.hvr-trim:active:before,.hvr-trim:focus:before,.hvr-trim:hover:before{opacity:1}@-webkit-keyframes hvr-ripple-out{100%{top:-12px;right:-12px;bottom:-12px;left:-12px;opacity:0}}@keyframes hvr-ripple-out{100%{top:-12px;right:-12px;bottom:-12px;left:-12px;opacity:0}}.hvr-ripple-out{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-ripple-out:before{content:'';position:absolute;border:#e1e1e1 solid 6px;top:0;right:0;bottom:0;left:0;-webkit-animation-duration:1s;animation-duration:1s}.hvr-ripple-out:active:before,.hvr-ripple-out:focus:before,.hvr-ripple-out:hover:before{-webkit-animation-name:hvr-ripple-out;animation-name:hvr-ripple-out}@-webkit-keyframes hvr-ripple-in{100%{top:0;right:0;bottom:0;left:0;opacity:1}}@keyframes hvr-ripple-in{100%{top:0;right:0;bottom:0;left:0;opacity:1}}.hvr-ripple-in{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-ripple-in:before{content:'';position:absolute;border:#e1e1e1 solid 4px;top:-12px;right:-12px;bottom:-12px;left:-12px;opacity:0;-webkit-animation-duration:1s;animation-duration:1s}.hvr-ripple-in:active:before,.hvr-ripple-in:focus:before,.hvr-ripple-in:hover:before{-webkit-animation-name:hvr-ripple-in;animation-name:hvr-ripple-in}.hvr-outline-out{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-outline-out:before{content:'';position:absolute;border:#e1e1e1 solid 4px;top:0;right:0;bottom:0;left:0;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:top,right,bottom,left;transition-property:top,right,bottom,left}.hvr-outline-out:active:before,.hvr-outline-out:focus:before,.hvr-outline-out:hover:before{top:-8px;right:-8px;bottom:-8px;left:-8px}.hvr-outline-in{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-outline-in:before{pointer-events:none;content:'';position:absolute;border:#e1e1e1 solid 4px;top:-16px;right:-16px;bottom:-16px;left:-16px;opacity:0;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:top,right,bottom,left;transition-property:top,right,bottom,left}.hvr-outline-in:active:before,.hvr-outline-in:focus:before,.hvr-outline-in:hover:before{top:-8px;right:-8px;bottom:-8px;left:-8px;opacity:1}.hvr-round-corners{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:border-radius;transition-property:border-radius}.hvr-round-corners:active,.hvr-round-corners:focus,.hvr-round-corners:hover{border-radius:1em}.hvr-underline-from-left{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-underline-from-left:before{content:"";position:absolute;z-index:-1;left:0;right:100%;bottom:0;background:#2098D1;height:4px;-webkit-transition-property:right;transition-property:right;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-underline-from-left:active:before,.hvr-underline-from-left:focus:before,.hvr-underline-from-left:hover:before{right:0}.hvr-underline-from-center{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-underline-from-center:before{content:"";position:absolute;z-index:-1;left:51%;right:51%;bottom:0;background:#2098D1;height:4px;-webkit-transition-property:left,right;transition-property:left,right;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-underline-from-center:active:before,.hvr-underline-from-center:focus:before,.hvr-underline-from-center:hover:before{left:0;right:0}.hvr-underline-from-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-underline-from-right:before{content:"";position:absolute;z-index:-1;left:100%;right:0;bottom:0;background:#2098D1;height:4px;-webkit-transition-property:left;transition-property:left;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-underline-from-right:active:before,.hvr-underline-from-right:focus:before,.hvr-underline-from-right:hover:before{left:0}.hvr-overline-from-left{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-overline-from-left:before{content:"";position:absolute;z-index:-1;left:0;right:100%;top:0;background:#2098D1;height:4px;-webkit-transition-property:right;transition-property:right;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-overline-from-left:active:before,.hvr-overline-from-left:focus:before,.hvr-overline-from-left:hover:before{right:0}.hvr-overline-from-center{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-overline-from-center:before{content:"";position:absolute;z-index:-1;left:51%;right:51%;top:0;background:#2098D1;height:4px;-webkit-transition-property:left,right;transition-property:left,right;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-overline-from-center:active:before,.hvr-overline-from-center:focus:before,.hvr-overline-from-center:hover:before{left:0;right:0}.hvr-overline-from-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-overline-from-right:before{content:"";position:absolute;z-index:-1;left:100%;right:0;top:0;background:#2098D1;height:4px;-webkit-transition-property:left;transition-property:left;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-overline-from-right:active:before,.hvr-overline-from-right:focus:before,.hvr-overline-from-right:hover:before{left:0}.hvr-reveal{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-reveal:before{content:"";position:absolute;z-index:-1;left:0;right:0;top:0;bottom:0;border-color:#2098D1;border-style:solid;border-width:0;-webkit-transition-property:border-width;transition-property:border-width;-webkit-transition-duration:.1s;transition-duration:.1s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-reveal:active:before,.hvr-reveal:focus:before,.hvr-reveal:hover:before{-webkit-transform:translateY(0);transform:translateY(0);border-width:4px}.hvr-underline-reveal{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-underline-reveal:before{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;background:#2098D1;height:4px;-webkit-transform:translateY(4px);transform:translateY(4px);-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-underline-reveal:active:before,.hvr-underline-reveal:focus:before,.hvr-underline-reveal:hover:before{-webkit-transform:translateY(0);transform:translateY(0)}.hvr-overline-reveal{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;overflow:hidden}.hvr-overline-reveal:before{content:"";position:absolute;z-index:-1;left:0;right:0;top:0;background:#2098D1;height:4px;-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-overline-reveal:active:before,.hvr-overline-reveal:focus:before,.hvr-overline-reveal:hover:before{-webkit-transform:translateY(0);transform:translateY(0)}.hvr-glow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:box-shadow;transition-property:box-shadow}.hvr-glow:active,.hvr-glow:focus,.hvr-glow:hover{box-shadow:0 0 8px rgba(0,0,0,.6)}.hvr-shadow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:box-shadow;transition-property:box-shadow}.hvr-shadow:active,.hvr-shadow:focus,.hvr-shadow:hover{box-shadow:0 10px 10px -10px rgba(0,0,0,.5)}.hvr-grow-shadow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:box-shadow,transform;transition-property:box-shadow,transform}.hvr-grow-shadow:active,.hvr-grow-shadow:focus,.hvr-grow-shadow:hover{box-shadow:0 10px 10px -10px rgba(0,0,0,.5);-webkit-transform:scale(1.1);transform:scale(1.1)}.hvr-box-shadow-outset{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:box-shadow;transition-property:box-shadow}.hvr-box-shadow-outset:active,.hvr-box-shadow-outset:focus,.hvr-box-shadow-outset:hover{box-shadow:2px 2px 2px rgba(0,0,0,.6)}.hvr-box-shadow-inset{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:box-shadow;transition-property:box-shadow;box-shadow:inset 0 0 0 rgba(0,0,0,.6),0 0 1px rgba(0,0,0,0)}.hvr-box-shadow-inset:active,.hvr-box-shadow-inset:focus,.hvr-box-shadow-inset:hover{box-shadow:inset 2px 2px 2px rgba(0,0,0,.6),0 0 1px rgba(0,0,0,0)}.hvr-float-shadow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-float-shadow:before{pointer-events:none;position:absolute;z-index:-1;content:'';top:100%;left:5%;height:10px;width:90%;opacity:0;background:-webkit-radial-gradient(center,ellipse,rgba(0,0,0,.35) 0,rgba(0,0,0,0) 80%);background:radial-gradient(ellipse at center,rgba(0,0,0,.35) 0,rgba(0,0,0,0) 80%);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform,opacity;transition-property:transform,opacity}.hvr-float-shadow:active,.hvr-float-shadow:focus,.hvr-float-shadow:hover{-webkit-transform:translateY(-5px);transform:translateY(-5px)}.hvr-float-shadow:active:before,.hvr-float-shadow:focus:before,.hvr-float-shadow:hover:before{opacity:1;-webkit-transform:translateY(5px);transform:translateY(5px)}.hvr-shadow-radial{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-shadow-radial:after,.hvr-shadow-radial:before{pointer-events:none;position:absolute;content:'';left:0;width:100%;box-sizing:border-box;height:5px;opacity:0;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:opacity;transition-property:opacity}.hvr-shadow-radial:before{bottom:100%;background:-webkit-radial-gradient(50% 150%,ellipse,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 80%);background:radial-gradient(ellipse at 50% 150%,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 80%)}.hvr-shadow-radial:after{top:100%;background:-webkit-radial-gradient(50% -50%,ellipse,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 80%);background:radial-gradient(ellipse at 50% -50%,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 80%)}.hvr-shadow-radial:active:after,.hvr-shadow-radial:active:before,.hvr-shadow-radial:focus:after,.hvr-shadow-radial:focus:before,.hvr-shadow-radial:hover:after,.hvr-shadow-radial:hover:before{opacity:1}.hvr-bubble-top{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-bubble-top:before{pointer-events:none;position:absolute;z-index:-1;content:'';border-style:solid;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;left:calc(50% - 10px);top:0;border-width:0 10px 10px;border-color:transparent transparent #e1e1e1}.hvr-bubble-top:active:before,.hvr-bubble-top:focus:before,.hvr-bubble-top:hover:before{-webkit-transform:translateY(-10px);transform:translateY(-10px)}.hvr-bubble-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-bubble-right:before{pointer-events:none;position:absolute;z-index:-1;content:'';border-style:solid;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;top:calc(50% - 10px);right:0;border-width:10px 0 10px 10px;border-color:transparent transparent transparent #e1e1e1}.hvr-bubble-right:active:before,.hvr-bubble-right:focus:before,.hvr-bubble-right:hover:before{-webkit-transform:translateX(10px);transform:translateX(10px)}.hvr-bubble-bottom{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-bubble-bottom:before{pointer-events:none;position:absolute;z-index:-1;content:'';border-style:solid;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;left:calc(50% - 10px);bottom:0;border-width:10px 10px 0;border-color:#e1e1e1 transparent transparent}.hvr-bubble-bottom:active:before,.hvr-bubble-bottom:focus:before,.hvr-bubble-bottom:hover:before{-webkit-transform:translateY(10px);transform:translateY(10px)}.hvr-bubble-left{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-bubble-left:before{pointer-events:none;position:absolute;z-index:-1;content:'';border-style:solid;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;top:calc(50% - 10px);left:0;border-width:10px 10px 10px 0;border-color:transparent #e1e1e1 transparent transparent}.hvr-bubble-left:active:before,.hvr-bubble-left:focus:before,.hvr-bubble-left:hover:before{-webkit-transform:translateX(-10px);transform:translateX(-10px)}.hvr-bubble-float-top{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-bubble-float-top:before{position:absolute;z-index:-1;content:'';left:calc(50% - 10px);top:0;border-style:solid;border-width:0 10px 10px;border-color:transparent transparent #e1e1e1;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-bubble-float-top:active,.hvr-bubble-float-top:focus,.hvr-bubble-float-top:hover{-webkit-transform:translateY(10px);transform:translateY(10px)}.hvr-bubble-float-top:active:before,.hvr-bubble-float-top:focus:before,.hvr-bubble-float-top:hover:before{-webkit-transform:translateY(-10px);transform:translateY(-10px)}.hvr-bubble-float-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-bubble-float-right:before{position:absolute;z-index:-1;top:calc(50% - 10px);right:0;content:'';border-style:solid;border-width:10px 0 10px 10px;border-color:transparent transparent transparent #e1e1e1;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-bubble-float-right:active,.hvr-bubble-float-right:focus,.hvr-bubble-float-right:hover{-webkit-transform:translateX(-10px);transform:translateX(-10px)}.hvr-bubble-float-right:active:before,.hvr-bubble-float-right:focus:before,.hvr-bubble-float-right:hover:before{-webkit-transform:translateX(10px);transform:translateX(10px)}.hvr-bubble-float-bottom{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-bubble-float-bottom:before{position:absolute;z-index:-1;content:'';left:calc(50% - 10px);bottom:0;border-style:solid;border-width:10px 10px 0;border-color:#e1e1e1 transparent transparent;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-bubble-float-bottom:active,.hvr-bubble-float-bottom:focus,.hvr-bubble-float-bottom:hover{-webkit-transform:translateY(-10px);transform:translateY(-10px)}.hvr-bubble-float-bottom:active:before,.hvr-bubble-float-bottom:focus:before,.hvr-bubble-float-bottom:hover:before{-webkit-transform:translateY(10px);transform:translateY(10px)}.hvr-bubble-float-left{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-bubble-float-left:before{position:absolute;z-index:-1;content:'';top:calc(50% - 10px);left:0;border-style:solid;border-width:10px 10px 10px 0;border-color:transparent #e1e1e1 transparent transparent;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform}.hvr-bubble-float-left:active,.hvr-bubble-float-left:focus,.hvr-bubble-float-left:hover{-webkit-transform:translateX(10px);transform:translateX(10px)}.hvr-bubble-float-left:active:before,.hvr-bubble-float-left:focus:before,.hvr-bubble-float-left:hover:before{-webkit-transform:translateX(-10px);transform:translateX(-10px)}.hvr-icon-back{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.1s;transition-duration:.1s}.hvr-icon-back .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.1s;transition-duration:.1s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-back:active .hvr-icon,.hvr-icon-back:focus .hvr-icon,.hvr-icon-back:hover .hvr-icon{-webkit-transform:translateX(-4px);transform:translateX(-4px)}.hvr-icon-forward{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.1s;transition-duration:.1s}.hvr-icon-forward .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.1s;transition-duration:.1s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-forward:active .hvr-icon,.hvr-icon-forward:focus .hvr-icon,.hvr-icon-forward:hover .hvr-icon{-webkit-transform:translateX(4px);transform:translateX(4px)}@-webkit-keyframes hvr-icon-down{0%,100%,50%{-webkit-transform:translateY(0);transform:translateY(0)}25%,75%{-webkit-transform:translateY(6px);transform:translateY(6px)}}@keyframes hvr-icon-down{0%,100%,50%{-webkit-transform:translateY(0);transform:translateY(0)}25%,75%{-webkit-transform:translateY(6px);transform:translateY(6px)}}.hvr-icon-down{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-down .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-down:active .hvr-icon,.hvr-icon-down:focus .hvr-icon,.hvr-icon-down:hover .hvr-icon{-webkit-animation-name:hvr-icon-down;animation-name:hvr-icon-down;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes hvr-icon-up{0%,100%,50%{-webkit-transform:translateY(0);transform:translateY(0)}25%,75%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}}@keyframes hvr-icon-up{0%,100%,50%{-webkit-transform:translateY(0);transform:translateY(0)}25%,75%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}}.hvr-icon-up{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-up .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-up:active .hvr-icon,.hvr-icon-up:focus .hvr-icon,.hvr-icon-up:hover .hvr-icon{-webkit-animation-name:hvr-icon-up;animation-name:hvr-icon-up;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}.hvr-icon-spin{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-spin .hvr-icon{-webkit-transition-duration:1s;transition-duration:1s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.hvr-icon-spin:active .hvr-icon,.hvr-icon-spin:focus .hvr-icon,.hvr-icon-spin:hover .hvr-icon{-webkit-transform:rotate(360deg);transform:rotate(360deg)}@-webkit-keyframes hvr-icon-drop{0%{opacity:0}50%{opacity:0;-webkit-transform:translateY(-100%);transform:translateY(-100%)}100%,51%{opacity:1}}@keyframes hvr-icon-drop{0%{opacity:0}50%{opacity:0;-webkit-transform:translateY(-100%);transform:translateY(-100%)}100%,51%{opacity:1}}.hvr-icon-drop{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-drop .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-drop:active .hvr-icon,.hvr-icon-drop:focus .hvr-icon,.hvr-icon-drop:hover .hvr-icon{opacity:0;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-animation-name:hvr-icon-drop;animation-name:hvr-icon-drop;-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-delay:.3s;animation-delay:.3s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:cubic-bezier(0.52,1.64,.37,.66);animation-timing-function:cubic-bezier(0.52,1.64,.37,.66)}.hvr-icon-fade{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-fade .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:color;transition-property:color}.hvr-icon-fade:active .hvr-icon,.hvr-icon-fade:focus .hvr-icon,.hvr-icon-fade:hover .hvr-icon{color:#0F9E5E}@-webkit-keyframes hvr-icon-float-away{0%{opacity:1}100%{opacity:0;-webkit-transform:translateY(-1em);transform:translateY(-1em)}}@keyframes hvr-icon-float-away{0%{opacity:1}100%{opacity:0;-webkit-transform:translateY(-1em);transform:translateY(-1em)}}.hvr-icon-float-away{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-float-away .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.hvr-icon-float-away:active .hvr-icon,.hvr-icon-float-away:focus .hvr-icon,.hvr-icon-float-away:hover .hvr-icon{-webkit-animation-name:hvr-icon-float-away;animation-name:hvr-icon-float-away;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes hvr-icon-sink-away{0%{opacity:1}100%{opacity:0;-webkit-transform:translateY(1em);transform:translateY(1em)}}@keyframes hvr-icon-sink-away{0%{opacity:1}100%{opacity:0;-webkit-transform:translateY(1em);transform:translateY(1em)}}.hvr-icon-sink-away{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-sink-away .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.hvr-icon-sink-away:active .hvr-icon,.hvr-icon-sink-away:focus .hvr-icon,.hvr-icon-sink-away:hover .hvr-icon{-webkit-animation-name:hvr-icon-sink-away;animation-name:hvr-icon-sink-away;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}.hvr-icon-grow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-grow .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-grow:active .hvr-icon,.hvr-icon-grow:focus .hvr-icon,.hvr-icon-grow:hover .hvr-icon{-webkit-transform:scale(1.3) translateZ(0);transform:scale(1.3) translateZ(0)}.hvr-icon-shrink{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-shrink .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-shrink:active .hvr-icon,.hvr-icon-shrink:focus .hvr-icon,.hvr-icon-shrink:hover .hvr-icon{-webkit-transform:scale(0.8);transform:scale(0.8)}@-webkit-keyframes hvr-icon-pulse{25%{-webkit-transform:scale(1.3);transform:scale(1.3)}75%{-webkit-transform:scale(0.8);transform:scale(0.8)}}@keyframes hvr-icon-pulse{25%{-webkit-transform:scale(1.3);transform:scale(1.3)}75%{-webkit-transform:scale(0.8);transform:scale(0.8)}}.hvr-icon-pulse{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-pulse .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-pulse:active .hvr-icon,.hvr-icon-pulse:focus .hvr-icon,.hvr-icon-pulse:hover .hvr-icon{-webkit-animation-name:hvr-icon-pulse;animation-name:hvr-icon-pulse;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}@-webkit-keyframes hvr-icon-pulse-grow{to{-webkit-transform:scale(1.3);transform:scale(1.3)}}@keyframes hvr-icon-pulse-grow{to{-webkit-transform:scale(1.3);transform:scale(1.3)}}.hvr-icon-pulse-grow{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-pulse-grow .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-pulse-grow:active .hvr-icon,.hvr-icon-pulse-grow:focus .hvr-icon,.hvr-icon-pulse-grow:hover .hvr-icon{-webkit-animation-name:hvr-icon-pulse-grow;animation-name:hvr-icon-pulse-grow;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}@-webkit-keyframes hvr-icon-pulse-shrink{to{-webkit-transform:scale(0.8);transform:scale(0.8)}}@keyframes hvr-icon-pulse-shrink{to{-webkit-transform:scale(0.8);transform:scale(0.8)}}.hvr-icon-pulse-shrink{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0)}.hvr-icon-pulse-shrink .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-pulse-shrink:active .hvr-icon,.hvr-icon-pulse-shrink:focus .hvr-icon,.hvr-icon-pulse-shrink:hover .hvr-icon{-webkit-animation-name:hvr-icon-pulse-shrink;animation-name:hvr-icon-pulse-shrink;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}@-webkit-keyframes hvr-icon-push{50%{-webkit-transform:scale(0.5);transform:scale(0.5)}}@keyframes hvr-icon-push{50%{-webkit-transform:scale(0.5);transform:scale(0.5)}}.hvr-icon-push{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-push .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-push:active .hvr-icon,.hvr-icon-push:focus .hvr-icon,.hvr-icon-push:hover .hvr-icon{-webkit-animation-name:hvr-icon-push;animation-name:hvr-icon-push;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-icon-pop{50%{-webkit-transform:scale(1.5);transform:scale(1.5)}}@keyframes hvr-icon-pop{50%{-webkit-transform:scale(1.5);transform:scale(1.5)}}.hvr-icon-pop{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-pop .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-pop:active .hvr-icon,.hvr-icon-pop:focus .hvr-icon,.hvr-icon-pop:hover .hvr-icon{-webkit-animation-name:hvr-icon-pop;animation-name:hvr-icon-pop;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:1;animation-iteration-count:1}.hvr-icon-bounce{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-bounce .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-bounce:active .hvr-icon,.hvr-icon-bounce:focus .hvr-icon,.hvr-icon-bounce:hover .hvr-icon{-webkit-transform:scale(1.5);transform:scale(1.5);-webkit-transition-timing-function:cubic-bezier(0.47,2.02,.31,-.36);transition-timing-function:cubic-bezier(0.47,2.02,.31,-.36)}.hvr-icon-rotate{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-rotate .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-rotate:active .hvr-icon,.hvr-icon-rotate:focus .hvr-icon,.hvr-icon-rotate:hover .hvr-icon{-webkit-transform:rotate(20deg);transform:rotate(20deg)}.hvr-icon-grow-rotate{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-grow-rotate .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-grow-rotate:active .hvr-icon,.hvr-icon-grow-rotate:focus .hvr-icon,.hvr-icon-grow-rotate:hover .hvr-icon{-webkit-transform:scale(1.5) rotate(12deg);transform:scale(1.5) rotate(12deg)}.hvr-icon-float{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-float .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-float:active .hvr-icon,.hvr-icon-float:focus .hvr-icon,.hvr-icon-float:hover .hvr-icon{-webkit-transform:translateY(-4px);transform:translateY(-4px)}.hvr-icon-sink{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-sink .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.hvr-icon-sink:active .hvr-icon,.hvr-icon-sink:focus .hvr-icon,.hvr-icon-sink:hover .hvr-icon{-webkit-transform:translateY(4px);transform:translateY(4px)}@-webkit-keyframes hvr-icon-bob{0%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}50%{-webkit-transform:translateY(-2px);transform:translateY(-2px)}100%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}}@keyframes hvr-icon-bob{0%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}50%{-webkit-transform:translateY(-2px);transform:translateY(-2px)}100%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}}@-webkit-keyframes hvr-icon-bob-float{100%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}}@keyframes hvr-icon-bob-float{100%{-webkit-transform:translateY(-6px);transform:translateY(-6px)}}.hvr-icon-bob{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-bob .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-bob:active .hvr-icon,.hvr-icon-bob:focus .hvr-icon,.hvr-icon-bob:hover .hvr-icon{-webkit-animation-name:hvr-icon-bob-float,hvr-icon-bob;animation-name:hvr-icon-bob-float,hvr-icon-bob;-webkit-animation-duration:.3s,1.5s;animation-duration:.3s,1.5s;-webkit-animation-delay:0s,.3s;animation-delay:0s,.3s;-webkit-animation-timing-function:ease-out,ease-in-out;animation-timing-function:ease-out,ease-in-out;-webkit-animation-iteration-count:1,infinite;animation-iteration-count:1,infinite;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-direction:normal,alternate;animation-direction:normal,alternate}@-webkit-keyframes hvr-icon-hang{0%{-webkit-transform:translateY(6px);transform:translateY(6px)}50%{-webkit-transform:translateY(2px);transform:translateY(2px)}100%{-webkit-transform:translateY(6px);transform:translateY(6px)}}@keyframes hvr-icon-hang{0%{-webkit-transform:translateY(6px);transform:translateY(6px)}50%{-webkit-transform:translateY(2px);transform:translateY(2px)}100%{-webkit-transform:translateY(6px);transform:translateY(6px)}}@-webkit-keyframes hvr-icon-hang-sink{100%{-webkit-transform:translateY(6px);transform:translateY(6px)}}@keyframes hvr-icon-hang-sink{100%{-webkit-transform:translateY(6px);transform:translateY(6px)}}.hvr-icon-hang{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-hang .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-hang:active .hvr-icon,.hvr-icon-hang:focus .hvr-icon,.hvr-icon-hang:hover .hvr-icon{-webkit-animation-name:hvr-icon-hang-sink,hvr-icon-hang;animation-name:hvr-icon-hang-sink,hvr-icon-hang;-webkit-animation-duration:.3s,1.5s;animation-duration:.3s,1.5s;-webkit-animation-delay:0s,.3s;animation-delay:0s,.3s;-webkit-animation-timing-function:ease-out,ease-in-out;animation-timing-function:ease-out,ease-in-out;-webkit-animation-iteration-count:1,infinite;animation-iteration-count:1,infinite;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-direction:normal,alternate;animation-direction:normal,alternate}@-webkit-keyframes hvr-icon-wobble-horizontal{16.65%{-webkit-transform:translateX(6px);transform:translateX(6px)}33.3%{-webkit-transform:translateX(-5px);transform:translateX(-5px)}49.95%{-webkit-transform:translateX(4px);transform:translateX(4px)}66.6%{-webkit-transform:translateX(-2px);transform:translateX(-2px)}83.25%{-webkit-transform:translateX(1px);transform:translateX(1px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes hvr-icon-wobble-horizontal{16.65%{-webkit-transform:translateX(6px);transform:translateX(6px)}33.3%{-webkit-transform:translateX(-5px);transform:translateX(-5px)}49.95%{-webkit-transform:translateX(4px);transform:translateX(4px)}66.6%{-webkit-transform:translateX(-2px);transform:translateX(-2px)}83.25%{-webkit-transform:translateX(1px);transform:translateX(1px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}.hvr-icon-wobble-horizontal{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-wobble-horizontal .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-wobble-horizontal:active .hvr-icon,.hvr-icon-wobble-horizontal:focus .hvr-icon,.hvr-icon-wobble-horizontal:hover .hvr-icon{-webkit-animation-name:hvr-icon-wobble-horizontal;animation-name:hvr-icon-wobble-horizontal;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-icon-wobble-vertical{16.65%{-webkit-transform:translateY(6px);transform:translateY(6px)}33.3%{-webkit-transform:translateY(-5px);transform:translateY(-5px)}49.95%{-webkit-transform:translateY(4px);transform:translateY(4px)}66.6%{-webkit-transform:translateY(-2px);transform:translateY(-2px)}83.25%{-webkit-transform:translateY(1px);transform:translateY(1px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes hvr-icon-wobble-vertical{16.65%{-webkit-transform:translateY(6px);transform:translateY(6px)}33.3%{-webkit-transform:translateY(-5px);transform:translateY(-5px)}49.95%{-webkit-transform:translateY(4px);transform:translateY(4px)}66.6%{-webkit-transform:translateY(-2px);transform:translateY(-2px)}83.25%{-webkit-transform:translateY(1px);transform:translateY(1px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}.hvr-icon-wobble-vertical{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-wobble-vertical .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-wobble-vertical:active .hvr-icon,.hvr-icon-wobble-vertical:focus .hvr-icon,.hvr-icon-wobble-vertical:hover .hvr-icon{-webkit-animation-name:hvr-icon-wobble-vertical;animation-name:hvr-icon-wobble-vertical;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;animation-iteration-count:1}@-webkit-keyframes hvr-icon-buzz{50%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}100%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}}@keyframes hvr-icon-buzz{50%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}100%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}}.hvr-icon-buzz{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-buzz .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-buzz:active .hvr-icon,.hvr-icon-buzz:focus .hvr-icon,.hvr-icon-buzz:hover .hvr-icon{-webkit-animation-name:hvr-icon-buzz;animation-name:hvr-icon-buzz;-webkit-animation-duration:.15s;animation-duration:.15s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}@-webkit-keyframes hvr-icon-buzz-out{10%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}20%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}30%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}40%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}50%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}60%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}70%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}80%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}90%{-webkit-transform:translateX(1px) rotate(0);transform:translateX(1px) rotate(0)}100%{-webkit-transform:translateX(-1px) rotate(0);transform:translateX(-1px) rotate(0)}}@keyframes hvr-icon-buzz-out{10%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}20%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}30%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}40%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}50%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}60%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}70%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}80%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}90%{-webkit-transform:translateX(1px) rotate(0);transform:translateX(1px) rotate(0)}100%{-webkit-transform:translateX(-1px) rotate(0);transform:translateX(-1px) rotate(0)}}.hvr-icon-buzz-out{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);-webkit-transition-duration:.3s;transition-duration:.3s}.hvr-icon-buzz-out .hvr-icon{-webkit-transform:translateZ(0);transform:translateZ(0)}.hvr-icon-buzz-out:active .hvr-icon,.hvr-icon-buzz-out:focus .hvr-icon,.hvr-icon-buzz-out:hover .hvr-icon{-webkit-animation-name:hvr-icon-buzz-out;animation-name:hvr-icon-buzz-out;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:1;animation-iteration-count:1}.hvr-curl-top-left{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-curl-top-left:before{pointer-events:none;position:absolute;content:'';height:0;width:0;top:0;left:0;background:#fff;background:linear-gradient(135deg,#fff 45%,#aaa 50%,#ccc 56%,#fff 80%);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#000000');z-index:1000;box-shadow:1px 1px 1px rgba(0,0,0,.4);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:width,height;transition-property:width,height}.hvr-curl-top-left:active:before,.hvr-curl-top-left:focus:before,.hvr-curl-top-left:hover:before{width:25px;height:25px}.hvr-curl-top-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-curl-top-right:before{pointer-events:none;position:absolute;content:'';height:0;width:0;top:0;right:0;background:#fff;background:linear-gradient(225deg,#fff 45%,#aaa 50%,#ccc 56%,#fff 80%);box-shadow:-1px 1px 1px rgba(0,0,0,.4);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:width,height;transition-property:width,height}.hvr-curl-top-right:active:before,.hvr-curl-top-right:focus:before,.hvr-curl-top-right:hover:before{width:25px;height:25px}.hvr-curl-bottom-right{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-curl-bottom-right:before{pointer-events:none;position:absolute;content:'';height:0;width:0;bottom:0;right:0;background:#fff;background:linear-gradient(315deg,#fff 45%,#aaa 50%,#ccc 56%,#fff 80%);box-shadow:-1px -1px 1px rgba(0,0,0,.4);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:width,height;transition-property:width,height}.hvr-curl-bottom-right:active:before,.hvr-curl-bottom-right:focus:before,.hvr-curl-bottom-right:hover:before{width:25px;height:25px}.hvr-curl-bottom-left{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0,0,0,0);position:relative}.hvr-curl-bottom-left:before{pointer-events:none;position:absolute;content:'';height:0;width:0;bottom:0;left:0;background:#fff;background:linear-gradient(45deg,#fff 45%,#aaa 50%,#ccc 56%,#fff 80%);box-shadow:1px -1px 1px rgba(0,0,0,.4);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:width,height;transition-property:width,height}.hvr-curl-bottom-left:active:before,.hvr-curl-bottom-left:focus:before,.hvr-curl-bottom-left:hover:before{width:25px;height:25px} \ No newline at end of file diff --git a/assets/js/css/hover.css b/assets/js/css/hover.css new file mode 100644 index 0000000..f5fcf87 --- /dev/null +++ b/assets/js/css/hover.css @@ -0,0 +1,4152 @@ +/*! + * Hover.css (http://ianlunn.github.io/Hover/) + * Version: 2.3.2 + * Author: Ian Lunn @IanLunn + * Author URL: http://ianlunn.co.uk/ + * Github: https://github.com/IanLunn/Hover + + * Hover.css Copyright Ian Lunn 2017. Generated with Sass. + */ +/* 2D TRANSITIONS */ +/* Grow */ +.hvr-grow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active { + -webkit-transform: scale(1.1); + transform: scale(1.1); +} + +/* Shrink */ +.hvr-shrink { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-shrink:hover, .hvr-shrink:focus, .hvr-shrink:active { + -webkit-transform: scale(0.9); + transform: scale(0.9); +} + +/* Pulse */ +@-webkit-keyframes hvr-pulse { + 25% { + -webkit-transform: scale(1.1); + transform: scale(1.1); + } + 75% { + -webkit-transform: scale(0.9); + transform: scale(0.9); + } +} +@keyframes hvr-pulse { + 25% { + -webkit-transform: scale(1.1); + transform: scale(1.1); + } + 75% { + -webkit-transform: scale(0.9); + transform: scale(0.9); + } +} +.hvr-pulse { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-pulse:hover, .hvr-pulse:focus, .hvr-pulse:active { + -webkit-animation-name: hvr-pulse; + animation-name: hvr-pulse; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; +} + +/* Pulse Grow */ +@-webkit-keyframes hvr-pulse-grow { + to { + -webkit-transform: scale(1.1); + transform: scale(1.1); + } +} +@keyframes hvr-pulse-grow { + to { + -webkit-transform: scale(1.1); + transform: scale(1.1); + } +} +.hvr-pulse-grow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-pulse-grow:hover, .hvr-pulse-grow:focus, .hvr-pulse-grow:active { + -webkit-animation-name: hvr-pulse-grow; + animation-name: hvr-pulse-grow; + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -webkit-animation-direction: alternate; + animation-direction: alternate; +} + +/* Pulse Shrink */ +@-webkit-keyframes hvr-pulse-shrink { + to { + -webkit-transform: scale(0.9); + transform: scale(0.9); + } +} +@keyframes hvr-pulse-shrink { + to { + -webkit-transform: scale(0.9); + transform: scale(0.9); + } +} +.hvr-pulse-shrink { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-pulse-shrink:hover, .hvr-pulse-shrink:focus, .hvr-pulse-shrink:active { + -webkit-animation-name: hvr-pulse-shrink; + animation-name: hvr-pulse-shrink; + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -webkit-animation-direction: alternate; + animation-direction: alternate; +} + +/* Push */ +@-webkit-keyframes hvr-push { + 50% { + -webkit-transform: scale(0.8); + transform: scale(0.8); + } + 100% { + -webkit-transform: scale(1); + transform: scale(1); + } +} +@keyframes hvr-push { + 50% { + -webkit-transform: scale(0.8); + transform: scale(0.8); + } + 100% { + -webkit-transform: scale(1); + transform: scale(1); + } +} +.hvr-push { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-push:hover, .hvr-push:focus, .hvr-push:active { + -webkit-animation-name: hvr-push; + animation-name: hvr-push; + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Pop */ +@-webkit-keyframes hvr-pop { + 50% { + -webkit-transform: scale(1.2); + transform: scale(1.2); + } +} +@keyframes hvr-pop { + 50% { + -webkit-transform: scale(1.2); + transform: scale(1.2); + } +} +.hvr-pop { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-pop:hover, .hvr-pop:focus, .hvr-pop:active { + -webkit-animation-name: hvr-pop; + animation-name: hvr-pop; + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Bounce In */ +.hvr-bounce-in { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; +} +.hvr-bounce-in:hover, .hvr-bounce-in:focus, .hvr-bounce-in:active { + -webkit-transform: scale(1.2); + transform: scale(1.2); + -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); + transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); +} + +/* Bounce Out */ +.hvr-bounce-out { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; +} +.hvr-bounce-out:hover, .hvr-bounce-out:focus, .hvr-bounce-out:active { + -webkit-transform: scale(0.8); + transform: scale(0.8); + -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); + transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); +} + +/* Rotate */ +.hvr-rotate { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-rotate:hover, .hvr-rotate:focus, .hvr-rotate:active { + -webkit-transform: rotate(4deg); + transform: rotate(4deg); +} + +/* Grow Rotate */ +.hvr-grow-rotate { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-grow-rotate:hover, .hvr-grow-rotate:focus, .hvr-grow-rotate:active { + -webkit-transform: scale(1.1) rotate(4deg); + transform: scale(1.1) rotate(4deg); +} + +/* Float */ +.hvr-float { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-float:hover, .hvr-float:focus, .hvr-float:active { + -webkit-transform: translateY(-8px); + transform: translateY(-8px); +} + +/* Sink */ +.hvr-sink { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-sink:hover, .hvr-sink:focus, .hvr-sink:active { + -webkit-transform: translateY(8px); + transform: translateY(8px); +} + +/* Bob */ +@-webkit-keyframes hvr-bob { + 0% { + -webkit-transform: translateY(-8px); + transform: translateY(-8px); + } + 50% { + -webkit-transform: translateY(-4px); + transform: translateY(-4px); + } + 100% { + -webkit-transform: translateY(-8px); + transform: translateY(-8px); + } +} +@keyframes hvr-bob { + 0% { + -webkit-transform: translateY(-8px); + transform: translateY(-8px); + } + 50% { + -webkit-transform: translateY(-4px); + transform: translateY(-4px); + } + 100% { + -webkit-transform: translateY(-8px); + transform: translateY(-8px); + } +} +@-webkit-keyframes hvr-bob-float { + 100% { + -webkit-transform: translateY(-8px); + transform: translateY(-8px); + } +} +@keyframes hvr-bob-float { + 100% { + -webkit-transform: translateY(-8px); + transform: translateY(-8px); + } +} +.hvr-bob { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-bob:hover, .hvr-bob:focus, .hvr-bob:active { + -webkit-animation-name: hvr-bob-float, hvr-bob; + animation-name: hvr-bob-float, hvr-bob; + -webkit-animation-duration: .3s, 1.5s; + animation-duration: .3s, 1.5s; + -webkit-animation-delay: 0s, .3s; + animation-delay: 0s, .3s; + -webkit-animation-timing-function: ease-out, ease-in-out; + animation-timing-function: ease-out, ease-in-out; + -webkit-animation-iteration-count: 1, infinite; + animation-iteration-count: 1, infinite; + -webkit-animation-fill-mode: forwards; + animation-fill-mode: forwards; + -webkit-animation-direction: normal, alternate; + animation-direction: normal, alternate; +} + +/* Hang */ +@-webkit-keyframes hvr-hang { + 0% { + -webkit-transform: translateY(8px); + transform: translateY(8px); + } + 50% { + -webkit-transform: translateY(4px); + transform: translateY(4px); + } + 100% { + -webkit-transform: translateY(8px); + transform: translateY(8px); + } +} +@keyframes hvr-hang { + 0% { + -webkit-transform: translateY(8px); + transform: translateY(8px); + } + 50% { + -webkit-transform: translateY(4px); + transform: translateY(4px); + } + 100% { + -webkit-transform: translateY(8px); + transform: translateY(8px); + } +} +@-webkit-keyframes hvr-hang-sink { + 100% { + -webkit-transform: translateY(8px); + transform: translateY(8px); + } +} +@keyframes hvr-hang-sink { + 100% { + -webkit-transform: translateY(8px); + transform: translateY(8px); + } +} +.hvr-hang { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-hang:hover, .hvr-hang:focus, .hvr-hang:active { + -webkit-animation-name: hvr-hang-sink, hvr-hang; + animation-name: hvr-hang-sink, hvr-hang; + -webkit-animation-duration: .3s, 1.5s; + animation-duration: .3s, 1.5s; + -webkit-animation-delay: 0s, .3s; + animation-delay: 0s, .3s; + -webkit-animation-timing-function: ease-out, ease-in-out; + animation-timing-function: ease-out, ease-in-out; + -webkit-animation-iteration-count: 1, infinite; + animation-iteration-count: 1, infinite; + -webkit-animation-fill-mode: forwards; + animation-fill-mode: forwards; + -webkit-animation-direction: normal, alternate; + animation-direction: normal, alternate; +} + +/* Skew */ +.hvr-skew { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-skew:hover, .hvr-skew:focus, .hvr-skew:active { + -webkit-transform: skew(-10deg); + transform: skew(-10deg); +} + +/* Skew Forward */ +.hvr-skew-forward { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transform-origin: 0 100%; + transform-origin: 0 100%; +} +.hvr-skew-forward:hover, .hvr-skew-forward:focus, .hvr-skew-forward:active { + -webkit-transform: skew(-10deg); + transform: skew(-10deg); +} + +/* Skew Backward */ +.hvr-skew-backward { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transform-origin: 0 100%; + transform-origin: 0 100%; +} +.hvr-skew-backward:hover, .hvr-skew-backward:focus, .hvr-skew-backward:active { + -webkit-transform: skew(10deg); + transform: skew(10deg); +} + +/* Wobble Vertical */ +@-webkit-keyframes hvr-wobble-vertical { + 16.65% { + -webkit-transform: translateY(8px); + transform: translateY(8px); + } + 33.3% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } + 49.95% { + -webkit-transform: translateY(4px); + transform: translateY(4px); + } + 66.6% { + -webkit-transform: translateY(-2px); + transform: translateY(-2px); + } + 83.25% { + -webkit-transform: translateY(1px); + transform: translateY(1px); + } + 100% { + -webkit-transform: translateY(0); + transform: translateY(0); + } +} +@keyframes hvr-wobble-vertical { + 16.65% { + -webkit-transform: translateY(8px); + transform: translateY(8px); + } + 33.3% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } + 49.95% { + -webkit-transform: translateY(4px); + transform: translateY(4px); + } + 66.6% { + -webkit-transform: translateY(-2px); + transform: translateY(-2px); + } + 83.25% { + -webkit-transform: translateY(1px); + transform: translateY(1px); + } + 100% { + -webkit-transform: translateY(0); + transform: translateY(0); + } +} +.hvr-wobble-vertical { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-wobble-vertical:hover, .hvr-wobble-vertical:focus, .hvr-wobble-vertical:active { + -webkit-animation-name: hvr-wobble-vertical; + animation-name: hvr-wobble-vertical; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Wobble Horizontal */ +@-webkit-keyframes hvr-wobble-horizontal { + 16.65% { + -webkit-transform: translateX(8px); + transform: translateX(8px); + } + 33.3% { + -webkit-transform: translateX(-6px); + transform: translateX(-6px); + } + 49.95% { + -webkit-transform: translateX(4px); + transform: translateX(4px); + } + 66.6% { + -webkit-transform: translateX(-2px); + transform: translateX(-2px); + } + 83.25% { + -webkit-transform: translateX(1px); + transform: translateX(1px); + } + 100% { + -webkit-transform: translateX(0); + transform: translateX(0); + } +} +@keyframes hvr-wobble-horizontal { + 16.65% { + -webkit-transform: translateX(8px); + transform: translateX(8px); + } + 33.3% { + -webkit-transform: translateX(-6px); + transform: translateX(-6px); + } + 49.95% { + -webkit-transform: translateX(4px); + transform: translateX(4px); + } + 66.6% { + -webkit-transform: translateX(-2px); + transform: translateX(-2px); + } + 83.25% { + -webkit-transform: translateX(1px); + transform: translateX(1px); + } + 100% { + -webkit-transform: translateX(0); + transform: translateX(0); + } +} +.hvr-wobble-horizontal { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-wobble-horizontal:hover, .hvr-wobble-horizontal:focus, .hvr-wobble-horizontal:active { + -webkit-animation-name: hvr-wobble-horizontal; + animation-name: hvr-wobble-horizontal; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Wobble To Bottom Right */ +@-webkit-keyframes hvr-wobble-to-bottom-right { + 16.65% { + -webkit-transform: translate(8px, 8px); + transform: translate(8px, 8px); + } + 33.3% { + -webkit-transform: translate(-6px, -6px); + transform: translate(-6px, -6px); + } + 49.95% { + -webkit-transform: translate(4px, 4px); + transform: translate(4px, 4px); + } + 66.6% { + -webkit-transform: translate(-2px, -2px); + transform: translate(-2px, -2px); + } + 83.25% { + -webkit-transform: translate(1px, 1px); + transform: translate(1px, 1px); + } + 100% { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} +@keyframes hvr-wobble-to-bottom-right { + 16.65% { + -webkit-transform: translate(8px, 8px); + transform: translate(8px, 8px); + } + 33.3% { + -webkit-transform: translate(-6px, -6px); + transform: translate(-6px, -6px); + } + 49.95% { + -webkit-transform: translate(4px, 4px); + transform: translate(4px, 4px); + } + 66.6% { + -webkit-transform: translate(-2px, -2px); + transform: translate(-2px, -2px); + } + 83.25% { + -webkit-transform: translate(1px, 1px); + transform: translate(1px, 1px); + } + 100% { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} +.hvr-wobble-to-bottom-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-wobble-to-bottom-right:hover, .hvr-wobble-to-bottom-right:focus, .hvr-wobble-to-bottom-right:active { + -webkit-animation-name: hvr-wobble-to-bottom-right; + animation-name: hvr-wobble-to-bottom-right; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Wobble To Top Right */ +@-webkit-keyframes hvr-wobble-to-top-right { + 16.65% { + -webkit-transform: translate(8px, -8px); + transform: translate(8px, -8px); + } + 33.3% { + -webkit-transform: translate(-6px, 6px); + transform: translate(-6px, 6px); + } + 49.95% { + -webkit-transform: translate(4px, -4px); + transform: translate(4px, -4px); + } + 66.6% { + -webkit-transform: translate(-2px, 2px); + transform: translate(-2px, 2px); + } + 83.25% { + -webkit-transform: translate(1px, -1px); + transform: translate(1px, -1px); + } + 100% { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} +@keyframes hvr-wobble-to-top-right { + 16.65% { + -webkit-transform: translate(8px, -8px); + transform: translate(8px, -8px); + } + 33.3% { + -webkit-transform: translate(-6px, 6px); + transform: translate(-6px, 6px); + } + 49.95% { + -webkit-transform: translate(4px, -4px); + transform: translate(4px, -4px); + } + 66.6% { + -webkit-transform: translate(-2px, 2px); + transform: translate(-2px, 2px); + } + 83.25% { + -webkit-transform: translate(1px, -1px); + transform: translate(1px, -1px); + } + 100% { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} +.hvr-wobble-to-top-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-wobble-to-top-right:hover, .hvr-wobble-to-top-right:focus, .hvr-wobble-to-top-right:active { + -webkit-animation-name: hvr-wobble-to-top-right; + animation-name: hvr-wobble-to-top-right; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Wobble Top */ +@-webkit-keyframes hvr-wobble-top { + 16.65% { + -webkit-transform: skew(-12deg); + transform: skew(-12deg); + } + 33.3% { + -webkit-transform: skew(10deg); + transform: skew(10deg); + } + 49.95% { + -webkit-transform: skew(-6deg); + transform: skew(-6deg); + } + 66.6% { + -webkit-transform: skew(4deg); + transform: skew(4deg); + } + 83.25% { + -webkit-transform: skew(-2deg); + transform: skew(-2deg); + } + 100% { + -webkit-transform: skew(0); + transform: skew(0); + } +} +@keyframes hvr-wobble-top { + 16.65% { + -webkit-transform: skew(-12deg); + transform: skew(-12deg); + } + 33.3% { + -webkit-transform: skew(10deg); + transform: skew(10deg); + } + 49.95% { + -webkit-transform: skew(-6deg); + transform: skew(-6deg); + } + 66.6% { + -webkit-transform: skew(4deg); + transform: skew(4deg); + } + 83.25% { + -webkit-transform: skew(-2deg); + transform: skew(-2deg); + } + 100% { + -webkit-transform: skew(0); + transform: skew(0); + } +} +.hvr-wobble-top { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transform-origin: 0 100%; + transform-origin: 0 100%; +} +.hvr-wobble-top:hover, .hvr-wobble-top:focus, .hvr-wobble-top:active { + -webkit-animation-name: hvr-wobble-top; + animation-name: hvr-wobble-top; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Wobble Bottom */ +@-webkit-keyframes hvr-wobble-bottom { + 16.65% { + -webkit-transform: skew(-12deg); + transform: skew(-12deg); + } + 33.3% { + -webkit-transform: skew(10deg); + transform: skew(10deg); + } + 49.95% { + -webkit-transform: skew(-6deg); + transform: skew(-6deg); + } + 66.6% { + -webkit-transform: skew(4deg); + transform: skew(4deg); + } + 83.25% { + -webkit-transform: skew(-2deg); + transform: skew(-2deg); + } + 100% { + -webkit-transform: skew(0); + transform: skew(0); + } +} +@keyframes hvr-wobble-bottom { + 16.65% { + -webkit-transform: skew(-12deg); + transform: skew(-12deg); + } + 33.3% { + -webkit-transform: skew(10deg); + transform: skew(10deg); + } + 49.95% { + -webkit-transform: skew(-6deg); + transform: skew(-6deg); + } + 66.6% { + -webkit-transform: skew(4deg); + transform: skew(4deg); + } + 83.25% { + -webkit-transform: skew(-2deg); + transform: skew(-2deg); + } + 100% { + -webkit-transform: skew(0); + transform: skew(0); + } +} +.hvr-wobble-bottom { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transform-origin: 100% 0; + transform-origin: 100% 0; +} +.hvr-wobble-bottom:hover, .hvr-wobble-bottom:focus, .hvr-wobble-bottom:active { + -webkit-animation-name: hvr-wobble-bottom; + animation-name: hvr-wobble-bottom; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Wobble Skew */ +@-webkit-keyframes hvr-wobble-skew { + 16.65% { + -webkit-transform: skew(-12deg); + transform: skew(-12deg); + } + 33.3% { + -webkit-transform: skew(10deg); + transform: skew(10deg); + } + 49.95% { + -webkit-transform: skew(-6deg); + transform: skew(-6deg); + } + 66.6% { + -webkit-transform: skew(4deg); + transform: skew(4deg); + } + 83.25% { + -webkit-transform: skew(-2deg); + transform: skew(-2deg); + } + 100% { + -webkit-transform: skew(0); + transform: skew(0); + } +} +@keyframes hvr-wobble-skew { + 16.65% { + -webkit-transform: skew(-12deg); + transform: skew(-12deg); + } + 33.3% { + -webkit-transform: skew(10deg); + transform: skew(10deg); + } + 49.95% { + -webkit-transform: skew(-6deg); + transform: skew(-6deg); + } + 66.6% { + -webkit-transform: skew(4deg); + transform: skew(4deg); + } + 83.25% { + -webkit-transform: skew(-2deg); + transform: skew(-2deg); + } + 100% { + -webkit-transform: skew(0); + transform: skew(0); + } +} +.hvr-wobble-skew { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-wobble-skew:hover, .hvr-wobble-skew:focus, .hvr-wobble-skew:active { + -webkit-animation-name: hvr-wobble-skew; + animation-name: hvr-wobble-skew; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Buzz */ +@-webkit-keyframes hvr-buzz { + 50% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 100% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } +} +@keyframes hvr-buzz { + 50% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 100% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } +} +.hvr-buzz { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-buzz:hover, .hvr-buzz:focus, .hvr-buzz:active { + -webkit-animation-name: hvr-buzz; + animation-name: hvr-buzz; + -webkit-animation-duration: 0.15s; + animation-duration: 0.15s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; +} + +/* Buzz Out */ +@-webkit-keyframes hvr-buzz-out { + 10% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 20% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + 30% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 40% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + 50% { + -webkit-transform: translateX(2px) rotate(1deg); + transform: translateX(2px) rotate(1deg); + } + 60% { + -webkit-transform: translateX(-2px) rotate(-1deg); + transform: translateX(-2px) rotate(-1deg); + } + 70% { + -webkit-transform: translateX(2px) rotate(1deg); + transform: translateX(2px) rotate(1deg); + } + 80% { + -webkit-transform: translateX(-2px) rotate(-1deg); + transform: translateX(-2px) rotate(-1deg); + } + 90% { + -webkit-transform: translateX(1px) rotate(0); + transform: translateX(1px) rotate(0); + } + 100% { + -webkit-transform: translateX(-1px) rotate(0); + transform: translateX(-1px) rotate(0); + } +} +@keyframes hvr-buzz-out { + 10% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 20% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + 30% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 40% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + 50% { + -webkit-transform: translateX(2px) rotate(1deg); + transform: translateX(2px) rotate(1deg); + } + 60% { + -webkit-transform: translateX(-2px) rotate(-1deg); + transform: translateX(-2px) rotate(-1deg); + } + 70% { + -webkit-transform: translateX(2px) rotate(1deg); + transform: translateX(2px) rotate(1deg); + } + 80% { + -webkit-transform: translateX(-2px) rotate(-1deg); + transform: translateX(-2px) rotate(-1deg); + } + 90% { + -webkit-transform: translateX(1px) rotate(0); + transform: translateX(1px) rotate(0); + } + 100% { + -webkit-transform: translateX(-1px) rotate(0); + transform: translateX(-1px) rotate(0); + } +} +.hvr-buzz-out { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-buzz-out:hover, .hvr-buzz-out:focus, .hvr-buzz-out:active { + -webkit-animation-name: hvr-buzz-out; + animation-name: hvr-buzz-out; + -webkit-animation-duration: 0.75s; + animation-duration: 0.75s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Forward */ +.hvr-forward { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-forward:hover, .hvr-forward:focus, .hvr-forward:active { + -webkit-transform: translateX(8px); + transform: translateX(8px); +} + +/* Backward */ +.hvr-backward { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-backward:hover, .hvr-backward:focus, .hvr-backward:active { + -webkit-transform: translateX(-8px); + transform: translateX(-8px); +} + +/* BACKGROUND TRANSITIONS */ +/* Fade */ +.hvr-fade { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + overflow: hidden; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: color, background-color; + transition-property: color, background-color; +} +.hvr-fade:hover, .hvr-fade:focus, .hvr-fade:active { + background-color: #2098D1; + color: white; +} + +/* Back Pulse */ +@-webkit-keyframes hvr-back-pulse { + 50% { + background-color: rgba(32, 152, 209, 0.75); + } +} +@keyframes hvr-back-pulse { + 50% { + background-color: rgba(32, 152, 209, 0.75); + } +} +.hvr-back-pulse { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + overflow: hidden; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; + -webkit-transition-property: color, background-color; + transition-property: color, background-color; +} +.hvr-back-pulse:hover, .hvr-back-pulse:focus, .hvr-back-pulse:active { + -webkit-animation-name: hvr-back-pulse; + animation-name: hvr-back-pulse; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-delay: 0.5s; + animation-delay: 0.5s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + background-color: #2098D1; + background-color: #2098d1; + color: white; +} + +/* Sweep To Right */ +.hvr-sweep-to-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-sweep-to-right:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scaleX(0); + transform: scaleX(0); + -webkit-transform-origin: 0 50%; + transform-origin: 0 50%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-sweep-to-right:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active { + color: white; +} +.hvr-sweep-to-right:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before { + -webkit-transform: scaleX(1); + transform: scaleX(1); +} + +/* Sweep To Left */ +.hvr-sweep-to-left { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-sweep-to-left:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scaleX(0); + transform: scaleX(0); + -webkit-transform-origin: 100% 50%; + transform-origin: 100% 50%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-sweep-to-left:hover, .hvr-sweep-to-left:focus, .hvr-sweep-to-left:active { + color: white; +} +.hvr-sweep-to-left:hover:before, .hvr-sweep-to-left:focus:before, .hvr-sweep-to-left:active:before { + -webkit-transform: scaleX(1); + transform: scaleX(1); +} + +/* Sweep To Bottom */ +.hvr-sweep-to-bottom { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-sweep-to-bottom:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scaleY(0); + transform: scaleY(0); + -webkit-transform-origin: 50% 0; + transform-origin: 50% 0; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-sweep-to-bottom:hover, .hvr-sweep-to-bottom:focus, .hvr-sweep-to-bottom:active { + color: white; +} +.hvr-sweep-to-bottom:hover:before, .hvr-sweep-to-bottom:focus:before, .hvr-sweep-to-bottom:active:before { + -webkit-transform: scaleY(1); + transform: scaleY(1); +} + +/* Sweep To Top */ +.hvr-sweep-to-top { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-sweep-to-top:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scaleY(0); + transform: scaleY(0); + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-sweep-to-top:hover, .hvr-sweep-to-top:focus, .hvr-sweep-to-top:active { + color: white; +} +.hvr-sweep-to-top:hover:before, .hvr-sweep-to-top:focus:before, .hvr-sweep-to-top:active:before { + -webkit-transform: scaleY(1); + transform: scaleY(1); +} + +/* Bounce To Right */ +.hvr-bounce-to-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; +} +.hvr-bounce-to-right:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scaleX(0); + transform: scaleX(0); + -webkit-transform-origin: 0 50%; + transform-origin: 0 50%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-bounce-to-right:hover, .hvr-bounce-to-right:focus, .hvr-bounce-to-right:active { + color: white; +} +.hvr-bounce-to-right:hover:before, .hvr-bounce-to-right:focus:before, .hvr-bounce-to-right:active:before { + -webkit-transform: scaleX(1); + transform: scaleX(1); + -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); + transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); +} + +/* Bounce To Left */ +.hvr-bounce-to-left { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; +} +.hvr-bounce-to-left:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scaleX(0); + transform: scaleX(0); + -webkit-transform-origin: 100% 50%; + transform-origin: 100% 50%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-bounce-to-left:hover, .hvr-bounce-to-left:focus, .hvr-bounce-to-left:active { + color: white; +} +.hvr-bounce-to-left:hover:before, .hvr-bounce-to-left:focus:before, .hvr-bounce-to-left:active:before { + -webkit-transform: scaleX(1); + transform: scaleX(1); + -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); + transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); +} + +/* Bounce To Bottom */ +.hvr-bounce-to-bottom { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; +} +.hvr-bounce-to-bottom:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scaleY(0); + transform: scaleY(0); + -webkit-transform-origin: 50% 0; + transform-origin: 50% 0; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-bounce-to-bottom:hover, .hvr-bounce-to-bottom:focus, .hvr-bounce-to-bottom:active { + color: white; +} +.hvr-bounce-to-bottom:hover:before, .hvr-bounce-to-bottom:focus:before, .hvr-bounce-to-bottom:active:before { + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); + transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); +} + +/* Bounce To Top */ +.hvr-bounce-to-top { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; +} +.hvr-bounce-to-top:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scaleY(0); + transform: scaleY(0); + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-bounce-to-top:hover, .hvr-bounce-to-top:focus, .hvr-bounce-to-top:active { + color: white; +} +.hvr-bounce-to-top:hover:before, .hvr-bounce-to-top:focus:before, .hvr-bounce-to-top:active:before { + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); + transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); +} + +/* Radial Out */ +.hvr-radial-out { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; + background: #e1e1e1; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-radial-out:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + border-radius: 100%; + -webkit-transform: scale(0); + transform: scale(0); + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-radial-out:hover, .hvr-radial-out:focus, .hvr-radial-out:active { + color: white; +} +.hvr-radial-out:hover:before, .hvr-radial-out:focus:before, .hvr-radial-out:active:before { + -webkit-transform: scale(2); + transform: scale(2); +} + +/* Radial In */ +.hvr-radial-in { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; + background: #2098D1; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-radial-in:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #e1e1e1; + border-radius: 100%; + -webkit-transform: scale(2); + transform: scale(2); + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-radial-in:hover, .hvr-radial-in:focus, .hvr-radial-in:active { + color: white; +} +.hvr-radial-in:hover:before, .hvr-radial-in:focus:before, .hvr-radial-in:active:before { + -webkit-transform: scale(0); + transform: scale(0); +} + +/* Rectangle In */ +.hvr-rectangle-in { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + background: #2098D1; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-rectangle-in:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #e1e1e1; + -webkit-transform: scale(1); + transform: scale(1); + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-rectangle-in:hover, .hvr-rectangle-in:focus, .hvr-rectangle-in:active { + color: white; +} +.hvr-rectangle-in:hover:before, .hvr-rectangle-in:focus:before, .hvr-rectangle-in:active:before { + -webkit-transform: scale(0); + transform: scale(0); +} + +/* Rectangle Out */ +.hvr-rectangle-out { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + background: #e1e1e1; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-rectangle-out:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + -webkit-transform: scale(0); + transform: scale(0); + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-rectangle-out:hover, .hvr-rectangle-out:focus, .hvr-rectangle-out:active { + color: white; +} +.hvr-rectangle-out:hover:before, .hvr-rectangle-out:focus:before, .hvr-rectangle-out:active:before { + -webkit-transform: scale(1); + transform: scale(1); +} + +/* Shutter In Horizontal */ +.hvr-shutter-in-horizontal { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + background: #2098D1; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-shutter-in-horizontal:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: #e1e1e1; + -webkit-transform: scaleX(1); + transform: scaleX(1); + -webkit-transform-origin: 50%; + transform-origin: 50%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-shutter-in-horizontal:hover, .hvr-shutter-in-horizontal:focus, .hvr-shutter-in-horizontal:active { + color: white; +} +.hvr-shutter-in-horizontal:hover:before, .hvr-shutter-in-horizontal:focus:before, .hvr-shutter-in-horizontal:active:before { + -webkit-transform: scaleX(0); + transform: scaleX(0); +} + +/* Shutter Out Horizontal */ +.hvr-shutter-out-horizontal { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + background: #e1e1e1; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-shutter-out-horizontal:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: #2098D1; + -webkit-transform: scaleX(0); + transform: scaleX(0); + -webkit-transform-origin: 50%; + transform-origin: 50%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-shutter-out-horizontal:hover, .hvr-shutter-out-horizontal:focus, .hvr-shutter-out-horizontal:active { + color: white; +} +.hvr-shutter-out-horizontal:hover:before, .hvr-shutter-out-horizontal:focus:before, .hvr-shutter-out-horizontal:active:before { + -webkit-transform: scaleX(1); + transform: scaleX(1); +} + +/* Shutter In Vertical */ +.hvr-shutter-in-vertical { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + background: #2098D1; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-shutter-in-vertical:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: #e1e1e1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transform-origin: 50%; + transform-origin: 50%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-shutter-in-vertical:hover, .hvr-shutter-in-vertical:focus, .hvr-shutter-in-vertical:active { + color: white; +} +.hvr-shutter-in-vertical:hover:before, .hvr-shutter-in-vertical:focus:before, .hvr-shutter-in-vertical:active:before { + -webkit-transform: scaleY(0); + transform: scaleY(0); +} + +/* Shutter Out Vertical */ +.hvr-shutter-out-vertical { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + background: #e1e1e1; + -webkit-transition-property: color; + transition-property: color; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-shutter-out-vertical:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: #2098D1; + -webkit-transform: scaleY(0); + transform: scaleY(0); + -webkit-transform-origin: 50%; + transform-origin: 50%; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-shutter-out-vertical:hover, .hvr-shutter-out-vertical:focus, .hvr-shutter-out-vertical:active { + color: white; +} +.hvr-shutter-out-vertical:hover:before, .hvr-shutter-out-vertical:focus:before, .hvr-shutter-out-vertical:active:before { + -webkit-transform: scaleY(1); + transform: scaleY(1); +} + +/* BORDER TRANSITIONS */ +/* Border Fade */ +.hvr-border-fade { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: box-shadow; + transition-property: box-shadow; + box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0); + /* Hack to improve aliasing on mobile/tablet devices */ +} +.hvr-border-fade:hover, .hvr-border-fade:focus, .hvr-border-fade:active { + box-shadow: inset 0 0 0 4px #2098D1, 0 0 1px rgba(0, 0, 0, 0); + /* Hack to improve aliasing on mobile/tablet devices */ +} + +/* Hollow */ +.hvr-hollow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: background; + transition-property: background; + box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0); + /* Hack to improve aliasing on mobile/tablet devices */ +} +.hvr-hollow:hover, .hvr-hollow:focus, .hvr-hollow:active { + background: none; +} + +/* Trim */ +.hvr-trim { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-trim:before { + content: ''; + position: absolute; + border: white solid 4px; + top: 4px; + left: 4px; + right: 4px; + bottom: 4px; + opacity: 0; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: opacity; + transition-property: opacity; +} +.hvr-trim:hover:before, .hvr-trim:focus:before, .hvr-trim:active:before { + opacity: 1; +} + +/* Ripple Out */ +@-webkit-keyframes hvr-ripple-out { + 100% { + top: -12px; + right: -12px; + bottom: -12px; + left: -12px; + opacity: 0; + } +} +@keyframes hvr-ripple-out { + 100% { + top: -12px; + right: -12px; + bottom: -12px; + left: -12px; + opacity: 0; + } +} +.hvr-ripple-out { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-ripple-out:before { + content: ''; + position: absolute; + border: #e1e1e1 solid 6px; + top: 0; + right: 0; + bottom: 0; + left: 0; + -webkit-animation-duration: 1s; + animation-duration: 1s; +} +.hvr-ripple-out:hover:before, .hvr-ripple-out:focus:before, .hvr-ripple-out:active:before { + -webkit-animation-name: hvr-ripple-out; + animation-name: hvr-ripple-out; +} + +/* Ripple In */ +@-webkit-keyframes hvr-ripple-in { + 100% { + top: 0; + right: 0; + bottom: 0; + left: 0; + opacity: 1; + } +} +@keyframes hvr-ripple-in { + 100% { + top: 0; + right: 0; + bottom: 0; + left: 0; + opacity: 1; + } +} +.hvr-ripple-in { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-ripple-in:before { + content: ''; + position: absolute; + border: #e1e1e1 solid 4px; + top: -12px; + right: -12px; + bottom: -12px; + left: -12px; + opacity: 0; + -webkit-animation-duration: 1s; + animation-duration: 1s; +} +.hvr-ripple-in:hover:before, .hvr-ripple-in:focus:before, .hvr-ripple-in:active:before { + -webkit-animation-name: hvr-ripple-in; + animation-name: hvr-ripple-in; +} + +/* Outline Out */ +.hvr-outline-out { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-outline-out:before { + content: ''; + position: absolute; + border: #e1e1e1 solid 4px; + top: 0; + right: 0; + bottom: 0; + left: 0; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: top, right, bottom, left; + transition-property: top, right, bottom, left; +} +.hvr-outline-out:hover:before, .hvr-outline-out:focus:before, .hvr-outline-out:active:before { + top: -8px; + right: -8px; + bottom: -8px; + left: -8px; +} + +/* Outline In */ +.hvr-outline-in { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-outline-in:before { + pointer-events: none; + content: ''; + position: absolute; + border: #e1e1e1 solid 4px; + top: -16px; + right: -16px; + bottom: -16px; + left: -16px; + opacity: 0; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: top, right, bottom, left; + transition-property: top, right, bottom, left; +} +.hvr-outline-in:hover:before, .hvr-outline-in:focus:before, .hvr-outline-in:active:before { + top: -8px; + right: -8px; + bottom: -8px; + left: -8px; + opacity: 1; +} + +/* Round Corners */ +.hvr-round-corners { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: border-radius; + transition-property: border-radius; +} +.hvr-round-corners:hover, .hvr-round-corners:focus, .hvr-round-corners:active { + border-radius: 1em; +} + +/* Underline From Left */ +.hvr-underline-from-left { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-underline-from-left:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 100%; + bottom: 0; + background: #2098D1; + height: 4px; + -webkit-transition-property: right; + transition-property: right; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-underline-from-left:hover:before, .hvr-underline-from-left:focus:before, .hvr-underline-from-left:active:before { + right: 0; +} + +/* Underline From Center */ +.hvr-underline-from-center { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-underline-from-center:before { + content: ""; + position: absolute; + z-index: -1; + left: 51%; + right: 51%; + bottom: 0; + background: #2098D1; + height: 4px; + -webkit-transition-property: left, right; + transition-property: left, right; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before { + left: 0; + right: 0; +} + +/* Underline From Right */ +.hvr-underline-from-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-underline-from-right:before { + content: ""; + position: absolute; + z-index: -1; + left: 100%; + right: 0; + bottom: 0; + background: #2098D1; + height: 4px; + -webkit-transition-property: left; + transition-property: left; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-underline-from-right:hover:before, .hvr-underline-from-right:focus:before, .hvr-underline-from-right:active:before { + left: 0; +} + +/* Overline From Left */ +.hvr-overline-from-left { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-overline-from-left:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 100%; + top: 0; + background: #2098D1; + height: 4px; + -webkit-transition-property: right; + transition-property: right; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-overline-from-left:hover:before, .hvr-overline-from-left:focus:before, .hvr-overline-from-left:active:before { + right: 0; +} + +/* Overline From Center */ +.hvr-overline-from-center { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-overline-from-center:before { + content: ""; + position: absolute; + z-index: -1; + left: 51%; + right: 51%; + top: 0; + background: #2098D1; + height: 4px; + -webkit-transition-property: left, right; + transition-property: left, right; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-overline-from-center:hover:before, .hvr-overline-from-center:focus:before, .hvr-overline-from-center:active:before { + left: 0; + right: 0; +} + +/* Overline From Right */ +.hvr-overline-from-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-overline-from-right:before { + content: ""; + position: absolute; + z-index: -1; + left: 100%; + right: 0; + top: 0; + background: #2098D1; + height: 4px; + -webkit-transition-property: left; + transition-property: left; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-overline-from-right:hover:before, .hvr-overline-from-right:focus:before, .hvr-overline-from-right:active:before { + left: 0; +} + +/* Reveal */ +.hvr-reveal { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-reveal:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + top: 0; + bottom: 0; + border-color: #2098D1; + border-style: solid; + border-width: 0; + -webkit-transition-property: border-width; + transition-property: border-width; + -webkit-transition-duration: 0.1s; + transition-duration: 0.1s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-reveal:hover:before, .hvr-reveal:focus:before, .hvr-reveal:active:before { + -webkit-transform: translateY(0); + transform: translateY(0); + border-width: 4px; +} + +/* Underline Reveal */ +.hvr-underline-reveal { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-underline-reveal:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + bottom: 0; + background: #2098D1; + height: 4px; + -webkit-transform: translateY(4px); + transform: translateY(4px); + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-underline-reveal:hover:before, .hvr-underline-reveal:focus:before, .hvr-underline-reveal:active:before { + -webkit-transform: translateY(0); + transform: translateY(0); +} + +/* Overline Reveal */ +.hvr-overline-reveal { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + overflow: hidden; +} +.hvr-overline-reveal:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + top: 0; + background: #2098D1; + height: 4px; + -webkit-transform: translateY(-4px); + transform: translateY(-4px); + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-overline-reveal:hover:before, .hvr-overline-reveal:focus:before, .hvr-overline-reveal:active:before { + -webkit-transform: translateY(0); + transform: translateY(0); +} + +/* SHADOW/GLOW TRANSITIONS */ +/* Glow */ +.hvr-glow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: box-shadow; + transition-property: box-shadow; +} +.hvr-glow:hover, .hvr-glow:focus, .hvr-glow:active { + box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); +} + +/* Shadow */ +.hvr-shadow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: box-shadow; + transition-property: box-shadow; +} +.hvr-shadow:hover, .hvr-shadow:focus, .hvr-shadow:active { + box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); +} + +/* Grow Shadow */ +.hvr-grow-shadow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: box-shadow, transform; + transition-property: box-shadow, transform; +} +.hvr-grow-shadow:hover, .hvr-grow-shadow:focus, .hvr-grow-shadow:active { + box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); + -webkit-transform: scale(1.1); + transform: scale(1.1); +} + +/* Box Shadow Outset */ +.hvr-box-shadow-outset { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: box-shadow; + transition-property: box-shadow; +} +.hvr-box-shadow-outset:hover, .hvr-box-shadow-outset:focus, .hvr-box-shadow-outset:active { + box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6); +} + +/* Box Shadow Inset */ +.hvr-box-shadow-inset { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: box-shadow; + transition-property: box-shadow; + box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.6), 0 0 1px rgba(0, 0, 0, 0); + /* Hack to improve aliasing on mobile/tablet devices */ +} +.hvr-box-shadow-inset:hover, .hvr-box-shadow-inset:focus, .hvr-box-shadow-inset:active { + box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.6), 0 0 1px rgba(0, 0, 0, 0); + /* Hack to improve aliasing on mobile/tablet devices */ +} + +/* Float Shadow */ +.hvr-float-shadow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-float-shadow:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + top: 100%; + left: 5%; + height: 10px; + width: 90%; + opacity: 0; + background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%); + /* W3C */ + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform, opacity; + transition-property: transform, opacity; +} +.hvr-float-shadow:hover, .hvr-float-shadow:focus, .hvr-float-shadow:active { + -webkit-transform: translateY(-5px); + transform: translateY(-5px); + /* move the element up by 5px */ +} +.hvr-float-shadow:hover:before, .hvr-float-shadow:focus:before, .hvr-float-shadow:active:before { + opacity: 1; + -webkit-transform: translateY(5px); + transform: translateY(5px); + /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */ +} + +/* Shadow Radial */ +.hvr-shadow-radial { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-shadow-radial:before, .hvr-shadow-radial:after { + pointer-events: none; + position: absolute; + content: ''; + left: 0; + width: 100%; + box-sizing: border-box; + background-repeat: no-repeat; + height: 5px; + opacity: 0; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: opacity; + transition-property: opacity; +} +.hvr-shadow-radial:before { + bottom: 100%; + background: -webkit-radial-gradient(50% 150%, ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at 50% 150%, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%); +} +.hvr-shadow-radial:after { + top: 100%; + background: -webkit-radial-gradient(50% -50%, ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at 50% -50%, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%); +} +.hvr-shadow-radial:hover:before, .hvr-shadow-radial:focus:before, .hvr-shadow-radial:active:before, .hvr-shadow-radial:hover:after, .hvr-shadow-radial:focus:after, .hvr-shadow-radial:active:after { + opacity: 1; +} + +/* SPEECH BUBBLES */ +/* Bubble Top */ +.hvr-bubble-top { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-bubble-top:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + left: calc(50% - 10px); + top: 0; + border-width: 0 10px 10px 10px; + border-color: transparent transparent #e1e1e1 transparent; +} +.hvr-bubble-top:hover:before, .hvr-bubble-top:focus:before, .hvr-bubble-top:active:before { + -webkit-transform: translateY(-10px); + transform: translateY(-10px); +} + +/* Bubble Right */ +.hvr-bubble-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-bubble-right:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + top: calc(50% - 10px); + right: 0; + border-width: 10px 0 10px 10px; + border-color: transparent transparent transparent #e1e1e1; +} +.hvr-bubble-right:hover:before, .hvr-bubble-right:focus:before, .hvr-bubble-right:active:before { + -webkit-transform: translateX(10px); + transform: translateX(10px); +} + +/* Bubble Bottom */ +.hvr-bubble-bottom { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-bubble-bottom:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + left: calc(50% - 10px); + bottom: 0; + border-width: 10px 10px 0 10px; + border-color: #e1e1e1 transparent transparent transparent; +} +.hvr-bubble-bottom:hover:before, .hvr-bubble-bottom:focus:before, .hvr-bubble-bottom:active:before { + -webkit-transform: translateY(10px); + transform: translateY(10px); +} + +/* Bubble Left */ +.hvr-bubble-left { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-bubble-left:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + top: calc(50% - 10px); + left: 0; + border-width: 10px 10px 10px 0; + border-color: transparent #e1e1e1 transparent transparent; +} +.hvr-bubble-left:hover:before, .hvr-bubble-left:focus:before, .hvr-bubble-left:active:before { + -webkit-transform: translateX(-10px); + transform: translateX(-10px); +} + +/* Bubble Float Top */ +.hvr-bubble-float-top { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-bubble-float-top:before { + position: absolute; + z-index: -1; + content: ''; + left: calc(50% - 10px); + top: 0; + border-style: solid; + border-width: 0 10px 10px 10px; + border-color: transparent transparent #e1e1e1 transparent; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-bubble-float-top:hover, .hvr-bubble-float-top:focus, .hvr-bubble-float-top:active { + -webkit-transform: translateY(10px); + transform: translateY(10px); +} +.hvr-bubble-float-top:hover:before, .hvr-bubble-float-top:focus:before, .hvr-bubble-float-top:active:before { + -webkit-transform: translateY(-10px); + transform: translateY(-10px); +} + +/* Bubble Float Right */ +.hvr-bubble-float-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-bubble-float-right:before { + position: absolute; + z-index: -1; + top: calc(50% - 10px); + right: 0; + content: ''; + border-style: solid; + border-width: 10px 0 10px 10px; + border-color: transparent transparent transparent #e1e1e1; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-bubble-float-right:hover, .hvr-bubble-float-right:focus, .hvr-bubble-float-right:active { + -webkit-transform: translateX(-10px); + transform: translateX(-10px); +} +.hvr-bubble-float-right:hover:before, .hvr-bubble-float-right:focus:before, .hvr-bubble-float-right:active:before { + -webkit-transform: translateX(10px); + transform: translateX(10px); +} + +/* Bubble Float Bottom */ +.hvr-bubble-float-bottom { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-bubble-float-bottom:before { + position: absolute; + z-index: -1; + content: ''; + left: calc(50% - 10px); + bottom: 0; + border-style: solid; + border-width: 10px 10px 0 10px; + border-color: #e1e1e1 transparent transparent transparent; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-bubble-float-bottom:hover, .hvr-bubble-float-bottom:focus, .hvr-bubble-float-bottom:active { + -webkit-transform: translateY(-10px); + transform: translateY(-10px); +} +.hvr-bubble-float-bottom:hover:before, .hvr-bubble-float-bottom:focus:before, .hvr-bubble-float-bottom:active:before { + -webkit-transform: translateY(10px); + transform: translateY(10px); +} + +/* Bubble Float Left */ +.hvr-bubble-float-left { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-bubble-float-left:before { + position: absolute; + z-index: -1; + content: ''; + top: calc(50% - 10px); + left: 0; + border-style: solid; + border-width: 10px 10px 10px 0; + border-color: transparent #e1e1e1 transparent transparent; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; +} +.hvr-bubble-float-left:hover, .hvr-bubble-float-left:focus, .hvr-bubble-float-left:active { + -webkit-transform: translateX(10px); + transform: translateX(10px); +} +.hvr-bubble-float-left:hover:before, .hvr-bubble-float-left:focus:before, .hvr-bubble-float-left:active:before { + -webkit-transform: translateX(-10px); + transform: translateX(-10px); +} + +/* ICONS */ +/* Icon Back */ +.hvr-icon-back { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.1s; + transition-duration: 0.1s; +} +.hvr-icon-back .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.1s; + transition-duration: 0.1s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-back:hover .hvr-icon, .hvr-icon-back:focus .hvr-icon, .hvr-icon-back:active .hvr-icon { + -webkit-transform: translateX(-4px); + transform: translateX(-4px); +} + +/* Icon Forward */ +.hvr-icon-forward { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.1s; + transition-duration: 0.1s; +} +.hvr-icon-forward .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.1s; + transition-duration: 0.1s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-forward:hover .hvr-icon, .hvr-icon-forward:focus .hvr-icon, .hvr-icon-forward:active .hvr-icon { + -webkit-transform: translateX(4px); + transform: translateX(4px); +} + +/* Icon Down */ +@-webkit-keyframes hvr-icon-down { + 0%, + 50%, + 100% { + -webkit-transform: translateY(0); + transform: translateY(0); + } + 25%, + 75% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } +} +@keyframes hvr-icon-down { + 0%, + 50%, + 100% { + -webkit-transform: translateY(0); + transform: translateY(0); + } + 25%, + 75% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } +} +/* Icon Down */ +.hvr-icon-down { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-down .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-down:hover .hvr-icon, .hvr-icon-down:focus .hvr-icon, .hvr-icon-down:active .hvr-icon { + -webkit-animation-name: hvr-icon-down; + animation-name: hvr-icon-down; + -webkit-animation-duration: 0.75s; + animation-duration: 0.75s; + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; +} + +/* Icon Up */ +@-webkit-keyframes hvr-icon-up { + 0%, + 50%, + 100% { + -webkit-transform: translateY(0); + transform: translateY(0); + } + 25%, + 75% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } +} +@keyframes hvr-icon-up { + 0%, + 50%, + 100% { + -webkit-transform: translateY(0); + transform: translateY(0); + } + 25%, + 75% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } +} +/* Icon Up */ +.hvr-icon-up { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-up .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-up:hover .hvr-icon, .hvr-icon-up:focus .hvr-icon, .hvr-icon-up:active .hvr-icon { + -webkit-animation-name: hvr-icon-up; + animation-name: hvr-icon-up; + -webkit-animation-duration: 0.75s; + animation-duration: 0.75s; + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; +} + +/* Icon Spin */ +.hvr-icon-spin { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-spin .hvr-icon { + -webkit-transition-duration: 1s; + transition-duration: 1s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; +} +.hvr-icon-spin:hover .hvr-icon, .hvr-icon-spin:focus .hvr-icon, .hvr-icon-spin:active .hvr-icon { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); +} + +/* Icon Drop */ +@-webkit-keyframes hvr-icon-drop { + 0% { + opacity: 0; + } + 50% { + opacity: 0; + -webkit-transform: translateY(-100%); + transform: translateY(-100%); + } + 51%, + 100% { + opacity: 1; + } +} +@keyframes hvr-icon-drop { + 0% { + opacity: 0; + } + 50% { + opacity: 0; + -webkit-transform: translateY(-100%); + transform: translateY(-100%); + } + 51%, + 100% { + opacity: 1; + } +} +/* Icon Drop */ +.hvr-icon-drop { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-drop .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-drop:hover .hvr-icon, .hvr-icon-drop:focus .hvr-icon, .hvr-icon-drop:active .hvr-icon { + opacity: 0; + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-animation-name: hvr-icon-drop; + animation-name: hvr-icon-drop; + -webkit-animation-duration: 0.5s; + animation-duration: 0.5s; + -webkit-animation-delay: 0.3s; + animation-delay: 0.3s; + -webkit-animation-fill-mode: forwards; + animation-fill-mode: forwards; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); + animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); +} + +/* Icon Fade */ +.hvr-icon-fade { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-fade .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.5s; + transition-duration: 0.5s; + -webkit-transition-property: color; + transition-property: color; +} +.hvr-icon-fade:hover .hvr-icon, .hvr-icon-fade:focus .hvr-icon, .hvr-icon-fade:active .hvr-icon { + color: #0F9E5E; +} + +/* Icon Float Away */ +@-webkit-keyframes hvr-icon-float-away { + 0% { + opacity: 1; + } + 100% { + opacity: 0; + -webkit-transform: translateY(-1em); + transform: translateY(-1em); + } +} +@keyframes hvr-icon-float-away { + 0% { + opacity: 1; + } + 100% { + opacity: 0; + -webkit-transform: translateY(-1em); + transform: translateY(-1em); + } +} +/* Icon Float Away */ +.hvr-icon-float-away { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-float-away .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-animation-duration: 0.5s; + animation-duration: 0.5s; + -webkit-animation-fill-mode: forwards; + animation-fill-mode: forwards; +} +.hvr-icon-float-away:hover .hvr-icon, .hvr-icon-float-away:focus .hvr-icon, .hvr-icon-float-away:active .hvr-icon { + -webkit-animation-name: hvr-icon-float-away; + animation-name: hvr-icon-float-away; + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; +} + +/* Icon Sink Away */ +@-webkit-keyframes hvr-icon-sink-away { + 0% { + opacity: 1; + } + 100% { + opacity: 0; + -webkit-transform: translateY(1em); + transform: translateY(1em); + } +} +@keyframes hvr-icon-sink-away { + 0% { + opacity: 1; + } + 100% { + opacity: 0; + -webkit-transform: translateY(1em); + transform: translateY(1em); + } +} +/* Icon Sink Away */ +.hvr-icon-sink-away { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-sink-away .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-animation-duration: 0.5s; + animation-duration: 0.5s; + -webkit-animation-fill-mode: forwards; + animation-fill-mode: forwards; +} +.hvr-icon-sink-away:hover .hvr-icon, .hvr-icon-sink-away:focus .hvr-icon, .hvr-icon-sink-away:active .hvr-icon { + -webkit-animation-name: hvr-icon-sink-away; + animation-name: hvr-icon-sink-away; + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; +} + +/* Icon Grow */ +.hvr-icon-grow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-grow .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-grow:hover .hvr-icon, .hvr-icon-grow:focus .hvr-icon, .hvr-icon-grow:active .hvr-icon { + -webkit-transform: scale(1.3) translateZ(0); + transform: scale(1.3) translateZ(0); +} + +/* Icon Shrink */ +.hvr-icon-shrink { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-shrink .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-shrink:hover .hvr-icon, .hvr-icon-shrink:focus .hvr-icon, .hvr-icon-shrink:active .hvr-icon { + -webkit-transform: scale(0.8); + transform: scale(0.8); +} + +/* Icon Pulse */ +@-webkit-keyframes hvr-icon-pulse { + 25% { + -webkit-transform: scale(1.3); + transform: scale(1.3); + } + 75% { + -webkit-transform: scale(0.8); + transform: scale(0.8); + } +} +@keyframes hvr-icon-pulse { + 25% { + -webkit-transform: scale(1.3); + transform: scale(1.3); + } + 75% { + -webkit-transform: scale(0.8); + transform: scale(0.8); + } +} +.hvr-icon-pulse { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-pulse .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-pulse:hover .hvr-icon, .hvr-icon-pulse:focus .hvr-icon, .hvr-icon-pulse:active .hvr-icon { + -webkit-animation-name: hvr-icon-pulse; + animation-name: hvr-icon-pulse; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; +} + +/* Icon Pulse Grow */ +@-webkit-keyframes hvr-icon-pulse-grow { + to { + -webkit-transform: scale(1.3); + transform: scale(1.3); + } +} +@keyframes hvr-icon-pulse-grow { + to { + -webkit-transform: scale(1.3); + transform: scale(1.3); + } +} +.hvr-icon-pulse-grow { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-pulse-grow .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-pulse-grow:hover .hvr-icon, .hvr-icon-pulse-grow:focus .hvr-icon, .hvr-icon-pulse-grow:active .hvr-icon { + -webkit-animation-name: hvr-icon-pulse-grow; + animation-name: hvr-icon-pulse-grow; + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -webkit-animation-direction: alternate; + animation-direction: alternate; +} + +/* Icon Pulse Shrink */ +@-webkit-keyframes hvr-icon-pulse-shrink { + to { + -webkit-transform: scale(0.8); + transform: scale(0.8); + } +} +@keyframes hvr-icon-pulse-shrink { + to { + -webkit-transform: scale(0.8); + transform: scale(0.8); + } +} +.hvr-icon-pulse-shrink { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-pulse-shrink .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-pulse-shrink:hover .hvr-icon, .hvr-icon-pulse-shrink:focus .hvr-icon, .hvr-icon-pulse-shrink:active .hvr-icon { + -webkit-animation-name: hvr-icon-pulse-shrink; + animation-name: hvr-icon-pulse-shrink; + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -webkit-animation-direction: alternate; + animation-direction: alternate; +} + +/* Icon Push */ +@-webkit-keyframes hvr-icon-push { + 50% { + -webkit-transform: scale(0.5); + transform: scale(0.5); + } +} +@keyframes hvr-icon-push { + 50% { + -webkit-transform: scale(0.5); + transform: scale(0.5); + } +} +.hvr-icon-push { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-push .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-push:hover .hvr-icon, .hvr-icon-push:focus .hvr-icon, .hvr-icon-push:active .hvr-icon { + -webkit-animation-name: hvr-icon-push; + animation-name: hvr-icon-push; + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Icon Pop */ +@-webkit-keyframes hvr-icon-pop { + 50% { + -webkit-transform: scale(1.5); + transform: scale(1.5); + } +} +@keyframes hvr-icon-pop { + 50% { + -webkit-transform: scale(1.5); + transform: scale(1.5); + } +} +.hvr-icon-pop { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-pop .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-pop:hover .hvr-icon, .hvr-icon-pop:focus .hvr-icon, .hvr-icon-pop:active .hvr-icon { + -webkit-animation-name: hvr-icon-pop; + animation-name: hvr-icon-pop; + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Icon Bounce */ +.hvr-icon-bounce { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-bounce .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-bounce:hover .hvr-icon, .hvr-icon-bounce:focus .hvr-icon, .hvr-icon-bounce:active .hvr-icon { + -webkit-transform: scale(1.5); + transform: scale(1.5); + -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); + transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); +} + +/* Icon Rotate */ +.hvr-icon-rotate { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-rotate .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-rotate:hover .hvr-icon, .hvr-icon-rotate:focus .hvr-icon, .hvr-icon-rotate:active .hvr-icon { + -webkit-transform: rotate(20deg); + transform: rotate(20deg); +} + +/* Icon Grow Rotate */ +.hvr-icon-grow-rotate { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-grow-rotate .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-grow-rotate:hover .hvr-icon, .hvr-icon-grow-rotate:focus .hvr-icon, .hvr-icon-grow-rotate:active .hvr-icon { + -webkit-transform: scale(1.5) rotate(12deg); + transform: scale(1.5) rotate(12deg); +} + +/* Icon Float */ +.hvr-icon-float { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-float .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-float:hover .hvr-icon, .hvr-icon-float:focus .hvr-icon, .hvr-icon-float:active .hvr-icon { + -webkit-transform: translateY(-4px); + transform: translateY(-4px); +} + +/* Icon Sink */ +.hvr-icon-sink { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-sink .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: transform; + transition-property: transform; + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-sink:hover .hvr-icon, .hvr-icon-sink:focus .hvr-icon, .hvr-icon-sink:active .hvr-icon { + -webkit-transform: translateY(4px); + transform: translateY(4px); +} + +/* Icon Bob */ +@-webkit-keyframes hvr-icon-bob { + 0% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } + 50% { + -webkit-transform: translateY(-2px); + transform: translateY(-2px); + } + 100% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } +} +@keyframes hvr-icon-bob { + 0% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } + 50% { + -webkit-transform: translateY(-2px); + transform: translateY(-2px); + } + 100% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } +} +@-webkit-keyframes hvr-icon-bob-float { + 100% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } +} +@keyframes hvr-icon-bob-float { + 100% { + -webkit-transform: translateY(-6px); + transform: translateY(-6px); + } +} +.hvr-icon-bob { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-bob .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-bob:hover .hvr-icon, .hvr-icon-bob:focus .hvr-icon, .hvr-icon-bob:active .hvr-icon { + -webkit-animation-name: hvr-icon-bob-float, hvr-icon-bob; + animation-name: hvr-icon-bob-float, hvr-icon-bob; + -webkit-animation-duration: .3s, 1.5s; + animation-duration: .3s, 1.5s; + -webkit-animation-delay: 0s, .3s; + animation-delay: 0s, .3s; + -webkit-animation-timing-function: ease-out, ease-in-out; + animation-timing-function: ease-out, ease-in-out; + -webkit-animation-iteration-count: 1, infinite; + animation-iteration-count: 1, infinite; + -webkit-animation-fill-mode: forwards; + animation-fill-mode: forwards; + -webkit-animation-direction: normal, alternate; + animation-direction: normal, alternate; +} + +/* Icon Hang */ +@-webkit-keyframes hvr-icon-hang { + 0% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } + 50% { + -webkit-transform: translateY(2px); + transform: translateY(2px); + } + 100% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } +} +@keyframes hvr-icon-hang { + 0% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } + 50% { + -webkit-transform: translateY(2px); + transform: translateY(2px); + } + 100% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } +} +@-webkit-keyframes hvr-icon-hang-sink { + 100% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } +} +@keyframes hvr-icon-hang-sink { + 100% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } +} +.hvr-icon-hang { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-hang .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-hang:hover .hvr-icon, .hvr-icon-hang:focus .hvr-icon, .hvr-icon-hang:active .hvr-icon { + -webkit-animation-name: hvr-icon-hang-sink, hvr-icon-hang; + animation-name: hvr-icon-hang-sink, hvr-icon-hang; + -webkit-animation-duration: .3s, 1.5s; + animation-duration: .3s, 1.5s; + -webkit-animation-delay: 0s, .3s; + animation-delay: 0s, .3s; + -webkit-animation-timing-function: ease-out, ease-in-out; + animation-timing-function: ease-out, ease-in-out; + -webkit-animation-iteration-count: 1, infinite; + animation-iteration-count: 1, infinite; + -webkit-animation-fill-mode: forwards; + animation-fill-mode: forwards; + -webkit-animation-direction: normal, alternate; + animation-direction: normal, alternate; +} + +/* Icon Wobble Horizontal */ +@-webkit-keyframes hvr-icon-wobble-horizontal { + 16.65% { + -webkit-transform: translateX(6px); + transform: translateX(6px); + } + 33.3% { + -webkit-transform: translateX(-5px); + transform: translateX(-5px); + } + 49.95% { + -webkit-transform: translateX(4px); + transform: translateX(4px); + } + 66.6% { + -webkit-transform: translateX(-2px); + transform: translateX(-2px); + } + 83.25% { + -webkit-transform: translateX(1px); + transform: translateX(1px); + } + 100% { + -webkit-transform: translateX(0); + transform: translateX(0); + } +} +@keyframes hvr-icon-wobble-horizontal { + 16.65% { + -webkit-transform: translateX(6px); + transform: translateX(6px); + } + 33.3% { + -webkit-transform: translateX(-5px); + transform: translateX(-5px); + } + 49.95% { + -webkit-transform: translateX(4px); + transform: translateX(4px); + } + 66.6% { + -webkit-transform: translateX(-2px); + transform: translateX(-2px); + } + 83.25% { + -webkit-transform: translateX(1px); + transform: translateX(1px); + } + 100% { + -webkit-transform: translateX(0); + transform: translateX(0); + } +} +.hvr-icon-wobble-horizontal { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-wobble-horizontal .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-wobble-horizontal:hover .hvr-icon, .hvr-icon-wobble-horizontal:focus .hvr-icon, .hvr-icon-wobble-horizontal:active .hvr-icon { + -webkit-animation-name: hvr-icon-wobble-horizontal; + animation-name: hvr-icon-wobble-horizontal; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Icon Wobble Vertical */ +@-webkit-keyframes hvr-icon-wobble-vertical { + 16.65% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } + 33.3% { + -webkit-transform: translateY(-5px); + transform: translateY(-5px); + } + 49.95% { + -webkit-transform: translateY(4px); + transform: translateY(4px); + } + 66.6% { + -webkit-transform: translateY(-2px); + transform: translateY(-2px); + } + 83.25% { + -webkit-transform: translateY(1px); + transform: translateY(1px); + } + 100% { + -webkit-transform: translateY(0); + transform: translateY(0); + } +} +@keyframes hvr-icon-wobble-vertical { + 16.65% { + -webkit-transform: translateY(6px); + transform: translateY(6px); + } + 33.3% { + -webkit-transform: translateY(-5px); + transform: translateY(-5px); + } + 49.95% { + -webkit-transform: translateY(4px); + transform: translateY(4px); + } + 66.6% { + -webkit-transform: translateY(-2px); + transform: translateY(-2px); + } + 83.25% { + -webkit-transform: translateY(1px); + transform: translateY(1px); + } + 100% { + -webkit-transform: translateY(0); + transform: translateY(0); + } +} +.hvr-icon-wobble-vertical { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-wobble-vertical .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-wobble-vertical:hover .hvr-icon, .hvr-icon-wobble-vertical:focus .hvr-icon, .hvr-icon-wobble-vertical:active .hvr-icon { + -webkit-animation-name: hvr-icon-wobble-vertical; + animation-name: hvr-icon-wobble-vertical; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* Icon Buzz */ +@-webkit-keyframes hvr-icon-buzz { + 50% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 100% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } +} +@keyframes hvr-icon-buzz { + 50% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 100% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } +} +.hvr-icon-buzz { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-buzz .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-buzz:hover .hvr-icon, .hvr-icon-buzz:focus .hvr-icon, .hvr-icon-buzz:active .hvr-icon { + -webkit-animation-name: hvr-icon-buzz; + animation-name: hvr-icon-buzz; + -webkit-animation-duration: 0.15s; + animation-duration: 0.15s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; +} + +/* Icon Buzz Out */ +@-webkit-keyframes hvr-icon-buzz-out { + 10% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 20% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + 30% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 40% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + 50% { + -webkit-transform: translateX(2px) rotate(1deg); + transform: translateX(2px) rotate(1deg); + } + 60% { + -webkit-transform: translateX(-2px) rotate(-1deg); + transform: translateX(-2px) rotate(-1deg); + } + 70% { + -webkit-transform: translateX(2px) rotate(1deg); + transform: translateX(2px) rotate(1deg); + } + 80% { + -webkit-transform: translateX(-2px) rotate(-1deg); + transform: translateX(-2px) rotate(-1deg); + } + 90% { + -webkit-transform: translateX(1px) rotate(0); + transform: translateX(1px) rotate(0); + } + 100% { + -webkit-transform: translateX(-1px) rotate(0); + transform: translateX(-1px) rotate(0); + } +} +@keyframes hvr-icon-buzz-out { + 10% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 20% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + 30% { + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 40% { + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + 50% { + -webkit-transform: translateX(2px) rotate(1deg); + transform: translateX(2px) rotate(1deg); + } + 60% { + -webkit-transform: translateX(-2px) rotate(-1deg); + transform: translateX(-2px) rotate(-1deg); + } + 70% { + -webkit-transform: translateX(2px) rotate(1deg); + transform: translateX(2px) rotate(1deg); + } + 80% { + -webkit-transform: translateX(-2px) rotate(-1deg); + transform: translateX(-2px) rotate(-1deg); + } + 90% { + -webkit-transform: translateX(1px) rotate(0); + transform: translateX(1px) rotate(0); + } + 100% { + -webkit-transform: translateX(-1px) rotate(0); + transform: translateX(-1px) rotate(0); + } +} +.hvr-icon-buzz-out { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; +} +.hvr-icon-buzz-out .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); +} +.hvr-icon-buzz-out:hover .hvr-icon, .hvr-icon-buzz-out:focus .hvr-icon, .hvr-icon-buzz-out:active .hvr-icon { + -webkit-animation-name: hvr-icon-buzz-out; + animation-name: hvr-icon-buzz-out; + -webkit-animation-duration: 0.75s; + animation-duration: 0.75s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; +} + +/* CURLS */ +/* Curl Top Left */ +.hvr-curl-top-left { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-curl-top-left:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + top: 0; + left: 0; + background: white; + /* IE9 */ + background: linear-gradient(135deg, white 45%, #aaa 50%, #ccc 56%, white 80%); + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#000000'); + /*For IE7-8-9*/ + z-index: 1000; + box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: width, height; + transition-property: width, height; +} +.hvr-curl-top-left:hover:before, .hvr-curl-top-left:focus:before, .hvr-curl-top-left:active:before { + width: 25px; + height: 25px; +} + +/* Curl Top Right */ +.hvr-curl-top-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-curl-top-right:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + top: 0; + right: 0; + background: white; + /* IE9 */ + background: linear-gradient(225deg, white 45%, #aaa 50%, #ccc 56%, white 80%); + box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.4); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: width, height; + transition-property: width, height; +} +.hvr-curl-top-right:hover:before, .hvr-curl-top-right:focus:before, .hvr-curl-top-right:active:before { + width: 25px; + height: 25px; +} + +/* Curl Bottom Right */ +.hvr-curl-bottom-right { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-curl-bottom-right:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + bottom: 0; + right: 0; + background: white; + /* IE9 */ + background: linear-gradient(315deg, white 45%, #aaa 50%, #ccc 56%, white 80%); + box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.4); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: width, height; + transition-property: width, height; +} +.hvr-curl-bottom-right:hover:before, .hvr-curl-bottom-right:focus:before, .hvr-curl-bottom-right:active:before { + width: 25px; + height: 25px; +} + +/* Curl Bottom Left */ +.hvr-curl-bottom-left { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); + position: relative; +} +.hvr-curl-bottom-left:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + bottom: 0; + left: 0; + background: white; + /* IE9 */ + background: linear-gradient(45deg, white 45%, #aaa 50%, #ccc 56%, white 80%); + box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.4); + -webkit-transition-duration: 0.3s; + transition-duration: 0.3s; + -webkit-transition-property: width, height; + transition-property: width, height; +} +.hvr-curl-bottom-left:hover:before, .hvr-curl-bottom-left:focus:before, .hvr-curl-bottom-left:active:before { + width: 25px; + height: 25px; +} + +/*# sourceMappingURL=hover.css.map */ diff --git a/assets/js/css/hover.css.map b/assets/js/css/hover.css.map new file mode 100644 index 0000000..3d2b27f --- /dev/null +++ b/assets/js/css/hover.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": "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", +"sources": ["../scss/hover.scss","../scss/effects/2d-transitions/_grow.scss","../scss/_hacks.scss","../scss/_mixins.scss","../scss/effects/2d-transitions/_shrink.scss","../scss/effects/2d-transitions/_pulse.scss","../scss/effects/2d-transitions/_pulse-grow.scss","../scss/effects/2d-transitions/_pulse-shrink.scss","../scss/effects/2d-transitions/_push.scss","../scss/effects/2d-transitions/_pop.scss","../scss/effects/2d-transitions/_bounce-in.scss","../scss/effects/2d-transitions/_bounce-out.scss","../scss/effects/2d-transitions/_rotate.scss","../scss/effects/2d-transitions/_grow-rotate.scss","../scss/effects/2d-transitions/_float.scss","../scss/effects/2d-transitions/_sink.scss","../scss/effects/2d-transitions/_bob.scss","../scss/effects/2d-transitions/_hang.scss","../scss/effects/2d-transitions/_skew.scss","../scss/effects/2d-transitions/_skew-forward.scss","../scss/effects/2d-transitions/_skew-backward.scss","../scss/effects/2d-transitions/_wobble-vertical.scss","../scss/effects/2d-transitions/_wobble-horizontal.scss","../scss/effects/2d-transitions/_wobble-to-bottom-right.scss","../scss/effects/2d-transitions/_wobble-to-top-right.scss","../scss/effects/2d-transitions/_wobble-top.scss","../scss/effects/2d-transitions/_wobble-bottom.scss","../scss/effects/2d-transitions/_wobble-skew.scss","../scss/effects/2d-transitions/_buzz.scss","../scss/effects/2d-transitions/_buzz-out.scss","../scss/effects/2d-transitions/_forward.scss","../scss/effects/2d-transitions/_backward.scss","../scss/effects/background-transitions/_fade.scss","../scss/_options.scss","../scss/effects/background-transitions/_back-pulse.scss","../scss/effects/background-transitions/_sweep-to-right.scss","../scss/effects/background-transitions/_sweep-to-left.scss","../scss/effects/background-transitions/_sweep-to-bottom.scss","../scss/effects/background-transitions/_sweep-to-top.scss","../scss/effects/background-transitions/_bounce-to-right.scss","../scss/effects/background-transitions/_bounce-to-left.scss","../scss/effects/background-transitions/_bounce-to-bottom.scss","../scss/effects/background-transitions/_bounce-to-top.scss","../scss/effects/background-transitions/_radial-out.scss","../scss/effects/background-transitions/_radial-in.scss","../scss/effects/background-transitions/_rectangle-in.scss","../scss/effects/background-transitions/_rectangle-out.scss","../scss/effects/background-transitions/_shutter-in-horizontal.scss","../scss/effects/background-transitions/_shutter-out-horizontal.scss","../scss/effects/background-transitions/_shutter-in-vertical.scss","../scss/effects/background-transitions/_shutter-out-vertical.scss","../scss/effects/border-transitions/_border-fade.scss","../scss/effects/border-transitions/_hollow.scss","../scss/effects/border-transitions/_trim.scss","../scss/effects/border-transitions/_ripple-out.scss","../scss/effects/border-transitions/_ripple-in.scss","../scss/effects/border-transitions/_outline-out.scss","../scss/effects/border-transitions/_outline-in.scss","../scss/effects/border-transitions/_round-corners.scss","../scss/effects/border-transitions/_underline-from-left.scss","../scss/effects/border-transitions/_underline-from-center.scss","../scss/effects/border-transitions/_underline-from-right.scss","../scss/effects/border-transitions/_overline-from-left.scss","../scss/effects/border-transitions/_overline-from-center.scss","../scss/effects/border-transitions/_overline-from-right.scss","../scss/effects/border-transitions/_reveal.scss","../scss/effects/border-transitions/_underline-reveal.scss","../scss/effects/border-transitions/_overline-reveal.scss","../scss/effects/shadow-and-glow-transitions/_glow.scss","../scss/effects/shadow-and-glow-transitions/_shadow.scss","../scss/effects/shadow-and-glow-transitions/_grow-shadow.scss","../scss/effects/shadow-and-glow-transitions/_box-shadow-outset.scss","../scss/effects/shadow-and-glow-transitions/_box-shadow-inset.scss","../scss/effects/shadow-and-glow-transitions/_float-shadow.scss","../scss/effects/shadow-and-glow-transitions/_shadow-radial.scss","../scss/effects/speech-bubbles/_bubble-top.scss","../scss/effects/speech-bubbles/_bubble-right.scss","../scss/effects/speech-bubbles/_bubble-bottom.scss","../scss/effects/speech-bubbles/_bubble-left.scss","../scss/effects/speech-bubbles/_bubble-float-top.scss","../scss/effects/speech-bubbles/_bubble-float-right.scss","../scss/effects/speech-bubbles/_bubble-float-bottom.scss","../scss/effects/speech-bubbles/_bubble-float-left.scss","../scss/effects/icons/_icon-back.scss","../scss/effects/icons/_icon-forward.scss","../scss/effects/icons/_icon-down.scss","../scss/effects/icons/_icon-up.scss","../scss/effects/icons/_icon-spin.scss","../scss/effects/icons/_icon-drop.scss","../scss/effects/icons/_icon-fade.scss","../scss/effects/icons/_icon-float-away.scss","../scss/effects/icons/_icon-sink-away.scss","../scss/effects/icons/_icon-grow.scss","../scss/effects/icons/_icon-shrink.scss","../scss/effects/icons/_icon-pulse.scss","../scss/effects/icons/_icon-pulse-grow.scss","../scss/effects/icons/_icon-pulse-shrink.scss","../scss/effects/icons/_icon-push.scss","../scss/effects/icons/_icon-pop.scss","../scss/effects/icons/_icon-bounce.scss","../scss/effects/icons/_icon-rotate.scss","../scss/effects/icons/_icon-grow-rotate.scss","../scss/effects/icons/_icon-float.scss","../scss/effects/icons/_icon-sink.scss","../scss/effects/icons/_icon-bob.scss","../scss/effects/icons/_icon-hang.scss","../scss/effects/icons/_icon-wobble-horizontal.scss","../scss/effects/icons/_icon-wobble-vertical.scss","../scss/effects/icons/_icon-buzz.scss","../scss/effects/icons/_icon-buzz-out.scss","../scss/effects/curls/_curl-top-left.scss","../scss/effects/curls/_curl-top-right.scss","../scss/effects/curls/_curl-bottom-right.scss","../scss/effects/curls/_curl-bottom-left.scss"], +"names": [], +"file": "hover.css" +} diff --git a/assets/js/hover.jpg b/assets/js/hover.jpg new file mode 100644 index 0000000..ab02092 Binary files /dev/null and b/assets/js/hover.jpg differ diff --git a/assets/js/index.html b/assets/js/index.html new file mode 100644 index 0000000..2c377b7 --- /dev/null +++ b/assets/js/index.html @@ -0,0 +1,406 @@ + + + + + + + + Hover.css - A collection of CSS3 powered hover effects + + + + + + + + +
+ Fork me on GitHub + +

Hover.css v2

+ + + +

A collection of CSS3 powered hover effects to be applied to links, buttons, logos, SVG, featured images and so on. Easily apply to your own elements, modify or just use for inspiration. Available in CSS, Sass, and LESS.

+ +
+ Download on GitHub +
+ + + +
+
+ + + +
+ +

2D Transitions

+ + Grow + Shrink + Pulse + Pulse Grow + Pulse Shrink + Push + Pop + Bounce In + Bounce Out + Rotate + Grow Rotate + Float + Sink + Bob + Hang + Skew + Skew Forward + Skew Backward + Wobble Horizontal + Wobble Vertical + Wobble To Bottom Right + Wobble To Top Right + Wobble Top + Wobble Bottom + Wobble Skew + Buzz + Buzz Out + Forward + Backward + + +

Background Transitions

+ + Fade + Back Pulse + Sweep To Right + Sweep To Left + Sweep To Bottom + Sweep To Top + Bounce To Right + Bounce To Left + Bounce To Bottom + Bounce To Top + Radial Out + Radial In + Rectangle In + Rectangle Out + Shutter In Horizontal + Shutter Out Horizontal + Shutter In Vertical + Shutter Out Vertical + + +

Icons

+ + Demo font icons courtesy of FontAwesome. How to use icons with Hover.css. + + + Icon Back + + + Icon Forward + + + + Icon Down + + + Icon Up + + + Icon Spin + + + Icon Drop + + + Icon Fade + + + Icon Float Away + + + Icon Sink Away + + + Icon Grow + + + Icon Shrink + + + Icon Pulse + + + Icon Pulse Grow + + + Icon Pulse Shrink + + + Icon Push + + + Icon Pop + + + Icon Bounce + + + Icon Rotate + + + Icon Grow Rotate + + + Icon Float + + + Icon Sink + + + Icon Bob + + + Icon Hang + + + Icon Wobble Horizontal + + + Icon Wobble Vertical + + + Icon Buzz + + + Icon Buzz Out + + + +

Border Transitions

+ + Border Fade + Hollow + Trim + Ripple Out + Ripple In + Outline Out + Outline In + Round Corners + Underline From Left + Underline From Center + Underline From Right + Reveal + Underline Reveal + Overline Reveal + Overline From Left + Overline From Center + Overline From Right + + +

Shadow and Glow Transitions

+ + Shadow + Grow Shadow + Float Shadow + Glow + Shadow Radial + Box Shadow Outset + Box Shadow Inset + + +

Speech Bubbles

+ + Bubble Top + Bubble Right + Bubble Bottom + Bubble Left + Bubble Float Top + Bubble Float Right + Bubble Float Bottom + Bubble Float Left + + +

Curls

+ + Curl Top Left + Curl Top Right + Curl Bottom Right + Curl Bottom Left +
+ + +
+
+

About Hover.css

+ +

All Hover.css effects make use of a single element (with the help of some pseudo-elements where necessary), are self contained so you can easily copy and paste them, and come in CSS, Sass, and LESS flavours.

+ +

Many effects use CSS3 features such as transitions, transforms and animations. Old browsers that don't support these features may need some extra attention to be certain a fallback hover effect is still in place.

+ +
+

Licenses

+ +

Hover.css is made available under a free personal/open source or paid commercial licenses depending on your requirements. To compare licenses please visit the Ian Lunn Design Limited Store and purchase a commercial license.

+ +

Personal/Open Source

+ +

For personal/open source use, Hover.css is made available under a MIT license:

+ +
    +
  • Use in unlimited personal applications
    • +
  • Your application can't be sold
    • +
  • Your modifications remain open-source
    • +
  • Free updates
    • +
+ +

Read full license

+ +

Commercial

+ +

For commercial use, Hover.css is made available under Commercial, Extended Commercial, and OEM Commercial licenses.

+ +

Commercial License

+ +
    +
  • Use in 1 application
    • +
  • Sell your application once only (e.g. a website sold to a client)
    • +
  • Your code is kept proprietary, to yourself
    • +
  • Free updates to the major version
    • +
+ +

Purchase | Read full license

+ +

Extended Commercial License

+ +
    +
  • Use in unlimited applications
    • +
  • Sell your applications an unlimited number of times (e.g. a website template sold on a theme store)*
    • +
  • Your code is kept proprietary, to yourself
    • +
  • Free updates to the major version
    • +
+ +

*With the exception of applications that allow end users to produce separate applications. See the OEM Commercial License.

+ +

Purchase | Read full license

+ +
+ +
+
Hover.css
Commercial
License
+

For 1 Project

+
+ $14 + + + +
+
Hover.css
Extended Commercial
License
+

For Unlimited Projects

+
+ $18 + +
+ +

OEM Commercial License

+ +

Should your application enable end users to produce separate applications that incorporate Ian Lunn Design Limited's software, for example, a development toolkit, library, or application builder, you must obtain an OEM Commercial License. Please contact us for more information about the OEM Commercial License.

+ +

MIT License (Pre v2.2.0 / 24th March 2017)

+

Hover.css was previously made available under a MIT License for both commercial and non-commercial use. Anyone that obtained a MIT license for commercial use before v2.2.0 (24th March 2017) may continue to use Hover.css versions prior to v2.2.0 under that same license.

+ +

If you'd like to upgrade to v2.2.0 or above, or would like to simply show your support for Hover.css (we'd much appreciate it!), please purchase an up-to-date commercial license. Commercial License.

+ +
+

Hover.css is now available as an Eager App

+

Quickly and easily install Hover.css on your WordPress site or via an embed code with Eager app.

+
+
+ +
+

Like Hover.css? Try out my animation framework for sliders,
presentations, and other step-based applications

+ + + +
+ +
+
+ +
+ +
+ +

Made by
Ian Lunn - WordPress & Front-end Developer

+ + + Copyright © 2017 Ian Lunn Design Limited +
+ + + + + + + + diff --git a/assets/js/less/_hacks.less b/assets/js/less/_hacks.less new file mode 100644 index 0000000..723c9ae --- /dev/null +++ b/assets/js/less/_hacks.less @@ -0,0 +1,26 @@ +// As is often the case, some devices/browsers need additional code to get CSS to work +// in the most desired way. These mixins are used to quickly drop in hacks for each element +// Find out more here: https://github.com/IanLunn/Hover/wiki/Hacks-Explained + +.hardwareAccel() { + // Improve performance on mobile/tablet devices + // Perspective reduces blurryness of text in Chrome + .prefixed(transform, perspective(1px) translateZ(0)); +} + +.improveAntiAlias() { + // Improve aliasing on mobile/tablet devices + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} + +.forceBlockLevel() { + // Transforms need to be block-level to work + display: inline-block; + vertical-align: middle; +} + +.hacks() { + .forceBlockLevel(); + .hardwareAccel(); + .improveAntiAlias(); +} diff --git a/assets/js/less/_mixins.less b/assets/js/less/_mixins.less new file mode 100644 index 0000000..cc221c6 --- /dev/null +++ b/assets/js/less/_mixins.less @@ -0,0 +1,51 @@ +// prefix declarations +.prefixed(@property, @value) { + & when (@webkit = true) { + -webkit-@{property}: @value; + } + + & when (@moz = true) { + -moz-@{property}: @value; + } + + & when (@ms = true) { + -ms-@{property}: @value; + } + + & when (@o = true) { + -o-@{property}: @value; + } + + @{property}: @value; +} + +// prefix keyframes +.keyframes(@name; @content) { + & when (@webkit = true) { + @-webkit-keyframes @name { + @content(); + } + } + + & when (@moz = true) { + @-moz-keyframes @name { + @content(); + } + } + + & when (@ms = true) { + @-ms-keyframes @name { + @content(); + } + } + + & when (@o = true) { + @-o-keyframes @name { + @content(); + } + } + + @keyframes @name { + @content(); + } +} diff --git a/assets/js/less/_options.less b/assets/js/less/_options.less new file mode 100644 index 0000000..7af3490 --- /dev/null +++ b/assets/js/less/_options.less @@ -0,0 +1,43 @@ +// DEFAULT OPTIONS + +// Prefix for Hover class names +@nameSpace: hvr; + +// Durations +@fastDuration: .1s; +@mediumDuration: .3s; +@slowDuration: .5s; + +// Colors +@primaryColor: #e1e1e1; +@secondaryColor: #666; +@highlightColor: #ccc; +@activeColor: #2098D1; +@shadowColor: rgba(0, 0, 0, .6); + +// Speech bubbles options +@tipWidth: 10px; //the width of the speech bubble tip +@tipHeight: 10px; //the height of the speech bubble tip +@tipColor: @primaryColor; + +// Arrows options +@spaceBetweenTextAndArrows: 2.2em; + +// Curl dimensions +@curlWidth: 25px; +@curlHeight: 25px; + +// Curl colors +@revealAreaColor: white; // reveal area behind the curl +@curlLineColor: #aaa; // crease line +@curlTransitionColor: #ccc; // color transitioning from crease line to final color +@curlLastColor: white; // final color of the back of the curl + +// Browser Prefixes - Which CSS prefixes should be used? +@webkit: true; +@moz: false; +@ms: false; +@o: false; + +// Compile with or without classes +@includeClasses: true; diff --git a/assets/js/less/effects/2d-transitions/_backward.less b/assets/js/less/effects/2d-transitions/_backward.less new file mode 100644 index 0000000..639ab85 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_backward.less @@ -0,0 +1,12 @@ +/* Backward */ +.backward() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateX(-8px)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_bob.less b/assets/js/less/effects/2d-transitions/_bob.less new file mode 100644 index 0000000..682a88d --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_bob.less @@ -0,0 +1,34 @@ +/* Bob */ +.keyframes(~"@{nameSpace}-bob", { + 0% { + .prefixed(transform, translateY(-8px)); + } + 50% { + .prefixed(transform, translateY(-4px)); + } + 100% { + .prefixed(transform, translateY(-8px)); + } +}); + +.keyframes(~"@{nameSpace}-bob-float", { + 100% { + .prefixed(transform, translateY(-8px)); + } +}); + +.bob() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-bob-float, @{nameSpace}-bob"); + .prefixed(animation-duration, ~".3s, 1.5s"); + .prefixed(animation-delay, ~"0s, .3s"); + .prefixed(animation-timing-function, ~"ease-out, ease-in-out"); + .prefixed(animation-iteration-count, ~"1, infinite"); + .prefixed(animation-fill-mode, ~"forwards"); + .prefixed(animation-direction, ~"normal, alternate"); + } +} diff --git a/assets/js/less/effects/2d-transitions/_bounce-in.less b/assets/js/less/effects/2d-transitions/_bounce-in.less new file mode 100644 index 0000000..44240c6 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_bounce-in.less @@ -0,0 +1,12 @@ +/* Bounce In */ +.bounce-in() { + .hacks(); + .prefixed(transition-duration, @slowDuration); + + &:hover, + &:focus, + &:active { + .prefixed(transform, scale(1.2)); + .prefixed(transition-timing-function, cubic-bezier(.47,2.02,.31,-0.36)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_bounce-out.less b/assets/js/less/effects/2d-transitions/_bounce-out.less new file mode 100644 index 0000000..8a94179 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_bounce-out.less @@ -0,0 +1,12 @@ +/* Bounce Out */ +.bounce-out() { + .hacks(); + .prefixed(transition-duration, @slowDuration); + + &:hover, + &:focus, + &:active { + .prefixed(transform, scale(.8)); + .prefixed(transition-timing-function, cubic-bezier(.47,2.02,.31,-0.36)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_buzz-out.less b/assets/js/less/effects/2d-transitions/_buzz-out.less new file mode 100644 index 0000000..eed1f21 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_buzz-out.less @@ -0,0 +1,55 @@ +/* Buzz Out */ +.keyframes(~"@{nameSpace}-buzz-out", { + 10% { + .prefixed(transform, translateX(3px) rotate(2deg)); + } + + 20% { + .prefixed(transform, translateX(-3px) rotate(-2deg)); + } + + 30% { + .prefixed(transform, translateX(3px) rotate(2deg)); + } + + 40% { + .prefixed(transform, translateX(-3px) rotate(-2deg)); + } + + 50% { + .prefixed(transform, translateX(2px) rotate(1deg)); + } + + 60% { + .prefixed(transform, translateX(-2px) rotate(-1deg)); + } + + 70% { + .prefixed(transform, translateX(2px) rotate(1deg)); + } + + 80% { + .prefixed(transform, translateX(-2px) rotate(-1deg)); + } + + 90% { + .prefixed(transform, translateX(1px) rotate(0)); + } + + 100% { + .prefixed(transform, translateX(-1px) rotate(0)); + } +}); + +.buzz-out() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-buzz-out"); + .prefixed(animation-duration, .75s); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_buzz.less b/assets/js/less/effects/2d-transitions/_buzz.less new file mode 100644 index 0000000..adc0cf2 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_buzz.less @@ -0,0 +1,23 @@ +/* Buzz */ +.keyframes(~"@{nameSpace}-buzz", { + 50% { + .prefixed(transform, translateX(3px) rotate(2deg)); + } + + 100% { + .prefixed(transform, translateX(-3px) rotate(-2deg)); + } +}); + +.buzz() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-buzz"); + .prefixed(animation-duration, .15s); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + } +} diff --git a/assets/js/less/effects/2d-transitions/_float.less b/assets/js/less/effects/2d-transitions/_float.less new file mode 100644 index 0000000..42ed62b --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_float.less @@ -0,0 +1,13 @@ +/* Float */ +.float() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateY(-8px)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_forward.less b/assets/js/less/effects/2d-transitions/_forward.less new file mode 100644 index 0000000..b1d3f63 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_forward.less @@ -0,0 +1,12 @@ +/* Forward */ +.forward() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateX(8px)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_grow-rotate.less b/assets/js/less/effects/2d-transitions/_grow-rotate.less new file mode 100644 index 0000000..8ac97dd --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_grow-rotate.less @@ -0,0 +1,12 @@ +/* Grow Rotate */ +.grow-rotate() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + .prefixed(transform, scale(1.1) rotate(4deg)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_grow.less b/assets/js/less/effects/2d-transitions/_grow.less new file mode 100644 index 0000000..e4cc0b2 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_grow.less @@ -0,0 +1,12 @@ +/* Grow */ +.grow() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + .prefixed(transform, scale(1.1)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_hang.less b/assets/js/less/effects/2d-transitions/_hang.less new file mode 100644 index 0000000..8fe1a3b --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_hang.less @@ -0,0 +1,34 @@ +/* Hang */ +.keyframes(~"@{nameSpace}-hang", { + 0% { + .prefixed(transform, translateY(8px)); + } + 50% { + .prefixed(transform, translateY(4px)); + } + 100% { + .prefixed(transform, translateY(8px)); + } +}); + +.keyframes(~"@{nameSpace}-hang-sink", { + 100% { + .prefixed(transform, translateY(8px)); + } +}); + +.hang() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-hang-sink, @{nameSpace}-hang"); + .prefixed(animation-duration, ~".3s, 1.5s"); + .prefixed(animation-delay, ~"0s, .3s"); + .prefixed(animation-timing-function, ~"ease-out, ease-in-out"); + .prefixed(animation-iteration-count, ~"1, infinite"); + .prefixed(animation-fill-mode, ~"forwards"); + .prefixed(animation-direction, ~"normal, alternate"); + } +} diff --git a/assets/js/less/effects/2d-transitions/_pop.less b/assets/js/less/effects/2d-transitions/_pop.less new file mode 100644 index 0000000..a83385f --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_pop.less @@ -0,0 +1,19 @@ +/* Pop */ +.keyframes(~"@{nameSpace}-pop", { + 50% { + .prefixed(transform, scale(1.2)); + } +}); + +.pop() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-pop"); + .prefixed(animation-duration, @mediumDuration); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_pulse-grow.less b/assets/js/less/effects/2d-transitions/_pulse-grow.less new file mode 100644 index 0000000..9ad9cf3 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_pulse-grow.less @@ -0,0 +1,20 @@ +/* Pulse Grow */ +.keyframes(~"@{nameSpace}-pulse-grow", { + to { + .prefixed(transform, scale(1.1)); + } +}); + +.pulse-grow() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-pulse-grow"); + .prefixed(animation-duration, @mediumDuration); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + .prefixed(animation-direction, alternate); + } +} diff --git a/assets/js/less/effects/2d-transitions/_pulse-shrink.less b/assets/js/less/effects/2d-transitions/_pulse-shrink.less new file mode 100644 index 0000000..6490351 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_pulse-shrink.less @@ -0,0 +1,20 @@ +/* Pulse Shrink */ +.keyframes(~"@{nameSpace}-pulse-shrink", { + to { + .prefixed(transform, scale(.9)); + } +}); + +.pulse-shrink() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-pulse-shrink"); + .prefixed(animation-duration, @mediumDuration); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + .prefixed(animation-direction, alternate); + } +} diff --git a/assets/js/less/effects/2d-transitions/_pulse.less b/assets/js/less/effects/2d-transitions/_pulse.less new file mode 100644 index 0000000..f38bac3 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_pulse.less @@ -0,0 +1,23 @@ +/* Pulse */ +.keyframes(~"@{nameSpace}-pulse", { + 25% { + .prefixed(transform, scale(1.1)); + } + + 75% { + .prefixed(transform, scale(.9)); + } +}); + +.pulse() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-pulse"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + } +} diff --git a/assets/js/less/effects/2d-transitions/_push.less b/assets/js/less/effects/2d-transitions/_push.less new file mode 100644 index 0000000..6ecc07c --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_push.less @@ -0,0 +1,23 @@ +/* Push */ +.keyframes(~"@{nameSpace}-push", { + 50% { + .prefixed(transform, scale(.8)); + } + + 100% { + .prefixed(transform, scale(1)); + } +}); + +.push() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-push"); + .prefixed(animation-duration, .3s); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_rotate.less b/assets/js/less/effects/2d-transitions/_rotate.less new file mode 100644 index 0000000..d19e1da --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_rotate.less @@ -0,0 +1,12 @@ +/* Rotate */ +.rotate() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + .prefixed(transform, rotate(4deg)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_shrink.less b/assets/js/less/effects/2d-transitions/_shrink.less new file mode 100644 index 0000000..5571511 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_shrink.less @@ -0,0 +1,12 @@ +/* Shrink */ +.shrink() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + .prefixed(transform, scale(.9)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_sink.less b/assets/js/less/effects/2d-transitions/_sink.less new file mode 100644 index 0000000..b977d1f --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_sink.less @@ -0,0 +1,13 @@ +/* Sink */ +.sink() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateY(8px)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_skew-backward.less b/assets/js/less/effects/2d-transitions/_skew-backward.less new file mode 100644 index 0000000..0d7961f --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_skew-backward.less @@ -0,0 +1,13 @@ +/* Skew Backward */ +.skew-backward() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transform-origin, 0 100%); + + &:hover, + &:focus, + &:active { + .prefixed(transform, skew(10deg)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_skew-forward.less b/assets/js/less/effects/2d-transitions/_skew-forward.less new file mode 100644 index 0000000..abc402a --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_skew-forward.less @@ -0,0 +1,13 @@ +/* Skew Forward */ +.skew-forward() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transform-origin, 0 100%); + + &:hover, + &:focus, + &:active { + .prefixed(transform, skew(-10deg)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_skew.less b/assets/js/less/effects/2d-transitions/_skew.less new file mode 100644 index 0000000..e74bbfe --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_skew.less @@ -0,0 +1,12 @@ +/* Skew */ +.skew() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + .prefixed(transform, skew(-10deg)); + } +} diff --git a/assets/js/less/effects/2d-transitions/_wobble-bottom.less b/assets/js/less/effects/2d-transitions/_wobble-bottom.less new file mode 100644 index 0000000..5bf2bc2 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_wobble-bottom.less @@ -0,0 +1,40 @@ +/* Wobble Bottom */ +.keyframes(~"@{nameSpace}-wobble-bottom", { + 16.65% { + .prefixed(transform, skew(-12deg)); + } + + 33.3% { + .prefixed(transform, skew(10deg)); + } + + 49.95% { + .prefixed(transform, skew(-6deg)); + } + + 66.6% { + .prefixed(transform, skew(4deg)); + } + + 83.25% { + .prefixed(transform, skew(-2deg)); + } + + 100% { + .prefixed(transform, skew(0)); + } +}); + +.wobble-bottom() { + .hacks(); + .prefixed(transform-origin, 100% 0); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-wobble-bottom"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_wobble-horizontal.less b/assets/js/less/effects/2d-transitions/_wobble-horizontal.less new file mode 100644 index 0000000..7eb9f49 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_wobble-horizontal.less @@ -0,0 +1,39 @@ +/* Wobble Horizontal */ +.keyframes(~"@{nameSpace}-wobble-horizontal", { + 16.65% { + .prefixed(transform, translateX(8px)); + } + + 33.3% { + .prefixed(transform, translateX(-6px)); + } + + 49.95% { + .prefixed(transform, translateX(4px)); + } + + 66.6% { + .prefixed(transform, translateX(-2px)); + } + + 83.25% { + .prefixed(transform, translateX(1px)); + } + + 100% { + .prefixed(transform, translateX(0)); + } +}); + +.wobble-horizontal() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-wobble-horizontal"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_wobble-skew.less b/assets/js/less/effects/2d-transitions/_wobble-skew.less new file mode 100644 index 0000000..aba4908 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_wobble-skew.less @@ -0,0 +1,39 @@ +/* Wobble Skew */ +.keyframes(~"@{nameSpace}-wobble-skew", { + 16.65% { + .prefixed(transform, skew(-12deg)); + } + + 33.3% { + .prefixed(transform, skew(10deg)); + } + + 49.95% { + .prefixed(transform, skew(-6deg)); + } + + 66.6% { + .prefixed(transform, skew(4deg)); + } + + 83.25% { + .prefixed(transform, skew(-2deg)); + } + + 100% { + .prefixed(transform, skew(0)); + } +}); + +.wobble-skew() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-wobble-skew"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_wobble-to-bottom-right.less b/assets/js/less/effects/2d-transitions/_wobble-to-bottom-right.less new file mode 100644 index 0000000..bee13b7 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_wobble-to-bottom-right.less @@ -0,0 +1,39 @@ +/* Wobble To Bottom Right */ +.keyframes(~"@{nameSpace}-wobble-to-bottom-right", { + 16.65% { + .prefixed(transform, translate(8px, 8px)); + } + + 33.3% { + .prefixed(transform, translate(-6px, -6px)); + } + + 49.95% { + .prefixed(transform, translate(4px, 4px)); + } + + 66.6% { + .prefixed(transform, translate(-2px, -2px)); + } + + 83.25% { + .prefixed(transform, translate(1px, 1px)); + } + + 100% { + .prefixed(transform, translate(0, 0)); + } +}); + +.wobble-to-bottom-right() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-wobble-to-bottom-right"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_wobble-to-top-right.less b/assets/js/less/effects/2d-transitions/_wobble-to-top-right.less new file mode 100644 index 0000000..0d564d9 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_wobble-to-top-right.less @@ -0,0 +1,39 @@ +/* Wobble To Top Right */ +.keyframes(~"@{nameSpace}-wobble-to-top-right", { + 16.65% { + .prefixed(transform, translate(8px, -8px)); + } + + 33.3% { + .prefixed(transform, translate(-6px, 6px)); + } + + 49.95% { + .prefixed(transform, translate(4px, -4px)); + } + + 66.6% { + .prefixed(transform, translate(-2px, 2px)); + } + + 83.25% { + .prefixed(transform, translate(1px, -1px)); + } + + 100% { + .prefixed(transform, translate(0, 0)); + } +}); + +.wobble-to-top-right() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-wobble-to-top-right"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_wobble-top.less b/assets/js/less/effects/2d-transitions/_wobble-top.less new file mode 100644 index 0000000..659de9a --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_wobble-top.less @@ -0,0 +1,40 @@ +/* Wobble Top */ +.keyframes(~"@{nameSpace}-wobble-top", { + 16.65% { + .prefixed(transform, skew(-12deg)); + } + + 33.3% { + .prefixed(transform, skew(10deg)); + } + + 49.95% { + .prefixed(transform, skew(-6deg)); + } + + 66.6% { + .prefixed(transform, skew(4deg)); + } + + 83.25% { + .prefixed(transform, skew(-2deg)); + } + + 100% { + .prefixed(transform, skew(0)); + } +}); + +.wobble-top() { + .hacks(); + .prefixed(transform-origin, 0 100%); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-wobble-top"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/2d-transitions/_wobble-vertical.less b/assets/js/less/effects/2d-transitions/_wobble-vertical.less new file mode 100644 index 0000000..0be6df9 --- /dev/null +++ b/assets/js/less/effects/2d-transitions/_wobble-vertical.less @@ -0,0 +1,39 @@ +/* Wobble Vertical */ +.keyframes(~"@{nameSpace}-wobble-vertical", { + 16.65% { + .prefixed(transform, translateY(8px)); + } + + 33.3% { + .prefixed(transform, translateY(-6px)); + } + + 49.95% { + .prefixed(transform, translateY(4px)); + } + + 66.6% { + .prefixed(transform, translateY(-2px)); + } + + 83.25% { + .prefixed(transform, translateY(1px)); + } + + 100% { + .prefixed(transform, translateY(0)); + } +}); + +.wobble-vertical() { + .hacks(); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-wobble-vertical"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/less/effects/background-transitions/_back-pulse.less b/assets/js/less/effects/background-transitions/_back-pulse.less new file mode 100644 index 0000000..d45e496 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_back-pulse.less @@ -0,0 +1,26 @@ +/* Back Pulse */ +.keyframes(~"@{nameSpace}-back-pulse", { + 50% { + background-color: rgba(32, 152, 209, .75); + } +}); + +.back-pulse() { + .hacks(); + overflow: hidden; + .prefixed(transition-duration, @slowDuration); + .prefixed(transition-property, "color, background-color"); + + &:hover, + &:focus, + &:active { + .prefixed(animation-name, ~"@{nameSpace}-back-pulse"); + .prefixed(animation-duration, 1s); + .prefixed(animation-delay, @slowDuration); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + background-color: @activeColor; + background-color: rgba(32, 152, 209, 1); + color: white; + } +} diff --git a/assets/js/less/effects/background-transitions/_bounce-to-bottom.less b/assets/js/less/effects/background-transitions/_bounce-to-bottom.less new file mode 100644 index 0000000..b0ef2bb --- /dev/null +++ b/assets/js/less/effects/background-transitions/_bounce-to-bottom.less @@ -0,0 +1,34 @@ +/* Bounce To Bottom */ +.bounce-to-bottom() { + .hacks(); + position: relative; + .prefixed(transition-property, color); + .prefixed(transition-duration, @slowDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scaleY(0)); + .prefixed(transform-origin, 50% 0); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @slowDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleY(1)); + .prefixed(transition-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_bounce-to-left.less b/assets/js/less/effects/background-transitions/_bounce-to-left.less new file mode 100644 index 0000000..ad48ee6 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_bounce-to-left.less @@ -0,0 +1,34 @@ +/* Bounce To Left */ +.bounce-to-left() { + .hacks(); + position: relative; + .prefixed(transition-property, color); + .prefixed(transition-duration, @slowDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scaleX(0)); + .prefixed(transform-origin, 100% 50%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @slowDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleX(1)); + .prefixed(transition-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_bounce-to-right.less b/assets/js/less/effects/background-transitions/_bounce-to-right.less new file mode 100644 index 0000000..9785754 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_bounce-to-right.less @@ -0,0 +1,34 @@ +/* Bounce To Right */ +.bounce-to-right() { + .hacks(); + position: relative; + .prefixed(transition-property, color); + .prefixed(transition-duration, @slowDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scaleX(0)); + .prefixed(transform-origin, 0 50%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @slowDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleX(1)); + .prefixed(transition-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_bounce-to-top.less b/assets/js/less/effects/background-transitions/_bounce-to-top.less new file mode 100644 index 0000000..4d64bf1 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_bounce-to-top.less @@ -0,0 +1,34 @@ +/* Bounce To Top */ +.bounce-to-top() { + .hacks(); + position: relative; + .prefixed(transition-property, color); + .prefixed(transition-duration, @slowDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scaleY(0)); + .prefixed(transform-origin, 50% 100%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @slowDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleY(1)); + .prefixed(transition-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_fade.less b/assets/js/less/effects/background-transitions/_fade.less new file mode 100644 index 0000000..7a92ac1 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_fade.less @@ -0,0 +1,14 @@ +/* Fade */ +.fade() { + .hacks(); + overflow: hidden; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, ~"color, background-color"); + + &:hover, + &:focus, + &:active { + background-color: @activeColor; + color: white; + } +} diff --git a/assets/js/less/effects/background-transitions/_radial-in.less b/assets/js/less/effects/background-transitions/_radial-in.less new file mode 100644 index 0000000..c59348e --- /dev/null +++ b/assets/js/less/effects/background-transitions/_radial-in.less @@ -0,0 +1,35 @@ +/* Radial In */ +.radial-in() { + .hacks(); + position: relative; + overflow: hidden; + background: @activeColor; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @primaryColor; + border-radius: 100%; + .prefixed(transform, scale(2)); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scale(0)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_radial-out.less b/assets/js/less/effects/background-transitions/_radial-out.less new file mode 100644 index 0000000..43daa24 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_radial-out.less @@ -0,0 +1,35 @@ +/* Radial Out */ +.radial-out() { + .hacks(); + position: relative; + overflow: hidden; + background: @primaryColor; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + border-radius: 100%; + .prefixed(transform, scale(0)); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scale(2)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_rectangle-in.less b/assets/js/less/effects/background-transitions/_rectangle-in.less new file mode 100644 index 0000000..a2b1114 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_rectangle-in.less @@ -0,0 +1,33 @@ +/* Rectangle In */ +.rectangle-in() { + .hacks(); + position: relative; + background: @activeColor; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @primaryColor; + .prefixed(transform, scale(1)); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scale(0)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_rectangle-out.less b/assets/js/less/effects/background-transitions/_rectangle-out.less new file mode 100644 index 0000000..dce554a --- /dev/null +++ b/assets/js/less/effects/background-transitions/_rectangle-out.less @@ -0,0 +1,33 @@ +/* Rectangle Out */ +.rectangle-out() { + .hacks(); + position: relative; + background: @primaryColor; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scale(0)); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scale(1)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_shutter-in-horizontal.less b/assets/js/less/effects/background-transitions/_shutter-in-horizontal.less new file mode 100644 index 0000000..461f813 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_shutter-in-horizontal.less @@ -0,0 +1,34 @@ +/* Shutter In Horizontal */ +.shutter-in-horizontal() { + .hacks(); + position: relative; + background: @activeColor; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: @primaryColor; + .prefixed(transform, scaleX(1)); + .prefixed(transform-origin, 50%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleX(0)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_shutter-in-vertical.less b/assets/js/less/effects/background-transitions/_shutter-in-vertical.less new file mode 100644 index 0000000..96f85e5 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_shutter-in-vertical.less @@ -0,0 +1,34 @@ +/* Shutter In Vertical */ +.shutter-in-vertical() { + .hacks(); + position: relative; + background: @activeColor; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: @primaryColor; + .prefixed(transform, scaleY(1)); + .prefixed(transform-origin, 50%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleY(0)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_shutter-out-horizontal.less b/assets/js/less/effects/background-transitions/_shutter-out-horizontal.less new file mode 100644 index 0000000..f97e9ad --- /dev/null +++ b/assets/js/less/effects/background-transitions/_shutter-out-horizontal.less @@ -0,0 +1,34 @@ +/* Shutter Out Horizontal */ +.shutter-out-horizontal() { + .hacks(); + position: relative; + background: @primaryColor; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: @activeColor; + .prefixed(transform, scaleX(0)); + .prefixed(transform-origin, 50%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleX(1)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_shutter-out-vertical.less b/assets/js/less/effects/background-transitions/_shutter-out-vertical.less new file mode 100644 index 0000000..1233a21 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_shutter-out-vertical.less @@ -0,0 +1,34 @@ +/* Shutter Out Vertical */ +.shutter-out-vertical() { + .hacks(); + position: relative; + background: @primaryColor; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: @activeColor; + .prefixed(transform, scaleY(0)); + .prefixed(transform-origin, 50%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleY(1)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_sweep-to-bottom.less b/assets/js/less/effects/background-transitions/_sweep-to-bottom.less new file mode 100644 index 0000000..df862a4 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_sweep-to-bottom.less @@ -0,0 +1,33 @@ +/* Sweep To Bottom */ +.sweep-to-bottom() { + .hacks(); + position: relative; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scaleY(0)); + .prefixed(transform-origin, 50% 0); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleY(1)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_sweep-to-left.less b/assets/js/less/effects/background-transitions/_sweep-to-left.less new file mode 100644 index 0000000..9db0b32 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_sweep-to-left.less @@ -0,0 +1,33 @@ +/* Sweep To Left */ +.sweep-to-left() { + .hacks(); + position: relative; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scaleX(0)); + .prefixed(transform-origin, 100% 50%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleX(1)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_sweep-to-right.less b/assets/js/less/effects/background-transitions/_sweep-to-right.less new file mode 100644 index 0000000..21160b4 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_sweep-to-right.less @@ -0,0 +1,33 @@ +/* Sweep To Right */ +.sweep-to-right() { + .hacks(); + position: relative; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scaleX(0)); + .prefixed(transform-origin, 0 50%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleX(1)); + } + } +} diff --git a/assets/js/less/effects/background-transitions/_sweep-to-top.less b/assets/js/less/effects/background-transitions/_sweep-to-top.less new file mode 100644 index 0000000..53da5e8 --- /dev/null +++ b/assets/js/less/effects/background-transitions/_sweep-to-top.less @@ -0,0 +1,33 @@ +/* Sweep To Top */ +.sweep-to-top() { + .hacks(); + position: relative; + .prefixed(transition-property, color); + .prefixed(transition-duration, @mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + .prefixed(transform, scaleY(0)); + .prefixed(transform-origin, 50% 100%); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + .prefixed(transform, scaleY(1)); + } + } +} diff --git a/assets/js/less/effects/border-transitions/_border-fade.less b/assets/js/less/effects/border-transitions/_border-fade.less new file mode 100644 index 0000000..de8efb1 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_border-fade.less @@ -0,0 +1,19 @@ +/* Border Fade */ +.border-fade() { + @borderWidth: 4px; + + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, box-shadow); + box-shadow: + inset 0 0 0 @borderWidth @primaryColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + + &:hover, + &:focus, + &:active { + box-shadow: + inset 0 0 0 @borderWidth @activeColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + } +} diff --git a/assets/js/less/effects/border-transitions/_hollow.less b/assets/js/less/effects/border-transitions/_hollow.less new file mode 100644 index 0000000..4138f2d --- /dev/null +++ b/assets/js/less/effects/border-transitions/_hollow.less @@ -0,0 +1,17 @@ +/* Hollow */ +.hollow() { + @borderWidth: 4px; + + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, background); + box-shadow: + inset 0 0 0 @borderWidth @primaryColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + + &:hover, + &:focus, + &:active { + background: none; + } +} diff --git a/assets/js/less/effects/border-transitions/_outline-in.less b/assets/js/less/effects/border-transitions/_outline-in.less new file mode 100644 index 0000000..938603f --- /dev/null +++ b/assets/js/less/effects/border-transitions/_outline-in.less @@ -0,0 +1,32 @@ +/* Outline In */ +.outline-in() { + @outerBorderWidth: 4px; + @innerBorderWidth: 4px; + + .hacks(); + position: relative; + + &:before { + pointer-events: none; + content: ''; + position: absolute; + border: @primaryColor solid @outerBorderWidth; + top: -(@outerBorderWidth + @innerBorderWidth) * 2; + right: -(@outerBorderWidth + @innerBorderWidth) * 2; + bottom: -(@outerBorderWidth + @innerBorderWidth) * 2; + left: -(@outerBorderWidth + @innerBorderWidth) * 2; + opacity: 0; + .prefixed(transition-duration, .3s); + .prefixed(transition-property, "top, right, bottom, left"); + } + + &:hover:before, + &:focus:before, + &:active:before { + top: -(@outerBorderWidth + @innerBorderWidth); + right: -(@outerBorderWidth + @innerBorderWidth); + bottom: -(@outerBorderWidth + @innerBorderWidth); + left: -(@outerBorderWidth + @innerBorderWidth); + opacity: 1; + } +} diff --git a/assets/js/less/effects/border-transitions/_outline-out.less b/assets/js/less/effects/border-transitions/_outline-out.less new file mode 100644 index 0000000..73ddd44 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_outline-out.less @@ -0,0 +1,29 @@ +/* Outline Out */ +.outline-out() { + @outerBorderWidth: 4px; + @innerBorderWidth: 4px; + + .hacks(); + position: relative; + + &:before { + content: ''; + position: absolute; + border: @primaryColor solid @outerBorderWidth; + top: 0; + right: 0; + bottom: 0; + left: 0; + .prefixed(transition-duration, .3s); + .prefixed(transition-property, "top, right, bottom, left"); + } + + &:hover:before, + &:focus:before, + &:active:before { + top: -(@outerBorderWidth + @innerBorderWidth); + right: -(@outerBorderWidth + @innerBorderWidth); + bottom: -(@outerBorderWidth + @innerBorderWidth); + left: -(@outerBorderWidth + @innerBorderWidth); + } +} diff --git a/assets/js/less/effects/border-transitions/_overline-from-center.less b/assets/js/less/effects/border-transitions/_overline-from-center.less new file mode 100644 index 0000000..7cdc753 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_overline-from-center.less @@ -0,0 +1,32 @@ +/* Overline From Center */ +.overline-from-center() { + @duration: @mediumDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 51%; + right: 51%; + top: 0; + background: @activeColor; + height: 4px; + .prefixed(transition-property, "left, right"); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + left: 0; + right: 0; + } + } +} diff --git a/assets/js/less/effects/border-transitions/_overline-from-left.less b/assets/js/less/effects/border-transitions/_overline-from-left.less new file mode 100644 index 0000000..b12a2f0 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_overline-from-left.less @@ -0,0 +1,31 @@ +/* Overline From Left */ +.overline-from-left() { + @duration: @mediumDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 100%; + top: 0; + background: @activeColor; + height: 4px; + .prefixed(transition-property, "right"); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + right: 0; + } + } +} diff --git a/assets/js/less/effects/border-transitions/_overline-from-right.less b/assets/js/less/effects/border-transitions/_overline-from-right.less new file mode 100644 index 0000000..0f44923 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_overline-from-right.less @@ -0,0 +1,31 @@ +/* Overline From Right */ +.overline-from-right() { + @duration: @mediumDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 100%; + right: 0; + top: 0; + background: @activeColor; + height: 4px; + .prefixed(transition-property, "left"); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + left: 0; + } + } +} diff --git a/assets/js/less/effects/border-transitions/_overline-reveal.less b/assets/js/less/effects/border-transitions/_overline-reveal.less new file mode 100644 index 0000000..b8680a9 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_overline-reveal.less @@ -0,0 +1,32 @@ +/* Overline Reveal */ +.overline-reveal() { + @duration: @mediumDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + top: 0; + background: @activeColor; + height: 4px; + .prefixed(transform, translateY(-4px)); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + .prefixed(transform, translateY(0)); + } + } +} diff --git a/assets/js/less/effects/border-transitions/_reveal.less b/assets/js/less/effects/border-transitions/_reveal.less new file mode 100644 index 0000000..84dca74 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_reveal.less @@ -0,0 +1,34 @@ +/* Reveal */ +.reveal() { + @duration: @fastDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + top: 0; + bottom: 0; + border-color: @activeColor; + border-style: solid; + border-width: 0; + .prefixed(transition-property, border-width); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + .prefixed(transform, translateY(0)); + border-width: 4px; + } + } +} diff --git a/assets/js/less/effects/border-transitions/_ripple-in.less b/assets/js/less/effects/border-transitions/_ripple-in.less new file mode 100644 index 0000000..eac791b --- /dev/null +++ b/assets/js/less/effects/border-transitions/_ripple-in.less @@ -0,0 +1,36 @@ +/* Ripple In */ +.keyframes(~"@{nameSpace}-ripple-in", { + 100% { + top: 0; + right: 0; + bottom: 0; + left: 0; + opacity: 1; + } +}); + +.ripple-in() { + @outerBorderWidth: 4px; + @innerBorderWidth: 4px; + + .hacks(); + position: relative; + + &:before { + content: ''; + position: absolute; + border: @primaryColor solid @outerBorderWidth; + top: -(6px + 6px); + right: -(6px + 6px); + bottom: -(6px + 6px); + left: -(6px + 6px); + opacity: 0; + .prefixed(animation-duration, 1s); + } + + &:hover:before, + &:focus:before, + &:active:before { + .prefixed(animation-name, ~"@{nameSpace}-ripple-in"); + } +} diff --git a/assets/js/less/effects/border-transitions/_ripple-out.less b/assets/js/less/effects/border-transitions/_ripple-out.less new file mode 100644 index 0000000..bd94248 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_ripple-out.less @@ -0,0 +1,35 @@ +/* Ripple Out */ +.keyframes(~"@{nameSpace}-ripple-out", { + 100% { + top: -(6px + 6px); + right: -(6px + 6px); + bottom: -(6px + 6px); + left: -(6px + 6px); + opacity: 0; + } +}); + +.ripple-out() { + @outerBorderWidth: 6px; + @innerBorderWidth: 6px; + + .hacks(); + position: relative; + + &:before { + content: ''; + position: absolute; + border: @primaryColor solid @outerBorderWidth; + top: 0; + right: 0; + bottom: 0; + left: 0; + .prefixed(animation-duration, 1s); + } + + &:hover:before, + &:focus:before, + &:active:before { + .prefixed(animation-name, ~"@{nameSpace}-ripple-out"); + } +} diff --git a/assets/js/less/effects/border-transitions/_round-corners.less b/assets/js/less/effects/border-transitions/_round-corners.less new file mode 100644 index 0000000..ab26854 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_round-corners.less @@ -0,0 +1,12 @@ +/* Round Corners */ +.round-corners() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, border-radius); + + &:hover, + &:focus, + &:active { + border-radius: 1em; + } +} diff --git a/assets/js/less/effects/border-transitions/_trim.less b/assets/js/less/effects/border-transitions/_trim.less new file mode 100644 index 0000000..14b6d2f --- /dev/null +++ b/assets/js/less/effects/border-transitions/_trim.less @@ -0,0 +1,27 @@ +/* Trim */ +.trim() { + @outerBorderWidth: 4px; + @innerBorderWidth: 4px; + + .hacks(); + position: relative; + + &:before { + content: ''; + position: absolute; + border: white solid @innerBorderWidth; + top: @outerBorderWidth; + left: @outerBorderWidth; + right: @outerBorderWidth; + bottom: @outerBorderWidth; + opacity: 0; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, opacity); + } + + &:hover:before, + &:focus:before, + &:active:before { + opacity: 1; + } +} diff --git a/assets/js/less/effects/border-transitions/_underline-from-center.less b/assets/js/less/effects/border-transitions/_underline-from-center.less new file mode 100644 index 0000000..9a9a414 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_underline-from-center.less @@ -0,0 +1,32 @@ +/* Underline From Center */ +.underline-from-center() { + @duration: @mediumDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 51%; + right: 51%; + bottom: 0; + background: @activeColor; + height: 4px; + .prefixed(transition-property, "left, right"); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + left: 0; + right: 0; + } + } +} diff --git a/assets/js/less/effects/border-transitions/_underline-from-left.less b/assets/js/less/effects/border-transitions/_underline-from-left.less new file mode 100644 index 0000000..378772c --- /dev/null +++ b/assets/js/less/effects/border-transitions/_underline-from-left.less @@ -0,0 +1,31 @@ +/* Underline From Left */ +.underline-from-left() { + @duration: @mediumDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 100%; + bottom: 0; + background: @activeColor; + height: 4px; + .prefixed(transition-property, "right"); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + right: 0; + } + } +} diff --git a/assets/js/less/effects/border-transitions/_underline-from-right.less b/assets/js/less/effects/border-transitions/_underline-from-right.less new file mode 100644 index 0000000..5d4a0d8 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_underline-from-right.less @@ -0,0 +1,31 @@ +/* Underline From Right */ +.underline-from-right() { + @duration: @mediumDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 100%; + right: 0; + bottom: 0; + background: @activeColor; + height: 4px; + .prefixed(transition-property, "left"); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + left: 0; + } + } +} diff --git a/assets/js/less/effects/border-transitions/_underline-reveal.less b/assets/js/less/effects/border-transitions/_underline-reveal.less new file mode 100644 index 0000000..f0287a5 --- /dev/null +++ b/assets/js/less/effects/border-transitions/_underline-reveal.less @@ -0,0 +1,32 @@ +/* Underline Reveal */ +.underline-reveal() { + @duration: @mediumDuration; + + .hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + bottom: 0; + background: @activeColor; + height: 4px; + .prefixed(transform, translateY(4px)); + .prefixed(transition-property, transform); + .prefixed(transition-duration, @duration); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + .prefixed(transform, translateY(0)); + } + } +} diff --git a/assets/js/less/effects/curls/_curl-bottom-left.less b/assets/js/less/effects/curls/_curl-bottom-left.less new file mode 100644 index 0000000..6f7e4cd --- /dev/null +++ b/assets/js/less/effects/curls/_curl-bottom-left.less @@ -0,0 +1,33 @@ +/* Curl Bottom Left */ +.curl-bottom-left() { + .hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + bottom: 0; + left: 0; + background: @revealAreaColor; /* IE9 */ + background: linear-gradient( + 45deg, + @revealAreaColor 45%, + @curlLineColor 50%, + @curlTransitionColor 56%, + @curlLastColor 80% + ); + box-shadow: 1px -1px 1px rgba(0, 0, 0, .4); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, ~"width, height"); + } + + &:hover:before, + &:focus:before, + &:active:before { + width: @curlWidth; + height: @curlHeight; + } +} diff --git a/assets/js/less/effects/curls/_curl-bottom-right.less b/assets/js/less/effects/curls/_curl-bottom-right.less new file mode 100644 index 0000000..5441fdc --- /dev/null +++ b/assets/js/less/effects/curls/_curl-bottom-right.less @@ -0,0 +1,33 @@ +/* Curl Bottom Right */ +.curl-bottom-right() { + .hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + bottom: 0; + right: 0; + background: @revealAreaColor; /* IE9 */ + background: linear-gradient( + 315deg, + @revealAreaColor 45%, + @curlLineColor 50%, + @curlTransitionColor 56%, + @curlLastColor 80% + ); + box-shadow: -1px -1px 1px rgba(0, 0, 0, .4); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, ~"width, height"); + } + + &:hover:before, + &:focus:before, + &:active:before { + width: @curlWidth; + height: @curlHeight; + } +} diff --git a/assets/js/less/effects/curls/_curl-top-left.less b/assets/js/less/effects/curls/_curl-top-left.less new file mode 100644 index 0000000..1531b55 --- /dev/null +++ b/assets/js/less/effects/curls/_curl-top-left.less @@ -0,0 +1,36 @@ +/* Curl Top Left */ +.curl-top-left() { + .hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + top: 0; + left: 0; + background: @revealAreaColor; /* IE9 */ + background: linear-gradient( + 135deg, + @revealAreaColor 45%, + @curlLineColor 50%, + @curlTransitionColor 56%, + @curlLastColor 80% + ); + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#000000');/*For IE7-8-9*/ + + z-index: 1000; + box-shadow: 1px 1px 1px rgba(0, 0, 0, .4); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, ~"width, height"); + } + + &:hover:before, + &:focus:before, + &:active:before { + width: @curlWidth; + height: @curlHeight; + } +} diff --git a/assets/js/less/effects/curls/_curl-top-right.less b/assets/js/less/effects/curls/_curl-top-right.less new file mode 100644 index 0000000..213a45e --- /dev/null +++ b/assets/js/less/effects/curls/_curl-top-right.less @@ -0,0 +1,33 @@ +/* Curl Top Right */ +.curl-top-right() { + .hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + top: 0; + right: 0; + background: @revealAreaColor; /* IE9 */ + background: linear-gradient( + 225deg, + @revealAreaColor 45%, + @curlLineColor 50%, + @curlTransitionColor 56%, + @curlLastColor 80% + ); + box-shadow: -1px 1px 1px rgba(0, 0, 0, .4); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, ~"width, height"); + } + + &:hover:before, + &:focus:before, + &:active:before { + width: @curlWidth; + height: @curlHeight; + } +} diff --git a/assets/js/less/effects/icons/_icon-back.less b/assets/js/less/effects/icons/_icon-back.less new file mode 100644 index 0000000..9278719 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-back.less @@ -0,0 +1,21 @@ +/* Icon Back */ +.icon-back() { + .hacks(); + .prefixed(transition-duration, @fastDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @fastDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, translateX(-4px)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-bob.less b/assets/js/less/effects/icons/_icon-bob.less new file mode 100644 index 0000000..f3a3b05 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-bob.less @@ -0,0 +1,42 @@ +/* Icon Bob */ +.keyframes(~"@{nameSpace}-icon-bob", { + 0% { + .prefixed(transform, translateY(-6px)); + } + 50% { + .prefixed(transform, translateY(-2px)); + } + 100% { + .prefixed(transform, translateY(-6px)); + } +}); + +.keyframes(~"@{nameSpace}-icon-bob-float", { + 100% { + .prefixed(transform, translateY(-6px)); + } +}); + +.icon-bob() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-bob-float, @{nameSpace}-icon-bob"); + .prefixed(animation-duration, ~".3s, 1.5s"); + .prefixed(animation-delay, ~"0s, .3s"); + .prefixed(animation-timing-function, ~"ease-out, ease-in-out"); + .prefixed(animation-iteration-count, ~"1, infinite"); + .prefixed(animation-fill-mode, ~"forwards"); + .prefixed(animation-direction, ~"normal, alternate"); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-bounce-out.less b/assets/js/less/effects/icons/_icon-bounce-out.less new file mode 100644 index 0000000..9049b46 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-bounce-out.less @@ -0,0 +1,28 @@ +/* Icon Bounce Out */ +.keyframes(~"@{nameSpace}-icon-bounce-out", { + 50% { + .prefixed(transform, scale(1.5)); + } +}); + +.icon-bounce-out() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, scale(.9)); + .prefixed(transition-timing-function, cubic-bezier(.47,2.02,.31,-0.36)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-bounce.less b/assets/js/less/effects/icons/_icon-bounce.less new file mode 100644 index 0000000..87ed025 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-bounce.less @@ -0,0 +1,23 @@ +/* Icon Bounce */ + +.icon-bounce() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, scale(1.5)); + .prefixed(transition-timing-function, cubic-bezier(.47,2.02,.31,-0.36)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-buzz-out.less b/assets/js/less/effects/icons/_icon-buzz-out.less new file mode 100644 index 0000000..b9f41b9 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-buzz-out.less @@ -0,0 +1,63 @@ +/* Icon Buzz Out */ +.keyframes(~"@{nameSpace}-icon-buzz-out", { + 10% { + .prefixed(transform, translateX(3px) rotate(2deg)); + } + + 20% { + .prefixed(transform, translateX(-3px) rotate(-2deg)); + } + + 30% { + .prefixed(transform, translateX(3px) rotate(2deg)); + } + + 40% { + .prefixed(transform, translateX(-3px) rotate(-2deg)); + } + + 50% { + .prefixed(transform, translateX(2px) rotate(1deg)); + } + + 60% { + .prefixed(transform, translateX(-2px) rotate(-1deg)); + } + + 70% { + .prefixed(transform, translateX(2px) rotate(1deg)); + } + + 80% { + .prefixed(transform, translateX(-2px) rotate(-1deg)); + } + + 90% { + .prefixed(transform, translateX(1px) rotate(0)); + } + + 100% { + .prefixed(transform, translateX(-1px) rotate(0)); + } +}); + +.icon-buzz-out() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-buzz-out"); + .prefixed(animation-duration, .75s); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-buzz.less b/assets/js/less/effects/icons/_icon-buzz.less new file mode 100644 index 0000000..0236264 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-buzz.less @@ -0,0 +1,31 @@ +/* Icon Buzz */ +.keyframes(~"@{nameSpace}-icon-buzz", { + 50% { + .prefixed(transform, translateX(3px) rotate(2deg)); + } + + 100% { + .prefixed(transform, translateX(-3px) rotate(-2deg)); + } +}); + +.icon-buzz() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-buzz"); + .prefixed(animation-duration, .15s); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-down.less b/assets/js/less/effects/icons/_icon-down.less new file mode 100644 index 0000000..400c2a9 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-down.less @@ -0,0 +1,32 @@ +/* Icon Down */ +.keyframes(~"@{nameSpace}-icon-down", { + 0%, + 50%, + 100% { + .prefixed(transform, translateY(0)); + } + 25%, + 75% { + .prefixed(transform, translateY(6px)); + } +}); + +/* Icon Down */ +.icon-down() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-down"); + .prefixed(animation-duration, .75s); + .prefixed(animation-timing-function, ease-out); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-drop.less b/assets/js/less/effects/icons/_icon-drop.less new file mode 100644 index 0000000..77e0002 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-drop.less @@ -0,0 +1,42 @@ +/* Icon Drop */ +.keyframes(~"@{nameSpace}-icon-drop", { + 0% { + opacity: 0; + + } + + 50% { + opacity: 0; + .prefixed(transform, translateY(-100%)); + } + + 51%, + 100% { + opacity: 1; + } +}); + +/* Icon Drop */ +.icon-drop() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + opacity: 0; + .prefixed(transition-duration, @mediumDuration); + .prefixed(animation-name, ~"@{nameSpace}-icon-drop"); + .prefixed(animation-duration, @slowDuration); + .prefixed(animation-delay, @mediumDuration); + .prefixed(animation-fill-mode, forwards); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-fade.less b/assets/js/less/effects/icons/_icon-fade.less new file mode 100644 index 0000000..30cdf3f --- /dev/null +++ b/assets/js/less/effects/icons/_icon-fade.less @@ -0,0 +1,19 @@ +/* Icon Fade */ +.icon-fade() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, .5s); + .prefixed(transition-property, color); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + color: #0F9E5E; + } + } +} diff --git a/assets/js/less/effects/icons/_icon-float-away.less b/assets/js/less/effects/icons/_icon-float-away.less new file mode 100644 index 0000000..9a5472f --- /dev/null +++ b/assets/js/less/effects/icons/_icon-float-away.less @@ -0,0 +1,32 @@ +/* Icon Float Away */ +.keyframes(~"@{nameSpace}-icon-float-away", { + 0% { + opacity: 1; + } + + 100% { + opacity: 0; + .prefixed(transform, translateY(-1em)); + } +}); + +/* Icon Float Away */ +.icon-float-away() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(animation-duration, @slowDuration); + .prefixed(animation-fill-mode, forwards); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-float-away"); + .prefixed(animation-timing-function, ease-out); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-float.less b/assets/js/less/effects/icons/_icon-float.less new file mode 100644 index 0000000..f45c16f --- /dev/null +++ b/assets/js/less/effects/icons/_icon-float.less @@ -0,0 +1,21 @@ +/* Icon Float */ +.icon-float() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, translateY(-4px)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-forward.less b/assets/js/less/effects/icons/_icon-forward.less new file mode 100644 index 0000000..5854aff --- /dev/null +++ b/assets/js/less/effects/icons/_icon-forward.less @@ -0,0 +1,21 @@ +/* Icon Forward */ +.icon-forward() { + .hacks(); + .prefixed(transition-duration, @fastDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @fastDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, translateX(4px)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-grow-rotate.less b/assets/js/less/effects/icons/_icon-grow-rotate.less new file mode 100644 index 0000000..5c135a6 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-grow-rotate.less @@ -0,0 +1,23 @@ +/* Icon Grow Rotate */ +.icon-grow-rotate() { + @duration: @mediumDuration; + + .hacks(); + .prefixed(transition-duration, @duration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @duration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, scale(1.5) rotate(12deg)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-grow.less b/assets/js/less/effects/icons/_icon-grow.less new file mode 100644 index 0000000..473b5a6 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-grow.less @@ -0,0 +1,21 @@ +/* Icon Grow */ +.icon-grow() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, scale(1.3) translateZ(0)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-hang.less b/assets/js/less/effects/icons/_icon-hang.less new file mode 100644 index 0000000..36aa7e2 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-hang.less @@ -0,0 +1,42 @@ +/* Icon Hang */ +.keyframes(~"@{nameSpace}-icon-hang", { + 0% { + .prefixed(transform, translateY(6px)); + } + 50% { + .prefixed(transform, translateY(2px)); + } + 100% { + .prefixed(transform, translateY(6px)); + } +}); + +.keyframes(~"@{nameSpace}-icon-hang-sink", { + 100% { + .prefixed(transform, translateY(6px)); + } +}); + +.icon-hang() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-hang-sink, @{nameSpace}-icon-hang"); + .prefixed(animation-duration, ~".3s, 1.5s"); + .prefixed(animation-delay, ~"0s, .3s"); + .prefixed(animation-timing-function, ~"ease-out, ease-in-out"); + .prefixed(animation-iteration-count, ~"1, infinite"); + .prefixed(animation-fill-mode, ~"forwards"); + .prefixed(animation-direction, ~"normal, alternate"); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-pop.less b/assets/js/less/effects/icons/_icon-pop.less new file mode 100644 index 0000000..10f6c7b --- /dev/null +++ b/assets/js/less/effects/icons/_icon-pop.less @@ -0,0 +1,30 @@ +/* Icon Pop */ +.keyframes(~"@{nameSpace}-icon-pop", { + 50% { + .prefixed(transform, scale(1.5)); + } +}); + +.icon-pop() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-pop"); + .prefixed(animation-duration, @mediumDuration); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-pulse-grow.less b/assets/js/less/effects/icons/_icon-pulse-grow.less new file mode 100644 index 0000000..b2d81f8 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-pulse-grow.less @@ -0,0 +1,28 @@ +/* Icon Pulse Grow */ +.keyframes(~"@{nameSpace}-icon-pulse-grow", { + to { + .prefixed(transform, scale(1.3)); + } +}); + +.icon-pulse-grow() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-pulse-grow"); + .prefixed(animation-duration, @mediumDuration); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + .prefixed(animation-direction, alternate); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-pulse-shrink.less b/assets/js/less/effects/icons/_icon-pulse-shrink.less new file mode 100644 index 0000000..08f6f13 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-pulse-shrink.less @@ -0,0 +1,28 @@ +/* Icon Pulse Shrink */ +.keyframes(~"@{nameSpace}-icon-pulse-shrink", { + to { + .prefixed(transform, scale(.8)); + } +}); + +.icon-pulse-shrink() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-pulse-shrink"); + .prefixed(animation-duration, @mediumDuration); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + .prefixed(animation-direction, alternate); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-pulse.less b/assets/js/less/effects/icons/_icon-pulse.less new file mode 100644 index 0000000..8fdf24d --- /dev/null +++ b/assets/js/less/effects/icons/_icon-pulse.less @@ -0,0 +1,31 @@ +/* Icon Pulse */ +.keyframes(~"@{nameSpace}-icon-pulse", { + 25% { + .prefixed(transform, scale(1.3)); + } + + 75% { + .prefixed(transform, scale(.8)); + } +}); + +.icon-pulse() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-pulse"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, infinite); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-push.less b/assets/js/less/effects/icons/_icon-push.less new file mode 100644 index 0000000..8f9ebc7 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-push.less @@ -0,0 +1,30 @@ +/* Icon Push */ +.keyframes(~"@{nameSpace}-icon-push", { + 50% { + .prefixed(transform, scale(.5)); + } +}); + +.icon-push() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-push"); + .prefixed(animation-duration, @mediumDuration); + .prefixed(animation-timing-function, linear); + .prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-rotate.less b/assets/js/less/effects/icons/_icon-rotate.less new file mode 100644 index 0000000..e48cbec --- /dev/null +++ b/assets/js/less/effects/icons/_icon-rotate.less @@ -0,0 +1,23 @@ +/* Icon Rotate */ +.icon-rotate() { + @duration: @mediumDuration; + + .hacks(); + .prefixed(transition-duration, @duration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @duration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, rotate(20deg)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-shrink.less b/assets/js/less/effects/icons/_icon-shrink.less new file mode 100644 index 0000000..b986949 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-shrink.less @@ -0,0 +1,21 @@ +/* Icon Shrink */ +.icon-shrink() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, scale(.8)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-sink-away.less b/assets/js/less/effects/icons/_icon-sink-away.less new file mode 100644 index 0000000..3964fb7 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-sink-away.less @@ -0,0 +1,32 @@ +/* Icon Sink Away */ +.keyframes(~"@{nameSpace}-icon-sink-away", { + 0% { + opacity: 1; + } + + 100% { + opacity: 0; + .prefixed(transform, translateY(1em)); + } +}); + +/* Icon Sink Away */ +.icon-sink-away() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(animation-duration, @slowDuration); + .prefixed(animation-fill-mode, forwards); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-sink-away"); + .prefixed(animation-timing-function, ease-out); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-sink.less b/assets/js/less/effects/icons/_icon-sink.less new file mode 100644 index 0000000..cfc02cf --- /dev/null +++ b/assets/js/less/effects/icons/_icon-sink.less @@ -0,0 +1,21 @@ +/* Icon Sink */ +.icon-sink() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, translateY(4px)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-spin.less b/assets/js/less/effects/icons/_icon-spin.less new file mode 100644 index 0000000..ab53487 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-spin.less @@ -0,0 +1,19 @@ +/* Icon Spin */ +.icon-spin() { + .hacks(); + + .hvr-icon { + .prefixed(transition-duration, 1s); + .prefixed(transition-property, transform); + .prefixed(transition-timing-function, ease-in-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(transform, rotate(360deg)); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-up.less b/assets/js/less/effects/icons/_icon-up.less new file mode 100644 index 0000000..05b00d5 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-up.less @@ -0,0 +1,32 @@ +/* Icon Up */ +.keyframes(~"@{nameSpace}-icon-up", { + 0%, + 50%, + 100% { + .prefixed(transform, translateY(0)); + } + 25%, + 75% { + .prefixed(transform, translateY(-6px)); + } +}); + +/* Icon Up */ +.icon-up() { + .hacks(); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-up"); + .prefixed(animation-duration, .75s); + .prefixed(animation-timing-function, ease-out); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-wobble-horizontal.less b/assets/js/less/effects/icons/_icon-wobble-horizontal.less new file mode 100644 index 0000000..08dd7af --- /dev/null +++ b/assets/js/less/effects/icons/_icon-wobble-horizontal.less @@ -0,0 +1,47 @@ +/* Icon Wobble Horizontal */ +.keyframes(~"@{nameSpace}-icon-wobble-horizontal", { + 16.65% { + .prefixed(transform, translateX(6px)); + } + + 33.3% { + .prefixed(transform, translateX(-5px)); + } + + 49.95% { + .prefixed(transform, translateX(4px)); + } + + 66.6% { + .prefixed(transform, translateX(-2px)); + } + + 83.25% { + .prefixed(transform, translateX(1px)); + } + + 100% { + .prefixed(transform, translateX(0)); + } +}); + +.icon-wobble-horizontal() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-wobble-horizontal"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/less/effects/icons/_icon-wobble-vertical.less b/assets/js/less/effects/icons/_icon-wobble-vertical.less new file mode 100644 index 0000000..b2152b3 --- /dev/null +++ b/assets/js/less/effects/icons/_icon-wobble-vertical.less @@ -0,0 +1,47 @@ +/* Icon Wobble Vertical */ +.keyframes(~"@{nameSpace}-icon-wobble-vertical", { + 16.65% { + .prefixed(transform, translateY(6px)); + } + + 33.3% { + .prefixed(transform, translateY(-5px)); + } + + 49.95% { + .prefixed(transform, translateY(4px)); + } + + 66.6% { + .prefixed(transform, translateY(-2px)); + } + + 83.25% { + .prefixed(transform, translateY(1px)); + } + + 100% { + .prefixed(transform, translateY(0)); + } +}); + +.icon-wobble-vertical() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + + .hvr-icon { + .prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + .prefixed(animation-name, ~"@{nameSpace}-icon-wobble-vertical"); + .prefixed(animation-duration, 1s); + .prefixed(animation-timing-function, ease-in-out); + .prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/less/effects/shadow-and-glow-transitions/_box-shadow-inset.less b/assets/js/less/effects/shadow-and-glow-transitions/_box-shadow-inset.less new file mode 100644 index 0000000..8ecd874 --- /dev/null +++ b/assets/js/less/effects/shadow-and-glow-transitions/_box-shadow-inset.less @@ -0,0 +1,16 @@ +/* Box Shadow Inset */ +.box-shadow-inset() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, box-shadow); + + box-shadow: inset 0 0 0 @shadowColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + + &:hover, + &:focus, + &:active { + box-shadow: inset 2px 2px 2px @shadowColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + } +} diff --git a/assets/js/less/effects/shadow-and-glow-transitions/_box-shadow-outset.less b/assets/js/less/effects/shadow-and-glow-transitions/_box-shadow-outset.less new file mode 100644 index 0000000..424befc --- /dev/null +++ b/assets/js/less/effects/shadow-and-glow-transitions/_box-shadow-outset.less @@ -0,0 +1,12 @@ +/* Box Shadow Outset */ +.box-shadow-outset() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, box-shadow); + + &:hover, + &:focus, + &:active { + box-shadow: 2px 2px 2px @shadowColor; + } +} diff --git a/assets/js/less/effects/shadow-and-glow-transitions/_float-shadow.less b/assets/js/less/effects/shadow-and-glow-transitions/_float-shadow.less new file mode 100644 index 0000000..6c8ccad --- /dev/null +++ b/assets/js/less/effects/shadow-and-glow-transitions/_float-shadow.less @@ -0,0 +1,34 @@ +/* Float Shadow */ +.float-shadow() { + .hacks(); + position: relative; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + top: 100%; + left: 5%; + height: 10px; + width: 90%; + opacity: 0; + background: -webkit-radial-gradient(center, ellipse, rgba(0,0,0,.35) 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at center, rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 80%); /* W3C */ + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, "transform, opacity"); + } + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateY(-5px)); /* move the element up by 5px */ + + &:before { + opacity: 1; + .prefixed(transform, translateY(5px)); /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */ + } + } +} diff --git a/assets/js/less/effects/shadow-and-glow-transitions/_glow.less b/assets/js/less/effects/shadow-and-glow-transitions/_glow.less new file mode 100644 index 0000000..2859a16 --- /dev/null +++ b/assets/js/less/effects/shadow-and-glow-transitions/_glow.less @@ -0,0 +1,12 @@ +/* Glow */ +.glow() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, box-shadow); + + &:hover, + &:focus, + &:active { + box-shadow: 0 0 8px @shadowColor; + } +} diff --git a/assets/js/less/effects/shadow-and-glow-transitions/_grow-shadow.less b/assets/js/less/effects/shadow-and-glow-transitions/_grow-shadow.less new file mode 100644 index 0000000..7f2d6d2 --- /dev/null +++ b/assets/js/less/effects/shadow-and-glow-transitions/_grow-shadow.less @@ -0,0 +1,13 @@ +/* Grow Shadow */ +.grow-shadow() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, "box-shadow, transform"); + + &:hover, + &:focus, + &:active { + box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); + .prefixed(transform, scale(1.1)); + } +} diff --git a/assets/js/less/effects/shadow-and-glow-transitions/_shadow-radial.less b/assets/js/less/effects/shadow-and-glow-transitions/_shadow-radial.less new file mode 100644 index 0000000..6659a99 --- /dev/null +++ b/assets/js/less/effects/shadow-and-glow-transitions/_shadow-radial.less @@ -0,0 +1,41 @@ +/* Shadow Radial */ +.shadow-radial() { + .hacks(); + position: relative; + + &:before, + &:after { + pointer-events: none; + position: absolute; + content: ''; + left: 0; + width: 100%; + box-sizing: border-box; + background-repeat: no-repeat; + height: 5px; + opacity: 0; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, opacity); + } + + &:before { + bottom: 100%; + background: -webkit-radial-gradient(50% 150%, ellipse, @shadowColor 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at 50% 150%, @shadowColor 0%, rgba(0, 0, 0, 0) 80%); + } + + &:after { + top: 100%; + background: -webkit-radial-gradient(50% -50%, ellipse, @shadowColor 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at 50% -50%, @shadowColor 0%, rgba(0, 0, 0, 0) 80%); + } + + &:hover:before, + &:focus:before, + &:active:before, + &:hover:after, + &:focus:after, + &:active:after { + opacity: 1; + } +} diff --git a/assets/js/less/effects/shadow-and-glow-transitions/_shadow.less b/assets/js/less/effects/shadow-and-glow-transitions/_shadow.less new file mode 100644 index 0000000..f55a4c3 --- /dev/null +++ b/assets/js/less/effects/shadow-and-glow-transitions/_shadow.less @@ -0,0 +1,12 @@ +/* Shadow */ +.shadow() { + .hacks(); + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, box-shadow); + + &:hover, + &:focus, + &:active { + box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); + } +} diff --git a/assets/js/less/effects/speech-bubbles/_bubble-bottom.less b/assets/js/less/effects/speech-bubbles/_bubble-bottom.less new file mode 100644 index 0000000..6d7f367 --- /dev/null +++ b/assets/js/less/effects/speech-bubbles/_bubble-bottom.less @@ -0,0 +1,25 @@ +/* Bubble Bottom */ +.bubble-bottom() { + .hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + left: calc(~"50%" - @tipWidth); + bottom: 0; + border-width: @tipHeight @tipWidth 0 @tipWidth; + border-color: @tipColor transparent transparent transparent; + } + + &:hover:before, + &:focus:before, + &:active:before { + .prefixed(transform, translateY(@tipHeight)); + } +} diff --git a/assets/js/less/effects/speech-bubbles/_bubble-float-bottom.less b/assets/js/less/effects/speech-bubbles/_bubble-float-bottom.less new file mode 100644 index 0000000..d503f2f --- /dev/null +++ b/assets/js/less/effects/speech-bubbles/_bubble-float-bottom.less @@ -0,0 +1,30 @@ +/* Bubble Float Bottom */ +.bubble-float-bottom() { + .hacks(); + position: relative; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:before { + position: absolute; + z-index: -1; + content: ''; + left: calc(~"50%" - @tipWidth); + bottom: 0; + border-style: solid; + border-width: @tipHeight @tipWidth 0 @tipWidth; + border-color: @tipColor transparent transparent transparent; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + } + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateY(-(@tipHeight))); + + &:before { + .prefixed(transform, translateY(@tipHeight)); + } + } +} diff --git a/assets/js/less/effects/speech-bubbles/_bubble-float-left.less b/assets/js/less/effects/speech-bubbles/_bubble-float-left.less new file mode 100644 index 0000000..6e503ec --- /dev/null +++ b/assets/js/less/effects/speech-bubbles/_bubble-float-left.less @@ -0,0 +1,30 @@ +/* Bubble Float Left */ +.bubble-float-left() { + .hacks(); + position: relative; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:before { + position: absolute; + z-index: -1; + content: ''; + top: calc(~"50%" - @tipHeight); + left: 0; + border-style: solid; + border-width: @tipHeight @tipWidth @tipHeight 0; + border-color: transparent @tipColor transparent transparent; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + } + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateX(@tipWidth)); + + &:before { + .prefixed(transform, translateX(-(@tipWidth))); + } + } +} diff --git a/assets/js/less/effects/speech-bubbles/_bubble-float-right.less b/assets/js/less/effects/speech-bubbles/_bubble-float-right.less new file mode 100644 index 0000000..397cbc4 --- /dev/null +++ b/assets/js/less/effects/speech-bubbles/_bubble-float-right.less @@ -0,0 +1,30 @@ +/* Bubble Float Right */ +.bubble-float-right() { + .hacks(); + position: relative; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:before { + position: absolute; + z-index: -1; + top: calc(~"50%" - @tipHeight); + right: 0; + content: ''; + border-style: solid; + border-width: @tipHeight 0 @tipHeight @tipWidth; + border-color: transparent transparent transparent @tipColor; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + } + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateX(-(@tipWidth))); + + &:before { + .prefixed(transform, translateX(@tipWidth)); + } + } +} diff --git a/assets/js/less/effects/speech-bubbles/_bubble-float-top.less b/assets/js/less/effects/speech-bubbles/_bubble-float-top.less new file mode 100644 index 0000000..8bf1992 --- /dev/null +++ b/assets/js/less/effects/speech-bubbles/_bubble-float-top.less @@ -0,0 +1,30 @@ +/* Bubble Float Top */ +.bubble-float-top() { + .hacks(); + position: relative; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + + &:before { + position: absolute; + z-index: -1; + content: ''; + left: calc(~"50%" - @tipWidth); + top: 0; + border-style: solid; + border-width: 0 @tipWidth @tipHeight @tipWidth; + border-color: transparent transparent @tipColor transparent; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + } + + &:hover, + &:focus, + &:active { + .prefixed(transform, translateY(@tipHeight)); + + &:before { + .prefixed(transform, translateY(-(@tipHeight))); + } + } +} diff --git a/assets/js/less/effects/speech-bubbles/_bubble-left.less b/assets/js/less/effects/speech-bubbles/_bubble-left.less new file mode 100644 index 0000000..118697f --- /dev/null +++ b/assets/js/less/effects/speech-bubbles/_bubble-left.less @@ -0,0 +1,25 @@ +/* Bubble Left */ +.bubble-left() { + .hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + top: calc(~"50%" - @tipHeight); + left: 0; + border-width: @tipHeight @tipWidth @tipHeight 0; + border-color: transparent @tipColor transparent transparent; + } + + &:hover:before, + &:focus:before, + &:active:before { + .prefixed(transform, translateX(-(@tipWidth))); + } +} diff --git a/assets/js/less/effects/speech-bubbles/_bubble-right.less b/assets/js/less/effects/speech-bubbles/_bubble-right.less new file mode 100644 index 0000000..da86ec6 --- /dev/null +++ b/assets/js/less/effects/speech-bubbles/_bubble-right.less @@ -0,0 +1,25 @@ +/* Bubble Right */ +.bubble-right() { + .hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + top: calc(~"50%" - @tipHeight); + right: 0; + border-width: @tipHeight 0 @tipHeight @tipWidth; + border-color: transparent transparent transparent @tipColor; + } + + &:hover:before, + &:focus:before, + &:active:before { + .prefixed(transform, translateX(@tipWidth)); + } +} diff --git a/assets/js/less/effects/speech-bubbles/_bubble-top.less b/assets/js/less/effects/speech-bubbles/_bubble-top.less new file mode 100644 index 0000000..b8eb95b --- /dev/null +++ b/assets/js/less/effects/speech-bubbles/_bubble-top.less @@ -0,0 +1,25 @@ +/* Bubble Top */ +.bubble-top() { + .hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + .prefixed(transition-duration, @mediumDuration); + .prefixed(transition-property, transform); + left: calc(~"50%" - @tipWidth); + top: 0; + border-width: 0 @tipWidth @tipHeight @tipWidth; + border-color: transparent transparent @tipColor transparent; + } + + &:hover:before, + &:focus:before, + &:active:before { + .prefixed(transform, translateY(-(@tipHeight))); + } +} diff --git a/assets/js/less/hover.less b/assets/js/less/hover.less new file mode 100644 index 0000000..23f076b --- /dev/null +++ b/assets/js/less/hover.less @@ -0,0 +1,794 @@ +/*! + * Hover.css (http://ianlunn.github.io/Hover/) + * Version: 2.3.2 + * Author: Ian Lunn @IanLunn + * Author URL: http://ianlunn.co.uk/ + * Github: https://github.com/IanLunn/Hover + + * Hover.css Copyright Ian Lunn 2017. Generated with LESS. + */ + + +@import "_options"; +@import "_mixins"; +@import "_hacks"; + + +/* 2D TRANSITIONS */ +@import "effects/2d-transitions/_grow"; +& when(@includeClasses = true) { + .@{nameSpace}-grow { + .grow(); + } +} + +@import "effects/2d-transitions/_shrink"; +& when(@includeClasses = true) { + .@{nameSpace}-shrink { + .shrink(); + } +} + +@import "effects/2d-transitions/_pulse"; +& when(@includeClasses = true) { + .@{nameSpace}-pulse { + .pulse(); + } +} + +@import "effects/2d-transitions/_pulse-grow"; +& when(@includeClasses = true) { + .@{nameSpace}-pulse-grow { + .pulse-grow(); + } +} + +@import "effects/2d-transitions/_pulse-shrink"; +& when(@includeClasses = true) { + .@{nameSpace}-pulse-shrink { + .pulse-shrink(); + } +} + +@import "effects/2d-transitions/_push"; +& when(@includeClasses = true) { + .@{nameSpace}-push { + .push(); + } +} + +@import "effects/2d-transitions/_pop"; +& when(@includeClasses = true) { + .@{nameSpace}-pop { + .pop(); + } +} + +@import "effects/2d-transitions/_bounce-in"; +& when(@includeClasses = true) { + .@{nameSpace}-bounce-in { + .bounce-in(); + } +} + +@import "effects/2d-transitions/_bounce-out"; +& when(@includeClasses = true) { + .@{nameSpace}-bounce-out { + .bounce-out(); + } +} + +@import "effects/2d-transitions/_rotate"; +& when(@includeClasses = true) { + .@{nameSpace}-rotate { + .rotate(); + } +} + +@import "effects/2d-transitions/_grow-rotate"; +& when(@includeClasses = true) { + .@{nameSpace}-grow-rotate { + .grow-rotate(); + } +} + +@import "effects/2d-transitions/_float"; +& when(@includeClasses = true) { + .@{nameSpace}-float { + .float(); + } +} + +@import "effects/2d-transitions/_sink"; +& when(@includeClasses = true) { + .@{nameSpace}-sink { + .sink(); + } +} + +@import "effects/2d-transitions/_bob"; +& when(@includeClasses = true) { + .@{nameSpace}-bob { + .bob(); + } +} + +@import "effects/2d-transitions/_hang"; +& when(@includeClasses = true) { + .@{nameSpace}-hang { + .hang(); + } +} + +@import "effects/2d-transitions/_skew"; +& when(@includeClasses = true) { + .@{nameSpace}-skew { + .skew(); + } +} + +@import "effects/2d-transitions/_skew-forward"; +& when(@includeClasses = true) { + .@{nameSpace}-skew-forward { + .skew-forward(); + } +} + +@import "effects/2d-transitions/_skew-backward"; +& when(@includeClasses = true) { + .@{nameSpace}-skew-backward { + .skew-backward(); + } +} + +@import "effects/2d-transitions/_wobble-vertical"; +& when(@includeClasses = true) { + .@{nameSpace}-wobble-vertical { + .wobble-vertical(); + } +} + +@import "effects/2d-transitions/_wobble-horizontal"; +& when(@includeClasses = true) { + .@{nameSpace}-wobble-horizontal { + .wobble-horizontal(); + } +} + +@import "effects/2d-transitions/_wobble-to-bottom-right"; +& when(@includeClasses = true) { + .@{nameSpace}-wobble-to-bottom-right { + .wobble-to-bottom-right(); + } +} + +@import "effects/2d-transitions/_wobble-to-top-right"; +& when(@includeClasses = true) { + .@{nameSpace}-wobble-to-top-right { + .wobble-to-top-right(); + } +} + +@import "effects/2d-transitions/_wobble-top"; +& when(@includeClasses = true) { + .@{nameSpace}-wobble-top { + .wobble-top(); + } +} + +@import "effects/2d-transitions/_wobble-bottom"; +& when(@includeClasses = true) { + .@{nameSpace}-wobble-bottom { + .wobble-bottom(); + } +} + +@import "effects/2d-transitions/_wobble-skew"; +& when(@includeClasses = true) { + .@{nameSpace}-wobble-skew { + .wobble-skew(); + } +} + +@import "effects/2d-transitions/_buzz"; +& when(@includeClasses = true) { + .@{nameSpace}-buzz { + .buzz(); + } +} + +@import "effects/2d-transitions/_buzz-out"; +& when(@includeClasses = true) { + .@{nameSpace}-buzz-out { + .buzz-out(); + } +} + +@import "effects/2d-transitions/_forward"; +& when(@includeClasses = true) { + .@{nameSpace}-forward { + .forward(); + } +} + +@import "effects/2d-transitions/_backward"; +& when(@includeClasses = true) { + .@{nameSpace}-backward { + .backward(); + } +} + +/* BACKGROUND TRANSITIONS */ +@import "effects/background-transitions/_fade"; +& when(@includeClasses = true) { + .@{nameSpace}-fade { + .fade(); + } +} + +@import "effects/background-transitions/_back-pulse"; +& when(@includeClasses = true) { + .@{nameSpace}-back-pulse { + .back-pulse(); + } +} + +@import "effects/background-transitions/_sweep-to-right"; +& when(@includeClasses = true) { + .@{nameSpace}-sweep-to-right { + .sweep-to-right(); + } +} + +@import "effects/background-transitions/_sweep-to-left"; +& when(@includeClasses = true) { + .@{nameSpace}-sweep-to-left { + .sweep-to-left(); + } +} + +@import "effects/background-transitions/_sweep-to-bottom"; +& when(@includeClasses = true) { + .@{nameSpace}-sweep-to-bottom { + .sweep-to-bottom(); + } +} + +@import "effects/background-transitions/_sweep-to-top"; +& when(@includeClasses = true) { + .@{nameSpace}-sweep-to-top { + .sweep-to-top(); + } +} + +@import "effects/background-transitions/_bounce-to-right"; +& when(@includeClasses = true) { + .@{nameSpace}-bounce-to-right { + .bounce-to-right(); + } +} + +@import "effects/background-transitions/_bounce-to-left"; +& when(@includeClasses = true) { + .@{nameSpace}-bounce-to-left { + .bounce-to-left(); + } +} + +@import "effects/background-transitions/_bounce-to-bottom"; +& when(@includeClasses = true) { + .@{nameSpace}-bounce-to-bottom { + .bounce-to-bottom(); + } +} + +@import "effects/background-transitions/_bounce-to-top"; +& when(@includeClasses = true) { + .@{nameSpace}-bounce-to-top { + .bounce-to-top(); + } +} + +@import "effects/background-transitions/_radial-out"; +& when(@includeClasses = true) { + .@{nameSpace}-radial-out { + .radial-out(); + } +} + +@import "effects/background-transitions/_radial-in"; +& when(@includeClasses = true) { + .@{nameSpace}-radial-in { + .radial-in(); + } +} + +@import "effects/background-transitions/_rectangle-in"; +& when(@includeClasses = true) { + .@{nameSpace}-rectangle-in { + .rectangle-in(); + } +} + +@import "effects/background-transitions/_rectangle-out"; +& when(@includeClasses = true) { + .@{nameSpace}-rectangle-out { + .rectangle-out(); + } +} + +@import "effects/background-transitions/_shutter-in-horizontal"; +& when(@includeClasses = true) { + .@{nameSpace}-shutter-in-horizontal { + .shutter-in-horizontal(); + } +} + +@import "effects/background-transitions/_shutter-out-horizontal"; +& when(@includeClasses = true) { + .@{nameSpace}-shutter-out-horizontal { + .shutter-out-horizontal(); + } +} + +@import "effects/background-transitions/_shutter-in-vertical"; +& when(@includeClasses = true) { + .@{nameSpace}-shutter-in-vertical { + .shutter-in-vertical(); + } +} + +@import "effects/background-transitions/_shutter-out-vertical"; +& when(@includeClasses = true) { + .@{nameSpace}-shutter-out-vertical { + .shutter-out-vertical(); + } +} + + +/* BORDER TRANSITIONS */ +@import "effects/border-transitions/_border-fade"; +& when (@includeClasses = true) { + .@{nameSpace}-border-fade { + .border-fade(); + } +} + +@import "effects/border-transitions/_hollow"; +& when (@includeClasses = true) { + .@{nameSpace}-hollow { + .hollow(); + } +} + +@import "effects/border-transitions/_trim"; +& when (@includeClasses = true) { + .@{nameSpace}-trim { + .trim(); + } +} + +@import "effects/border-transitions/_ripple-out"; +& when (@includeClasses = true) { + .@{nameSpace}-ripple-out { + .ripple-out(); + } +} + +@import "effects/border-transitions/_ripple-in"; +& when (@includeClasses = true) { + .@{nameSpace}-ripple-in { + .ripple-in(); + } +} + +@import "effects/border-transitions/_outline-out"; +& when (@includeClasses = true) { + .@{nameSpace}-outline-out { + .outline-out(); + } +} + +@import "effects/border-transitions/_outline-in"; +& when (@includeClasses = true) { + .@{nameSpace}-outline-in { + .outline-in(); + } +} + +@import "effects/border-transitions/_round-corners"; +& when (@includeClasses = true) { + .@{nameSpace}-round-corners { + .round-corners(); + } +} + +@import "effects/border-transitions/_underline-from-left"; +& when (@includeClasses = true) { + .@{nameSpace}-underline-from-left { + .underline-from-left(); + } +} + +@import "effects/border-transitions/_underline-from-center"; +& when (@includeClasses = true) { + .@{nameSpace}-underline-from-center { + .underline-from-center(); + } +} + +@import "effects/border-transitions/_underline-from-right"; +& when (@includeClasses = true) { + .@{nameSpace}-underline-from-right { + .underline-from-right(); + } +} + +@import "effects/border-transitions/_overline-from-left"; +& when (@includeClasses = true) { + .@{nameSpace}-overline-from-left { + .overline-from-left(); + } +} + +@import "effects/border-transitions/_overline-from-center"; +& when (@includeClasses = true) { + .@{nameSpace}-overline-from-center { + .overline-from-center(); + } +} + +@import "effects/border-transitions/_overline-from-right"; +& when (@includeClasses = true) { + .@{nameSpace}-overline-from-right { + .overline-from-right(); + } +} + +@import "effects/border-transitions/_reveal"; +& when (@includeClasses = true) { + .@{nameSpace}-reveal { + .reveal(); + } +} + +@import "effects/border-transitions/_underline-reveal"; +& when (@includeClasses = true) { + .@{nameSpace}-underline-reveal { + .underline-reveal(); + } +} + +@import "effects/border-transitions/_overline-reveal"; +& when (@includeClasses = true) { + .@{nameSpace}-overline-reveal { + .overline-reveal(); + } +} + + +/* SHADOW/GLOW TRANSITIONS */ +@import "effects/shadow-and-glow-transitions/_glow"; +& when (@includeClasses = true) { + .@{nameSpace}-glow { + .glow(); + } +} + +@import "effects/shadow-and-glow-transitions/_shadow"; +& when (@includeClasses = true) { + .@{nameSpace}-shadow { + .shadow(); + } +} + +@import "effects/shadow-and-glow-transitions/_grow-shadow"; +& when (@includeClasses = true) { + .@{nameSpace}-grow-shadow { + .grow-shadow(); + } +} + +@import "effects/shadow-and-glow-transitions/_box-shadow-outset"; +& when (@includeClasses = true) { + .@{nameSpace}-box-shadow-outset { + .box-shadow-outset(); + } +} + +@import "effects/shadow-and-glow-transitions/_box-shadow-inset"; +& when (@includeClasses = true) { + .@{nameSpace}-box-shadow-inset { + .box-shadow-inset(); + } +} + +@import "effects/shadow-and-glow-transitions/_float-shadow"; +& when (@includeClasses = true) { + .@{nameSpace}-float-shadow { + .float-shadow(); + } +} + +@import "effects/shadow-and-glow-transitions/_shadow-radial"; +& when (@includeClasses = true) { + .@{nameSpace}-show-radial { + .shadow-radial(); + } +} + +/* SPEECH BUBBLES */ +@import "effects/speech-bubbles/_bubble-top"; +& when(@includeClasses = true) { + .@{nameSpace}-bubble-top { + .bubble-top(); + } +} + +@import "effects/speech-bubbles/_bubble-right"; +& when(@includeClasses = true) { + .@{nameSpace}-bubble-right { + .bubble-right(); + } +} + +@import "effects/speech-bubbles/_bubble-bottom"; +& when(@includeClasses = true) { + .@{nameSpace}-bubble-bottom { + .bubble-bottom(); + } +} + +@import "effects/speech-bubbles/_bubble-left"; +& when(@includeClasses = true) { + .@{nameSpace}-bubble-left { + .bubble-left(); + } +} + +@import "effects/speech-bubbles/_bubble-float-top"; +& when(@includeClasses = true) { + .@{nameSpace}-bubble-float-top { + .bubble-float-top(); + } +} + +@import "effects/speech-bubbles/_bubble-float-right"; +& when(@includeClasses = true) { + .@{nameSpace}-bubble-float-right { + .bubble-float-right(); + } +} + +@import "effects/speech-bubbles/_bubble-float-bottom"; +& when(@includeClasses = true) { + .@{nameSpace}-bubble-float-bottom { + .bubble-float-bottom(); + } +} + +@import "effects/speech-bubbles/_bubble-float-left"; +& when(@includeClasses = true) { + .@{nameSpace}-bubble-float-left { + .bubble-float-left(); + } +} + +/* ICONS */ +@import "effects/icons/_icon-back"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-back { + .icon-back(); + } +} + +@import "effects/icons/_icon-forward"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-forward { + .icon-forward(); + } +} + +@import "effects/icons/_icon-down"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-down { + .icon-down(); + } +} + +@import "effects/icons/_icon-up"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-up { + .icon-up(); + } +} + +@import "effects/icons/_icon-spin"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-spin { + .icon-spin(); + } +} + +@import "effects/icons/_icon-drop"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-drop { + .icon-drop(); + } +} + +@import "effects/icons/_icon-fade"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-fade { + .icon-fade(); + } +} + +@import "effects/icons/_icon-float-away"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-float-away { + .icon-float-away(); + } +} + +@import "effects/icons/_icon-sink-away"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-sink-away { + .icon-sink-away(); + } +} + +@import "effects/icons/_icon-grow"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-grow { + .icon-grow(); + } +} + +@import "effects/icons/_icon-shrink"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-shrink { + .icon-shrink(); + } +} + +@import "effects/icons/_icon-pulse"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-pulse { + .icon-pulse(); + } +} + +@import "effects/icons/_icon-pulse-grow"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-pulse-grow { + .icon-pulse-grow(); + } +} + +@import "effects/icons/_icon-pulse-shrink"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-pulse-shrink { + .icon-pulse-shrink(); + } +} + +@import "effects/icons/_icon-push"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-push { + .icon-push(); + } +} + +@import "effects/icons/_icon-pop"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-pop { + .icon-pop(); + } +} + +@import "effects/icons/_icon-bounce"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-bounce { + .icon-bounce(); + } +} + +@import "effects/icons/_icon-rotate"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-rotate { + .icon-rotate(); + } +} + +@import "effects/icons/_icon-grow-rotate"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-grow-rotate { + .icon-grow-rotate(); + } +} + +@import "effects/icons/_icon-float"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-float { + .icon-float(); + } +} + +@import "effects/icons/_icon-sink"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-sink { + .icon-sink(); + } +} + +@import "effects/icons/_icon-bob"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-bob { + .icon-bob(); + } +} + +@import "effects/icons/_icon-hang"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-hang { + .icon-hang(); + } +} + +@import "effects/icons/_icon-wobble-horizontal"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-wobble-horizontal { + .icon-wobble-horizontal(); + } +} + +@import "effects/icons/_icon-wobble-vertical"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-wobble-vertical { + .icon-wobble-vertical(); + } +} + +@import "effects/icons/_icon-buzz"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-buzz { + .icon-buzz(); + } +} + +@import "effects/icons/_icon-buzz-out"; +& when(@includeClasses = true) { + .@{nameSpace}-icon-buzz-out { + .icon-buzz-out(); + } +} + +/* CURLS */ +@import "effects/curls/_curl-top-left"; +& when(@includeClasses = true) { + .@{nameSpace}-curl-top-left { + .curl-top-left(); + } +} + +@import "effects/curls/_curl-top-right"; +& when(@includeClasses = true) { + .@{nameSpace}-curl-top-right { + .curl-top-right(); + } +} + +@import "effects/curls/_curl-bottom-right"; +& when(@includeClasses = true) { + .@{nameSpace}-curl-bottom-right { + .curl-bottom-right(); + } +} + +@import "effects/curls/_curl-bottom-left"; +& when(@includeClasses = true) { + .@{nameSpace}-curl-bottom-left { + .curl-bottom-left(); + } +} diff --git a/assets/js/license.txt b/assets/js/license.txt new file mode 100644 index 0000000..1562a4e --- /dev/null +++ b/assets/js/license.txt @@ -0,0 +1,42 @@ +# Licenses + +Hover.css is made available under a free personal/open source or paid commercial licenses depending on your requirements. To compare licenses please visit the [Ian Lunn Design Limited Store](https://ianlunn.co.uk/store/licenses/) and [purchase a commercial license here](https://ianlunn.co.uk/store/hover-css/). + +## Personal/Open Source + +For personal/open source use, Hover.css is made available under a [MIT license](https://opensource.org/licenses/MIT) + +- Use in unlimited personal applications +- Your application can't be sold +- Your modifications remain open-source +- Free updates + +[Read full license](https://ianlunn.co.uk/store/licenses/personal/) + +## Commercial + +For commercial use, Hover.css is made available under Commercial, Extended Commercial, and OEM Commercial licenses. + +### Commercial License + +- Use in 1 application +- Sell your application once only (e.g. a website sold to a client) +- Your code is kept proprietary, to yourself +- Free updates to the major version + +[Purchase](https://ianlunn.co.uk/store/hover-css/?attribute_pa_licenses=commercial) | [Read full license](https://ianlunn.co.uk/store/licenses/commercial/) + +### Extended Commercial License + +- Use in unlimited applications +- Sell your applications an unlimited number of times (e.g. a website template sold on a theme store)* +- Your code is kept proprietary, to yourself +- Free updates to the major version + +*With the exception of applications that allow end users to produce separate applications. See the OEM Commercial License. + +[Purchase](https://ianlunn.co.uk/store/hover-css/?attribute_pa_licenses=extended-commercial) | [Read full license](https://ianlunn.co.uk/store/licenses/extended-commercial/) + +### OEM Commercial License + +Should your application enable end users to produce separate applications that incorporate Ian Lunn Design Limited's software, for example, a development toolkit, library, or application builder, you must obtain an OEM Commercial License. Please [contact us](https://ianlunn.co.uk/contact/) for more information about the OEM Commercial License. diff --git a/assets/js/logo-transparent.png b/assets/js/logo-transparent.png new file mode 100644 index 0000000..7eecc29 Binary files /dev/null and b/assets/js/logo-transparent.png differ diff --git a/assets/js/modern-slide-in.png b/assets/js/modern-slide-in.png new file mode 100644 index 0000000..76fe69e Binary files /dev/null and b/assets/js/modern-slide-in.png differ diff --git a/assets/js/package.json b/assets/js/package.json new file mode 100644 index 0000000..8404800 --- /dev/null +++ b/assets/js/package.json @@ -0,0 +1,25 @@ +{ + "name": "hover.css", + "author": "Ian Lunn", + "version": "2.3.2", + "repository": { + "type": "git", + "url": "https://github.com/IanLunn/Hover" + }, + "bugs": { + "url": "https://github.com/IanLunn/Hover/issues" + }, + "style": "css/hover.css", + "sass": "scss/hover.scss", + "main": "css/hover.css", + "devDependencies": { + "grunt": "~0.4.1", + "grunt-contrib-connect": "~0.5.0", + "grunt-contrib-cssmin": "~0.7.0", + "grunt-contrib-less": "^1.0.0", + "grunt-contrib-sass": "~0.6.0", + "grunt-contrib-watch": "~0.5.3", + "grunt-version": "^0.3.0", + "load-grunt-tasks": "~3.3.0" + } +} diff --git a/assets/js/photo-stack.png b/assets/js/photo-stack.png new file mode 100644 index 0000000..bdca98d Binary files /dev/null and b/assets/js/photo-stack.png differ diff --git a/assets/js/scss/_hacks.scss b/assets/js/scss/_hacks.scss new file mode 100644 index 0000000..0e6c243 --- /dev/null +++ b/assets/js/scss/_hacks.scss @@ -0,0 +1,26 @@ +// As is often the case, some devices/browsers need additional code to get CSS to work +// in the most desired way. These mixins are used to quickly drop in hacks for each element +// Find out more here: https://github.com/IanLunn/Hover/wiki/Hacks-Explained + +@mixin hardwareAccel() { + // Improve performance on mobile/tablet devices + // Perspective reduces blurryness of text in Chrome + @include prefixed(transform, perspective(1px) translateZ(0)); +} + +@mixin improveAntiAlias() { + // Improve aliasing on mobile/tablet devices + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} + +@mixin forceBlockLevel() { + // Transforms need to be block-level to work + display: inline-block; + vertical-align: middle; +} + +@mixin hacks() { + @include forceBlockLevel(); + @include hardwareAccel(); + @include improveAntiAlias(); +} diff --git a/assets/js/scss/_mixins.scss b/assets/js/scss/_mixins.scss new file mode 100644 index 0000000..e992178 --- /dev/null +++ b/assets/js/scss/_mixins.scss @@ -0,0 +1,51 @@ +// prefix declarations +@mixin prefixed($property, $value) { + @if $webkit == true { + -webkit-#{$property}: #{$value}; + } + + @if $moz == true { + -moz-#{$property}: #{$value}; + } + + @if $ms == true { + -ms-#{$property}: #{$value}; + } + + @if $o == true { + -o-#{$property}: #{$value}; + } + + #{$property}: #{$value}; +} + +// prefix keyframes +@mixin keyframes($name) { + @if $webkit == true { + @-webkit-keyframes #{$name} { + @content; + } + } + + @if $moz == true { + @-moz-keyframes #{$name} { + @content; + } + } + + @if $ms == true { + @-ms-keyframes #{$name} { + @content; + } + } + + @if $o == true { + @-o-keyframes #{$name} { + @content; + } + } + + @keyframes #{$name} { + @content; + } +} diff --git a/assets/js/scss/_options.scss b/assets/js/scss/_options.scss new file mode 100644 index 0000000..b5a92f6 --- /dev/null +++ b/assets/js/scss/_options.scss @@ -0,0 +1,43 @@ +// DEFAULT OPTIONS + +// Prefix for Hover class names +$nameSpace: 'hvr' !default; + +// Durations +$fastDuration: .1s !default; +$mediumDuration: .3s !default; +$slowDuration: .5s !default; + +// Colors +$primaryColor: #e1e1e1 !default; +$secondaryColor: #666 !default; +$highlightColor: #ccc !default; +$activeColor: #2098D1 !default; +$shadowColor: rgba(0, 0, 0, .6) !default; + +// Speech bubbles options +$tipWidth: 10px !default; //the width of the speech bubble tip +$tipHeight: 10px !default; //the height of the speech bubble tip +$tipColor: $primaryColor !default; + +// Arrows options +$spaceBetweenTextAndArrows: 2.2em !default; + +// Curl dimensions +$curlWidth: 25px !default; +$curlHeight: 25px !default; + +// Curl colors +$revealAreaColor: white !default; // reveal area behind the curl +$curlLineColor: #aaa !default; // crease line +$curlTransitionColor: #ccc !default; // color transitioning from crease line to final color +$curlLastColor: white !default; // final color of the back of the curl + +// Browser Prefixes - Which CSS prefixes should be used? +$webkit: true !default; +$moz: false !default; +$ms: false !default; +$o: false !default; + +// Compile with or without classes +$includeClasses: true !default; diff --git a/assets/js/scss/effects/2d-transitions/_backward.scss b/assets/js/scss/effects/2d-transitions/_backward.scss new file mode 100644 index 0000000..97d0ce1 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_backward.scss @@ -0,0 +1,12 @@ +/* Backward */ +@mixin backward { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateX(-8px)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_bob.scss b/assets/js/scss/effects/2d-transitions/_bob.scss new file mode 100644 index 0000000..a5307f1 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_bob.scss @@ -0,0 +1,34 @@ +/* Bob */ +@include keyframes(#{$nameSpace}-bob) { + 0% { + @include prefixed(transform, translateY(-8px)); + } + 50% { + @include prefixed(transform, translateY(-4px)); + } + 100% { + @include prefixed(transform, translateY(-8px)); + } +} + +@include keyframes(#{$nameSpace}-bob-float) { + 100% { + @include prefixed(transform, translateY(-8px)); + } +} + +@mixin bob { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, "#{$nameSpace}-bob-float, #{$nameSpace}-bob"); + @include prefixed(animation-duration, ".3s, 1.5s"); + @include prefixed(animation-delay, "0s, .3s"); + @include prefixed(animation-timing-function, "ease-out, ease-in-out"); + @include prefixed(animation-iteration-count, "1, infinite"); + @include prefixed(animation-fill-mode, "forwards"); + @include prefixed(animation-direction, "normal, alternate"); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_bounce-in.scss b/assets/js/scss/effects/2d-transitions/_bounce-in.scss new file mode 100644 index 0000000..797ac63 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_bounce-in.scss @@ -0,0 +1,12 @@ +/* Bounce In */ +@mixin bounce-in { + @include hacks(); + @include prefixed(transition-duration, $slowDuration); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, scale(1.2)); + @include prefixed(transition-timing-function, cubic-bezier(.47,2.02,.31,-0.36)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_bounce-out.scss b/assets/js/scss/effects/2d-transitions/_bounce-out.scss new file mode 100644 index 0000000..7132fae --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_bounce-out.scss @@ -0,0 +1,12 @@ +/* Bounce Out */ +@mixin bounce-out { + @include hacks(); + @include prefixed(transition-duration, $slowDuration); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, scale(.8)); + @include prefixed(transition-timing-function, cubic-bezier(.47,2.02,.31,-0.36)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_buzz-out.scss b/assets/js/scss/effects/2d-transitions/_buzz-out.scss new file mode 100644 index 0000000..0ff20f3 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_buzz-out.scss @@ -0,0 +1,55 @@ +/* Buzz Out */ +@include keyframes(#{$nameSpace}-buzz-out) { + 10% { + @include prefixed(transform, translateX(3px) rotate(2deg)); + } + + 20% { + @include prefixed(transform, translateX(-3px) rotate(-2deg)); + } + + 30% { + @include prefixed(transform, translateX(3px) rotate(2deg)); + } + + 40% { + @include prefixed(transform, translateX(-3px) rotate(-2deg)); + } + + 50% { + @include prefixed(transform, translateX(2px) rotate(1deg)); + } + + 60% { + @include prefixed(transform, translateX(-2px) rotate(-1deg)); + } + + 70% { + @include prefixed(transform, translateX(2px) rotate(1deg)); + } + + 80% { + @include prefixed(transform, translateX(-2px) rotate(-1deg)); + } + + 90% { + @include prefixed(transform, translateX(1px) rotate(0)); + } + + 100% { + @include prefixed(transform, translateX(-1px) rotate(0)); + } +} + +@mixin buzz-out { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-buzz-out); + @include prefixed(animation-duration, .75s); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_buzz.scss b/assets/js/scss/effects/2d-transitions/_buzz.scss new file mode 100644 index 0000000..6beac3c --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_buzz.scss @@ -0,0 +1,23 @@ +/* Buzz */ +@include keyframes(#{$nameSpace}-buzz) { + 50% { + @include prefixed(transform, translateX(3px) rotate(2deg)); + } + + 100% { + @include prefixed(transform, translateX(-3px) rotate(-2deg)); + } +} + +@mixin buzz { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-buzz); + @include prefixed(animation-duration, .15s); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_float.scss b/assets/js/scss/effects/2d-transitions/_float.scss new file mode 100644 index 0000000..5ff0eef --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_float.scss @@ -0,0 +1,13 @@ +/* Float */ +@mixin float { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateY(-8px)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_forward.scss b/assets/js/scss/effects/2d-transitions/_forward.scss new file mode 100644 index 0000000..3f1713d --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_forward.scss @@ -0,0 +1,12 @@ +/* Forward */ +@mixin forward { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateX(8px)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_grow-rotate.scss b/assets/js/scss/effects/2d-transitions/_grow-rotate.scss new file mode 100644 index 0000000..1826a76 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_grow-rotate.scss @@ -0,0 +1,12 @@ +/* Grow Rotate */ +@mixin grow-rotate { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, scale(1.1) rotate(4deg)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_grow.scss b/assets/js/scss/effects/2d-transitions/_grow.scss new file mode 100644 index 0000000..3c81ae9 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_grow.scss @@ -0,0 +1,12 @@ +/* Grow */ +@mixin grow { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, scale(1.1)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_hang.scss b/assets/js/scss/effects/2d-transitions/_hang.scss new file mode 100644 index 0000000..277cc60 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_hang.scss @@ -0,0 +1,34 @@ +/* Hang */ +@include keyframes(#{$nameSpace}-hang) { + 0% { + @include prefixed(transform, translateY(8px)); + } + 50% { + @include prefixed(transform, translateY(4px)); + } + 100% { + @include prefixed(transform, translateY(8px)); + } +} + +@include keyframes(#{$nameSpace}-hang-sink) { + 100% { + @include prefixed(transform, translateY(8px)); + } +} + +@mixin hang { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, "#{$nameSpace}-hang-sink, #{$nameSpace}-hang"); + @include prefixed(animation-duration, ".3s, 1.5s"); + @include prefixed(animation-delay, "0s, .3s"); + @include prefixed(animation-timing-function, "ease-out, ease-in-out"); + @include prefixed(animation-iteration-count, "1, infinite"); + @include prefixed(animation-fill-mode, "forwards"); + @include prefixed(animation-direction, "normal, alternate"); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_pop.scss b/assets/js/scss/effects/2d-transitions/_pop.scss new file mode 100644 index 0000000..88f1bb8 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_pop.scss @@ -0,0 +1,19 @@ +/* Pop */ +@include keyframes(#{$nameSpace}-pop) { + 50% { + @include prefixed(transform, scale(1.2)); + } +} + +@mixin pop { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-pop); + @include prefixed(animation-duration, $mediumDuration); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_pulse-grow.scss b/assets/js/scss/effects/2d-transitions/_pulse-grow.scss new file mode 100644 index 0000000..a47c44a --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_pulse-grow.scss @@ -0,0 +1,20 @@ +/* Pulse Grow */ +@include keyframes(#{$nameSpace}-pulse-grow) { + to { + @include prefixed(transform, scale(1.1)); + } +} + +@mixin pulse-grow { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-pulse-grow); + @include prefixed(animation-duration, $mediumDuration); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + @include prefixed(animation-direction, alternate); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_pulse-shrink.scss b/assets/js/scss/effects/2d-transitions/_pulse-shrink.scss new file mode 100644 index 0000000..25b4446 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_pulse-shrink.scss @@ -0,0 +1,20 @@ +/* Pulse Shrink */ +@include keyframes(#{$nameSpace}-pulse-shrink) { + to { + @include prefixed(transform, scale(.9)); + } +} + +@mixin pulse-shrink { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-pulse-shrink); + @include prefixed(animation-duration, $mediumDuration); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + @include prefixed(animation-direction, alternate); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_pulse.scss b/assets/js/scss/effects/2d-transitions/_pulse.scss new file mode 100644 index 0000000..814fdea --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_pulse.scss @@ -0,0 +1,23 @@ +/* Pulse */ +@include keyframes(#{$nameSpace}-pulse) { + 25% { + @include prefixed(transform, scale(1.1)); + } + + 75% { + @include prefixed(transform, scale(.9)); + } +} + +@mixin pulse { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-pulse); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_push.scss b/assets/js/scss/effects/2d-transitions/_push.scss new file mode 100644 index 0000000..5e72b0f --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_push.scss @@ -0,0 +1,23 @@ +/* Push */ +@include keyframes(#{$nameSpace}-push) { + 50% { + @include prefixed(transform, scale(.8)); + } + + 100% { + @include prefixed(transform, scale(1)); + } +} + +@mixin push { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-push); + @include prefixed(animation-duration, .3s); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_rotate.scss b/assets/js/scss/effects/2d-transitions/_rotate.scss new file mode 100644 index 0000000..d7dece2 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_rotate.scss @@ -0,0 +1,12 @@ +/* Rotate */ +@mixin rotate { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, rotate(4deg)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_shrink.scss b/assets/js/scss/effects/2d-transitions/_shrink.scss new file mode 100644 index 0000000..9344c44 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_shrink.scss @@ -0,0 +1,12 @@ +/* Shrink */ +@mixin shrink { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, scale(.9)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_sink.scss b/assets/js/scss/effects/2d-transitions/_sink.scss new file mode 100644 index 0000000..1242bae --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_sink.scss @@ -0,0 +1,13 @@ +/* Sink */ +@mixin sink { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateY(8px)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_skew-backward.scss b/assets/js/scss/effects/2d-transitions/_skew-backward.scss new file mode 100644 index 0000000..d5b983f --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_skew-backward.scss @@ -0,0 +1,13 @@ +/* Skew Backward */ +@mixin skew-backward { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transform-origin, 0 100%); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, skew(10deg)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_skew-forward.scss b/assets/js/scss/effects/2d-transitions/_skew-forward.scss new file mode 100644 index 0000000..8faf7ed --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_skew-forward.scss @@ -0,0 +1,13 @@ +/* Skew Forward */ +@mixin skew-forward { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transform-origin, 0 100%); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, skew(-10deg)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_skew.scss b/assets/js/scss/effects/2d-transitions/_skew.scss new file mode 100644 index 0000000..1e8818f --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_skew.scss @@ -0,0 +1,12 @@ +/* Skew */ +@mixin skew { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:hover, + &:focus, + &:active { + @include prefixed(transform, skew(-10deg)); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_wobble-bottom.scss b/assets/js/scss/effects/2d-transitions/_wobble-bottom.scss new file mode 100644 index 0000000..be2818b --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_wobble-bottom.scss @@ -0,0 +1,40 @@ +/* Wobble Bottom */ +@include keyframes(#{$nameSpace}-wobble-bottom) { + 16.65% { + @include prefixed(transform, skew(-12deg)); + } + + 33.3% { + @include prefixed(transform, skew(10deg)); + } + + 49.95% { + @include prefixed(transform, skew(-6deg)); + } + + 66.6% { + @include prefixed(transform, skew(4deg)); + } + + 83.25% { + @include prefixed(transform, skew(-2deg)); + } + + 100% { + @include prefixed(transform, skew(0)); + } +} + +@mixin wobble-bottom { + @include hacks(); + @include prefixed(transform-origin, 100% 0); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-wobble-bottom); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_wobble-horizontal.scss b/assets/js/scss/effects/2d-transitions/_wobble-horizontal.scss new file mode 100644 index 0000000..c57404a --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_wobble-horizontal.scss @@ -0,0 +1,39 @@ +/* Wobble Horizontal */ +@include keyframes(#{$nameSpace}-wobble-horizontal) { + 16.65% { + @include prefixed(transform, translateX(8px)); + } + + 33.3% { + @include prefixed(transform, translateX(-6px)); + } + + 49.95% { + @include prefixed(transform, translateX(4px)); + } + + 66.6% { + @include prefixed(transform, translateX(-2px)); + } + + 83.25% { + @include prefixed(transform, translateX(1px)); + } + + 100% { + @include prefixed(transform, translateX(0)); + } +} + +@mixin wobble-horizontal { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-wobble-horizontal); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_wobble-skew.scss b/assets/js/scss/effects/2d-transitions/_wobble-skew.scss new file mode 100644 index 0000000..4355e7b --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_wobble-skew.scss @@ -0,0 +1,39 @@ +/* Wobble Skew */ +@include keyframes(#{$nameSpace}-wobble-skew) { + 16.65% { + @include prefixed(transform, skew(-12deg)); + } + + 33.3% { + @include prefixed(transform, skew(10deg)); + } + + 49.95% { + @include prefixed(transform, skew(-6deg)); + } + + 66.6% { + @include prefixed(transform, skew(4deg)); + } + + 83.25% { + @include prefixed(transform, skew(-2deg)); + } + + 100% { + @include prefixed(transform, skew(0)); + } +} + +@mixin wobble-skew { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-wobble-skew); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_wobble-to-bottom-right.scss b/assets/js/scss/effects/2d-transitions/_wobble-to-bottom-right.scss new file mode 100644 index 0000000..f1df22a --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_wobble-to-bottom-right.scss @@ -0,0 +1,39 @@ +/* Wobble To Bottom Right */ +@include keyframes(#{$nameSpace}-wobble-to-bottom-right) { + 16.65% { + @include prefixed(transform, translate(8px, 8px)); + } + + 33.3% { + @include prefixed(transform, translate(-6px, -6px)); + } + + 49.95% { + @include prefixed(transform, translate(4px, 4px)); + } + + 66.6% { + @include prefixed(transform, translate(-2px, -2px)); + } + + 83.25% { + @include prefixed(transform, translate(1px, 1px)); + } + + 100% { + @include prefixed(transform, translate(0, 0)); + } +} + +@mixin wobble-to-bottom-right { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-wobble-to-bottom-right); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_wobble-to-top-right.scss b/assets/js/scss/effects/2d-transitions/_wobble-to-top-right.scss new file mode 100644 index 0000000..56247c8 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_wobble-to-top-right.scss @@ -0,0 +1,39 @@ +/* Wobble To Top Right */ +@include keyframes(#{$nameSpace}-wobble-to-top-right) { + 16.65% { + @include prefixed(transform, translate(8px, -8px)); + } + + 33.3% { + @include prefixed(transform, translate(-6px, 6px)); + } + + 49.95% { + @include prefixed(transform, translate(4px, -4px)); + } + + 66.6% { + @include prefixed(transform, translate(-2px, 2px)); + } + + 83.25% { + @include prefixed(transform, translate(1px, -1px)); + } + + 100% { + @include prefixed(transform, translate(0, 0)); + } +} + +@mixin wobble-to-top-right { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-wobble-to-top-right); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_wobble-top.scss b/assets/js/scss/effects/2d-transitions/_wobble-top.scss new file mode 100644 index 0000000..7603842 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_wobble-top.scss @@ -0,0 +1,40 @@ +/* Wobble Top */ +@include keyframes(#{$nameSpace}-wobble-top) { + 16.65% { + @include prefixed(transform, skew(-12deg)); + } + + 33.3% { + @include prefixed(transform, skew(10deg)); + } + + 49.95% { + @include prefixed(transform, skew(-6deg)); + } + + 66.6% { + @include prefixed(transform, skew(4deg)); + } + + 83.25% { + @include prefixed(transform, skew(-2deg)); + } + + 100% { + @include prefixed(transform, skew(0)); + } +} + +@mixin wobble-top { + @include hacks(); + @include prefixed(transform-origin, 0 100%); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-wobble-top); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/2d-transitions/_wobble-vertical.scss b/assets/js/scss/effects/2d-transitions/_wobble-vertical.scss new file mode 100644 index 0000000..fd28eb7 --- /dev/null +++ b/assets/js/scss/effects/2d-transitions/_wobble-vertical.scss @@ -0,0 +1,39 @@ +/* Wobble Vertical */ +@include keyframes(#{$nameSpace}-wobble-vertical) { + 16.65% { + @include prefixed(transform, translateY(8px)); + } + + 33.3% { + @include prefixed(transform, translateY(-6px)); + } + + 49.95% { + @include prefixed(transform, translateY(4px)); + } + + 66.6% { + @include prefixed(transform, translateY(-2px)); + } + + 83.25% { + @include prefixed(transform, translateY(1px)); + } + + 100% { + @include prefixed(transform, translateY(0)); + } +} + +@mixin wobble-vertical { + @include hacks(); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-wobble-vertical); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } +} diff --git a/assets/js/scss/effects/background-transitions/_back-pulse.scss b/assets/js/scss/effects/background-transitions/_back-pulse.scss new file mode 100644 index 0000000..fa2afb8 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_back-pulse.scss @@ -0,0 +1,26 @@ +/* Back Pulse */ +@include keyframes(#{$nameSpace}-back-pulse) { + 50% { + background-color: rgba(32, 152, 209, .75); + } +} + +@mixin back-pulse { + @include hacks(); + overflow: hidden; + @include prefixed(transition-duration, $slowDuration); + @include prefixed(transition-property, "color, background-color"); + + &:hover, + &:focus, + &:active { + @include prefixed(animation-name, #{$nameSpace}-back-pulse); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-delay, $slowDuration); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + background-color: $activeColor; + background-color: rgba(32, 152, 209, 1); + color: white; + } +} diff --git a/assets/js/scss/effects/background-transitions/_bounce-to-bottom.scss b/assets/js/scss/effects/background-transitions/_bounce-to-bottom.scss new file mode 100644 index 0000000..d0770a5 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_bounce-to-bottom.scss @@ -0,0 +1,34 @@ +/* Bounce To Bottom */ +@mixin bounce-to-bottom { + @include hacks(); + position: relative; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $slowDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scaleY(0)); + @include prefixed(transform-origin, 50% 0); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $slowDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleY(1)); + @include prefixed(transition-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_bounce-to-left.scss b/assets/js/scss/effects/background-transitions/_bounce-to-left.scss new file mode 100644 index 0000000..b2a5f11 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_bounce-to-left.scss @@ -0,0 +1,34 @@ +/* Bounce To Left */ +@mixin bounce-to-left { + @include hacks(); + position: relative; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $slowDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scaleX(0)); + @include prefixed(transform-origin, 100% 50%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $slowDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleX(1)); + @include prefixed(transition-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_bounce-to-right.scss b/assets/js/scss/effects/background-transitions/_bounce-to-right.scss new file mode 100644 index 0000000..f9ef6b1 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_bounce-to-right.scss @@ -0,0 +1,34 @@ +/* Bounce To Right */ +@mixin bounce-to-right { + @include hacks(); + position: relative; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $slowDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scaleX(0)); + @include prefixed(transform-origin, 0 50%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $slowDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleX(1)); + @include prefixed(transition-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_bounce-to-top.scss b/assets/js/scss/effects/background-transitions/_bounce-to-top.scss new file mode 100644 index 0000000..cd1e0cf --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_bounce-to-top.scss @@ -0,0 +1,34 @@ +/* Bounce To Top */ +@mixin bounce-to-top { + @include hacks(); + position: relative; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $slowDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scaleY(0)); + @include prefixed(transform-origin, 50% 100%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $slowDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleY(1)); + @include prefixed(transition-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_fade.scss b/assets/js/scss/effects/background-transitions/_fade.scss new file mode 100644 index 0000000..4baf1a5 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_fade.scss @@ -0,0 +1,14 @@ +/* Fade */ +@mixin fade { + @include hacks(); + overflow: hidden; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, "color, background-color"); + + &:hover, + &:focus, + &:active { + background-color: $activeColor; + color: white; + } +} diff --git a/assets/js/scss/effects/background-transitions/_radial-in.scss b/assets/js/scss/effects/background-transitions/_radial-in.scss new file mode 100644 index 0000000..60d13bc --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_radial-in.scss @@ -0,0 +1,35 @@ +/* Radial In */ +@mixin radial-in { + @include hacks(); + position: relative; + overflow: hidden; + background: $activeColor; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $primaryColor; + border-radius: 100%; + @include prefixed(transform, scale(2)); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scale(0)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_radial-out.scss b/assets/js/scss/effects/background-transitions/_radial-out.scss new file mode 100644 index 0000000..3ca4173 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_radial-out.scss @@ -0,0 +1,35 @@ +/* Radial Out */ +@mixin radial-out { + @include hacks(); + position: relative; + overflow: hidden; + background: $primaryColor; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + border-radius: 100%; + @include prefixed(transform, scale(0)); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scale(2)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_rectangle-in.scss b/assets/js/scss/effects/background-transitions/_rectangle-in.scss new file mode 100644 index 0000000..d576d75 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_rectangle-in.scss @@ -0,0 +1,33 @@ +/* Rectangle In */ +@mixin rectangle-in { + @include hacks(); + position: relative; + background: $activeColor; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $primaryColor; + @include prefixed(transform, scale(1)); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scale(0)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_rectangle-out.scss b/assets/js/scss/effects/background-transitions/_rectangle-out.scss new file mode 100644 index 0000000..10cc440 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_rectangle-out.scss @@ -0,0 +1,33 @@ +/* Rectangle Out */ +@mixin rectangle-out { + @include hacks(); + position: relative; + background: $primaryColor; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scale(0)); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scale(1)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_shutter-in-horizontal.scss b/assets/js/scss/effects/background-transitions/_shutter-in-horizontal.scss new file mode 100644 index 0000000..67a1530 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_shutter-in-horizontal.scss @@ -0,0 +1,34 @@ +/* Shutter In Horizontal */ +@mixin shutter-in-horizontal { + @include hacks(); + position: relative; + background: $activeColor; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: $primaryColor; + @include prefixed(transform, scaleX(1)); + @include prefixed(transform-origin, 50%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleX(0)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_shutter-in-vertical.scss b/assets/js/scss/effects/background-transitions/_shutter-in-vertical.scss new file mode 100644 index 0000000..014cf89 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_shutter-in-vertical.scss @@ -0,0 +1,34 @@ +/* Shutter In Vertical */ +@mixin shutter-in-vertical { + @include hacks(); + position: relative; + background: $activeColor; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: $primaryColor; + @include prefixed(transform, scaleY(1)); + @include prefixed(transform-origin, 50%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleY(0)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_shutter-out-horizontal.scss b/assets/js/scss/effects/background-transitions/_shutter-out-horizontal.scss new file mode 100644 index 0000000..632e63b --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_shutter-out-horizontal.scss @@ -0,0 +1,34 @@ +/* Shutter Out Horizontal */ +@mixin shutter-out-horizontal { + @include hacks(); + position: relative; + background: $primaryColor; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: $activeColor; + @include prefixed(transform, scaleX(0)); + @include prefixed(transform-origin, 50%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleX(1)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_shutter-out-vertical.scss b/assets/js/scss/effects/background-transitions/_shutter-out-vertical.scss new file mode 100644 index 0000000..ffb3208 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_shutter-out-vertical.scss @@ -0,0 +1,34 @@ +/* Shutter Out Vertical */ +@mixin shutter-out-vertical { + @include hacks(); + position: relative; + background: $primaryColor; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: $activeColor; + @include prefixed(transform, scaleY(0)); + @include prefixed(transform-origin, 50%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleY(1)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_sweep-to-bottom.scss b/assets/js/scss/effects/background-transitions/_sweep-to-bottom.scss new file mode 100644 index 0000000..ec3c797 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_sweep-to-bottom.scss @@ -0,0 +1,33 @@ +/* Sweep To Bottom */ +@mixin sweep-to-bottom { + @include hacks(); + position: relative; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scaleY(0)); + @include prefixed(transform-origin, 50% 0); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleY(1)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_sweep-to-left.scss b/assets/js/scss/effects/background-transitions/_sweep-to-left.scss new file mode 100644 index 0000000..af5923f --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_sweep-to-left.scss @@ -0,0 +1,33 @@ +/* Sweep To Left */ +@mixin sweep-to-left { + @include hacks(); + position: relative; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scaleX(0)); + @include prefixed(transform-origin, 100% 50%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleX(1)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_sweep-to-right.scss b/assets/js/scss/effects/background-transitions/_sweep-to-right.scss new file mode 100644 index 0000000..9bf5ed5 --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_sweep-to-right.scss @@ -0,0 +1,33 @@ +/* Sweep To Right */ +@mixin sweep-to-right { + @include hacks(); + position: relative; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scaleX(0)); + @include prefixed(transform-origin, 0 50%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleX(1)); + } + } +} diff --git a/assets/js/scss/effects/background-transitions/_sweep-to-top.scss b/assets/js/scss/effects/background-transitions/_sweep-to-top.scss new file mode 100644 index 0000000..e4ecc2f --- /dev/null +++ b/assets/js/scss/effects/background-transitions/_sweep-to-top.scss @@ -0,0 +1,33 @@ +/* Sweep To Top */ +@mixin sweep-to-top { + @include hacks(); + position: relative; + @include prefixed(transition-property, color); + @include prefixed(transition-duration, $mediumDuration); + + &:before { + content: ""; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + @include prefixed(transform, scaleY(0)); + @include prefixed(transform-origin, 50% 100%); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + color: white; + + &:before { + @include prefixed(transform, scaleY(1)); + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_border-fade.scss b/assets/js/scss/effects/border-transitions/_border-fade.scss new file mode 100644 index 0000000..1d06c28 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_border-fade.scss @@ -0,0 +1,19 @@ +/* Border Fade */ +@mixin border-fade { + $borderWidth: 4px; + + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, box-shadow); + box-shadow: + inset 0 0 0 $borderWidth $primaryColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + + &:hover, + &:focus, + &:active { + box-shadow: + inset 0 0 0 $borderWidth $activeColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + } +} diff --git a/assets/js/scss/effects/border-transitions/_hollow.scss b/assets/js/scss/effects/border-transitions/_hollow.scss new file mode 100644 index 0000000..ea70c81 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_hollow.scss @@ -0,0 +1,17 @@ +/* Hollow */ +@mixin hollow { + $borderWidth: 4px; + + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, background); + box-shadow: + inset 0 0 0 $borderWidth $primaryColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + + &:hover, + &:focus, + &:active { + background: none; + } +} diff --git a/assets/js/scss/effects/border-transitions/_outline-in.scss b/assets/js/scss/effects/border-transitions/_outline-in.scss new file mode 100644 index 0000000..71fa497 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_outline-in.scss @@ -0,0 +1,32 @@ +/* Outline In */ +@mixin outline-in { + $outerBorderWidth: 4px; + $innerBorderWidth: 4px; + + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + content: ''; + position: absolute; + border: $primaryColor solid $outerBorderWidth; + top: -($outerBorderWidth + $innerBorderWidth) * 2; + right: -($outerBorderWidth + $innerBorderWidth) * 2; + bottom: -($outerBorderWidth + $innerBorderWidth) * 2; + left: -($outerBorderWidth + $innerBorderWidth) * 2; + opacity: 0; + @include prefixed(transition-duration, .3s); + @include prefixed(transition-property, "top, right, bottom, left"); + } + + &:hover:before, + &:focus:before, + &:active:before { + top: -($outerBorderWidth + $innerBorderWidth); + right: -($outerBorderWidth + $innerBorderWidth); + bottom: -($outerBorderWidth + $innerBorderWidth); + left: -($outerBorderWidth + $innerBorderWidth); + opacity: 1; + } +} diff --git a/assets/js/scss/effects/border-transitions/_outline-out.scss b/assets/js/scss/effects/border-transitions/_outline-out.scss new file mode 100644 index 0000000..73ca889 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_outline-out.scss @@ -0,0 +1,29 @@ +/* Outline Out */ +@mixin outline-out { + $outerBorderWidth: 4px; + $innerBorderWidth: 4px; + + @include hacks(); + position: relative; + + &:before { + content: ''; + position: absolute; + border: $primaryColor solid $outerBorderWidth; + top: 0; + right: 0; + bottom: 0; + left: 0; + @include prefixed(transition-duration, .3s); + @include prefixed(transition-property, "top, right, bottom, left"); + } + + &:hover:before, + &:focus:before, + &:active:before { + top: -($outerBorderWidth + $innerBorderWidth); + right: -($outerBorderWidth + $innerBorderWidth); + bottom: -($outerBorderWidth + $innerBorderWidth); + left: -($outerBorderWidth + $innerBorderWidth); + } +} diff --git a/assets/js/scss/effects/border-transitions/_overline-from-center.scss b/assets/js/scss/effects/border-transitions/_overline-from-center.scss new file mode 100644 index 0000000..278f906 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_overline-from-center.scss @@ -0,0 +1,32 @@ +/* Overline From Center */ +@mixin overline-from-center { + $duration: $mediumDuration; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 51%; + right: 51%; + top: 0; + background: $activeColor; + height: 4px; + @include prefixed(transition-property, "left, right"); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + left: 0; + right: 0; + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_overline-from-left.scss b/assets/js/scss/effects/border-transitions/_overline-from-left.scss new file mode 100644 index 0000000..644a993 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_overline-from-left.scss @@ -0,0 +1,31 @@ +/* Overline From Left */ +@mixin overline-from-left { + $duration: $mediumDuration; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 100%; + top: 0; + background: $activeColor; + height: 4px; + @include prefixed(transition-property, "right"); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + right: 0; + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_overline-from-right.scss b/assets/js/scss/effects/border-transitions/_overline-from-right.scss new file mode 100644 index 0000000..88ff3c6 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_overline-from-right.scss @@ -0,0 +1,31 @@ +/* Overline From Right */ +@mixin overline-from-right { + $duration: $mediumDuration; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 100%; + right: 0; + top: 0; + background: $activeColor; + height: 4px; + @include prefixed(transition-property, "left"); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + left: 0; + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_overline-reveal.scss b/assets/js/scss/effects/border-transitions/_overline-reveal.scss new file mode 100644 index 0000000..868396a --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_overline-reveal.scss @@ -0,0 +1,32 @@ +/* Overline Reveal */ +@mixin overline-reveal { + $duration: $mediumDuration; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + top: 0; + background: $activeColor; + height: 4px; + @include prefixed(transform, translateY(-4px)); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + @include prefixed(transform, translateY(0)); + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_reveal.scss b/assets/js/scss/effects/border-transitions/_reveal.scss new file mode 100644 index 0000000..d0c2ddb --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_reveal.scss @@ -0,0 +1,34 @@ +/* Reveal */ +@mixin reveal { + $duration: #{$fastDuration}; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + top: 0; + bottom: 0; + border-color: #{$activeColor}; + border-style: solid; + border-width: 0; + @include prefixed(transition-property, border-width); + @include prefixed(transition-duration, #{$duration}); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + @include prefixed(transform, translateY(0)); + border-width: 4px; + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_ripple-in.scss b/assets/js/scss/effects/border-transitions/_ripple-in.scss new file mode 100644 index 0000000..2f7f94d --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_ripple-in.scss @@ -0,0 +1,36 @@ +/* Ripple In */ +@include keyframes(#{$nameSpace}-ripple-in) { + 100% { + top: 0; + right: 0; + bottom: 0; + left: 0; + opacity: 1; + } +} + +@mixin ripple-in { + $outerBorderWidth: 4px; + $innerBorderWidth: 4px; + + @include hacks(); + position: relative; + + &:before { + content: ''; + position: absolute; + border: $primaryColor solid $outerBorderWidth; + top: -(6px + 6px); + right: -(6px + 6px); + bottom: -(6px + 6px); + left: -(6px + 6px); + opacity: 0; + @include prefixed(animation-duration, 1s); + } + + &:hover:before, + &:focus:before, + &:active:before { + @include prefixed(animation-name, #{$nameSpace}-ripple-in); + } +} diff --git a/assets/js/scss/effects/border-transitions/_ripple-out.scss b/assets/js/scss/effects/border-transitions/_ripple-out.scss new file mode 100644 index 0000000..4d9fabc --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_ripple-out.scss @@ -0,0 +1,35 @@ +/* Ripple Out */ +@include keyframes(#{$nameSpace}-ripple-out) { + 100% { + top: -(6px + 6px); + right: -(6px + 6px); + bottom: -(6px + 6px); + left: -(6px + 6px); + opacity: 0; + } +} + +@mixin ripple-out { + $outerBorderWidth: 6px; + $innerBorderWidth: 6px; + + @include hacks(); + position: relative; + + &:before { + content: ''; + position: absolute; + border: $primaryColor solid $outerBorderWidth; + top: 0; + right: 0; + bottom: 0; + left: 0; + @include prefixed(animation-duration, 1s); + } + + &:hover:before, + &:focus:before, + &:active:before { + @include prefixed(animation-name, #{$nameSpace}-ripple-out); + } +} diff --git a/assets/js/scss/effects/border-transitions/_round-corners.scss b/assets/js/scss/effects/border-transitions/_round-corners.scss new file mode 100644 index 0000000..c34cdc2 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_round-corners.scss @@ -0,0 +1,12 @@ +/* Round Corners */ +@mixin round-corners { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, border-radius); + + &:hover, + &:focus, + &:active { + border-radius: 1em; + } +} diff --git a/assets/js/scss/effects/border-transitions/_trim.scss b/assets/js/scss/effects/border-transitions/_trim.scss new file mode 100644 index 0000000..1e8e2d6 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_trim.scss @@ -0,0 +1,27 @@ +/* Trim */ +@mixin trim { + $outerBorderWidth: 4px; + $innerBorderWidth: 4px; + + @include hacks(); + position: relative; + + &:before { + content: ''; + position: absolute; + border: white solid $innerBorderWidth; + top: $outerBorderWidth; + left: $outerBorderWidth; + right: $outerBorderWidth; + bottom: $outerBorderWidth; + opacity: 0; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, opacity); + } + + &:hover:before, + &:focus:before, + &:active:before { + opacity: 1; + } +} diff --git a/assets/js/scss/effects/border-transitions/_underline-from-center.scss b/assets/js/scss/effects/border-transitions/_underline-from-center.scss new file mode 100644 index 0000000..d7d6274 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_underline-from-center.scss @@ -0,0 +1,32 @@ +/* Underline From Center */ +@mixin underline-from-center { + $duration: $mediumDuration; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 51%; + right: 51%; + bottom: 0; + background: $activeColor; + height: 4px; + @include prefixed(transition-property, "left, right"); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + left: 0; + right: 0; + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_underline-from-left.scss b/assets/js/scss/effects/border-transitions/_underline-from-left.scss new file mode 100644 index 0000000..a2b9cac --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_underline-from-left.scss @@ -0,0 +1,31 @@ +/* Underline From Left */ +@mixin underline-from-left { + $duration: $mediumDuration; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 100%; + bottom: 0; + background: $activeColor; + height: 4px; + @include prefixed(transition-property, "right"); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + right: 0; + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_underline-from-right.scss b/assets/js/scss/effects/border-transitions/_underline-from-right.scss new file mode 100644 index 0000000..f3957ce --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_underline-from-right.scss @@ -0,0 +1,31 @@ +/* Underline From Right */ +@mixin underline-from-right { + $duration: $mediumDuration; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 100%; + right: 0; + bottom: 0; + background: $activeColor; + height: 4px; + @include prefixed(transition-property, "left"); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + left: 0; + } + } +} diff --git a/assets/js/scss/effects/border-transitions/_underline-reveal.scss b/assets/js/scss/effects/border-transitions/_underline-reveal.scss new file mode 100644 index 0000000..986b793 --- /dev/null +++ b/assets/js/scss/effects/border-transitions/_underline-reveal.scss @@ -0,0 +1,32 @@ +/* Underline Reveal */ +@mixin underline-reveal { + $duration: $mediumDuration; + + @include hacks(); + position: relative; + overflow: hidden; + + &:before { + content: ""; + position: absolute; + z-index: -1; + left: 0; + right: 0; + bottom: 0; + background: $activeColor; + height: 4px; + @include prefixed(transform, translateY(4px)); + @include prefixed(transition-property, transform); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + &:before { + @include prefixed(transform, translateY(0)); + } + } +} diff --git a/assets/js/scss/effects/curls/_curl-bottom-left.scss b/assets/js/scss/effects/curls/_curl-bottom-left.scss new file mode 100644 index 0000000..4963d30 --- /dev/null +++ b/assets/js/scss/effects/curls/_curl-bottom-left.scss @@ -0,0 +1,33 @@ +/* Curl Bottom Left */ +@mixin curl-bottom-left { + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + bottom: 0; + left: 0; + background: $revealAreaColor; /* IE9 */ + background: linear-gradient( + 45deg, + $revealAreaColor 45%, + $curlLineColor 50%, + $curlTransitionColor 56%, + $curlLastColor 80% + ); + box-shadow: 1px -1px 1px rgba(0, 0, 0, .4); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, "width, height"); + } + + &:hover:before, + &:focus:before, + &:active:before { + width: $curlWidth; + height: $curlHeight; + } +} diff --git a/assets/js/scss/effects/curls/_curl-bottom-right.scss b/assets/js/scss/effects/curls/_curl-bottom-right.scss new file mode 100644 index 0000000..197542f --- /dev/null +++ b/assets/js/scss/effects/curls/_curl-bottom-right.scss @@ -0,0 +1,33 @@ +/* Curl Bottom Right */ +@mixin curl-bottom-right { + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + bottom: 0; + right: 0; + background: $revealAreaColor; /* IE9 */ + background: linear-gradient( + 315deg, + $revealAreaColor 45%, + $curlLineColor 50%, + $curlTransitionColor 56%, + $curlLastColor 80% + ); + box-shadow: -1px -1px 1px rgba(0, 0, 0, .4); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, "width, height"); + } + + &:hover:before, + &:focus:before, + &:active:before { + width: $curlWidth; + height: $curlHeight; + } +} diff --git a/assets/js/scss/effects/curls/_curl-top-left.scss b/assets/js/scss/effects/curls/_curl-top-left.scss new file mode 100644 index 0000000..462b6b5 --- /dev/null +++ b/assets/js/scss/effects/curls/_curl-top-left.scss @@ -0,0 +1,36 @@ +/* Curl Top Left */ +@mixin curl-top-left { + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + top: 0; + left: 0; + background: $revealAreaColor; /* IE9 */ + background: linear-gradient( + 135deg, + $revealAreaColor 45%, + $curlLineColor 50%, + $curlTransitionColor 56%, + $curlLastColor 80% + ); + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#000000');/*For IE7-8-9*/ + + z-index: 1000; + box-shadow: 1px 1px 1px rgba(0, 0, 0, .4); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, "width, height"); + } + + &:hover:before, + &:focus:before, + &:active:before { + width: $curlWidth; + height: $curlHeight; + } +} diff --git a/assets/js/scss/effects/curls/_curl-top-right.scss b/assets/js/scss/effects/curls/_curl-top-right.scss new file mode 100644 index 0000000..9972652 --- /dev/null +++ b/assets/js/scss/effects/curls/_curl-top-right.scss @@ -0,0 +1,33 @@ +/* Curl Top Right */ +@mixin curl-top-right { + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + content: ''; + height: 0; + width: 0; + top: 0; + right: 0; + background: $revealAreaColor; /* IE9 */ + background: linear-gradient( + 225deg, + $revealAreaColor 45%, + $curlLineColor 50%, + $curlTransitionColor 56%, + $curlLastColor 80% + ); + box-shadow: -1px 1px 1px rgba(0, 0, 0, .4); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, "width, height"); + } + + &:hover:before, + &:focus:before, + &:active:before { + width: $curlWidth; + height: $curlHeight; + } +} diff --git a/assets/js/scss/effects/icons/_icon-back.scss b/assets/js/scss/effects/icons/_icon-back.scss new file mode 100644 index 0000000..c878d05 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-back.scss @@ -0,0 +1,21 @@ +/* Icon Back */ +@mixin icon-back { + @include hacks(); + @include prefixed(transition-duration, $fastDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $fastDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, translateX(-4px)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-bob.scss b/assets/js/scss/effects/icons/_icon-bob.scss new file mode 100644 index 0000000..2eb1961 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-bob.scss @@ -0,0 +1,42 @@ +/* Icon Bob */ +@include keyframes(#{$nameSpace}-icon-bob) { + 0% { + @include prefixed(transform, translateY(-6px)); + } + 50% { + @include prefixed(transform, translateY(-2px)); + } + 100% { + @include prefixed(transform, translateY(-6px)); + } +} + +@include keyframes(#{$nameSpace}-icon-bob-float) { + 100% { + @include prefixed(transform, translateY(-6px)); + } +} + +@mixin icon-bob { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, "#{$nameSpace}-icon-bob-float, #{$nameSpace}-icon-bob"); + @include prefixed(animation-duration, ".3s, 1.5s"); + @include prefixed(animation-delay, "0s, .3s"); + @include prefixed(animation-timing-function, "ease-out, ease-in-out"); + @include prefixed(animation-iteration-count, "1, infinite"); + @include prefixed(animation-fill-mode, "forwards"); + @include prefixed(animation-direction, "normal, alternate"); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-bounce-out.scss b/assets/js/scss/effects/icons/_icon-bounce-out.scss new file mode 100644 index 0000000..f1880b2 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-bounce-out.scss @@ -0,0 +1,28 @@ +/* Icon Bounce Out */ +@include keyframes(#{$nameSpace}-icon-bounce-out) { + 50% { + @include prefixed(transform, scale(1.5)); + } +} + +@mixin icon-bounce-out { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, scale(.9)); + @include prefixed(transition-timing-function, cubic-bezier(.47,2.02,.31,-0.36)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-bounce.scss b/assets/js/scss/effects/icons/_icon-bounce.scss new file mode 100644 index 0000000..09953b0 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-bounce.scss @@ -0,0 +1,23 @@ +/* Icon Bounce */ + +@mixin icon-bounce { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, scale(1.5)); + @include prefixed(transition-timing-function, cubic-bezier(.47,2.02,.31,-0.36)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-buzz-out.scss b/assets/js/scss/effects/icons/_icon-buzz-out.scss new file mode 100644 index 0000000..bd8b4e3 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-buzz-out.scss @@ -0,0 +1,63 @@ +/* Icon Buzz Out */ +@include keyframes(#{$nameSpace}-icon-buzz-out) { + 10% { + @include prefixed(transform, translateX(3px) rotate(2deg)); + } + + 20% { + @include prefixed(transform, translateX(-3px) rotate(-2deg)); + } + + 30% { + @include prefixed(transform, translateX(3px) rotate(2deg)); + } + + 40% { + @include prefixed(transform, translateX(-3px) rotate(-2deg)); + } + + 50% { + @include prefixed(transform, translateX(2px) rotate(1deg)); + } + + 60% { + @include prefixed(transform, translateX(-2px) rotate(-1deg)); + } + + 70% { + @include prefixed(transform, translateX(2px) rotate(1deg)); + } + + 80% { + @include prefixed(transform, translateX(-2px) rotate(-1deg)); + } + + 90% { + @include prefixed(transform, translateX(1px) rotate(0)); + } + + 100% { + @include prefixed(transform, translateX(-1px) rotate(0)); + } +} + +@mixin icon-buzz-out { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-buzz-out); + @include prefixed(animation-duration, .75s); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-buzz.scss b/assets/js/scss/effects/icons/_icon-buzz.scss new file mode 100644 index 0000000..dcfb0b2 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-buzz.scss @@ -0,0 +1,31 @@ +/* Icon Buzz */ +@include keyframes(#{$nameSpace}-icon-buzz) { + 50% { + @include prefixed(transform, translateX(3px) rotate(2deg)); + } + + 100% { + @include prefixed(transform, translateX(-3px) rotate(-2deg)); + } +} + +@mixin icon-buzz { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-buzz); + @include prefixed(animation-duration, .15s); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-down.scss b/assets/js/scss/effects/icons/_icon-down.scss new file mode 100644 index 0000000..3e2244d --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-down.scss @@ -0,0 +1,32 @@ +/* Icon Down */ +@include keyframes(#{$nameSpace}-icon-down) { + 0%, + 50%, + 100% { + @include prefixed(transform, translateY(0)); + } + 25%, + 75% { + @include prefixed(transform, translateY(6px)); + } +} + +/* Icon Down */ +@mixin icon-down { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-down); + @include prefixed(animation-duration, .75s); + @include prefixed(animation-timing-function, ease-out); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-drop.scss b/assets/js/scss/effects/icons/_icon-drop.scss new file mode 100644 index 0000000..591d963 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-drop.scss @@ -0,0 +1,42 @@ +/* Icon Drop */ +@include keyframes(#{$nameSpace}-icon-drop) { + 0% { + opacity: 0; + + } + + 50% { + opacity: 0; + @include prefixed(transform, translateY(-100%)); + } + + 51%, + 100% { + opacity: 1; + } +} + +/* Icon Drop */ +@mixin icon-drop { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + opacity: 0; + @include prefixed(transition-duration, #{$mediumDuration}); + @include prefixed(animation-name, #{$nameSpace}-icon-drop); + @include prefixed(animation-duration, #{$slowDuration}); + @include prefixed(animation-delay, #{$mediumDuration}); + @include prefixed(animation-fill-mode, forwards); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-timing-function, cubic-bezier(.52,1.64,.37,.66)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-fade.scss b/assets/js/scss/effects/icons/_icon-fade.scss new file mode 100644 index 0000000..310ae92 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-fade.scss @@ -0,0 +1,19 @@ +/* Icon Fade */ +@mixin icon-fade { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, .5s); + @include prefixed(transition-property, color); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + color: #0F9E5E; + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-float-away.scss b/assets/js/scss/effects/icons/_icon-float-away.scss new file mode 100644 index 0000000..2fc8611 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-float-away.scss @@ -0,0 +1,32 @@ +/* Icon Float Away */ +@include keyframes(#{$nameSpace}-icon-float-away) { + 0% { + opacity: 1; + } + + 100% { + opacity: 0; + @include prefixed(transform, translateY(-1em)); + } +} + +/* Icon Float Away */ +@mixin icon-float-away { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(animation-duration, #{$slowDuration}); + @include prefixed(animation-fill-mode, forwards); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-float-away); + @include prefixed(animation-timing-function, ease-out); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-float.scss b/assets/js/scss/effects/icons/_icon-float.scss new file mode 100644 index 0000000..e8230c2 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-float.scss @@ -0,0 +1,21 @@ +/* Icon Float */ +@mixin icon-float { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, translateY(-4px)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-forward.scss b/assets/js/scss/effects/icons/_icon-forward.scss new file mode 100644 index 0000000..efe7884 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-forward.scss @@ -0,0 +1,21 @@ +/* Icon Forward */ +@mixin icon-forward { + @include hacks(); + @include prefixed(transition-duration, $fastDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $fastDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, translateX(4px)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-grow-rotate.scss b/assets/js/scss/effects/icons/_icon-grow-rotate.scss new file mode 100644 index 0000000..3ecd480 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-grow-rotate.scss @@ -0,0 +1,23 @@ +/* Icon Grow Rotate */ +@mixin icon-grow-rotate { + $duration: $mediumDuration; + + @include hacks(); + @include prefixed(transition-duration, $duration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, scale(1.5) rotate(12deg)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-grow.scss b/assets/js/scss/effects/icons/_icon-grow.scss new file mode 100644 index 0000000..883b3fa --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-grow.scss @@ -0,0 +1,21 @@ +/* Icon Grow */ +@mixin icon-grow { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, scale(1.3) translateZ(0)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-hang.scss b/assets/js/scss/effects/icons/_icon-hang.scss new file mode 100644 index 0000000..de08ebf --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-hang.scss @@ -0,0 +1,42 @@ +/* Icon Hang */ +@include keyframes(#{$nameSpace}-icon-hang) { + 0% { + @include prefixed(transform, translateY(6px)); + } + 50% { + @include prefixed(transform, translateY(2px)); + } + 100% { + @include prefixed(transform, translateY(6px)); + } +} + +@include keyframes(#{$nameSpace}-icon-hang-sink) { + 100% { + @include prefixed(transform, translateY(6px)); + } +} + +@mixin icon-hang { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, "#{$nameSpace}-icon-hang-sink, #{$nameSpace}-icon-hang"); + @include prefixed(animation-duration, ".3s, 1.5s"); + @include prefixed(animation-delay, "0s, .3s"); + @include prefixed(animation-timing-function, "ease-out, ease-in-out"); + @include prefixed(animation-iteration-count, "1, infinite"); + @include prefixed(animation-fill-mode, "forwards"); + @include prefixed(animation-direction, "normal, alternate"); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-pop.scss b/assets/js/scss/effects/icons/_icon-pop.scss new file mode 100644 index 0000000..7a02a6c --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-pop.scss @@ -0,0 +1,30 @@ +/* Icon Pop */ +@include keyframes(#{$nameSpace}-icon-pop) { + 50% { + @include prefixed(transform, scale(1.5)); + } +} + +@mixin icon-pop { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-pop); + @include prefixed(animation-duration, $mediumDuration); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-pulse-grow.scss b/assets/js/scss/effects/icons/_icon-pulse-grow.scss new file mode 100644 index 0000000..40014ce --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-pulse-grow.scss @@ -0,0 +1,28 @@ +/* Icon Pulse Grow */ +@include keyframes(#{$nameSpace}-icon-pulse-grow) { + to { + @include prefixed(transform, scale(1.3)); + } +} + +@mixin icon-pulse-grow { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-pulse-grow); + @include prefixed(animation-duration, $mediumDuration); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + @include prefixed(animation-direction, alternate); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-pulse-shrink.scss b/assets/js/scss/effects/icons/_icon-pulse-shrink.scss new file mode 100644 index 0000000..4f81cb7 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-pulse-shrink.scss @@ -0,0 +1,28 @@ +/* Icon Pulse Shrink */ +@include keyframes(#{$nameSpace}-icon-pulse-shrink) { + to { + @include prefixed(transform, scale(.8)); + } +} + +@mixin icon-pulse-shrink { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-pulse-shrink); + @include prefixed(animation-duration, $mediumDuration); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + @include prefixed(animation-direction, alternate); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-pulse.scss b/assets/js/scss/effects/icons/_icon-pulse.scss new file mode 100644 index 0000000..9a4616c --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-pulse.scss @@ -0,0 +1,31 @@ +/* Icon Pulse */ +@include keyframes(#{$nameSpace}-icon-pulse) { + 25% { + @include prefixed(transform, scale(1.3)); + } + + 75% { + @include prefixed(transform, scale(.8)); + } +} + +@mixin icon-pulse { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-pulse); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, infinite); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-push.scss b/assets/js/scss/effects/icons/_icon-push.scss new file mode 100644 index 0000000..35432dc --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-push.scss @@ -0,0 +1,30 @@ +/* Icon Push */ +@include keyframes(#{$nameSpace}-icon-push) { + 50% { + @include prefixed(transform, scale(.5)); + } +} + +@mixin icon-push { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-push); + @include prefixed(animation-duration, $mediumDuration); + @include prefixed(animation-timing-function, linear); + @include prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-rotate.scss b/assets/js/scss/effects/icons/_icon-rotate.scss new file mode 100644 index 0000000..d8da2a3 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-rotate.scss @@ -0,0 +1,23 @@ +/* Icon Rotate */ +@mixin icon-rotate { + $duration: $mediumDuration; + + @include hacks(); + @include prefixed(transition-duration, $duration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $duration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, rotate(20deg)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-shrink.scss b/assets/js/scss/effects/icons/_icon-shrink.scss new file mode 100644 index 0000000..2d1d2ed --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-shrink.scss @@ -0,0 +1,21 @@ +/* Icon Shrink */ +@mixin icon-shrink { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, scale(.8)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-sink-away.scss b/assets/js/scss/effects/icons/_icon-sink-away.scss new file mode 100644 index 0000000..2a4c96c --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-sink-away.scss @@ -0,0 +1,32 @@ +/* Icon Sink Away */ +@include keyframes(#{$nameSpace}-icon-sink-away) { + 0% { + opacity: 1; + } + + 100% { + opacity: 0; + @include prefixed(transform, translateY(1em)); + } +} + +/* Icon Sink Away */ +@mixin icon-sink-away { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(animation-duration, #{$slowDuration}); + @include prefixed(animation-fill-mode, forwards); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-sink-away); + @include prefixed(animation-timing-function, ease-out); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-sink.scss b/assets/js/scss/effects/icons/_icon-sink.scss new file mode 100644 index 0000000..f093ff7 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-sink.scss @@ -0,0 +1,21 @@ +/* Icon Sink */ +@mixin icon-sink { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, translateY(4px)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-spin.scss b/assets/js/scss/effects/icons/_icon-spin.scss new file mode 100644 index 0000000..935daf6 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-spin.scss @@ -0,0 +1,19 @@ +/* Icon Spin */ +@mixin icon-spin { + @include hacks(); + + .hvr-icon { + @include prefixed(transition-duration, 1s); + @include prefixed(transition-property, transform); + @include prefixed(transition-timing-function, ease-in-out); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(transform, rotate(360deg)); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-up.scss b/assets/js/scss/effects/icons/_icon-up.scss new file mode 100644 index 0000000..fc44c86 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-up.scss @@ -0,0 +1,32 @@ +/* Icon Up */ +@include keyframes(#{$nameSpace}-icon-up) { + 0%, + 50%, + 100% { + @include prefixed(transform, translateY(0)); + } + 25%, + 75% { + @include prefixed(transform, translateY(-6px)); + } +} + +/* Icon Up */ +@mixin icon-up { + @include hacks(); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-up); + @include prefixed(animation-duration, .75s); + @include prefixed(animation-timing-function, ease-out); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-wobble-horizontal.scss b/assets/js/scss/effects/icons/_icon-wobble-horizontal.scss new file mode 100644 index 0000000..6828baa --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-wobble-horizontal.scss @@ -0,0 +1,47 @@ +/* Icon Wobble Horizontal */ +@include keyframes(#{$nameSpace}-icon-wobble-horizontal) { + 16.65% { + @include prefixed(transform, translateX(6px)); + } + + 33.3% { + @include prefixed(transform, translateX(-5px)); + } + + 49.95% { + @include prefixed(transform, translateX(4px)); + } + + 66.6% { + @include prefixed(transform, translateX(-2px)); + } + + 83.25% { + @include prefixed(transform, translateX(1px)); + } + + 100% { + @include prefixed(transform, translateX(0)); + } +} + +@mixin icon-wobble-horizontal { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-wobble-horizontal); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/scss/effects/icons/_icon-wobble-vertical.scss b/assets/js/scss/effects/icons/_icon-wobble-vertical.scss new file mode 100644 index 0000000..3f63886 --- /dev/null +++ b/assets/js/scss/effects/icons/_icon-wobble-vertical.scss @@ -0,0 +1,47 @@ +/* Icon Wobble Vertical */ +@include keyframes(#{$nameSpace}-icon-wobble-vertical) { + 16.65% { + @include prefixed(transform, translateY(6px)); + } + + 33.3% { + @include prefixed(transform, translateY(-5px)); + } + + 49.95% { + @include prefixed(transform, translateY(4px)); + } + + 66.6% { + @include prefixed(transform, translateY(-2px)); + } + + 83.25% { + @include prefixed(transform, translateY(1px)); + } + + 100% { + @include prefixed(transform, translateY(0)); + } +} + +@mixin icon-wobble-vertical { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + + .hvr-icon { + @include prefixed(transform, translateZ(0)); + } + + &:hover, + &:focus, + &:active { + + .hvr-icon { + @include prefixed(animation-name, #{$nameSpace}-icon-wobble-vertical); + @include prefixed(animation-duration, 1s); + @include prefixed(animation-timing-function, ease-in-out); + @include prefixed(animation-iteration-count, 1); + } + } +} diff --git a/assets/js/scss/effects/shadow-and-glow-transitions/_box-shadow-inset.scss b/assets/js/scss/effects/shadow-and-glow-transitions/_box-shadow-inset.scss new file mode 100644 index 0000000..3255244 --- /dev/null +++ b/assets/js/scss/effects/shadow-and-glow-transitions/_box-shadow-inset.scss @@ -0,0 +1,16 @@ +/* Box Shadow Inset */ +@mixin box-shadow-inset { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, box-shadow); + + box-shadow: inset 0 0 0 $shadowColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + + &:hover, + &:focus, + &:active { + box-shadow: inset 2px 2px 2px $shadowColor, + 0 0 1px rgba(0, 0, 0, 0); /* Hack to improve aliasing on mobile/tablet devices */ + } +} diff --git a/assets/js/scss/effects/shadow-and-glow-transitions/_box-shadow-outset.scss b/assets/js/scss/effects/shadow-and-glow-transitions/_box-shadow-outset.scss new file mode 100644 index 0000000..1ed5b90 --- /dev/null +++ b/assets/js/scss/effects/shadow-and-glow-transitions/_box-shadow-outset.scss @@ -0,0 +1,12 @@ +/* Box Shadow Outset */ +@mixin box-shadow-outset { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, box-shadow); + + &:hover, + &:focus, + &:active { + box-shadow: 2px 2px 2px $shadowColor; + } +} diff --git a/assets/js/scss/effects/shadow-and-glow-transitions/_float-shadow.scss b/assets/js/scss/effects/shadow-and-glow-transitions/_float-shadow.scss new file mode 100644 index 0000000..fbde9a2 --- /dev/null +++ b/assets/js/scss/effects/shadow-and-glow-transitions/_float-shadow.scss @@ -0,0 +1,34 @@ +/* Float Shadow */ +@mixin float-shadow { + @include hacks(); + position: relative; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + top: 100%; + left: 5%; + height: 10px; + width: 90%; + opacity: 0; + background: -webkit-radial-gradient(center, ellipse, rgba(0,0,0,.35) 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at center, rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 80%); /* W3C */ + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, "transform, opacity"); + } + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateY(-5px)); /* move the element up by 5px */ + + &:before { + opacity: 1; + @include prefixed(transform, translateY(5px)); /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */ + } + } +} diff --git a/assets/js/scss/effects/shadow-and-glow-transitions/_glow.scss b/assets/js/scss/effects/shadow-and-glow-transitions/_glow.scss new file mode 100644 index 0000000..519de87 --- /dev/null +++ b/assets/js/scss/effects/shadow-and-glow-transitions/_glow.scss @@ -0,0 +1,12 @@ +/* Glow */ +@mixin glow { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, box-shadow); + + &:hover, + &:focus, + &:active { + box-shadow: 0 0 8px $shadowColor; + } +} diff --git a/assets/js/scss/effects/shadow-and-glow-transitions/_grow-shadow.scss b/assets/js/scss/effects/shadow-and-glow-transitions/_grow-shadow.scss new file mode 100644 index 0000000..7b0b7d7 --- /dev/null +++ b/assets/js/scss/effects/shadow-and-glow-transitions/_grow-shadow.scss @@ -0,0 +1,13 @@ +/* Grow Shadow */ +@mixin grow-shadow { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, "box-shadow, transform"); + + &:hover, + &:focus, + &:active { + box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); + @include prefixed(transform, scale(1.1)); + } +} diff --git a/assets/js/scss/effects/shadow-and-glow-transitions/_shadow-radial.scss b/assets/js/scss/effects/shadow-and-glow-transitions/_shadow-radial.scss new file mode 100644 index 0000000..8f35b54 --- /dev/null +++ b/assets/js/scss/effects/shadow-and-glow-transitions/_shadow-radial.scss @@ -0,0 +1,41 @@ +/* Shadow Radial */ +@mixin shadow-radial { + @include hacks(); + position: relative; + + &:before, + &:after { + pointer-events: none; + position: absolute; + content: ''; + left: 0; + width: 100%; + box-sizing: border-box; + background-repeat: no-repeat; + height: 5px; + opacity: 0; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, opacity); + } + + &:before { + bottom: 100%; + background: -webkit-radial-gradient(50% 150%, ellipse, $shadowColor 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at 50% 150%, $shadowColor 0%, rgba(0, 0, 0, 0) 80%); + } + + &:after { + top: 100%; + background: -webkit-radial-gradient(50% -50%, ellipse, $shadowColor 0%, rgba(0, 0, 0, 0) 80%); + background: radial-gradient(ellipse at 50% -50%, $shadowColor 0%, rgba(0, 0, 0, 0) 80%); + } + + &:hover:before, + &:focus:before, + &:active:before, + &:hover:after, + &:focus:after, + &:active:after { + opacity: 1; + } +} diff --git a/assets/js/scss/effects/shadow-and-glow-transitions/_shadow.scss b/assets/js/scss/effects/shadow-and-glow-transitions/_shadow.scss new file mode 100644 index 0000000..d4f4d16 --- /dev/null +++ b/assets/js/scss/effects/shadow-and-glow-transitions/_shadow.scss @@ -0,0 +1,12 @@ +/* Shadow */ +@mixin shadow { + @include hacks(); + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, box-shadow); + + &:hover, + &:focus, + &:active { + box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); + } +} diff --git a/assets/js/scss/effects/speech-bubbles/_bubble-bottom.scss b/assets/js/scss/effects/speech-bubbles/_bubble-bottom.scss new file mode 100644 index 0000000..2a83cd7 --- /dev/null +++ b/assets/js/scss/effects/speech-bubbles/_bubble-bottom.scss @@ -0,0 +1,25 @@ +/* Bubble Bottom */ +@mixin bubble-bottom { + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + left: calc(50% - #{$tipWidth}); + bottom: 0; + border-width: $tipHeight $tipWidth 0 $tipWidth; + border-color: $tipColor transparent transparent transparent; + } + + &:hover:before, + &:focus:before, + &:active:before { + @include prefixed(transform, translateY($tipHeight)); + } +} diff --git a/assets/js/scss/effects/speech-bubbles/_bubble-float-bottom.scss b/assets/js/scss/effects/speech-bubbles/_bubble-float-bottom.scss new file mode 100644 index 0000000..1980e05 --- /dev/null +++ b/assets/js/scss/effects/speech-bubbles/_bubble-float-bottom.scss @@ -0,0 +1,30 @@ +/* Bubble Float Bottom */ +@mixin bubble-float-bottom { + @include hacks(); + position: relative; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:before { + position: absolute; + z-index: -1; + content: ''; + left: calc(50% - #{$tipWidth}); + bottom: 0; + border-style: solid; + border-width: $tipHeight $tipWidth 0 $tipWidth; + border-color: $tipColor transparent transparent transparent; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + } + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateY(-($tipHeight))); + + &:before { + @include prefixed(transform, translateY($tipHeight)); + } + } +} diff --git a/assets/js/scss/effects/speech-bubbles/_bubble-float-left.scss b/assets/js/scss/effects/speech-bubbles/_bubble-float-left.scss new file mode 100644 index 0000000..52dc889 --- /dev/null +++ b/assets/js/scss/effects/speech-bubbles/_bubble-float-left.scss @@ -0,0 +1,30 @@ +/* Bubble Float Left */ +@mixin bubble-float-left { + @include hacks(); + position: relative; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:before { + position: absolute; + z-index: -1; + content: ''; + top: calc(50% - #{$tipHeight}); + left: 0; + border-style: solid; + border-width: $tipHeight $tipWidth $tipHeight 0; + border-color: transparent $tipColor transparent transparent; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + } + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateX($tipWidth)); + + &:before { + @include prefixed(transform, translateX(-($tipWidth))); + } + } +} diff --git a/assets/js/scss/effects/speech-bubbles/_bubble-float-right.scss b/assets/js/scss/effects/speech-bubbles/_bubble-float-right.scss new file mode 100644 index 0000000..8e924b0 --- /dev/null +++ b/assets/js/scss/effects/speech-bubbles/_bubble-float-right.scss @@ -0,0 +1,30 @@ +/* Bubble Float Right */ +@mixin bubble-float-right { + @include hacks(); + position: relative; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:before { + position: absolute; + z-index: -1; + top: calc(50% - #{$tipHeight}); + right: 0; + content: ''; + border-style: solid; + border-width: $tipHeight 0 $tipHeight $tipWidth; + border-color: transparent transparent transparent $tipColor; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + } + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateX(-($tipWidth))); + + &:before { + @include prefixed(transform, translateX($tipWidth)); + } + } +} diff --git a/assets/js/scss/effects/speech-bubbles/_bubble-float-top.scss b/assets/js/scss/effects/speech-bubbles/_bubble-float-top.scss new file mode 100644 index 0000000..547e2fc --- /dev/null +++ b/assets/js/scss/effects/speech-bubbles/_bubble-float-top.scss @@ -0,0 +1,30 @@ +/* Bubble Float Top */ +@mixin bubble-float-top { + @include hacks(); + position: relative; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + + &:before { + position: absolute; + z-index: -1; + content: ''; + left: calc(50% - #{$tipWidth}); + top: 0; + border-style: solid; + border-width: 0 $tipWidth $tipHeight $tipWidth; + border-color: transparent transparent $tipColor transparent; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + } + + &:hover, + &:focus, + &:active { + @include prefixed(transform, translateY($tipHeight)); + + &:before { + @include prefixed(transform, translateY(-($tipHeight))); + } + } +} diff --git a/assets/js/scss/effects/speech-bubbles/_bubble-left.scss b/assets/js/scss/effects/speech-bubbles/_bubble-left.scss new file mode 100644 index 0000000..a42498b --- /dev/null +++ b/assets/js/scss/effects/speech-bubbles/_bubble-left.scss @@ -0,0 +1,25 @@ +/* Bubble Left */ +@mixin bubble-left { + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + top: calc(50% - #{$tipHeight}); + left: 0; + border-width: $tipHeight $tipWidth $tipHeight 0; + border-color: transparent $tipColor transparent transparent; + } + + &:hover:before, + &:focus:before, + &:active:before { + @include prefixed(transform, translateX(-($tipWidth))); + } +} diff --git a/assets/js/scss/effects/speech-bubbles/_bubble-right.scss b/assets/js/scss/effects/speech-bubbles/_bubble-right.scss new file mode 100644 index 0000000..e5c0a07 --- /dev/null +++ b/assets/js/scss/effects/speech-bubbles/_bubble-right.scss @@ -0,0 +1,25 @@ +/* Bubble Right */ +@mixin bubble-right { + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + top: calc(50% - #{$tipHeight}); + right: 0; + border-width: $tipHeight 0 $tipHeight $tipWidth; + border-color: transparent transparent transparent $tipColor; + } + + &:hover:before, + &:focus:before, + &:active:before { + @include prefixed(transform, translateX($tipWidth)); + } +} diff --git a/assets/js/scss/effects/speech-bubbles/_bubble-top.scss b/assets/js/scss/effects/speech-bubbles/_bubble-top.scss new file mode 100644 index 0000000..ca48ca5 --- /dev/null +++ b/assets/js/scss/effects/speech-bubbles/_bubble-top.scss @@ -0,0 +1,25 @@ +/* Bubble Top */ +@mixin bubble-top { + @include hacks(); + position: relative; + + &:before { + pointer-events: none; + position: absolute; + z-index: -1; + content: ''; + border-style: solid; + @include prefixed(transition-duration, $mediumDuration); + @include prefixed(transition-property, transform); + left: calc(50% - #{$tipWidth}); + top: 0; + border-width: 0 $tipWidth $tipHeight $tipWidth; + border-color: transparent transparent $tipColor transparent; + } + + &:hover:before, + &:focus:before, + &:active:before { + @include prefixed(transform, translateY(-($tipHeight))); + } +} diff --git a/assets/js/scss/hover.scss b/assets/js/scss/hover.scss new file mode 100644 index 0000000..5eb0b19 --- /dev/null +++ b/assets/js/scss/hover.scss @@ -0,0 +1,793 @@ +/*! + * Hover.css (http://ianlunn.github.io/Hover/) + * Version: 2.3.2 + * Author: Ian Lunn @IanLunn + * Author URL: http://ianlunn.co.uk/ + * Github: https://github.com/IanLunn/Hover + + * Hover.css Copyright Ian Lunn 2017. Generated with Sass. + */ + +@import "options"; +@import "mixins"; +@import "hacks"; + + +/* 2D TRANSITIONS */ +@import "effects/2d-transitions/grow"; +@if $includeClasses { + .#{$nameSpace}-grow { + @include grow(); + } +} + +@import "effects/2d-transitions/shrink"; +@if $includeClasses { + .#{$nameSpace}-shrink { + @include shrink(); + } +} + +@import "effects/2d-transitions/pulse"; +@if $includeClasses { + .#{$nameSpace}-pulse { + @include pulse(); + } +} + +@import "effects/2d-transitions/pulse-grow"; +@if $includeClasses { + .#{$nameSpace}-pulse-grow { + @include pulse-grow(); + } +} + +@import "effects/2d-transitions/pulse-shrink"; +@if $includeClasses { + .#{$nameSpace}-pulse-shrink { + @include pulse-shrink(); + } +} + +@import "effects/2d-transitions/push"; +@if $includeClasses { + .#{$nameSpace}-push { + @include push(); + } +} + +@import "effects/2d-transitions/pop"; +@if $includeClasses { + .#{$nameSpace}-pop { + @include pop(); + } +} + +@import "effects/2d-transitions/bounce-in"; +@if $includeClasses { + .#{$nameSpace}-bounce-in { + @include bounce-in(); + } +} + +@import "effects/2d-transitions/bounce-out"; +@if $includeClasses { + .#{$nameSpace}-bounce-out { + @include bounce-out(); + } +} + +@import "effects/2d-transitions/rotate"; +@if $includeClasses { + .#{$nameSpace}-rotate { + @include rotate(); + } +} + +@import "effects/2d-transitions/grow-rotate"; +@if $includeClasses { + .#{$nameSpace}-grow-rotate { + @include grow-rotate(); + } +} + +@import "effects/2d-transitions/float"; +@if $includeClasses { + .#{$nameSpace}-float { + @include float(); + } +} + +@import "effects/2d-transitions/sink"; +@if $includeClasses { + .#{$nameSpace}-sink { + @include sink(); + } +} + +@import "effects/2d-transitions/bob"; +@if $includeClasses { + .#{$nameSpace}-bob { + @include bob(); + } +} + +@import "effects/2d-transitions/hang"; +@if $includeClasses { + .#{$nameSpace}-hang { + @include hang(); + } +} + +@import "effects/2d-transitions/skew"; +@if $includeClasses { + .#{$nameSpace}-skew { + @include skew(); + } +} + +@import "effects/2d-transitions/skew-forward"; +@if $includeClasses { + .#{$nameSpace}-skew-forward { + @include skew-forward(); + } +} + +@import "effects/2d-transitions/skew-backward"; +@if $includeClasses { + .#{$nameSpace}-skew-backward { + @include skew-backward(); + } +} + +@import "effects/2d-transitions/wobble-vertical"; +@if $includeClasses { + .#{$nameSpace}-wobble-vertical { + @include wobble-vertical(); + } +} + +@import "effects/2d-transitions/wobble-horizontal"; +@if $includeClasses { + .#{$nameSpace}-wobble-horizontal { + @include wobble-horizontal(); + } +} + +@import "effects/2d-transitions/wobble-to-bottom-right"; +@if $includeClasses { + .#{$nameSpace}-wobble-to-bottom-right { + @include wobble-to-bottom-right(); + } +} + +@import "effects/2d-transitions/wobble-to-top-right"; +@if $includeClasses { + .#{$nameSpace}-wobble-to-top-right { + @include wobble-to-top-right(); + } +} + +@import "effects/2d-transitions/wobble-top"; +@if $includeClasses { + .#{$nameSpace}-wobble-top { + @include wobble-top(); + } +} + +@import "effects/2d-transitions/wobble-bottom"; +@if $includeClasses { + .#{$nameSpace}-wobble-bottom { + @include wobble-bottom(); + } +} + +@import "effects/2d-transitions/wobble-skew"; +@if $includeClasses { + .#{$nameSpace}-wobble-skew { + @include wobble-skew(); + } +} + +@import "effects/2d-transitions/buzz"; +@if $includeClasses { + .#{$nameSpace}-buzz { + @include buzz(); + } +} + +@import "effects/2d-transitions/buzz-out"; +@if $includeClasses { + .#{$nameSpace}-buzz-out { + @include buzz-out(); + } +} + +@import "effects/2d-transitions/forward"; +@if $includeClasses { + .#{$nameSpace}-forward { + @include forward(); + } +} + +@import "effects/2d-transitions/backward"; +@if $includeClasses { + .#{$nameSpace}-backward { + @include backward(); + } +} + +/* BACKGROUND TRANSITIONS */ +@import "effects/background-transitions/fade"; +@if $includeClasses { + .#{$nameSpace}-fade { + @include fade(); + } +} + +@import "effects/background-transitions/back-pulse"; +@if $includeClasses { + .#{$nameSpace}-back-pulse { + @include back-pulse(); + } +} + +@import "effects/background-transitions/sweep-to-right"; +@if $includeClasses { + .#{$nameSpace}-sweep-to-right { + @include sweep-to-right(); + } +} + +@import "effects/background-transitions/sweep-to-left"; +@if $includeClasses { + .#{$nameSpace}-sweep-to-left { + @include sweep-to-left(); + } +} + +@import "effects/background-transitions/sweep-to-bottom"; +@if $includeClasses { + .#{$nameSpace}-sweep-to-bottom { + @include sweep-to-bottom(); + } +} + +@import "effects/background-transitions/sweep-to-top"; +@if $includeClasses { + .#{$nameSpace}-sweep-to-top { + @include sweep-to-top(); + } +} + +@import "effects/background-transitions/bounce-to-right"; +@if $includeClasses { + .#{$nameSpace}-bounce-to-right { + @include bounce-to-right(); + } +} + +@import "effects/background-transitions/bounce-to-left"; +@if $includeClasses { + .#{$nameSpace}-bounce-to-left { + @include bounce-to-left(); + } +} + +@import "effects/background-transitions/bounce-to-bottom"; +@if $includeClasses { + .#{$nameSpace}-bounce-to-bottom { + @include bounce-to-bottom(); + } +} + +@import "effects/background-transitions/bounce-to-top"; +@if $includeClasses { + .#{$nameSpace}-bounce-to-top { + @include bounce-to-top(); + } +} + +@import "effects/background-transitions/radial-out"; +@if $includeClasses { + .#{$nameSpace}-radial-out { + @include radial-out(); + } +} + +@import "effects/background-transitions/radial-in"; +@if $includeClasses { + .#{$nameSpace}-radial-in { + @include radial-in(); + } +} + +@import "effects/background-transitions/rectangle-in"; +@if $includeClasses { + .#{$nameSpace}-rectangle-in { + @include rectangle-in(); + } +} + +@import "effects/background-transitions/rectangle-out"; +@if $includeClasses { + .#{$nameSpace}-rectangle-out { + @include rectangle-out(); + } +} + +@import "effects/background-transitions/shutter-in-horizontal"; +@if $includeClasses { + .#{$nameSpace}-shutter-in-horizontal { + @include shutter-in-horizontal(); + } +} + +@import "effects/background-transitions/shutter-out-horizontal"; +@if $includeClasses { + .#{$nameSpace}-shutter-out-horizontal { + @include shutter-out-horizontal(); + } +} + +@import "effects/background-transitions/shutter-in-vertical"; +@if $includeClasses { + .#{$nameSpace}-shutter-in-vertical { + @include shutter-in-vertical(); + } +} + +@import "effects/background-transitions/shutter-out-vertical"; +@if $includeClasses { + .#{$nameSpace}-shutter-out-vertical { + @include shutter-out-vertical(); + } +} + + +/* BORDER TRANSITIONS */ +@import "effects/border-transitions/border-fade"; +@if $includeClasses { + .#{$nameSpace}-border-fade { + @include border-fade(); + } +} + +@import "effects/border-transitions/hollow"; +@if $includeClasses { + .#{$nameSpace}-hollow { + @include hollow(); + } +} + +@import "effects/border-transitions/trim"; +@if $includeClasses { + .#{$nameSpace}-trim { + @include trim(); + } +} + +@import "effects/border-transitions/ripple-out"; +@if $includeClasses { + .#{$nameSpace}-ripple-out { + @include ripple-out(); + } +} + +@import "effects/border-transitions/ripple-in"; +@if $includeClasses { + .#{$nameSpace}-ripple-in { + @include ripple-in(); + } +} + +@import "effects/border-transitions/outline-out"; +@if $includeClasses { + .#{$nameSpace}-outline-out { + @include outline-out(); + } +} + +@import "effects/border-transitions/outline-in"; +@if $includeClasses { + .#{$nameSpace}-outline-in { + @include outline-in(); + } +} + +@import "effects/border-transitions/round-corners"; +@if $includeClasses { + .#{$nameSpace}-round-corners { + @include round-corners(); + } +} + +@import "effects/border-transitions/underline-from-left"; +@if $includeClasses { + .#{$nameSpace}-underline-from-left { + @include underline-from-left(); + } +} + +@import "effects/border-transitions/underline-from-center"; +@if $includeClasses { + .#{$nameSpace}-underline-from-center { + @include underline-from-center(); + } +} + +@import "effects/border-transitions/underline-from-right"; +@if $includeClasses { + .#{$nameSpace}-underline-from-right { + @include underline-from-right(); + } +} + +@import "effects/border-transitions/overline-from-left"; +@if $includeClasses { + .#{$nameSpace}-overline-from-left { + @include overline-from-left(); + } +} + +@import "effects/border-transitions/overline-from-center"; +@if $includeClasses { + .#{$nameSpace}-overline-from-center { + @include overline-from-center(); + } +} + +@import "effects/border-transitions/overline-from-right"; +@if $includeClasses { + .#{$nameSpace}-overline-from-right { + @include overline-from-right(); + } +} + +@import "effects/border-transitions/reveal"; +@if $includeClasses { + .#{$nameSpace}-reveal { + @include reveal(); + } +} + +@import "effects/border-transitions/underline-reveal"; +@if $includeClasses { + .#{$nameSpace}-underline-reveal { + @include underline-reveal(); + } +} + +@import "effects/border-transitions/overline-reveal"; +@if $includeClasses { + .#{$nameSpace}-overline-reveal { + @include overline-reveal(); + } +} + + +/* SHADOW/GLOW TRANSITIONS */ +@import "effects/shadow-and-glow-transitions/glow"; +@if $includeClasses { + .#{$nameSpace}-glow { + @include glow(); + } +} + +@import "effects/shadow-and-glow-transitions/shadow"; +@if $includeClasses { + .#{$nameSpace}-shadow { + @include shadow(); + } +} + +@import "effects/shadow-and-glow-transitions/grow-shadow"; +@if $includeClasses { + .#{$nameSpace}-grow-shadow { + @include grow-shadow(); + } +} + +@import "effects/shadow-and-glow-transitions/box-shadow-outset"; +@if $includeClasses { + .#{$nameSpace}-box-shadow-outset { + @include box-shadow-outset(); + } +} + +@import "effects/shadow-and-glow-transitions/box-shadow-inset"; +@if $includeClasses { + .#{$nameSpace}-box-shadow-inset { + @include box-shadow-inset(); + } +} + +@import "effects/shadow-and-glow-transitions/float-shadow"; +@if $includeClasses { + .#{$nameSpace}-float-shadow { + @include float-shadow(); + } +} + +@import "effects/shadow-and-glow-transitions/shadow-radial"; +@if $includeClasses { + .#{$nameSpace}-shadow-radial { + @include shadow-radial(); + } +} + +/* SPEECH BUBBLES */ +@import "effects/speech-bubbles/bubble-top"; +@if $includeClasses { + .#{$nameSpace}-bubble-top { + @include bubble-top(); + } +} + +@import "effects/speech-bubbles/bubble-right"; +@if $includeClasses { + .#{$nameSpace}-bubble-right { + @include bubble-right(); + } +} + +@import "effects/speech-bubbles/bubble-bottom"; +@if $includeClasses { + .#{$nameSpace}-bubble-bottom { + @include bubble-bottom(); + } +} + +@import "effects/speech-bubbles/bubble-left"; +@if $includeClasses { + .#{$nameSpace}-bubble-left { + @include bubble-left(); + } +} + +@import "effects/speech-bubbles/bubble-float-top"; +@if $includeClasses { + .#{$nameSpace}-bubble-float-top { + @include bubble-float-top(); + } +} + +@import "effects/speech-bubbles/bubble-float-right"; +@if $includeClasses { + .#{$nameSpace}-bubble-float-right { + @include bubble-float-right(); + } +} + +@import "effects/speech-bubbles/bubble-float-bottom"; +@if $includeClasses { + .#{$nameSpace}-bubble-float-bottom { + @include bubble-float-bottom(); + } +} + +@import "effects/speech-bubbles/bubble-float-left"; +@if $includeClasses { + .#{$nameSpace}-bubble-float-left { + @include bubble-float-left(); + } +} + +/* ICONS */ +@import "effects/icons/icon-back"; +@if $includeClasses { + .#{$nameSpace}-icon-back { + @include icon-back(); + } +} + +@import "effects/icons/icon-forward"; +@if $includeClasses { + .#{$nameSpace}-icon-forward { + @include icon-forward(); + } +} + +@import "effects/icons/icon-down"; +@if $includeClasses { + .#{$nameSpace}-icon-down { + @include icon-down(); + } +} + +@import "effects/icons/icon-up"; +@if $includeClasses { + .#{$nameSpace}-icon-up { + @include icon-up(); + } +} + +@import "effects/icons/icon-spin"; +@if $includeClasses { + .#{$nameSpace}-icon-spin { + @include icon-spin(); + } +} + +@import "effects/icons/icon-drop"; +@if $includeClasses { + .#{$nameSpace}-icon-drop { + @include icon-drop(); + } +} + +@import "effects/icons/icon-fade"; +@if $includeClasses { + .#{$nameSpace}-icon-fade { + @include icon-fade(); + } +} + +@import "effects/icons/icon-float-away"; +@if $includeClasses { + .#{$nameSpace}-icon-float-away { + @include icon-float-away(); + } +} + +@import "effects/icons/icon-sink-away"; +@if $includeClasses { + .#{$nameSpace}-icon-sink-away { + @include icon-sink-away(); + } +} + +@import "effects/icons/icon-grow"; +@if $includeClasses { + .#{$nameSpace}-icon-grow { + @include icon-grow(); + } +} + +@import "effects/icons/icon-shrink"; +@if $includeClasses { + .#{$nameSpace}-icon-shrink { + @include icon-shrink(); + } +} + +@import "effects/icons/icon-pulse"; +@if $includeClasses { + .#{$nameSpace}-icon-pulse { + @include icon-pulse(); + } +} + +@import "effects/icons/icon-pulse-grow"; +@if $includeClasses { + .#{$nameSpace}-icon-pulse-grow { + @include icon-pulse-grow(); + } +} + +@import "effects/icons/icon-pulse-shrink"; +@if $includeClasses { + .#{$nameSpace}-icon-pulse-shrink { + @include icon-pulse-shrink(); + } +} + +@import "effects/icons/icon-push"; +@if $includeClasses { + .#{$nameSpace}-icon-push { + @include icon-push(); + } +} + +@import "effects/icons/icon-pop"; +@if $includeClasses { + .#{$nameSpace}-icon-pop { + @include icon-pop(); + } +} + +@import "effects/icons/icon-bounce"; +@if $includeClasses { + .#{$nameSpace}-icon-bounce { + @include icon-bounce(); + } +} + +@import "effects/icons/icon-rotate"; +@if $includeClasses { + .#{$nameSpace}-icon-rotate { + @include icon-rotate(); + } +} + +@import "effects/icons/icon-grow-rotate"; +@if $includeClasses { + .#{$nameSpace}-icon-grow-rotate { + @include icon-grow-rotate(); + } +} + +@import "effects/icons/icon-float"; +@if $includeClasses { + .#{$nameSpace}-icon-float { + @include icon-float(); + } +} + +@import "effects/icons/icon-sink"; +@if $includeClasses { + .#{$nameSpace}-icon-sink { + @include icon-sink(); + } +} + +@import "effects/icons/icon-bob"; +@if $includeClasses { + .#{$nameSpace}-icon-bob { + @include icon-bob(); + } +} + +@import "effects/icons/icon-hang"; +@if $includeClasses { + .#{$nameSpace}-icon-hang { + @include icon-hang(); + } +} + +@import "effects/icons/icon-wobble-horizontal"; +@if $includeClasses { + .#{$nameSpace}-icon-wobble-horizontal { + @include icon-wobble-horizontal(); + } +} + +@import "effects/icons/icon-wobble-vertical"; +@if $includeClasses { + .#{$nameSpace}-icon-wobble-vertical { + @include icon-wobble-vertical(); + } +} + +@import "effects/icons/icon-buzz"; +@if $includeClasses { + .#{$nameSpace}-icon-buzz { + @include icon-buzz(); + } +} + +@import "effects/icons/icon-buzz-out"; +@if $includeClasses { + .#{$nameSpace}-icon-buzz-out { + @include icon-buzz-out(); + } +} + +/* CURLS */ +@import "effects/curls/curl-top-left"; +@if $includeClasses { + .#{$nameSpace}-curl-top-left { + @include curl-top-left(); + } +} + +@import "effects/curls/curl-top-right"; +@if $includeClasses { + .#{$nameSpace}-curl-top-right { + @include curl-top-right(); + } +} + +@import "effects/curls/curl-bottom-right"; +@if $includeClasses { + .#{$nameSpace}-curl-bottom-right { + @include curl-bottom-right(); + } +} + +@import "effects/curls/curl-bottom-left"; +@if $includeClasses { + .#{$nameSpace}-curl-bottom-left { + @include curl-bottom-left(); + } +} diff --git a/assets/js/sequence-logo.png b/assets/js/sequence-logo.png new file mode 100644 index 0000000..d2fbeb1 Binary files /dev/null and b/assets/js/sequence-logo.png differ diff --git a/assets/js/two-up.png b/assets/js/two-up.png new file mode 100644 index 0000000..dfe589a Binary files /dev/null and b/assets/js/two-up.png differ diff --git a/assets/myanimelist.svg b/assets/myanimelist.svg new file mode 100644 index 0000000..1a097a4 --- /dev/null +++ b/assets/myanimelist.svg @@ -0,0 +1 @@ +MyAnimeList \ No newline at end of file diff --git a/assets/ogusers.webp b/assets/ogusers.webp new file mode 100644 index 0000000..35a7802 Binary files /dev/null and b/assets/ogusers.webp differ diff --git a/assets/soundtrack.mp3 b/assets/soundtrack.mp3 new file mode 100644 index 0000000..88493f3 Binary files /dev/null and b/assets/soundtrack.mp3 differ diff --git a/assets/style.css b/assets/style.css new file mode 100644 index 0000000..5072c6c --- /dev/null +++ b/assets/style.css @@ -0,0 +1,98 @@ +body { + padding: 0px; + margin: 0px; + font-size: 16px; + color: #000000; + font-family: 'Poppins', sans-serif; +} +a { + text-decoration: none; + color: #000000; +} +* { + box-sizing: border-box; + -webkit-tap-highlight-color: transparent; + outline: none; +} +input, +button, +textarea { + -moz-appearance: none; + -webkit-appearance: none; + font-family: 'Poppins', sans-serif; +} +img { + max-width: 100%; + display: block; +} + +.background { + position: absolute; + top: 0px; + max-height: 100vh; + overflow: hidden; + z-index: 1; +} +.background img { + object-fit: cover; + min-height: 100vh; + min-width: 100vw; +} +.wrapper { + position: absolute; + z-index: 2; + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; + width: 100%; + background-color: rgba(0, 0, 0, 0.7); +} +.inner { + width: 220px; +} +.inner h1 { + color: #ffffff; + font-size: 54px; + line-height: 44px; + margin: 0px 0px 25px 0px; + text-align: center; + height:15px +} +.inner h2 { + color: #ffffff; + font-size: 15px; + line-height: 44px; + margin: 0px 0px 25px 0px; + text-align: center; + height:15px +} +.inner div { + display: block; + color: #ffffff; + font-size: 20px; +} +.inner div span { + font-weight: 700; + width: 100px; + display: inline-block; +} +.inner a { + color: #ffffff; +} +.inner .audio { + color: #ffffff; + display: block; + text-align: center; + text-transform: uppercase; + font-style: italic; + font-size: 14px; + padding: 8px 0px; + cursor: pointer; +} +.column { + float: left; + width: 33.33%; + padding: 5px; + } + \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..13575d9 --- /dev/null +++ b/index.html @@ -0,0 +1,63 @@ + + + + + + + + + tixte.gifts - home + + + + + + + + + + + + + + + + +
+ background image +
+
+
+

Ignacio

+

aka korea, i code sometimes

+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ (Click for audio) + + + + + \ No newline at end of file