/* @group Plus Code 1_1 Awesome Font icon 4 animated */ /* Licensed under the MIT license Copyright (c) Multithemes - Licensing & Terms of Use The resources on “Plus code” by Multithemes for Awesome Icons (Created by Dave Gandy) can be used freely in personal and commercial projects. The resources on “Plus code” can be used in websites, web apps and web templates intended for sale. You don’t have to link back to us if it vitiates your work but we appreciate any credit. You are “NOT ALLOWED” to take our work “as-is” and sell it, redistribute or re-publish it (with the exception of forking our GitHub repos), or sell “pluginized” versions of it. “NOT ALLOWED”: Web template, Themes, modules, widget and so on. If you plan to create RapidWeaver, WordPress, Joomla, Hype site or any Android/ios/winn App etc. plugins out of our code, please credit us in a fair way. Please, respect the licenses. We always indicate the license in the readme and in the code. Please contact me, if you need further informations and questions about the commercial license. Summarized, use it freely, integrate it, make it your own, but don’t copy and paste our work and sell it or claim that it’s yours, stay fair. Thank you for visiting, I hope you enjoy my work and find it useful! The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ /* @group Social icons background - colored */ .fa-box-custom { background-color: #FFE913 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } /* ------CIRCLE icon----- */ .fa-box-o {border-radius: 1em !important;} .fa-box-o-half { border-radius: 1em !important; border-top-left-radius:0.1em !important; -webkit-border-top-left-radius:0.1em !important; border-top-right-radius:0.7em !important; -webkit-border-top-right-radius:0.7em !important; border-bottom-left-radius:0.7em !important; -webkit-border-bottom-left-radius:0.7em !important; border-bottom-right-radius:0.1em !important; -webkit-border-bottom-right-radius:0.1em !important; } /* ------CIRCLE icon hover----- */ .fa-box-o-square { border-radius: 1em !important; /* Prevent Webkit text rendering */ -webkit-transform: translateZ(0px); border-radius: 0.1em !important; transition: all 0.25s ease-out; -webkit-transition: all 0.25s ease-out; transition-delay: 23ms; -webkit-transition-delay: 23ms; } .fa-box-o-square:hover { border-radius: 1em !important;} /* ------CIRCLE end ----- */ .fa-box-silver { /* _____BETA STYLE_______ */ background: -webkit-linear-gradient(#fefffe, #858585); background: linear-gradient(#fefffe, #858585); background: -o-linear-gradient(#fefffe, #858585); color: #4c4b4c !important; filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#fefffe', EndColorStr='#858585', GradientType=0); /* MSIE */ border-radius: .1em; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; text-shadow: #f0f0f0 0 1px 0 !important; line-height: 1em !important; } .fa-box-black { background-color: #0c0c0c !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-grey { background-color: #919191 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-white { background-color: #f9f9f9 !important; border-radius: .1em; color: #5f5f5f !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-google-plus { background-color: #dd4b39 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-blogger { background-color: #FF8833 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-facebook { background-color: #3B5998 !important; border-radius: .1em; /* Prevent Webkit text rendering and also using slideshow*/ -webkit-transform: translateZ(0px); color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-flickr { background-color: #FE0883 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-foursquare { background-color: #0072B1 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-instagram { background-color: #4E433C !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-linkedin { background-color: #4875B4 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-reddit { background-color: #CEE3F8 !important; border-radius: .1em; color: #6d6d6d !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-rss { background-color: #FA9B39 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-github-alt { background-color: #e57300 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-stumbleupon { background-color: #EB4924 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-tumblr { background-color: #34526F !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-twitter { background-color: #00A0D1 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-pagelines { background-color: #4f92b1 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-vimeo-blue { background-color: #44BBFF !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-vimeo { background-color: #AAD450 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-youtube { background-color: #C4302B !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-pinterest { background-color: #c40028 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-skype { background-color: #12A5F4 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-dropbox { background-color: #007ee5 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-soundcloud { background-color: #ff3a00 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } .fa-box-dribbble { background-color: #ea4c89 !important; border-radius: .1em; color: #fefffe !important; width: 1.2857142857142858em; text-align: center; padding-top: .15em !important; padding-bottom: .15em !important; line-height: 1em !important; } /* @end */ /* @group INLINE text ( Inline, Inline Table and inline block) */ .fa-inline { display: inline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } .fa-inline h6, .fa-inline h5, .fa-inline h4, .fa-inline h3, .fa-inline h2, .fa-inline h1, .fa-inline .font-1, .fa-inline .font-2, .fa-inline .font-3, .fa-inline .font-4, .fa-inline .fotn-5, .fa-inline .font-6, .fa-inline .font-7, .fa-inline .font-8, .fa-inline .font-9, .fa-inline .font-10, .fa-inline .font-11, .fa-inline .font-12, .fa-inline .font-13, .fa-inline .font-14, .fa-inline .font-15, .fa-inline .font-16, .fa-inline .font-17, .fa-inline .font-18, .fa-inline .font-19, .fa-inline .font-20 { display: inline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0;} /* vertical-align: top; */ .fa-inline-table {display: inline-table; vertical-align: top; margin-top: 0 !important; margin-bottom: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; } .fa-inline-table h6, .fa-inline-table h5, .fa-inline-table h4, .fa-inline-table h3, .fa-inline-table h2, .fa-inline-table h1, .fa-inline-table .font-1, .fa-inline-table .font-2, .fa-inline-table .font-3, .fa-inline-table .font-4, .fa-inline-table .fotn-5, .fa-inline-table .font-6, .fa-inline-table .font-7, .fa-inline-table .font-8, .fa-inline-table .font-9, .fa-inline-table .font-10, .fa-inline-table .font-11, .fa-inline-table .font-12, .fa-inline-table .font-13, .fa-inline-table .font-14, .fa-inline-table .font-15, .fa-inline-table .font-16, .fa-inline-table .font-17, .fa-inline-table .font-18, .fa-inline-table .font-19, .fa-inline-table .font-20 { display: inline-table; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0;} /* vertical-align: top; */ .fa-inline-block { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0;} .fa-inline-block h6, .fa-inline-block h5, .fa-inline-block h4, .fa-inline-block h3, .fa-inline-block h2, .fa-inline-block h1, .fa-inline-block .font-1, .fa-inline-block .font-2, .fa-inline-block .font-3, .fa-inline-block .font-4, .fa-inline-block .fotn-5, .fa-inline-block .font-6, .fa-inline-block .font-7, .fa-inline-block .font-8, .fa-inline-block .font-9, .fa-inline-block .font-10, .fa-inline-block .font-11, .fa-inline-block .font-12, .fa-inline-block .font-13, .fa-inline-block .font-14, .fa-inline-block .font-15, .fa-inline-block .font-16, .fa-inline-block .font-17, .fa-inline-block .font-18, .fa-inline-block .font-19, .fa-inline-block .font-20 { display: inline-block; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0;} /* vertical-align: top; */ /* @end */ /* @group STYLES SILVER - For TEXT and ICONS ONLY */ /* ------ icon - silver CSS3 ------- */ .fa-silver-light { background: -webkit-linear-gradient(#fefffe, #858585); background: -o-linear-gradient(transparent, transparent);/* remove gradient in OPERA */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: #dadbda; text-shadow: none !important; filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#fefffe', EndColorStr='#858585', GradientType=0); /* MSIE */ } .fa-silver-light-inverse { background: -webkit-linear-gradient(#858585, #fefffe); background: -o-linear-gradient(transparent, transparent);/* remove gradient in OPERA */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: #dadbda; text-shadow: none !important; filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#858585', EndColorStr='#fefffe', GradientType=0); /* MSIE */ } .fa-silver { background: -webkit-linear-gradient(#a6a6a6, #5e5e5e); background: -o-linear-gradient(transparent, transparent);/* remove gradient in OPERA */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: #828282; text-shadow: none !important; filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#a6a6a6', EndColorStr='#5e5e5e', GradientType=0); /* MSIE */ } .fa-silver-inverse { background: -webkit-linear-gradient(#5e5e5e, #a6a6a6); background: -o-linear-gradient(transparent, transparent);/* remove gradient in OPERA */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: #828282; text-shadow: none !important; filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#5e5e5e', EndColorStr='#a6a6a6', GradientType=0);/* MSIE */ } .fa-silver-dark, .fa-silver-dark q { background: -webkit-linear-gradient(#434343, #2d2d2d) !important; background: -o-linear-gradient(transparent, transparent);/* remove gradient in OPERA */ -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; color: #393939 !important; text-shadow: none !important; filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#434343', EndColorStr='#2d2d2d', GradientType=0); /* MSIE */ } .fa-silver-dark-inverse{ background: -webkit-linear-gradient(#2d2d2d, #434343); background: -o-linear-gradient(transparent, transparent);/* remove gradient in OPERA */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: #393939; text-shadow: none !important; filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#2d2d2d', EndColorStr='#434343', GradientType=0); /* MSIE */ } /* @end */ /* @group STYLES GLOW - For TEXT and ICONS ONLY */ /* ------ GLOW FAMILY ------- */ /* ------ GLOW FIX ------- */ .fa-glow-black { color: #000 !important; text-shadow: #000 0 -2px 15px; filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8); /* FOR IE8/9 */ -webkit-filter: blur(3px); /* visible in modern browsers only */ } .fa-glow-white { color: #fefffe !important; text-shadow: #fefffe 0 -2px 15px; filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8); /* FOR IE8/9 */ -webkit-filter: blur(3px);/* visible in modern browsers only */ } /* ------ GLOW FIX ------- */ /* ------ GLOW - IN - ANIMATED ------- */ .fa-glow-black-in { color: #000 !important; text-shadow: #000 0 -2px 15px; filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8); /* FOR IE8/9 */ -webkit-filter: blur(3px); /* modern browsers only */ -webkit-animation: glow-black-in 1.8s ease-out both !important; animation: glow-black-in 1.8s ease-out both !important; } @keyframes glow-black-in{ 0% {text-shadow: #2b2b2b 0 0px 0px;}/* modern browsers only */ 30% {text-shadow: #2b2b2b 0 0px 0px;} 100% {text-shadow: #000 0 -2px 15px;} } @-webkit-keyframes glow-black-in{ 0% {text-shadow: #2b2b2b 0 0px 0px; -webkit-filter: blur(0px); } 30% {text-shadow: #2b2b2b 0 0px 0px; -webkit-filter: blur(0px); } 100% {text-shadow: #000 0 -2px 15px; -webkit-filter: blur(3px); } } @-ms-keyframes glow-black-in{ /* IE9 does not support CSS animation. */ 0% { text-shadow: #2b2b2b 0 0px 6px; -webkit-filter: blur(0px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8); } 30% {text-shadow: #2b2b2b 0 0px 6px; -webkit-filter: blur(0px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0); } 100% {text-shadow: #000 0 -2px 15px; -webkit-filter: blur(3px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8); } } .fa-glow-white-in { color: #fefffe !important; text-shadow: #fefffe 0 -2px 15px; filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8); /* FOR IE8/9 */ -webkit-filter: blur(3px); /* modern browsers only */ -webkit-animation: glow-white-in 1.8s ease-out both !important; animation: glow-white-in 1.8s ease-out both !important; } @keyframes glow-white-in { /* modern browsers only */ 0% {text-shadow: #efefef 0 0px 0px;} 30% {text-shadow: #efefef 0 0px 0px;} 100% {text-shadow: #fefffe 0 -2px 15px;} } @-webkit-keyframes glow-white-in { 0% {text-shadow: #efefef 0 0px 0px; -webkit-filter: blur(0px);} 30% {text-shadow: #efefef 0 0px 0px; -webkit-filter: blur(0px);} 100% {text-shadow: #fefffe 0 -2px 15px; -webkit-filter: blur(3px);} } @-ms-keyframes glow-white-in {/* IE9 does not support CSS animation. */ 0% {text-shadow: #efefef 0 0px 0px; -webkit-filter: blur(0px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0); } 30% {text-shadow: #efefef 0 0px 0px; -webkit-filter: blur(0px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0); } 100% { text-shadow: #fefffe 0 -2px 15px; -webkit-filter: blur(3px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8);} } /* ------ GLOW - IN - ANIMATED ------- */ /* ------ GLOW - OUT - ANIMATED ------- */ .fa-glow-black-out { color: #000 !important; text-shadow: #000 0 0px 0px; /* modern browsers only */ filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0); /* FOR IE8/9 */ -webkit-filter: blur(0px); /* modern browsers only */ -webkit-animation: glow-black-out 2.2s ease-in both !important; animation: glow-black-out 2.2s ease-in both !important; } @keyframes glow-black-out{ 0% {text-shadow: #000 0 -1px 15px; } 30% {text-shadow: #000 0 -1px 15px;} 100% {text-shadow: #000 0 0px 0px;} } @-webkit-keyframes glow-black-out{ 0% {text-shadow: #000 0 -1px 15px; -webkit-filter: blur(3px);} 30% {text-shadow: #000 0 -1px 15px; -webkit-filter: blur(3px);} 100% {text-shadow: #000 0 0px 0px; -webkit-filter: blur(0px);} } @-ms-keyframes glow-black-out{/* IE9 does not support CSS animation. */ 0% {text-shadow: #000 0 -1px 15px; -webkit-filter: blur(3px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8);} 30% {text-shadow: #000 0 -1px 15px; -webkit-filter: blur(3px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8);} 100% {text-shadow: #000 0 0px 0px; -webkit-filter: blur(0px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0); } } .fa-glow-white-out { color: #fefffe !important; text-shadow: #efefef 0 0px 0px; filter: Shadow(Color=#efefef, Direction=0, Strength=6); /* FOR IE8/9 */ -webkit-filter: blur(0px); /* modern browsers only */ -webkit-animation: glow-white-out 2.2s ease-in both !important; animation: glow-white-out 2.2s ease-in both !important; } @keyframes glow-white-out { 0% {text-shadow: #fefffe 0 1px 15px; -webkit-filter: blur(3px); } 30% {text-shadow: #fefffe 0 1px 15px; -webkit-filter: blur(3px); } 100% {text-shadow: #efefef 0 0px 0px; -webkit-filter: blur(0px); } } @-webkit-keyframes glow-white-out { 0% {text-shadow: #fefffe 0 1px 15px; -webkit-filter: blur(3px); } 30% {text-shadow: #fefffe 0 1px 15px; -webkit-filter: blur(3px); } 100% {text-shadow: #efefef 0 0px 0px; -webkit-filter: blur(0px); } } @-ms-keyframes glow-white-out {/* IE9 does not support CSS animation. */ 0% {text-shadow: #fefffe 0 1px 15px; -webkit-filter: blur(3px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8);} 30% {text-shadow: #fefffe 0 1px 15px; -webkit-filter: blur(3px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=8);} 100% {text-shadow: #efefef 0 0px 0px; -webkit-filter: blur(0px); filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0);} } /* ------ GLOW FAMILY ------- */ /* @end */ /* @group STYLES SHADOW - For TEXT and ICONS ONLY */ /* shadow-bottom is a BETA STYLE IN DEVELOPMENT: READ BEFORE USE: This stile require an image because the shadow behavior is different between browsers. Moreover Firefox don't support the blur. Use this style with caution and check the result on your selected browsers. */ /* --start beta style -- */ .fa-shadow-bottom {position: relative;} .fa-shadow-bottom:after { content: " "; height: 3px; position: absolute; width: 90%; left: 0; right: 0; text-shadow: #0c0c0c 0 0 8px;/* remove COLOR in OPERA */ -webkit-background-clip: text; /* ERASE AFTER CONTENT */ -webkit-text-fill-color: transparent; /* ERASE AFTER CONTENT */ /* filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=30) !important; */ -webkit-filter: blur(3px); box-shadow: 0px 0px 13px 0px #000 ; -webkit-box-shadow: 0px 0px 13px 0px #000 ; -moz-box-shadow: 0px 0px 13px 0px #000 ; border-radius:9px; -webkit-border-radius:9px; -moz-border-radius:9px; background: transparent url(css/webfonts/fontawesome/shadow_tile_2.png) repeat center center; padding-bottom: 0; margin-right: auto; margin-left: auto; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); opacity: 0.48; margin-top: 1.1em; overflow: visible; } /* ------ icon shadow ------- */ .fa-shadow-white-thin {text-shadow: #dcdcdc 0 1px 2px; filter:progid:DXImageTransform.Microsoft.Shadow(color='white', Direction=180, Strength=2);} /* OLD IE */ .fa-shadow-white {text-shadow: #dcdcdc 0 2px 3px; filter:progid:DXImageTransform.Microsoft.Shadow(color='white', Direction=180, Strength=3);} .fa-shadow-white-big {text-shadow: #dcdcdc 0 3px 5px; filter:progid:DXImageTransform.Microsoft.Shadow(color='white', Direction=180, Strength=4);} .fa-shadow-black-thin {text-shadow: #2b2b2b 0 1px 2px; filter:progid:DXImageTransform.Microsoft.Shadow(color='black', Direction=180, Strength=2);} .fa-shadow-black {text-shadow: #2b2b2b 0 2px 3px; filter:progid:DXImageTransform.Microsoft.Shadow(color='black', Direction=180, Strength=3);} .fa-shadow-black-big {text-shadow: #2b2b2b 0 3px 6px; filter:progid:DXImageTransform.Microsoft.Shadow(color='black', Direction=180, Strength=4);} /* @end */ /* @group TRANSFORM SLIP */ /* ----- SLIP DOWN------ */ .fa-slip { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; margin-right: auto; margin-left: auto; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding-right: 1px; padding-left: 1px; opacity: 1; -webkit-animation: slip 1.3s ease-in both !important; animation: slip 1.3s ease-in both !important; } @-webkit-keyframes slip { 0% {-webkit-transform: perspective(200px)rotateX(90deg) translateY(-50%); opacity: 0;} 70% {-webkit-transform: perspective(500px)rotateX(0deg) translateY(0px); opacity: 1;} 100% {-webkit-transform: perspective(600px) rotateX(0deg) translateY(0px); opacity: 1;} } @keyframes slip { 0% {opacity: 0; transform: perspective(200px) rotateX(90deg) rotateY(0deg) translateY(-50%);} 70% {opacity: 1; transform: perspective(500px) rotateX(0deg) rotateY(0deg) translateY(0px);} 100% {opacity: 1; transform: perspective(600px) rotateX(0deg) rotateY(0deg) translateY(0px);} } /* @end */ /* @group TRANSFORM FLIP*/ /* -------flip HORIZONTAL "Y" 200------ */ .fa-flip-horizontal-200 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -ms-animation: flip-y-200 2s ease-in both !important; margin-right: auto; margin-left: auto; padding-right: 1px; padding-left: 1px; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flip-y-200 2s ease-in both !important; animation: flip-y-200 2s ease-in both !important; } @-webkit-keyframes flip-y-200 { 0% {-webkit-transform: perspective(3000px) rotateY(90deg); opacity: 0;} 30% {opacity: 0;} 100% {-webkit-transform: perspective(3000px) rotateY(0deg); opacity: 1;} } @keyframes flip-y-200 { 0% {opacity: 0;transform: perspective(3000px) rotateX(0deg) rotateY(90deg);} 30% {opacity: 0; } 100% { opacity: 1; -webkit-transform: perspective(2600px) rotateX(0deg) rotateY(0deg); } /*100% { opacity: 1; -webkit-transform: perspective(1600px) rotateX(0deg) rotateY(0deg); }*/ } /* -------flip HORIZONTAL "Y" 150------ */ .fa-flip-horizontal-150 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; padding-right: 1px; padding-left: 1px; margin-right: auto; margin-left: auto; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flip-y-150 1.5s ease-in both !important; animation: flip-y-150 1.5s ease-in both !important; } @-webkit-keyframes flip-y-150 { 0% {-webkit-transform: perspective(3000px) rotateY(90deg); opacity: 0;} 30% {opacity: 0;} 100% {-webkit-transform: perspective(3000px) rotateY(0deg); opacity: 1;} } @keyframes flip-y-150 { 0% { opacity: 0; transform: perspective(3000px) rotateX(0deg) rotateY(90deg);} 30% { opacity: 0;} 100% { opacity: 1; transform: perspective(3000px) rotateX(0deg) rotateY(0deg);} } /* -------flip HORIZONTAL "Y" 100------ */ .fa-flip-horizontal-100 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; padding-right: 1px; padding-left: 1px; margin-right: auto; margin-left: auto; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flip-y-100 1s ease-in both !important; animation: flip-y-100 1s ease-in both !important; } @-webkit-keyframes flip-y-100 { 0% {-webkit-transform: perspective(3000px)rotateY(90deg); opacity: 0;} 30% {opacity: 0;} 100% {-webkit-transform: perspective(3000px) rotateY(0deg); opacity: 1;} } @keyframes flip-y-100 { 0% {opacity: 0; transform: perspective(3000px) rotateX(0deg) rotateY(90deg);} 30% {opacity: 0;} 100% {opacity: 1; transform: perspective(3000px) rotateX(0deg) rotateY(0deg);} } /* -------flip HORIZONTAL "Y" 50------ */ .fa-flip-horizontal-50 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; padding-right: 1px; padding-left: 1px; margin-right: auto; margin-left: auto; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flip-y-50 0.5s ease-in both !important; animation: flip-y-50 0.5s ease-in both !important; } @-webkit-keyframes flip-y-50 { 0% {-webkit-transform: perspective(3000px)rotateY(90deg); opacity: 0;} 30% {opacity: 0;} 100% {-webkit-transform: perspective(3000px) rotateY(0deg); opacity: 1;} } @keyframes flip-y-50 { 0% {opacity: 0; transform: perspective(3000px) rotateX(0deg) rotateY(90deg);} 30% { opacity: 0;} 100% { opacity: 1; transform: perspective(3000px) rotateX(0deg) rotateY(0deg);} } /* -------flip VERTICAL "X" 200------ */ .fa-flip-vertical-200 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; margin-right: auto; margin-left: auto; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flip-x-200 2s ease-in both !important; animation: flip-x-200 2s ease-in both !important; } @-webkit-keyframes flip-x-200 { 0% {-webkit-transform: perspective(600px)rotateX(90deg); opacity: 0;} 30% {opacity: 0;} 100% {-webkit-transform: perspective(600px) rotateX(0deg); opacity: 1;} } @keyframes flip-x-200 { 0% { opacity: 0; transform: perspective(600px) rotateX(90deg) rotateY(0deg);} 30% {opacity: 0;} 100% {opacity: 1; transform: perspective(600px) rotateX(0deg) rotateY(0deg);} } /* -------flip VERTICAL "X" 150------ */ .fa-flip-vertical-150 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; margin-right: auto; margin-left: auto; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flip-x-150 1.5s ease-in both !important; animation: flip-x-150 1.5s ease-in both !important; } @-webkit-keyframes flip-x-150 { 0% {-webkit-transform: perspective(600px)rotateX(90deg); opacity: 0;} 27% {opacity: 0;} 100% {-webkit-transform: perspective(600px) rotateX(0deg); opacity: 1;} } @keyframes flip-x-150 { 0% {opacity: 0; transform: perspective(600px) rotateX(90deg) rotateY(0deg);} 27% {opacity: 0;} 100% {opacity: 1; transform: perspective(600px) rotateX(0deg) rotateY(0deg);} } /* -------flip VERTICAL "X" 100------ */ .fa-flip-vertical-100 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; margin-right: auto; margin-left: auto; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flip-x-100 1s ease-in both !important; animation: flip-x-100 1s ease-in both !important; } @-webkit-keyframes flip-x-100 { 0% {-webkit-transform: perspective(600px)rotateX(90deg); opacity: 0;} 25% {opacity: 0;} 100% {-webkit-transform: perspective(600px) rotateX(0deg); opacity: 1;} } @keyframes flip-x-100 { 0% {opacity: 0; transform: perspective(600px) rotateX(90deg) rotateY(0deg); } 25% {opacity: 0;} 100% {opacity: 1; transform: perspective(600px) rotateX(0deg) rotateY(0deg);} } /* -------flip VERTICAL "X" 50------ */ .fa-flip-vertical-50 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; margin-right: auto; margin-left: auto; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flip-x-50 0.5s ease-in both !important; animation: flip-x-50 0.5s ease-in both !important; } @-webkit-keyframes flip-x-50 { 0% {-webkit-transform: perspective(600px)rotateX(90deg); opacity: 0;} 10% {opacity: 0;} 100% {-webkit-transform: perspective(600px) rotateX(0deg); opacity: 1;} } @keyframes flip-x-50 {0% {opacity: 0; transform: perspective(600px) rotateX(90deg) rotateY(0deg);} 10% {opacity: 0;} 100% {opacity: 1; transform: perspective(600px) rotateX(0deg) rotateY(0deg);} } /* @end */ /* @group TRANSFORM SLIDE */ /* ------ SLIDE UP ------- */ .fa-slide-up { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-animation: slide-up 1.6s ease-out both !important; animation: slide-up 1.6s ease-out both !important; -webkit-animation-delay: 0.35s; animation-delay: 0.35s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes slide-up { 0%{ opacity:0; transform: translateY(-50px); } 45%{ transform: translateY(-50px); } 75%{ opacity:0; } 100%{ opacity:1; transform: translateY(0px); } } @-webkit-keyframes slide-up { 0%{ opacity:0; -webkit-transform: translateY(-50px); } 45%{ -webkit-transform: translateY(-50px); } 75%{ opacity:0; } 100%{ opacity:1; -webkit-transform: translateY(0px); } } /* ------ SLIDE DOWN ------- */ .fa-slide-down { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-animation: slide-down 1.6s ease-out both !important; animation: slide-down 1.6s ease-out both !important; -webkit-animation-delay: 0.35s; animation-delay: 0.35s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes slide-down { 0%{ opacity:0; transform: translateY(50px); } 45%{ transform: translateY(50px); } 75%{ opacity:0; } 100%{ opacity:1; transform: translateY(0px); } } @-webkit-keyframes slide-down { 0%{ opacity:0; -webkit-transform: translateY(50px); } 45%{ -webkit-transform: translateY(50px); } 75%{ opacity:0;} 100%{ opacity:1; -webkit-transform: translateY(0px); } } /* ------ SLIDE LEFT ------- */ .fa-slide-left { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-animation: slide-left 1.6s ease-out both !important; animation: slide-left 1.6s ease-out both !important; -webkit-animation-delay: 0.35s; animation-delay: 0.35s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes slide-left { 0%{opacity:0; transform:translateX(-50px);} 45%{ transform: translateX(-50px); } 75%{ opacity:0; } 100%{ opacity:1; transform: translateX(0px); } } @-webkit-keyframes slide-left { 0%{ opacity:0; -webkit-transform: translateX(-50px); } 45%{ -webkit-transform: translateX(-50px); } 75%{ opacity:0; } 100%{ opacity:1; -webkit-transform: translateX(0px); } } /* ------ SLIDE RIGHT ------- */ .fa-slide-right { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-animation: slide-right 1.6s ease-out both !important; animation: slide-right 1.6s ease-out both !important; -webkit-animation-delay: 0.35s; animation-delay: 0.35s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes slide-right { 0%{ opacity:0; transform: translateX(50px); } 45%{ transform: translateX(50px); } 75%{ opacity:0; } 100%{ opacity:1; transform: translateX(0px); } } @-webkit-keyframes slide-right { 0%{ opacity:0; -webkit-transform: translateX(50px); } 45%{ -webkit-transform: translateX(50px); } 75%{ opacity:0; } 100%{ opacity:1; -webkit-transform: translateX(0px); } } /* @end */ /* @group TRANSFORM FADE IN */ /* ------ fade-250 ------- */ .fa-fade-250 { -webkit-animation: fade-250 2.5s ease-in both !important; animation: fade-250 2.5s ease-in both !important; } @-webkit-keyframes fade-250 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } @keyframes fade-250 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } /* ------ fade-200 ------- */ .fa-fade-200 { -webkit-animation: fade-200 2s ease-in both !important; animation: fade-200 2s ease-in both !important; } @-webkit-keyframes fade-200 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } @keyframes fade-200 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } /* ------ fade-150 ------- */ .fa-fade-150 { -webkit-animation: fade-150 1.5s ease-in both !important; animation: fade-150 1.5s ease-in both !important; } @-webkit-keyframes fade-150 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } @keyframes fade-150 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } /* ------ fade-100 ------- */ .fa-fade-100 { -webkit-animation: fade-100 1s ease-in both !important; animation: fade-100 1s ease-in both !important; } @-webkit-keyframes fade-100 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } @keyframes fade-100 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } /* ------ fade-75 ------- */ .fa-fade-75 { -webkit-animation: fade-75 0.75s ease-in both !important; animation: fade-75 0.75s ease-in both !important; } @-webkit-keyframes fade-75 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } @keyframes fade-75 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } /* ------ fade-50 ------- */ .fa-fade-50 { -webkit-animation: fade-50 0.50s ease-in both !important; animation: fade-50 0.50s ease-in both !important; } @-webkit-keyframes fade-50 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } @keyframes fade-50 { 0% {opacity: 0;} 35% {opacity: 0;} 100% {opacity: 1;} } /* @end */ /* @group TRANSFORM BEAT */ /* ------ beat ------- */ .fa-beat { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-animation: beat 1.6s linear both !important; animation: beat 1.6s linear both !important; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px;o verflow: visible; } @keyframes beat { 0% {transform: scale(1);} 62% {transform: scale(1);} 77% {transform: scale(0.8);} 100% {transform: scale(1);} } @-webkit-keyframes beat { 0% {-webkit-transform: scale(1); } 62% {-webkit-transform: scale(1);} 77% {-webkit-transform: scale(0.8);} 100% {-webkit-transform: scale(1);} } /* ------ icon - beat ------- */ /* @end */ /* @group TRANSFORM BEAT - FAST */ .fa-beat-fast { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-animation: beat-fast 0.4s linear both !important; animation: beat-fast 0.4s linear both !important; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; } @keyframes beat-fast { 0% {transform: scale(1);} 20% {transform: scale(0.8);} 100% {transform: scale(1);} } @-webkit-keyframes beat-fast { 0% {-webkit-transform: scale(1);} 20% {-webkit-transform: scale(0.8);} 100% {-webkit-transform: scale(1);} } /* ------ icon - beat fast ------- */ /* @end */ /* @group TRANSFORM SCALE */ /* ------ icon - zoom ------- */ .fa-scale{ display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; opacity: 1; padding: 1px; overflow: visible; -webkit-animation: scale 1.4s ease-out both !important; animation: scale 1.4s ease-out both !important; } @keyframes scale { 0% {transform: scale(0); opacity: 0;} 30% {transform: scale(0);} 50% {opacity: 0;} 100% {transform: scale(1); opacity: 1;} } @-webkit-keyframes scale { 0% {-webkit-transform: scale(0); opacity: 0;} 30% {-webkit-transform: scale(0);} 50% {opacity: 0;} 100% {-webkit-transform: scale(1); opacity: 1;} } /* ---- end ----- */ .fa-scale-inverse { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: scale-inverse 1.4s ease-out both !important; animation: scale-inverse 1.4s ease-out both !important; } @keyframes scale-inverse { 0% {transform: scale(1.3); opacity: 0;} 30% {transform: scale(1.3);} 50% {opacity: 0; } 100% {transform: scale(1); opacity: 1;} } @-webkit-keyframes scale-inverse { 0% {-webkit-transform: scale(1.3); opacity: 0;} 30% {opacity: 0; -webkit-transform: scale (1.3);} 50% {opacity: 0;} 100% {-webkit-transform: scale (1); opacity: 1;} } /* @end */ /* @group TRANSFORM ROTATION */ /* ------ SPIN ROTATE 360 ------- */ .fa-spin-360 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-360 1.9s ease-out both !important; animation: spin-360 1.9s ease-out both !important; } @-webkit-keyframes spin-360 { 0% {-webkit-transform: rotate(359deg);} 100%{-webkit-transform: rotate(0deg);} } @keyframes spin-360 { 0% {transform: rotate(359deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 180 ------- */ .fa-spin-180 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-180 1.9s ease-out both !important; animation: spin-180 1.9s ease-out both !important; } @-webkit-keyframes spin-180 { 0% {-webkit-transform: rotate(180deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-180 { 0% {transform: rotate(180deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 90 ------- */ .fa-spin-90 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-90 1.9s ease-out both !important; animation: spin-90 1.9s ease-out both !important; } @-webkit-keyframes spin-90 { 0% {-webkit-transform: rotate(90deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-90 { 0% {transform: rotate(90deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 80 ------- */ .fa-spin-80 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-80 1.9s ease-out both !important; animation: spin-80 1.9s ease-out both !important; } @-webkit-keyframes spin-80 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-80 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 70 ------- */ .fa-spin-70 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-70 1.9s ease-out both !important; animation: spin-70 1.9s ease-out both !important; } @-webkit-keyframes spin-70 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-70 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 60 ------- */ .fa-spin-70 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-70 1.9s ease-out both !important; animation: spin-70 1.9s ease-out both !important; } @-webkit-keyframes spin-70 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-70 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 50 ------- */ .fa-spin-50 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-50 1.9s ease-out both !important; animation: spin-50 1.9s ease-out both !important; } @-webkit-keyframes spin-50 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-50 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 45 ------- */ .fa-spin-45 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-45 1.9s ease-out both !important; animation: spin-45 1.9s ease-out both !important; } @-webkit-keyframes spin-45 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-45 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 40 ------- */ .fa-spin-40 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-40 1.9s ease-out both !important; animation: spin-40 1.9s ease-out both !important; } @-webkit-keyframes spin-40 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-40 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 30 ------- */ .fa-spin-30 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-30 1.9s ease-out both !important; animation: spin-30 1.9s ease-out both !important; } @-webkit-keyframes spin-30 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-30 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 20 ------- */ .fa-spin-20 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-20 1.9s ease-out both !important; animation: spin-20 1.9s ease-out both !important; } @-webkit-keyframes spin-20 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-20 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* ------ SPIN ROTATE 10 ------- */ .fa-spin-10 { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; padding: 1px; overflow: visible; -webkit-animation: spin-10 1.9s ease-out both !important; animation: spin-10 1.9s ease-out both !important; } @-webkit-keyframes spin-10 { 0% {-webkit-transform: rotate(80deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes spin-10 { 0% {transform: rotate(80deg);} 100% {transform: rotate(0deg);} } /* @end */ /* @group TRANSFORM ROCK */ /* ------ ROCK ------- */ .fa-rock { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; opacity: 1; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; overflow: visible; padding: 1px; -webkit-animation: rock 1.7s ease-in-out both !important; animation: rock 1.7s ease-in-out both !important; } @-webkit-keyframes rock { 0% {opacity: 0; -webkit-transform: rotate(-30deg);} 51% {opacity: 0; -webkit-transform:rotate(-30deg);} 70% {opacity: 1; -webkit-transform: rotate(8deg);} 100% { -webkit-transform: rotate(0deg);} } @keyframes rock { 0% {opacity: 0; transform: rotate(-30deg);} 51% {opacity: 1; transform:rotate(-30deg);} 70% {transform: rotate(8deg);} 100% {transform: rotate(0deg);} } /* ---- end ----- */ /* @end */ /* @group TRANSFORM DANGLES */ /* ------ dangles ------- */ .fa-dangles { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; overflow: visible; -webkit-animation: dangles 1.3s ease-out both !important; animation: dangles 1.3s ease-out both !important; } @-webkit-keyframes dangles { 0% {-webkit-transform: rotate(-61deg);} 25% {-webkit-transform: rotate(20deg);} 50% {-webkit-transform: rotate(-21deg);} 75% {-webkit-transform: rotate(13deg);} 100% {-webkit-transform: rotate(0deg);} } @keyframes dangles { 0% {transform: rotate(-61deg);} 25% {transform: rotate(20deg);} 50% {transform: rotate(-21deg);} 75% {transform: rotate(13deg);} 100% {transform: rotate(0deg);} } /* ---- end ----- */ /* @end */ /* @group TRANSFORM PULSE */ /* ------ pulse ------- */ .fa-pulse { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-animation: pulse 2.2s ease-in-out both !important; animation: pulse 2.2s ease-in-out both !important; } @keyframes pulse { 0% { opacity: 1;} 39% {opacity: 1;} 50% {opacity: 0.3;} 72% {opacity: 1;} 87% {opacity: 0.3;} 100% {opacity: 1;} } @-webkit-keyframes pulse { 0% { opacity: 1;} 39% {opacity: 1;} 50% {opacity: 0.3;} 72% {opacity: 1;} 87% {opacity: 0.3;} 100% {opacity: 1;} } /* ------ pulse INFINITE------- */ .fa-pulse-loop { /* infinite linear; */ display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; /* ------ don't add code to prevent issues in the linnkd with FA------- */ -webkit-animation: pulse-loop 2.9s linear; animation: pulse-loop 2.9s linear; -webkit-animation-iteration-count: 11; animation-iteration-count: 11; } @keyframes pulse-loop { 0% {opacity: 1;} 44% {opacity: 1; } 54% {opacity: 0.55;} 76% {opacity: 1;} 91% {opacity: 0.55;} 100% { opacity: 1;} } @-webkit-keyframes pulse-loop { 0% {opacity: 1;} 44% {opacity: 1; } 54% {opacity: 0.55;} 76% {opacity: 1;} 91% {opacity: 0.55;} 100% { opacity: 1;} } /* ------ pulse INFINITE------- */ /* @end */ /* @group MAX HEIGHT - For TEXT and ICONS ONLY */ /* ------ MAX 300 PIXEL ------- */ .fa-max-300 {font-size: 300px; margin: 0; padding: 0; line-height: 0.9em;} @media only screen and (max-width: 1030px) { .fa-max-300 {font-size: 300px !important; }} @media only screen and (max-width: 800px) { .fa-max-300 {font-size: 280px !important; }} @media only screen and (max-width: 750px) { .fa-max-300 {font-size: 275px !important; }} @media only screen and (max-width: 700px) { .fa-max-300 {font-size: 260px !important; }} @media only screen and (max-width: 650px) { .fa-max-300 {font-size: 240px !important; }} @media only screen and (max-width: 600px) { .fa-max-300 {font-size: 220px !important; }} @media only screen and (max-width: 566px) { .fa-max-300 {font-size: 190px !important; }} @media only screen and (max-width: 533px) { .fa-max-300 {font-size: 170px !important; }} @media only screen and (max-width: 500px) { .fa-max-300 {font-size: 160px !important; }} @media only screen and (max-width: 400px) { .fa-max-300 {font-size: 130px !important; }} @media only screen and (max-width: 320px) { .fa-max-300 {font-size: 120px !important; }} @media only screen and (max-width: 240px) { .fa-max-300 {font-size: 75px !important; }} /* ------ MAX 275 PIXEL ------- */ .fa-max-275 {font-size: 275px !important; line-height: 1em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-275 {font-size: 275px !important; }} @media only screen and (max-width: 800px) { .fa-max-275 {font-size: 275px !important; }} @media only screen and (max-width: 750px) { .fa-max-275 {font-size: 260px !important; }} @media only screen and (max-width: 700px) { .fa-max-275 {font-size: 250px !important; }} @media only screen and (max-width: 650px) { .fa-max-275 {font-size: 235px !important; }} @media only screen and (max-width: 600px) { .fa-max-275 {font-size: 200px !important; }} @media only screen and (max-width: 566px) { .fa-max-275 {font-size: 170px !important; }} @media only screen and (max-width: 533px) { .fa-max-275 {font-size: 150px !important; }} @media only screen and (max-width: 500px) { .fa-max-275 {font-size: 140px !important; }} @media only screen and (max-width: 400px) { .fa-max-275 {font-size: 125px !important; }} @media only screen and (max-width: 320px) { .fa-max-275 {font-size: 110px !important; }} @media only screen and (max-width: 240px) { .fa-max-275 {font-size: 70px !important; }} /* ------ MAX 250 PIXEL ------- */ .fa-max-250 {font-size: 250px !important; line-height: 1em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-250 {font-size: 250px !important; }} @media only screen and (max-width: 800px) { .fa-max-250 {font-size: 250px !important; }} @media only screen and (max-width: 750px) { .fa-max-250 {font-size: 235px !important; }} @media only screen and (max-width: 700px) { .fa-max-250 {font-size: 225px !important; }} @media only screen and (max-width: 650px) { .fa-max-250 {font-size: 200px !important; }} @media only screen and (max-width: 600px) { .fa-max-250 {font-size: 180px !important; }} @media only screen and (max-width: 566px) { .fa-max-250 {font-size: 160px !important; }} @media only screen and (max-width: 533px) { .fa-max-250 {font-size: 140px !important; }} @media only screen and (max-width: 500px) { .fa-max-250 {font-size: 130px !important; }} @media only screen and (max-width: 400px) { .fa-max-250 {font-size: 110px !important; }} @media only screen and (max-width: 320px) { .fa-max-250 {font-size: 105px !important; }} @media only screen and (max-width: 240px) { .fa-max-250 {font-size: 65px !important; }} /* ------ MAX 225 PIXEL ------- */ .fa-max-225 {font-size: 225px !important; line-height: 1em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-225 {font-size: 225px !important; }} @media only screen and (max-width: 800px) { .fa-max-225 {font-size: 225px !important; }} @media only screen and (max-width: 750px) { .fa-max-225 {font-size: 225px !important; }} @media only screen and (max-width: 700px) { .fa-max-225 {font-size: 215px !important; }} @media only screen and (max-width: 650px) { .fa-max-225 {font-size: 200px !important; }} @media only screen and (max-width: 600px) { .fa-max-225 {font-size: 175px !important; }} @media only screen and (max-width: 566px) { .fa-max-225 {font-size: 150px !important; }} @media only screen and (max-width: 533px) { .fa-max-225 {font-size: 135px !important; }} @media only screen and (max-width: 500px) { .fa-max-225 {font-size: 120px !important; }} @media only screen and (max-width: 400px) { .fa-max-225 {font-size: 105px !important; }} @media only screen and (max-width: 320px) { .fa-max-225 {font-size: 100px !important; }} @media only screen and (max-width: 240px) { .fa-max-225 {font-size: 60px !important; }} /* ------ MAX 200 PIXEL ------- */ .fa-max-200 {font-size: 200px !important; line-height: 1em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-200 {font-size: 200px !important; }} @media only screen and (max-width: 800px) { .fa-max-200 {font-size: 200px !important; }} @media only screen and (max-width: 750px) { .fa-max-200 {font-size: 200px !important; }} @media only screen and (max-width: 700px) { .fa-max-200 {font-size: 200px !important; }} @media only screen and (max-width: 650px) { .fa-max-200 {font-size: 180px !important; }} @media only screen and (max-width: 600px) { .fa-max-200 {font-size: 175px !important; }} @media only screen and (max-width: 566px) { .fa-max-200 {font-size: 140px !important; }} @media only screen and (max-width: 533px) { .fa-max-200 {font-size: 125px !important; }} @media only screen and (max-width: 500px) { .fa-max-200 {font-size: 110px !important; }} @media only screen and (max-width: 400px) { .fa-max-200 {font-size: 100px !important; }} @media only screen and (max-width: 320px) { .fa-max-200 {font-size: 90px !important; }} @media only screen and (max-width: 240px) { .fa-max-200 {font-size: 55px !important; }} /* ------ MAX 175 PIXEL ------- */ .fa-max-175 {font-size: 175px !important; line-height: 1em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-175 {font-size: 175px !important; }} @media only screen and (max-width: 800px) { .fa-max-175 {font-size: 175px !important; }} @media only screen and (max-width: 750px) { .fa-max-175 {font-size: 175px !important; }} @media only screen and (max-width: 700px) { .fa-max-175 {font-size: 175px !important; }} @media only screen and (max-width: 650px) { .fa-max-175 {font-size: 170px !important; }} @media only screen and (max-width: 600px) { .fa-max-175 {font-size: 155px !important; }} @media only screen and (max-width: 566px) { .fa-max-175 {font-size: 145px !important; }} @media only screen and (max-width: 533px) { .fa-max-175 {font-size: 120px !important; }} @media only screen and (max-width: 500px) { .fa-max-175 {font-size: 95px !important; }} @media only screen and (max-width: 400px) { .fa-max-175 {font-size: 90px !important; }} @media only screen and (max-width: 320px) { .fa-max-175 {font-size: 85px !important; }} @media only screen and (max-width: 240px) { .fa-max-175 {font-size: 50px !important; }} /* ------ MAX 150 PIXEL ------- */ .fa-max-150 {font-size: 150px !important; line-height: 1.1em; margin: 0; padding: 0; } @media only screen and (max-width: 1030px) { .fa-max-150 {font-size: 150px !important; }} @media only screen and (max-width: 800px) { .fa-max-150 {font-size: 150px !important; }} @media only screen and (max-width: 750px) { .fa-max-150 {font-size: 150px !important; }} @media only screen and (max-width: 700px) { .fa-max-150 {font-size: 150px !important; }} @media only screen and (max-width: 650px) { .fa-max-150 {font-size: 150px !important; }} @media only screen and (max-width: 600px) { .fa-max-150 {font-size: 140px !important; }} @media only screen and (max-width: 566px) { .fa-max-150 {font-size: 120px !important; }} @media only screen and (max-width: 533px) { .fa-max-150 {font-size: 110px !important; }} @media only screen and (max-width: 500px) { .fa-max-150 {font-size: 95px !important; }} @media only screen and (max-width: 400px) { .fa-max-150 {font-size: 80px !important; }} @media only screen and (max-width: 320px) { .fa-max-150 {font-size: 75px !important; }} @media only screen and (max-width: 240px) { .fa-max-150 {font-size: 45px !important; }} /* ------ MAX 125 PIXEL ------- */ .fa-max-125 {font-size: 125px !important; line-height: 1.14em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-125 {font-size: 125px !important; }} @media only screen and (max-width: 800px) { .fa-max-125 {font-size: 125px !important; }} @media only screen and (max-width: 750px) { .fa-max-125 {font-size: 125px !important; }} @media only screen and (max-width: 700px) { .fa-max-125 {font-size: 125px !important; }} @media only screen and (max-width: 650px) { .fa-max-125 {font-size: 125px !important; }} @media only screen and (max-width: 600px) { .fa-max-125 {font-size: 125px !important; }} @media only screen and (max-width: 566px) { .fa-max-125 {font-size: 115px !important; }} @media only screen and (max-width: 533px) { .fa-max-125 {font-size: 100px !important; }} @media only screen and (max-width: 500px) { .fa-max-125 {font-size: 87px !important; }} @media only screen and (max-width: 400px) { .fa-max-125 {font-size: 75px !important; }} @media only screen and (max-width: 320px) { .fa-max-125 {font-size: 66px !important; }} @media only screen and (max-width: 240px) { .fa-max-125 {font-size: 42px !important; }} /* ------ MAX 100 PIXEL ------- */ .fa-max-100 {font-size: 100px !important; line-height: 1.14em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-100 {font-size: 100px !important; }} @media only screen and (max-width: 800px) { .fa-max-100 {font-size: 100px !important; }} @media only screen and (max-width: 750px) { .fa-max-100 {font-size: 100px !important; }} @media only screen and (max-width: 700px) { .fa-max-100 {font-size: 100px !important; }} @media only screen and (max-width: 650px) { .fa-max-100 {font-size: 100px !important; }} @media only screen and (max-width: 600px) { .fa-max-100 {font-size: 100px !important; }} @media only screen and (max-width: 566px) { .fa-max-100 {font-size: 90px !important; }} @media only screen and (max-width: 533px) { .fa-max-100 {font-size: 85px !important; }} @media only screen and (max-width: 500px) { .fa-max-100 {font-size: 80px !important; }} @media only screen and (max-width: 400px) { .fa-max-100 {font-size: 65px !important; }} @media only screen and (max-width: 320px) { .fa-max-100 {font-size: 57px !important; }} @media only screen and (max-width: 240px) { .fa-max-100 {font-size: 35px !important; }} /* ------ MAX 75 PIXEL ------- */ .fa-max-75 {font-size: 75px !important; line-height: 1.14em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-75 {font-size: 75px !important; }} @media only screen and (max-width: 800px) { .fa-max-75 {font-size: 75px !important; }} @media only screen and (max-width: 750px) { .fa-max-75 {font-size: 75px !important; }} @media only screen and (max-width: 700px) { .fa-max-75 {font-size: 75px !important; }} @media only screen and (max-width: 650px) { .fa-max-75 {font-size: 75px !important; }} @media only screen and (max-width: 600px) { .fa-max-75 {font-size: 75px !important; }} @media only screen and (max-width: 566px) { .fa-max-75 {font-size: 75px !important; }} @media only screen and (max-width: 533px) { .fa-max-75 {font-size: 70px !important; }} @media only screen and (max-width: 500px) { .fa-max-75 {font-size: 60px !important; }} @media only screen and (max-width: 400px) { .fa-max-75 {font-size: 55px !important; }} @media only screen and (max-width: 320px) { .fa-max-75 {font-size: 40px !important; }} @media only screen and (max-width: 240px) { .fa-max-75 {font-size: 30px !important; }} /* ------ MAX 50 PIXEL ------- */ .fa-max-50 {font-size: 50px !important; line-height: 1.14em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 800px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 750px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 700px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 650px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 600px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 566px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 533px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 500px) { .fa-max-50 {font-size: 50px !important; }} @media only screen and (max-width: 400px) { .fa-max-50 {font-size: 40px !important; }} @media only screen and (max-width: 320px) { .fa-max-50 {font-size: 30px !important; }} @media only screen and (max-width: 240px) { .fa-max-50 {font-size: 25px !important; }} /* ------ MAX 30 PIXEL ------- */ .fa-max-30 {font-size: 30px !important; line-height: 1.05em; margin: 0; padding: 0;} @media only screen and (max-width: 1030px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 800px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 750px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 700px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 650px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 600px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 566px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 533px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 500px) { .fa-max-30 {font-size: 30px !important; }} @media only screen and (max-width: 400px) { .fa-max-30 {font-size: 25px !important; }} @media only screen and (max-width: 320px) { .fa-max-30 {font-size: 22px !important; }} @media only screen and (max-width: 240px) { .fa-max-30 {font-size: 22px !important; }} /* icons size */ /* @end */ /* @group SWAP */ .fa-swap { /* vertical */ -webkit-animation: swap-vertical 0.45s ease-in-out both !important; animation: swap-vertical 0.45s ease-out both !important; -webkit-animation-fill-mode: both; animation-fill-mode: both; overflow: hidden !important; } @keyframes swap-vertical { 0%{ transform: translateY(0px); opacity: 1;} 18%{transform: translateY(20px);opacity: 0.15;} 20%{opacity: 0.2; } 50%{ transform: translateY(60px);} 51%{ transform: translateY(-80px); opacity: 0.0;} 52%{ transform: translateY(-40px); opacity: 0.0;} 58%{ transform: translateY(-10px); opacity: 0.6;} 70%{ transform: translateY(15px); opacity: 1;} 100%{ transform: translateY(0px); opacity: 1;} } @-webkit-keyframes swap-vertical { 0%{ -webkit-transform: translateY(0px); opacity: 1;} 18%{-webkit-transform: translateY(20px);opacity: 0.15;} 20%{opacity: 0.2; } 50%{ -webkit-transform: translateY(60px);} 51%{ -webkit-transform: translateY(-80px); opacity: 0.0;} 52%{ -webkit-transform: translateY(-40px); opacity: 0.0;} 58%{ -webkit-transform: translateY(-10px); opacity: 0.6;} 70%{ -webkit-transform: translateY(15px); opacity: 1;} 100%{ -webkit-transform: translateY(0px); opacity: 1;} } .fa-swap-horizontal { -webkit-animation: swap-horizontal 0.45s ease-in-out both !important; animation: swap-horizontal 0.45s ease-out both !important; -webkit-animation-fill-mode: both; animation-fill-mode: both; overflow: hidden !important; } @keyframes swap-horizontal { 0%{ transform: translateX(0px); opacity: 1;} 18%{transform: translateX(20px);opacity: 0.15;} 20%{opacity: 0.2; } 50%{ transform: translateX(60px);} 51%{ transform: translateX(-80px); opacity: 0.0;} 52%{ transform: translateX(-40px); opacity: 0.0;} 58%{ transform: translateX(-10px); opacity: 0.6;} 70%{ transform: translateX(15px); opacity: 1;} 100%{ transform: translateX(0px); opacity: 1;} } @-webkit-keyframes swap-horizontal { 0%{ -webkit-transform: translateX(0px); opacity: 1;} 18%{-webkit-transform: translateX(20px);opacity: 0.15;} 20%{opacity: 0.2; } 50%{ -webkit-transform: translateX(60px);} 51%{ -webkit-transform: translateX(-80px); opacity: 0.0;} 52%{ -webkit-transform: translateX(-40px); opacity: 0.0;} 58%{ -webkit-transform: translateX(-10px); opacity: 0.6;} 70%{ -webkit-transform: translateX(15px); opacity: 1;} 100%{ -webkit-transform: translateX(0px); opacity: 1;} } /* END */ /* pinch fa-pinch inverse ( for buttons ) */ .fa-pinch { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; opacity: 1; padding: 1px; overflow: visible; -webkit-animation: pinch 0.55s ease-out both !important; animation: pinch 0.55s ease-out both !important; } /* @end */ /* @group PINCH */ @keyframes pinch { 0% {opacity: 1; transform: scale(1.0) translateX(0) translatey(0);} 25% {opacity: 0.5; transform: scale(0.5) translateX(0) translatey(0);} 33% {opacity: 0; transform: scale(0.0) translateX(0) translatey(0);} 35% {opacity: 0; transform: scale(0.0) translateX(0) translatey(0);} 40% {opacity: 0.0; transform: scale(1.7) translateX(0) translatey(0);} 50% {opacity: 0.2;} 70% {opacity: 0.9;} 100% {opacity: 1; transform: scale(1.0) translateX(0) translatey(0);} } @-webkit-keyframes pinch { 0% {opacity: 1; -webkit-transform: scale(1.0) translateX(0) translatey(0);} 25% {opacity: 0.5; -webkit-transform: scale(0.5) translateX(0) translatey(0);} 33% {opacity: 0; -webkit-transform: scale(0.0) translateX(0) translatey(0);} 35% {opacity: 0; -webkit-transform: scale(0.0) translateX(0) translatey(0);} 40% {opacity: 0.0; -webkit-transform: scale(1.7) translateX(0) translatey(0);} 50% {opacity: 0.2;} 70% {opacity: 0.9;} 100% {opacity: 1; -webkit-transform: scale(1.0) translateX(0) translatey(0);} } .fa-pinch-inverse { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0;margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; opacity: 1; padding: 1px; overflow: visible; -webkit-animation: pinch-inverse 0.55s ease-out both !important; animation: pinch-inverse 0.55s ease-out both !important; } @keyframes pinch-inverse { 100% {opacity: 1; transform: scale(1.0) translateX(0) translatey(0);} 70% {opacity: 0.5; transform: scale(0.5) translateX(0) translatey(0);} 50% {opacity: 0; transform: scale(0.0) translateX(0) translatey(0);} 40% {opacity: 0; transform: scale(0.0) translateX(0) translatey(0);} 35% {opacity: 0.0; transform: scale(1.7) translateX(0) translatey(0);} 33% {opacity: 0.2;} 25% {opacity: 0.9;} 0% {opacity: 1; transform: scale(1.0) translateX(0) translatey(0);} } @-webkit-keyframes pinch-inverse { 100% {opacity: 1; -webkit-transform: scale(1.0) translateX(0) translatey(0);} 70% {opacity: 0.5; -webkit-transform: scale(0.5) translateX(0) translatey(0);} 50% {opacity: 0; -webkit-transform: scale(0.0) translateX(0) translatey(0);} 40% {opacity: 0; -webkit-transform: scale(0.0) translateX(0) translatey(0);} 35% {opacity: 0.0; -webkit-transform: scale(1.7) translateX(0) translatey(0);} 33% {opacity: 0.2;} 25% {opacity: 0.9;} 0% {opacity: 1; -webkit-transform: scale(1.0) translateX(0) translatey(0);} } /* @end */ /* @group BLURRED */ /* --- BLUR BLURRED--- */ .fa-blurred { filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0); /* FOR IE8/9 */ -webkit-filter: blur(0px); /* modern browsers only */ -webkit-animation: blurred 0.8s ease-in both !important; animation: blurred 0.8s ease-in both !important; -ms-animation: blurred 0.8s ease-in both !important; } @keyframes blurred{ 0% {filter: blur(0px); -webkit-filter: blur(0px);} 20% {filter: blur(3px); -webkit-filter: blur(3px);} 100% {filter: blur(0px); -webkit-filter: blur(0px);} } @-webkit-keyframes blurred{ 0% {-webkit-filter: blur(0px);} 20% {-webkit-filter: blur(3px);} 100% {-webkit-filter: blur(0px);} } @-ms-keyframes blurred{/* IE9 does not support CSS animation. */ 0% {filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0);} 20% {filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=5);} 100% {filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=0);} } /* @end */ /* @group FLIPPED */ .fa-flipped { /* vertical */ display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; margin-right: auto; margin-left: auto; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flipped-y 1s ease-in-out both !important; animation: flipped-y 1s ease-in-out both !important; } @-webkit-keyframes flipped-y { 0% {-webkit-transform: perspective(3000px)rotateY(0deg);} 100% {-webkit-transform: perspective(3000px) rotateY(360deg);} } @keyframes flipped-y { 0% {transform: perspective(3000px) rotateY(00deg) rotateX(0deg);} 100% {transform: perspective(3000px) rotateY(360deg) rotateX(0deg);} } .fa-flipped-horizontal { display: inline-block; vertical-align: baseline; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; margin-right: auto; margin-left: auto; -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; -webkit-animation: flipped-x 1s ease-in-out both !important; animation: flipped-x 1s ease-in-out both !important; } @-webkit-keyframes flipped-x { 0% {-webkit-transform: perspective(3000px)rotateX(0deg);} 100% {-webkit-transform: perspective(3000px) rotateX(360deg);} } @keyframes flipped-x { 0% {transform: perspective(3000px) rotateX(00deg) rotateY(0deg);} 100% {transform: perspective(3000px) rotateX(360deg) rotateY(0deg);} } /* @end */ /* @group BOUNCE - center */ .fa-bounce { -webkit-animation-name: fa-bounce-center ; animation-name: fa-bounce-center ; -webkit-animation-duration: 0.90s; animation-duration: 0.90s; } @-webkit-keyframes fa-bounce-center {from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.230, 0.670, 0.390, 1.300); animation-timing-function: cubic-bezier(0.230, 0.670, 0.390, 1.300);} 0% { opacity: 0; -webkit-transform: scale3d(.4, .4, .4); transform: scale3d(.4, .4, .4); } 20% { -webkit-transform: scale3d(1.14, 1.14, 1.14); transform: scale3d(1.14, 1.14, 1.14); } 40% { -webkit-transform: scale3d(.8, .8, .8); transform: scale3d(.8, .8, .8); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.95, .95, .95); transform: scale3d(.95, .95, .95); } to {opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes fa-bounce-center { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.230, 0.670, 0.390, 1.300); animation-timing-function: cubic-bezier(0.230, 0.670, 0.390, 1.300);} 0% { opacity: 0; -webkit-transform: scale3d(.4, .4, .4); transform: scale3d(.4, .4, .4);} 20% { -webkit-transform: scale3d(1.14, 1.14, 1.14); transform: scale3d(1.14, 1.14, 1.14); } 40% { -webkit-transform: scale3d(.8, .8, .8); transform: scale3d(.8, .8, .8); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.95, .95, .95); transform: scale3d(.95, .95, .95); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } /* @end */ /* @group ENLARGE - REDUCE - Buttons States */ .fa-reduce { /*display: inline-block; vertical-align: baseline;*/ -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; overflow: visible; -webkit-animation: reduce 0.20s ease-in both !important; animation: reduce 0.20s ease-in both !important; transform-origin: center; transform-style: center; } @keyframes reduce { 0% {transform: scale(1);} 100% {transform: scale(0.9);} } @-webkit-keyframes reduce { 0% {-webkit-transform: scale(1);} 100% {-webkit-transform: scale(0.9);} } .fa-enlarge { /*display: inline-block; vertical-align: baseline; */ -webkit-transform: translateZ(0px); -webkit-transform-style: preserve-3d; overflow: visible; -webkit-animation: enlarge 0.25s ease-out both !important; animation: enlarge 0.25s ease-out both !important; transform-origin: center; transform-style: center; } @keyframes enlarge { 0% {transform: scale(0.9) translateX(0) translatey(0);} 100% {transform: scale(1.0) translateX(0) translatey(0);} } @-webkit-keyframes enlarge { 0% {-webkit-transform: scale(0.9) translateX(0) translatey(0);} 100% {-webkit-transform: scale(1.0) translateX(0) translatey(0);} } /* @end */ /* @end */ /* @group Elegant Icons */ [data-icon]:before {font-family: 'ElegantIcons'; content: attr(data-icon); speak: none; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* Use the following CSS code if you want to have a class per icon */ .arrow_up, .arrow_down, .arrow_left, .arrow_right, .arrow_left-up, .arrow_right-up, .arrow_right-down, .arrow_left-down, .arrow-up-down, .arrow_up-down_alt, .arrow_left-right_alt, .arrow_left-right, .arrow_expand_alt2, .arrow_expand_alt, .arrow_condense, .arrow_expand, .arrow_move, .arrow_carrot-up, .arrow_carrot-down, .arrow_carrot-left, .arrow_carrot-right, .arrow_carrot-2up, .arrow_carrot-2down, .arrow_carrot-2left, .arrow_carrot-2right, .arrow_carrot-up_alt2, .arrow_carrot-down_alt2, .arrow_carrot-left_alt2, .arrow_carrot-right_alt2, .arrow_carrot-2up_alt2, .arrow_carrot-2down_alt2, .arrow_carrot-2left_alt2, .arrow_carrot-2right_alt2, .arrow_triangle-up, .arrow_triangle-down, .arrow_triangle-left, .arrow_triangle-right, .arrow_triangle-up_alt2, .arrow_triangle-down_alt2, .arrow_triangle-left_alt2, .arrow_triangle-right_alt2, .arrow_back, .icon_minus-06, .icon_plus, .icon_close, .icon_check, .icon_minus_alt2, .icon_plus_alt2, .icon_close_alt2, .icon_check_alt2, .icon_zoom-out_alt, .icon_zoom-in_alt, .icon_search, .icon_box-empty, .icon_box-selected, .icon_minus-box, .icon_plus-box, .icon_box-checked, .icon_circle-empty, .icon_circle-slelected, .icon_stop_alt2, .icon_stop, .icon_pause_alt2, .icon_pause, .icon_menu, .icon_menu-square_alt2, .icon_menu-circle_alt2, .icon_ul, .icon_ol, .icon_adjust-horiz, .icon_adjust-vert, .icon_document_alt, .icon_documents_alt, .icon_pencil, .icon_pencil-edit_alt, .icon_pencil-edit, .icon_folder-alt, .icon_folder-open_alt, .icon_folder-add_alt, .icon_info_alt, .icon_error-oct_alt, .icon_error-circle_alt, .icon_error-triangle_alt, .icon_question_alt2, .icon_question, .icon_comment_alt, .icon_chat_alt, .icon_vol-mute_alt, .icon_volume-low_alt, .icon_volume-high_alt, .icon_quotations, .icon_quotations_alt2, .icon_clock_alt, .icon_lock_alt, .icon_lock-open_alt, .icon_key_alt, .icon_cloud_alt, .icon_cloud-upload_alt, .icon_cloud-download_alt, .icon_image, .icon_images, .icon_lightbulb_alt, .icon_gift_alt, .icon_house_alt, .icon_genius, .icon_mobile, .icon_tablet, .icon_laptop, .icon_desktop, .icon_camera_alt, .icon_mail_alt, .icon_cone_alt, .icon_ribbon_alt, .icon_bag_alt, .icon_creditcard, .icon_cart_alt, .icon_paperclip, .icon_tag_alt, .icon_tags_alt, .icon_trash_alt, .icon_cursor_alt, .icon_mic_alt, .icon_compass_alt, .icon_pin_alt, .icon_pushpin_alt, .icon_map_alt, .icon_drawer_alt, .icon_toolbox_alt, .icon_book_alt, .icon_calendar, .icon_film, .icon_table, .icon_contacts_alt, .icon_headphones, .icon_lifesaver, .icon_piechart, .icon_refresh, .icon_link_alt, .icon_link, .icon_loading, .icon_blocked, .icon_archive_alt, .icon_heart_alt, .icon_star_alt, .icon_star-half_alt, .icon_star, .icon_star-half, .icon_tools, .icon_tool, .icon_cog, .icon_cogs, .arrow_up_alt, .arrow_down_alt, .arrow_left_alt, .arrow_right_alt, .arrow_left-up_alt, .arrow_right-up_alt, .arrow_right-down_alt, .arrow_left-down_alt, .arrow_condense_alt, .arrow_expand_alt3, .arrow_carrot_up_alt, .arrow_carrot-down_alt, .arrow_carrot-left_alt, .arrow_carrot-right_alt, .arrow_carrot-2up_alt, .arrow_carrot-2dwnn_alt, .arrow_carrot-2left_alt, .arrow_carrot-2right_alt, .arrow_triangle-up_alt, .arrow_triangle-down_alt, .arrow_triangle-left_alt, .arrow_triangle-right_alt, .icon_minus_alt, .icon_plus_alt, .icon_close_alt, .icon_check_alt, .icon_zoom-out, .icon_zoom-in, .icon_stop_alt, .icon_menu-square_alt, .icon_menu-circle_alt, .icon_document, .icon_documents, .icon_pencil_alt, .icon_folder, .icon_folder-open, .icon_folder-add, .icon_folder_upload, .icon_folder_download, .icon_info, .icon_error-circle, .icon_error-oct, .icon_error-triangle, .icon_question_alt, .icon_comment, .icon_chat, .icon_vol-mute, .icon_volume-low, .icon_volume-high, .icon_quotations_alt, .icon_clock, .icon_lock, .icon_lock-open, .icon_key, .icon_cloud, .icon_cloud-upload, .icon_cloud-download, .icon_lightbulb, .icon_gift, .icon_house, .icon_camera, .icon_mail, .icon_cone, .icon_ribbon, .icon_bag, .icon_cart, .icon_tag, .icon_tags, .icon_trash, .icon_cursor, .icon_mic, .icon_compass, .icon_pin, .icon_pushpin, .icon_map, .icon_drawer, .icon_toolbox, .icon_book, .icon_contacts, .icon_archive, .icon_heart, .icon_profile, .icon_group, .icon_grid-2x2, .icon_grid-3x3, .icon_music, .icon_pause_alt, .icon_phone, .icon_upload, .icon_download, .social_facebook, .social_twitter, .social_pinterest, .social_googleplus, .social_tumblr, .social_tumbleupon, .social_wordpress, .social_instagram, .social_dribbble, .social_vimeo, .social_linkedin, .social_rss, .social_deviantart, .social_share, .social_myspace, .social_skype, .social_youtube, .social_picassa, .social_googledrive, .social_flickr, .social_blogger, .social_spotify, .social_delicious, .social_facebook_circle, .social_twitter_circle, .social_pinterest_circle, .social_googleplus_circle, .social_tumblr_circle, .social_stumbleupon_circle, .social_wordpress_circle, .social_instagram_circle, .social_dribbble_circle, .social_vimeo_circle, .social_linkedin_circle, .social_rss_circle, .social_deviantart_circle, .social_share_circle, .social_myspace_circle, .social_skype_circle, .social_youtube_circle, .social_picassa_circle, .social_googledrive_alt2, .social_flickr_circle, .social_blogger_circle, .social_spotify_circle, .social_delicious_circle, .social_facebook_square, .social_twitter_square, .social_pinterest_square, .social_googleplus_square, .social_tumblr_square, .social_stumbleupon_square, .social_wordpress_square, .social_instagram_square, .social_dribbble_square, .social_vimeo_square, .social_linkedin_square, .social_rss_square, .social_deviantart_square, .social_share_square, .social_myspace_square, .social_skype_square, .social_youtube_square, .social_picassa_square, .social_googledrive_square, .social_flickr_square, .social_blogger_square, .social_spotify_square, .social_delicious_square, .icon_printer, .icon_calulator, .icon_building, .icon_floppy, .icon_drive, .icon_search-2, .icon_id, .icon_id-2, .icon_puzzle, .icon_like, .icon_dislike, .icon_mug, .icon_currency, .icon_wallet, .icon_pens, .icon_easel, .icon_flowchart, .icon_datareport, .icon_briefcase, .icon_shield, .icon_percent, .icon_globe, .icon_globe-2, .icon_target, .icon_hourglass, .icon_balance, .icon_rook, .icon_printer-alt, .icon_calculator_alt, .icon_building_alt, .icon_floppy_alt, .icon_drive_alt, .icon_search_alt, .icon_id_alt, .icon_id-2_alt, .icon_puzzle_alt, .icon_like_alt, .icon_dislike_alt, .icon_mug_alt, .icon_currency_alt, .icon_wallet_alt, .icon_pens_alt, .icon_easel_alt, .icon_flowchart_alt, .icon_datareport_alt, .icon_briefcase_alt, .icon_shield_alt, .icon_percent_alt, .icon_globe_alt, .icon_clipboard { font-family: 'ElegantIcons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; display: inline-block; /* Added "inline-block" in order to use all AW font classes and also the Plus code (animations) */ } .arrow_up:before{content:"\21";}.arrow_down:before{content:"\22";}.arrow_left:before{content:"\23";}.arrow_right:before{content:"\24";}.arrow_left-up:before{content:"\25";}.arrow_right-up:before{content:"\26";}.arrow_right-down:before{content:"\27";}.arrow_left-down:before{content:"\28";}.arrow-up-down:before{content:"\29";}.arrow_up-down_alt:before{content:"\2a";}.arrow_left-right_alt:before{content:"\2b";}.arrow_left-right:before{content:"\2c";}.arrow_expand_alt2:before{content:"\2d";}.arrow_expand_alt:before{content:"\2e";}.arrow_condense:before{content:"\2f";}.arrow_expand:before{content:"\30";}.arrow_move:before{content:"\31";}.arrow_carrot-up:before{content:"\32";}.arrow_carrot-down:before{content:"\33";}.arrow_carrot-left:before{content:"\34";}.arrow_carrot-right:before{content:"\35";}.arrow_carrot-2up:before{content:"\36";}.arrow_carrot-2down:before{content:"\37";}.arrow_carrot-2left:before{content:"\38";}.arrow_carrot-2right:before{content:"\39";}.arrow_carrot-up_alt2:before{content:"\3a";}.arrow_carrot-down_alt2:before{content:"\3b";}.arrow_carrot-left_alt2:before{content:"\3c";}.arrow_carrot-right_alt2:before{content:"\3d";}.arrow_carrot-2up_alt2:before{content:"\3e";}.arrow_carrot-2down_alt2:before{content:"\3f";}.arrow_carrot-2left_alt2:before{content:"\40";}.arrow_carrot-2right_alt2:before{content:"\41";}.arrow_triangle-up:before{content:"\42";}.arrow_triangle-down:before{content:"\43";}.arrow_triangle-left:before{content:"\44";}.arrow_triangle-right:before{content:"\45";}.arrow_triangle-up_alt2:before{content:"\46";}.arrow_triangle-down_alt2:before{content:"\47";}.arrow_triangle-left_alt2:before{content:"\48";}.arrow_triangle-right_alt2:before{content:"\49";}.arrow_back:before{content:"\4a";}.icon_minus-06:before{content:"\4b";}.icon_plus:before{content:"\4c";}.icon_close:before{content:"\4d";}.icon_check:before{content:"\4e";}.icon_minus_alt2:before{content:"\4f";}.icon_plus_alt2:before{content:"\50";}.icon_close_alt2:before{content:"\51";}.icon_check_alt2:before{content:"\52";}.icon_zoom-out_alt:before{content:"\53";}.icon_zoom-in_alt:before{content:"\54";}.icon_search:before{content:"\55";}.icon_box-empty:before{content:"\56";}.icon_box-selected:before{content:"\57";}.icon_minus-box:before{content:"\58";}.icon_plus-box:before{content:"\59";}.icon_box-checked:before{content:"\5a";}.icon_circle-empty:before{content:"\5b";}.icon_circle-slelected:before{content:"\5c";}.icon_stop_alt2:before{content:"\5d";}.icon_stop:before{content:"\5e";}.icon_pause_alt2:before{content:"\5f";}.icon_pause:before{content:"\60";}.icon_menu:before{content:"\61";}.icon_menu-square_alt2:before{content:"\62";}.icon_menu-circle_alt2:before{content:"\63";}.icon_ul:before{content:"\64";}.icon_ol:before{content:"\65";}.icon_adjust-horiz:before{content:"\66";}.icon_adjust-vert:before{content:"\67";}.icon_document_alt:before{content:"\68";}.icon_documents_alt:before{content:"\69";}.icon_pencil:before{content:"\6a";}.icon_pencil-edit_alt:before{content:"\6b";}.icon_pencil-edit:before{content:"\6c";}.icon_folder-alt:before{content:"\6d";}.icon_folder-open_alt:before{content:"\6e";}.icon_folder-add_alt:before{content:"\6f";}.icon_info_alt:before{content:"\70";}.icon_error-oct_alt:before{content:"\71";}.icon_error-circle_alt:before{content:"\72";}.icon_error-triangle_alt:before{content:"\73";}.icon_question_alt2:before{content:"\74";}.icon_question:before{content:"\75";}.icon_comment_alt:before{content:"\76";}.icon_chat_alt:before{content:"\77";}.icon_vol-mute_alt:before{content:"\78";}.icon_volume-low_alt:before{content:"\79";}.icon_volume-high_alt:before{content:"\7a";}.icon_quotations:before{content:"\7b";}.icon_quotations_alt2:before{content:"\7c";}.icon_clock_alt:before{content:"\7d";}.icon_lock_alt:before{content:"\7e";}.icon_lock-open_alt:before{content:"\e000";}.icon_key_alt:before{content:"\e001";}.icon_cloud_alt:before{content:"\e002";}.icon_cloud-upload_alt:before{content:"\e003";}.icon_cloud-download_alt:before{content:"\e004";}.icon_image:before{content:"\e005";}.icon_images:before{content:"\e006";}.icon_lightbulb_alt:before{content:"\e007";}.icon_gift_alt:before{content:"\e008";}.icon_house_alt:before{content:"\e009";}.icon_genius:before{content:"\e00a";}.icon_mobile:before{content:"\e00b";}.icon_tablet:before{content:"\e00c";}.icon_laptop:before{content:"\e00d";}.icon_desktop:before{content:"\e00e";}.icon_camera_alt:before{content:"\e00f";}.icon_mail_alt:before{content:"\e010";}.icon_cone_alt:before{content:"\e011";}.icon_ribbon_alt:before{content:"\e012";}.icon_bag_alt:before{content:"\e013";}.icon_creditcard:before{content:"\e014";}.icon_cart_alt:before{content:"\e015";}.icon_paperclip:before{content:"\e016";}.icon_tag_alt:before{content:"\e017";}.icon_tags_alt:before{content:"\e018";}.icon_trash_alt:before{content:"\e019";}.icon_cursor_alt:before{content:"\e01a";}.icon_mic_alt:before{content:"\e01b";}.icon_compass_alt:before{content:"\e01c";}.icon_pin_alt:before{content:"\e01d";}.icon_pushpin_alt:before{content:"\e01e";}.icon_map_alt:before{content:"\e01f";}.icon_drawer_alt:before{content:"\e020";}.icon_toolbox_alt:before{content:"\e021";}.icon_book_alt:before{content:"\e022";}.icon_calendar:before{content:"\e023";}.icon_film:before{content:"\e024";}.icon_table:before{content:"\e025";}.icon_contacts_alt:before{content:"\e026";}.icon_headphones:before{content:"\e027";}.icon_lifesaver:before{content:"\e028";}.icon_piechart:before{content:"\e029";}.icon_refresh:before{content:"\e02a";}.icon_link_alt:before{content:"\e02b";}.icon_link:before{content:"\e02c";}.icon_loading:before{content:"\e02d";}.icon_blocked:before{content:"\e02e";}.icon_archive_alt:before{content:"\e02f";}.icon_heart_alt:before{content:"\e030";}.icon_star_alt:before{content:"\e031";}.icon_star-half_alt:before{content:"\e032";}.icon_star:before{content:"\e033";}.icon_star-half:before{content:"\e034";}.icon_tools:before{content:"\e035";}.icon_tool:before{content:"\e036";}.icon_cog:before{content:"\e037";}.icon_cogs:before{content:"\e038";}.arrow_up_alt:before{content:"\e039";}.arrow_down_alt:before{content:"\e03a";}.arrow_left_alt:before{content:"\e03b";}.arrow_right_alt:before{content:"\e03c";}.arrow_left-up_alt:before{content:"\e03d";}.arrow_right-up_alt:before{content:"\e03e";}.arrow_right-down_alt:before{content:"\e03f";}.arrow_left-down_alt:before{content:"\e040";}.arrow_condense_alt:before{content:"\e041";}.arrow_expand_alt3:before{content:"\e042";}.arrow_carrot_up_alt:before{content:"\e043";}.arrow_carrot-down_alt:before{content:"\e044";}.arrow_carrot-left_alt:before{content:"\e045";}.arrow_carrot-right_alt:before{content:"\e046";}.arrow_carrot-2up_alt:before{content:"\e047";}.arrow_carrot-2dwnn_alt:before{content:"\e048";}.arrow_carrot-2left_alt:before{content:"\e049";}.arrow_carrot-2right_alt:before{content:"\e04a";}.arrow_triangle-up_alt:before{content:"\e04b";}.arrow_triangle-down_alt:before{content:"\e04c";}.arrow_triangle-left_alt:before{content:"\e04d";}.arrow_triangle-right_alt:before{content:"\e04e";}.icon_minus_alt:before{content:"\e04f";}.icon_plus_alt:before{content:"\e050";}.icon_close_alt:before{content:"\e051";}.icon_check_alt:before{content:"\e052";}.icon_zoom-out:before{content:"\e053";}.icon_zoom-in:before{content:"\e054";}.icon_stop_alt:before{content:"\e055";}.icon_menu-square_alt:before{content:"\e056";}.icon_menu-circle_alt:before{content:"\e057";}.icon_document:before{content:"\e058";}.icon_documents:before{content:"\e059";}.icon_pencil_alt:before{content:"\e05a";}.icon_folder:before{content:"\e05b";}.icon_folder-open:before{content:"\e05c";}.icon_folder-add:before{content:"\e05d";}.icon_folder_upload:before{content:"\e05e";}.icon_folder_download:before{content:"\e05f";}.icon_info:before{content:"\e060";}.icon_error-circle:before{content:"\e061";}.icon_error-oct:before{content:"\e062";}.icon_error-triangle:before{content:"\e063";}.icon_question_alt:before{content:"\e064";}.icon_comment:before{content:"\e065";}.icon_chat:before{content:"\e066";}.icon_vol-mute:before{content:"\e067";}.icon_volume-low:before{content:"\e068";}.icon_volume-high:before{content:"\e069";}.icon_quotations_alt:before{content:"\e06a";}.icon_clock:before{content:"\e06b";}.icon_lock:before{content:"\e06c";}.icon_lock-open:before{content:"\e06d";}.icon_key:before{content:"\e06e";}.icon_cloud:before{content:"\e06f";}.icon_cloud-upload:before{content:"\e070";}.icon_cloud-download:before{content:"\e071";}.icon_lightbulb:before{content:"\e072";}.icon_gift:before{content:"\e073";}.icon_house:before{content:"\e074";}.icon_camera:before{content:"\e075";}.icon_mail:before{content:"\e076";}.icon_cone:before{content:"\e077";}.icon_ribbon:before{content:"\e078";}.icon_bag:before{content:"\e079";}.icon_cart:before{content:"\e07a";}.icon_tag:before{content:"\e07b";}.icon_tags:before{content:"\e07c";}.icon_trash:before{content:"\e07d";}.icon_cursor:before{content:"\e07e";}.icon_mic:before{content:"\e07f";}.icon_compass:before{content:"\e080";}.icon_pin:before{content:"\e081";}.icon_pushpin:before{content:"\e082";}.icon_map:before{content:"\e083";}.icon_drawer:before{content:"\e084";}.icon_toolbox:before{content:"\e085";}.icon_book:before{content:"\e086";}.icon_contacts:before{content:"\e087";}.icon_archive:before{content:"\e088";}.icon_heart:before{content:"\e089";}.icon_profile:before{content:"\e08a";}.icon_group:before{content:"\e08b";}.icon_grid-2x2:before{content:"\e08c";}.icon_grid-3x3:before{content:"\e08d";}.icon_music:before{content:"\e08e";}.icon_pause_alt:before{content:"\e08f";}.icon_phone:before{content:"\e090";}.icon_upload:before{content:"\e091";}.icon_download:before{content:"\e092";}.social_facebook:before{content:"\e093";}.social_twitter:before{content:"\e094";}.social_pinterest:before{content:"\e095";}.social_googleplus:before{content:"\e096";}.social_tumblr:before{content:"\e097";}.social_tumbleupon:before{content:"\e098";}.social_wordpress:before{content:"\e099";}.social_instagram:before{content:"\e09a";}.social_dribbble:before{content:"\e09b";}.social_vimeo:before{content:"\e09c";}.social_linkedin:before{content:"\e09d";}.social_rss:before{content:"\e09e";}.social_deviantart:before{content:"\e09f";}.social_share:before{content:"\e0a0";}.social_myspace:before{content:"\e0a1";}.social_skype:before{content:"\e0a2";}.social_youtube:before{content:"\e0a3";}.social_picassa:before{content:"\e0a4";}.social_googledrive:before{content:"\e0a5";}.social_flickr:before{content:"\e0a6";}.social_blogger:before{content:"\e0a7";}.social_spotify:before{content:"\e0a8";}.social_delicious:before{content:"\e0a9";}.social_facebook_circle:before{content:"\e0aa";}.social_twitter_circle:before{content:"\e0ab";}.social_pinterest_circle:before{content:"\e0ac";}.social_googleplus_circle:before{content:"\e0ad";}.social_tumblr_circle:before{content:"\e0ae";}.social_stumbleupon_circle:before{content:"\e0af";}.social_wordpress_circle:before{content:"\e0b0";}.social_instagram_circle:before{content:"\e0b1";}.social_dribbble_circle:before{content:"\e0b2";}.social_vimeo_circle:before{content:"\e0b3";}.social_linkedin_circle:before{content:"\e0b4";}.social_rss_circle:before{content:"\e0b5";}.social_deviantart_circle:before{content:"\e0b6";}.social_share_circle:before{content:"\e0b7";}.social_myspace_circle:before{content:"\e0b8";}.social_skype_circle:before{content:"\e0b9";}.social_youtube_circle:before{content:"\e0ba";}.social_picassa_circle:before{content:"\e0bb";}.social_googledrive_alt2:before{content:"\e0bc";}.social_flickr_circle:before{content:"\e0bd";}.social_blogger_circle:before{content:"\e0be";}.social_spotify_circle:before{content:"\e0bf";}.social_delicious_circle:before{content:"\e0c0";}.social_facebook_square:before{content:"\e0c1";}.social_twitter_square:before{content:"\e0c2";}.social_pinterest_square:before{content:"\e0c3";}.social_googleplus_square:before{content:"\e0c4";}.social_tumblr_square:before{content:"\e0c5";}.social_stumbleupon_square:before{content:"\e0c6";}.social_wordpress_square:before{content:"\e0c7";}.social_instagram_square:before{content:"\e0c8";}.social_dribbble_square:before{content:"\e0c9";}.social_vimeo_square:before{content:"\e0ca";}.social_linkedin_square:before{content:"\e0cb";}.social_rss_square:before{content:"\e0cc";}.social_deviantart_square:before{content:"\e0cd";}.social_share_square:before{content:"\e0ce";}.social_myspace_square:before{content:"\e0cf";}.social_skype_square:before{content:"\e0d0";}.social_youtube_square:before{content:"\e0d1";}.social_picassa_square:before{content:"\e0d2";}.social_googledrive_square:before{content:"\e0d3";}.social_flickr_square:before{content:"\e0d4";}.social_blogger_square:before{content:"\e0d5";}.social_spotify_square:before{content:"\e0d6";}.social_delicious_square:before{content:"\e0d7";}.icon_printer:before{content:"\e103";}.icon_calulator:before{content:"\e0ee";}.icon_building:before{content:"\e0ef";}.icon_floppy:before{content:"\e0e8";}.icon_drive:before{content:"\e0ea";}.icon_search-2:before{content:"\e101";}.icon_id:before{content:"\e107";}.icon_id-2:before{content:"\e108";}.icon_puzzle:before{content:"\e102";}.icon_like:before{content:"\e106";}.icon_dislike:before{content:"\e0eb";}.icon_mug:before{content:"\e105";}.icon_currency:before{content:"\e0ed";}.icon_wallet:before{content:"\e100";}.icon_pens:before{content:"\e104";}.icon_easel:before{content:"\e0e9";}.icon_flowchart:before{content:"\e109";}.icon_datareport:before{content:"\e0ec";}.icon_briefcase:before{content:"\e0fe";}.icon_shield:before{content:"\e0f6";}.icon_percent:before{content:"\e0fb";}.icon_globe:before{content:"\e0e2";}.icon_globe-2:before{content:"\e0e3";}.icon_target:before{content:"\e0f5";}.icon_hourglass:before{content:"\e0e1";}.icon_balance:before{content:"\e0ff";}.icon_rook:before{content:"\e0f8";}.icon_printer-alt:before{content:"\e0fa";}.icon_calculator_alt:before{content:"\e0e7";}.icon_building_alt:before{content:"\e0fd";}.icon_floppy_alt:before{content:"\e0e4";}.icon_drive_alt:before{content:"\e0e5";}.icon_search_alt:before{content:"\e0f7";}.icon_id_alt:before{content:"\e0e0";}.icon_id-2_alt:before{content:"\e0fc";}.icon_puzzle_alt:before{content:"\e0f9";}.icon_like_alt:before{content:"\e0dd";}.icon_dislike_alt:before{content:"\e0f1";}.icon_mug_alt:before{content:"\e0dc";}.icon_currency_alt:before{content:"\e0f3";}.icon_wallet_alt:before{content:"\e0d8";}.icon_pens_alt:before{content:"\e0db";}.icon_easel_alt:before{content:"\e0f0";}.icon_flowchart_alt:before{content:"\e0df";}.icon_datareport_alt:before{content:"\e0f2";}.icon_briefcase_alt:before{content:"\e0f4";}.icon_shield_alt:before{content:"\e0d9";}.icon_percent_alt:before{content:"\e0da";}.icon_globe_alt:before{content:"\e0de";}.icon_clipboard:before{content:"\e0e6";} .glyph {float: left; text-align: center; padding: .75em; margin: .4em 1.5em .75em 0; width: 6em; text-shadow: none; } .glyph_big { font-size: 128px; color: #59c5dc; float: left; margin-right: 20px; } .glyph div { padding-bottom: 10px;} .glyph input { font-family: consolas, monospace; font-size: 12px; width: 100%; text-align: center; border: 0; box-shadow: 0 0 0 1px #ccc; padding: .2em; -moz-border-radius: 5px; -webkit-border-radius: 5px;} .centered { margin-left: auto; margin-right: auto; } .glyph .fs1 { font-size: 2em; } /* @end */