<?php 

    use Pixebuilder\Element as Element;

    // prevent direct file access
	if( !defined( 'ABSPATH' ) ) exit;
    
    // check if post has autosave
    function pixe_post_has_autosave($post_id){
        $autosave_data = get_post_meta($post_id, '_autosave-pixe-builder-data', true);
        if( empty($autosave_data) ){
            return false;
        }
        return true;
    }

    // get page dependencies
    function pixe_get_post_dependency($post_id, $autosave = false){
        if( empty($post_id) ) return '';

        $autosave = $autosave? pixe_post_has_autosave($post_id): false;
        $prefix = $autosave? '_autosave-': '';
        $dependency = get_post_meta($post_id, $prefix . 'pixe-builder-dependency', true);
        $dependency = apply_filters('pixe_get_post_dependency', $dependency, $post_id, $autosave);
        
        return $dependency;
    }
    
    // get page builder data by post id
    function pixe_get_builder_data($post_id, $autosave = false){
        $builder_data = array();

        $autosave = $autosave? pixe_post_has_autosave($post_id): false;
        $prefix = $autosave? '_autosave-': '';
        $builder_data = get_post_meta($post_id, $prefix . 'pixe-builder-main', true);
        $builder_data = apply_filters('pixe_get_builder_data', $builder_data, $post_id, $autosave);

        return $builder_data;
    } // get_builder_data
    function pixe_get_builder_settings($post_id, $autosave = false){
        $builder_settings = array();

        $autosave = $autosave? pixe_post_has_autosave($post_id): false;
        $prefix = $autosave? '_autosave-': '';
        $builder_settings = get_post_meta($post_id, $prefix . 'pixe-builder-settings', true);
        return $builder_settings;
    } 

    // get style of the page
    function pixe_get_post_style($post_id, $autosave = false){
        if( empty($post_id) ) return '';

        $autosave = $autosave? pixe_post_has_autosave($post_id): false;
        $prefix = $autosave? '_autosave-': '';
        $styles = get_post_meta($post_id, $prefix . 'pixe-builder-styles', true);
        $styles = apply_filters('pixe_get_post_style', $styles, $post_id, $autosave);
        return $styles;
    }

    // get content of the page
    function pixe_get_post_content($post_id, $autosave = false){
        if( empty($post_id) ) return '';
        
        global $pixe_builder_loop;
        $pixe_builder_loop = true;

        $builder_data = pixe_get_builder_data($post_id, $autosave);
        $builder_content = pixe_get_builder_content($builder_data, true);
        
        $pixe_builder_loop = false;

        if( !empty($builder_content) ){
            if( Pixe_Editor::is_editor() && Pixe_Template::is_template() ){
                return $builder_content;
            }else{
                return '<div class="pixe-editor pixe-box-sizing" >' . $builder_content . '</div>';
            }
        }
    
        return '';
    } // pixe_get_content 

    // get page elements by type
    function pixe_get_builder_content($data, $is_editor = false, $echo = false){
        $builder_html_safe = '';
        $editor_content_div = false;

        if( is_array($data) ){
            foreach($data as $item){ 
                if( empty($item) ) continue;

                // editor content div
                if( $is_editor ){
                    if( $item['_type'] == 'wrapper' || $item['_type'] == 'collection' || ($item['_type'] == 'element' && $item['_element'] == 'post-content') ){
                        if( $editor_content_div ){
                            $builder_html_safe .= '</div>'; $editor_content_div = false; 
                        }
                    }else{
                        if( !$editor_content_div ){
                            $builder_html_safe .= '<div class="pixe-editor-content" >'; $editor_content_div = true;
                        }
                    }
                }

                // print item
                switch($item['_type']){
                    case 'collection':
                        $builder_html_safe .= Element\Collection::render($item);
                        break;
                    case 'wrapper':
                        $builder_html_safe .= Element\Wrapper::render($item);
                        break;
                    case 'column': 
                        $builder_html_safe .= Element\Column::render($item);
                        break;
                    case 'element':
                        $builder_html_safe .= Element\Item::render_element($item);
                        break;
                }
            }

            // close last div
            if( $is_editor && $editor_content_div ){ $builder_html_safe .= '</div>'; $editor_content_div = false; }
        }
        
                        
        if( !empty($echo) ){
            echo $builder_html_safe; // phpcs:ignore WordPress.Security.EscapeOutput -- Output escaped during element rendering.
        }else{
            return $builder_html_safe;
        }
        
    } // pixe_get_builder_content

    // get responsive class from item settings
    function pixe_get_responsive_class($settings, $slug = 'responsive', $display = 'block'){
        $extra_class = '';

        // responsive class
        if( !empty($settings[$slug]) ){
            if( in_array('desktop', $settings[$slug]) ){
                $extra_class .= ' pixe-hide-desktop';
            }
            if( in_array('tablet', $settings[$slug]) ){
                $extra_class .= ' pixe-hide-tablet';
            }
            if( in_array('mobile', $settings[$slug]) ){
                $extra_class .= ' pixe-hide-mobile';
            }
        }

        // display class
        if( !empty($extra_class) ){
            $extra_class .= ' pixe-display-' . $display;
        }

        return $extra_class;
    }

    // background media sync with "pixeSetBackgroundMedia" js function
    function pixe_get_background_media($item_settings = array(), $always_show = false){
        if( empty($item_settings['bg-media']) ){
            if( $always_show ){
                return '<div class="pixe-bg-style" ></div>';
            }else{
                return '';
            }
        }

        $ret = '';
        $extra_class = '';
        $settings = $item_settings['bg-media'];

        $devices = array(
            'desktop' => 'pixe-desktop pixe-normal',
            'desktop-hover' => 'pixe-desktop pixe-hover',
            'tablet' => 'pixe-tablet pixe-normal',
            'tablet-hover' => 'pixe-tablet pixe-hover',
            'mobile' => 'pixe-mobile pixe-normal',
            'mobile-hover' => 'pixe-mobile pixe-hover',
        );

        foreach($devices as $slug => $device_class){
            if( empty($settings[$slug]) ) continue;
            
            $bg_class = $device_class;
            if( empty($settings[$slug]['type']) || $settings[$slug]['type'] == 'image' ){
                $bg = pixe_get_background_image($bg_class, $settings[$slug]);
            }else if( $settings[$slug]['type'] == 'video' ){
                $bg = pixe_get_background_video($bg_class, $settings[$slug]);
            }else if( $settings[$slug]['type'] == 'map' ){
                $bg = pixe_get_background_map($bg_class, $settings[$slug]);
            }

            // add extra class for hiding desktop bg
            if( !empty($bg) ){
                $ret .= $bg;
                if( $slug == 'tablet' ){
                    $extra_class .= 'pixe-has-tablet';
                }else if( $slug == 'mobile' ){
                    $extra_class .= 'pixe-has-mobile';
                }
            }
        }
        
        if( !empty($ret) || $always_show ){
            $ret = '<div class="pixe-bg-style ' . esc_attr($extra_class) . '" >' . $ret . '</div>';
        }

        return $ret;
    }
    function pixe_get_background_image($extra_class, $settings = array()){

        // check if image exists
        if( empty($settings['source']) ){
            if( empty($settings['image']) ) return '';

        }else{
            if( $settings['source'] == 'featured-image' ){
                $query_image_id = get_post_thumbnail_id();

            }else if( $settings['source'] == 'custom-field' ){
                if( empty($settings['source-slug']) ) return;
                if( empty(get_the_ID()) ) return '';
                $query_image_id = get_post_meta(get_the_ID(), $settings['source-slug'], true);

            }else if( $settings['source'] == 'term-meta' ){
                if( empty($settings['source-slug']) ) return;
                $term = pixe_get_query_term();
                $query_image_id = get_term_meta($term->term_id, $settings['source-slug'], true);
            }
            if( empty($query_image_id) ) return;
        }

        // get style
        $atts = array();

        // attachment
        if( !empty($settings['attachment']) ){
            if( $settings['attachment'] == 'parallax' && !empty($settings['parallax-speed']) ){
                $atts['parallax'] = $settings['parallax-speed'];
            }
        }

        $bg  = '<div class="pixe-bg pixe-bg-image ' . esc_attr($extra_class) . '" ';
        $bg .= pixe_get_data_atts($atts);
        $bg .= ' >';
        if( !empty($settings['display']) && $settings['display'] == 'img' ){
            $thumbnail_size = empty($settings['thumbnail-size'])? 'full': $settings['thumbnail-size'];
            if( !empty($settings['source']) ){
                $bg .= wp_get_attachment_image($query_image_id, $thumbnail_size, false, array('class' => 'pixe-bg-inner'));
            }else if( !empty($settings['image']['id']) ){
                $bg .= wp_get_attachment_image($settings['image']['id'], $thumbnail_size, false, array('class' => 'pixe-bg-inner'));
            }
        }else{
            if( !empty($settings['source']) ){ 
                $styles = array('background-image' => array('id' => $query_image_id));
            }else{
                $styles = array('background-image' => $settings['image']);
            }
            $bg .= '<div class="pixe-bg-inner" ' . pixe_get_style_atts($styles) . '></div>';
        }
        $bg .= '</div>';

        return $bg;
    }
    function pixe_get_background_video($extra_class, $settings = array()){
        $video = '';
        
        $video_settings = array(
            'background' => 'yes',
            'loop' => (isset($settings['loop']) && $settings['loop'] == 'no')? 'no': 'yes',
            'start-time' => isset($settings['start-time'])? $settings['start-time']: '',
            'end-time' => isset($settings['end-time'])? $settings['end-time']: ''
        );
        if( empty($settings['video-type']) ){
            if( !empty($settings['url']) ){
                
                $video = pixe_get_video($settings['url'], $video_settings);

                if( !empty($video) ){
                    $extra_class .= ' pixe-fvideo-wrap';
                }else{
                    $video = pixe_get_html5_video($settings['url'], $video_settings);
                }
            }
        }else if( $settings['video-type'] == 'self-hosted' ){
            if( !empty($settings['video']['url']) ){
                $video = pixe_get_html5_video($settings['video']['url'], $video_settings);
            }
        }

        if( !empty($video) ){
            return '<div class="pixe-bg pixe-bg-video ' . esc_attr($extra_class) . '" >' . $video . '</div>';
        }
        
        return '';
    }

    function pixe_get_background_map($extra_class, $settings = array()){
        return '<div class="pixe-bg pixe-bg-map ' . esc_attr($extra_class) . '" >' . pixe_get_map($settings) . '</div>';
    }

    function pixe_animation_class($settings){
        if( pixe_is_admin() ){
            return '';
        }else if( !empty($settings['animation']) || !empty($settings['tablet-animation']) || !empty($settings['mobile-animation']) ){
            return ' pixe-animation-init';
        }
        return '';
    }
    function pixe_scroll_motion_atts($settings){
        $atts = array();
        if( !empty($settings['scroll-motion']) ){
            $atts['d'] = $settings['scroll-motion'];
        }
        if( !empty($settings['tablet-scroll-motion']) ){
            $atts['t'] = $settings['tablet-scroll-motion'];
        }
        if( !empty($settings['mobile-scroll-motion']) ){
            $atts['m'] = $settings['mobile-scroll-motion'];
        }
        if( !empty($atts) && !empty($settings['_element']) && in_array($settings['_element'], array('text-box', 'title')) ){
            $atts['type'] = 'text';
        }
        
        return $atts;
    }
    function pixe_animation_atts($settings){
        $atts = array();
        if( isset($settings['animation']['trigger-location']) && $settings['animation']['trigger-location'] != '' ){
            $atts['d'] = $settings['animation']['trigger-location'];
        }
        if( isset($settings['tablet-animation']['trigger-location']) && $settings['tablet-animation']['trigger-location'] != '' ){
            $atts['t'] = $settings['tablet-animation']['trigger-location'];
        }
        if( isset($settings['mobile-animation']['trigger-location']) && $settings['mobile-animation']['trigger-location'] != '' ){
            $atts['m'] = $settings['mobile-animation']['trigger-location'];
        }
        if( !empty($settings['animation']['repeat']) ){
            $atts['repeat'] = 1;
        }

        if( empty($atts) && 
            (!empty($settings['animation']['effect']) || !empty($settings['tablet-animation']['effect']) || !empty($settings['mobile-animation']['effect'])) ){
            return 'empty';
        }
        return $atts;
    }

    function pixe_animation_css($type){
        switch($type){
            case 'fade-in': 
                return '@-webkit-keyframes fadeIn{ from {opacity: 0;} to {opacity: 1;} }@keyframes fadeIn{ from {opacity: 0;} to {opacity: 1;} }';
            case 'fade-in-up':
                return '@-webkit-keyframes fadeInUp{ from {opacity: 0;-webkit-transform: translate3d(0, 50px, 0);transform: translate3d(0, 50px, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes fadeInUp{ from {opacity: 0;-webkit-transform: translate3d(0, 50px, 0);transform: translate3d(0, 50px, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'fade-in-down':
                return '@-webkit-keyframes fadeInDown{ from {opacity: 0;-webkit-transform: translate3d(0, -50px, 0);transform: translate3d(0, -50px, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes fadeInDown{ from {opacity: 0;-webkit-transform: translate3d(0, -50px, 0);transform: translate3d(0, -50px, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'fade-in-left':
                return '@-webkit-keyframes fadeInLeft{ from {opacity: 0;-webkit-transform: translate3d(-50px, 0, 0);transform: translate3d(-50px, 0, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes fadeInLeft{ from {opacity: 0;-webkit-transform: translate3d(-50px, 0, 0);transform: translate3d(-50px, 0, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'fade-in-right':
                return '@-webkit-keyframes fadeInRight{ from {opacity: 0;-webkit-transform: translate3d(50px, 0, 0);transform: translate3d(50px, 0, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes fadeInRight{ from {opacity: 0;-webkit-transform: translate3d(50px, 0, 0);transform: translate3d(50px, 0, 0);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'slide-in-up':
                return '@-webkit-keyframes slideInUp{ from {opacity: 0;-webkit-transform: translate3d(0, 50px, 0);transform: translate3d(0, 50px, 0);visibility: visible;} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes slideInUp{ from {opacity: 0;-webkit-transform: translate3d(0, 50px, 0);transform: translate3d(0, 50px, 0);visibility: visible;} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'slide-in-down':
                return '@-webkit-keyframes slideInDown{ from {opacity: 0;-webkit-transform: translate3d(0, -50px, 0);transform: translate3d(0, -50px, 0);visibility: visible;} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes slideInDown{ from {opacity: 0;-webkit-transform: translate3d(0, -50px, 0);transform: translate3d(0, -50px, 0);visibility: visible;} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'slide-in-left':
                return '@-webkit-keyframes slideInLeft{ from {opacity: 0;-webkit-transform: translate3d(-50px, 0, 0);transform: translate3d(-50px, 0, 0);visibility: visible;} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes slideInLeft{ from {opacity: 0;-webkit-transform: translate3d(-50px, 0, 0);transform: translate3d(-50px, 0, 0);visibility: visible;} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'slide-in-right':
                return '@-webkit-keyframes slideInRight{ from {opacity: 0;-webkit-transform: translate3d(50px, 0, 0);transform: translate3d(50px, 0, 0);visibility: visible;} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes slideInRight{ from {opacity: 0;-webkit-transform: translate3d(50px, 0, 0);transform: translate3d(50px, 0, 0);visibility: visible;} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'zoom-in':
                return '@-webkit-keyframes zoomIn{ from {opacity: 0;-webkit-transform: scale3d(0.3, 0.3, 0.3);transform: scale3d(0.3, 0.3, 0.3);} 50% {opacity: 1;} 100% {opacity: 1} }@keyframes zoomIn{ from {opacity: 0;-webkit-transform: scale3d(0.3, 0.3, 0.3);transform: scale3d(0.3, 0.3, 0.3);} 50% {opacity: 1;} 100% {opacity: 1} }';
            case 'zoom-in-up':
                return '@-webkit-keyframes zoomInUp{ from {opacity: 0;-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);} 60% {opacity: 1;-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);} 100% {opacity: 1} }@keyframes zoomInUp{ from {opacity: 0;-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);} 60% {opacity: 1;-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);} 100% {opacity: 1} }';
            case 'zoom-in-down':
                return '@-webkit-keyframes zoomInDown{ from {opacity: 0;-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);} 60% {opacity: 1;-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);} 100% {opacity: 1} }@keyframes zoomInDown{ from {opacity: 0;-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);} 60% {opacity: 1;-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);} 100% {opacity: 1} }';
            case 'zoom-in-left':
                return '@-webkit-keyframes zoomInLeft{ from {opacity: 0;-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);} 60% {opacity: 1;-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);} 100% {opacity: 1} }@keyframes zoomInLeft{ from {opacity: 0;-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);} 60% {opacity: 1;-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);} 100% {opacity: 1} }';
            case 'zoom-in-right':
                return '@-webkit-keyframes zoomInRight{ from {opacity: 0;-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);} 60% {opacity: 1;-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);} 100% {opacity: 1} }@keyframes zoomInRight{ from {opacity: 0;-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);} 60% {opacity: 1;-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);} 100% {opacity: 1} }';
            case 'rotate-in':
                return '@-webkit-keyframes rotateIn{ from {-webkit-transform: rotate3d(0, 0, 1, -200deg);transform: rotate3d(0, 0, 1, -200deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }@keyframes rotateIn{ from {-webkit-transform: rotate3d(0, 0, 1, -200deg);transform: rotate3d(0, 0, 1, -200deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }';
            case 'rotate-in-up-left':
                return '@-webkit-keyframes rotateInUpLeft{ from {-webkit-transform: rotate3d(0, 0, 1, 45deg);transform: rotate3d(0, 0, 1, 45deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }@keyframes rotateInUpLeft{ from {-webkit-transform: rotate3d(0, 0, 1, 45deg);transform: rotate3d(0, 0, 1, 45deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }';
            case 'rotate-in-up-right':
                return '@-webkit-keyframes rotateInUpRight{ from {-webkit-transform: rotate3d(0, 0, 1, -90deg);transform: rotate3d(0, 0, 1, -90deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }@keyframes rotateInUpRight{ from {-webkit-transform: rotate3d(0, 0, 1, -90deg);transform: rotate3d(0, 0, 1, -90deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }';
            case 'rotate-in-down-left':
                return '@-webkit-keyframes rotateInDownLeft{ from {-webkit-transform: rotate3d(0, 0, 1, -45deg);transform: rotate3d(0, 0, 1, -45deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }@keyframes rotateInDownLeft{ from {-webkit-transform: rotate3d(0, 0, 1, -45deg);transform: rotate3d(0, 0, 1, -45deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }';
            case 'rotate-in-down-right':
                return '@-webkit-keyframes rotateInDownRight{ from {-webkit-transform: rotate3d(0, 0, 1, 45deg);transform: rotate3d(0, 0, 1, 45deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }@keyframes rotateInDownRight{ from {-webkit-transform: rotate3d(0, 0, 1, 45deg);transform: rotate3d(0, 0, 1, 45deg);opacity: 0;} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);opacity: 1;} }';
            case 'bounce':
                return '@-webkit-keyframes bounce{ from,20%,53%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 40%,43% {-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);-webkit-transform: translate3d(0, -30px, 0) scaleY(1.1);transform: translate3d(0, -30px, 0) scaleY(1.1);} 70% {-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);-webkit-transform: translate3d(0, -15px, 0) scaleY(1.05);transform: translate3d(0, -15px, 0) scaleY(1.05);} 80% {-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);-webkit-transform: translate3d(0, 0, 0) scaleY(0.95);transform: translate3d(0, 0, 0) scaleY(0.95);} 90% {-webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);transform: translate3d(0, -4px, 0) scaleY(1.02);} }@keyframes bounce{ from,20%,53%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 40%,43% {-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);-webkit-transform: translate3d(0, -30px, 0) scaleY(1.1);transform: translate3d(0, -30px, 0) scaleY(1.1);} 70% {-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);-webkit-transform: translate3d(0, -15px, 0) scaleY(1.05);transform: translate3d(0, -15px, 0) scaleY(1.05);} 80% {-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);-webkit-transform: translate3d(0, 0, 0) scaleY(0.95);transform: translate3d(0, 0, 0) scaleY(0.95);} 90% {-webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);transform: translate3d(0, -4px, 0) scaleY(1.02);} }';
            case 'bounce-in':
                return '@-webkit-keyframes bounceIn{ from,20%,40%,60%,80%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} 0% {opacity: 0;-webkit-transform: scale3d(0.3, 0.3, 0.3);transform: scale3d(0.3, 0.3, 0.3);} 20% {-webkit-transform: scale3d(1.1, 1.1, 1.1);transform: scale3d(1.1, 1.1, 1.1);} 40% {-webkit-transform: scale3d(0.9, 0.9, 0.9);transform: scale3d(0.9, 0.9, 0.9);} 60% {opacity: 1;-webkit-transform: scale3d(1.03, 1.03, 1.03);transform: scale3d(1.03, 1.03, 1.03);} 80% {-webkit-transform: scale3d(0.97, 0.97, 0.97);transform: scale3d(0.97, 0.97, 0.97);} to {opacity: 1;-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} }@keyframes bounceIn{ from,20%,40%,60%,80%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} 0% {opacity: 0;-webkit-transform: scale3d(0.3, 0.3, 0.3);transform: scale3d(0.3, 0.3, 0.3);} 20% {-webkit-transform: scale3d(1.1, 1.1, 1.1);transform: scale3d(1.1, 1.1, 1.1);} 40% {-webkit-transform: scale3d(0.9, 0.9, 0.9);transform: scale3d(0.9, 0.9, 0.9);} 60% {opacity: 1;-webkit-transform: scale3d(1.03, 1.03, 1.03);transform: scale3d(1.03, 1.03, 1.03);} 80% {-webkit-transform: scale3d(0.97, 0.97, 0.97);transform: scale3d(0.97, 0.97, 0.97);}to {opacity: 1;-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} }';
            case 'bounce-in-up':
                return '@-webkit-keyframes bounceInUp{ from,60%,75%,90%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} from {opacity: 0;-webkit-transform: translate3d(0, 3000px, 0) scaleY(5);transform: translate3d(0, 3000px, 0) scaleY(5);} 60% {opacity: 1;-webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);transform: translate3d(0, -20px, 0) scaleY(0.9);} 75% {-webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);transform: translate3d(0, 10px, 0) scaleY(0.95);} 90% {-webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);transform: translate3d(0, -5px, 0) scaleY(0.985);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes bounceInUp{ from,60%,75%,90%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} from {opacity: 0;-webkit-transform: translate3d(0, 3000px, 0) scaleY(5);transform: translate3d(0, 3000px, 0) scaleY(5);} 60% {opacity: 1;-webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);transform: translate3d(0, -20px, 0) scaleY(0.9);} 75% {-webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);transform: translate3d(0, 10px, 0) scaleY(0.95);} 90% {-webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);transform: translate3d(0, -5px, 0) scaleY(0.985);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'bounce-in-down':
                return '@-webkit-keyframes bounceInDown{ from,60%,75%,90%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} 0% {opacity: 0;-webkit-transform: translate3d(0, -3000px, 0) scaleY(3);transform: translate3d(0, -3000px, 0) scaleY(3);} 60% {opacity: 1;-webkit-transform: translate3d(0, 25px, 0) scaleY(0.9);transform: translate3d(0, 25px, 0) scaleY(0.9);} 75% {-webkit-transform: translate3d(0, -10px, 0) scaleY(0.95);transform: translate3d(0, -10px, 0) scaleY(0.95);} 90% {-webkit-transform: translate3d(0, 5px, 0) scaleY(0.985);transform: translate3d(0, 5px, 0) scaleY(0.985);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes bounceInDown{ from,60%,75%,90%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} 0% {opacity: 0;-webkit-transform: translate3d(0, -3000px, 0) scaleY(3);transform: translate3d(0, -3000px, 0) scaleY(3);} 60% {opacity: 1;-webkit-transform: translate3d(0, 25px, 0) scaleY(0.9);transform: translate3d(0, 25px, 0) scaleY(0.9);} 75% {-webkit-transform: translate3d(0, -10px, 0) scaleY(0.95);transform: translate3d(0, -10px, 0) scaleY(0.95);} 90% {-webkit-transform: translate3d(0, 5px, 0) scaleY(0.985);transform: translate3d(0, 5px, 0) scaleY(0.985);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'bounce-in-left':
                return '@-webkit-keyframes bounceInLeft{ from,60%,75%,90%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} 0% {opacity: 0;-webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);transform: translate3d(-3000px, 0, 0) scaleX(3);} 60% {opacity: 1;-webkit-transform: translate3d(25px, 0, 0) scaleX(1);transform: translate3d(25px, 0, 0) scaleX(1);} 75% {-webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);transform: translate3d(-10px, 0, 0) scaleX(0.98);} 90% {-webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);transform: translate3d(5px, 0, 0) scaleX(0.995);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes bounceInLeft{ from,60%,75%,90%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} 0% {opacity: 0;-webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);transform: translate3d(-3000px, 0, 0) scaleX(3);} 60% {opacity: 1;-webkit-transform: translate3d(25px, 0, 0) scaleX(1);transform: translate3d(25px, 0, 0) scaleX(1);} 75% {-webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);transform: translate3d(-10px, 0, 0) scaleX(0.98);} 90% {-webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);transform: translate3d(5px, 0, 0) scaleX(0.995);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'bounce-in-right':
                return '@-webkit-keyframes bounceInRight{ from,60%,75%,90%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} from {opacity: 0;-webkit-transform: translate3d(3000px, 0, 0) scaleX(3);transform: translate3d(3000px, 0, 0) scaleX(3);} 60% {opacity: 1;-webkit-transform: translate3d(-25px, 0, 0) scaleX(1);transform: translate3d(-25px, 0, 0) scaleX(1);} 75% {-webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);transform: translate3d(10px, 0, 0) scaleX(0.98);} 90% {-webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);transform: translate3d(-5px, 0, 0) scaleX(0.995);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes bounceInRight{ from,60%,75%,90%,to {-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} from {opacity: 0;-webkit-transform: translate3d(3000px, 0, 0) scaleX(3);transform: translate3d(3000px, 0, 0) scaleX(3);} 60% {opacity: 1;-webkit-transform: translate3d(-25px, 0, 0) scaleX(1);transform: translate3d(-25px, 0, 0) scaleX(1);} 75% {-webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);transform: translate3d(10px, 0, 0) scaleX(0.98);} 90% {-webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);transform: translate3d(-5px, 0, 0) scaleX(0.995);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'flip-in-x':
                return '@-webkit-keyframes flipInX{ from {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);transform: perspective(400px) rotate3d(1, 0, 0, 90deg);-webkit-animation-timing-function: ease-in;animation-timing-function: ease-in;opacity: 0;} 40% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);transform: perspective(400px) rotate3d(1, 0, 0, -20deg);-webkit-animation-timing-function: ease-in;animation-timing-function: ease-in;} 60% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);transform: perspective(400px) rotate3d(1, 0, 0, 10deg);opacity: 1;} 80% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);transform: perspective(400px) rotate3d(1, 0, 0, -5deg);} to {opacity: 1;-webkit-transform: perspective(400px);transform: perspective(400px);} }@keyframes flipInX{ from {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);transform: perspective(400px) rotate3d(1, 0, 0, 90deg);-webkit-animation-timing-function: ease-in;animation-timing-function: ease-in;opacity: 0;} 40% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);transform: perspective(400px) rotate3d(1, 0, 0, -20deg);-webkit-animation-timing-function: ease-in;animation-timing-function: ease-in;} 60% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);transform: perspective(400px) rotate3d(1, 0, 0, 10deg);opacity: 1;} 80% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);transform: perspective(400px) rotate3d(1, 0, 0, -5deg);} to {opacity: 1;-webkit-transform: perspective(400px);transform: perspective(400px);} }';
            case 'flip-in-y':
                return '@-webkit-keyframes flipInY{ from {-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);transform: perspective(400px) rotate3d(0, 1, 0, 90deg);-webkit-animation-timing-function: ease-in;animation-timing-function: ease-in;opacity: 0;} 40% {-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);transform: perspective(400px) rotate3d(0, 1, 0, -20deg);-webkit-animation-timing-function: ease-in;animation-timing-function: ease-in;} 60% {-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);transform: perspective(400px) rotate3d(0, 1, 0, 10deg);opacity: 1;} 80% {-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);transform: perspective(400px) rotate3d(0, 1, 0, -5deg);} to {opacity: 1;-webkit-transform: perspective(400px);transform: perspective(400px);} }@keyframes flipInY{ from {-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);transform: perspective(400px) rotate3d(0, 1, 0, 90deg);-webkit-animation-timing-function: ease-in;animation-timing-function: ease-in;opacity: 0;} 40% {-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);transform: perspective(400px) rotate3d(0, 1, 0, -20deg);-webkit-animation-timing-function: ease-in;animation-timing-function: ease-in;} 60% {-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);transform: perspective(400px) rotate3d(0, 1, 0, 10deg);opacity: 1;} 80% {-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);transform: perspective(400px) rotate3d(0, 1, 0, -5deg);} to {opacity: 1;-webkit-transform: perspective(400px);transform: perspective(400px);} }';
            case 'flash':
                return '@-webkit-keyframes flash{ from,50%,to {opacity: 1;} 25%,75% {opacity: 0;} }@keyframes flash{ from,50%,to {opacity: 1;} 25%,75% {opacity: 0;} }';
            case 'jack-in-the-box':
                return '@-webkit-keyframes jackInTheBox{ from {opacity: 0;-webkit-transform: scale(0.1) rotate(30deg);transform: scale(0.1) rotate(30deg);-webkit-transform-origin: center bottom;transform-origin: center bottom;} 50% {-webkit-transform: rotate(-10deg);transform: rotate(-10deg);}70% {-webkit-transform: rotate(3deg);transform: rotate(3deg);} to {opacity: 1;-webkit-transform: scale(1);transform: scale(1);} }@keyframes jackInTheBox{ from {opacity: 0;-webkit-transform: scale(0.1) rotate(30deg);transform: scale(0.1) rotate(30deg);-webkit-transform-origin: center bottom;transform-origin: center bottom;} 50% {-webkit-transform: rotate(-10deg);transform: rotate(-10deg);}70% {-webkit-transform: rotate(3deg);transform: rotate(3deg);} to {opacity: 1;-webkit-transform: scale(1);transform: scale(1);} }';
            case 'jello':
                return '@-webkit-keyframes jello{ from,11.1%,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 22.2% {-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);transform: skewX(-12.5deg) skewY(-12.5deg);} 33.3% {-webkit-transform: skewX(6.25deg) skewY(6.25deg);transform: skewX(6.25deg) skewY(6.25deg);} 44.4% {-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);transform: skewX(-3.125deg) skewY(-3.125deg);} 55.5% {-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);transform: skewX(1.5625deg) skewY(1.5625deg);} 66.6% {-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);transform: skewX(-0.78125deg) skewY(-0.78125deg);} 77.7% {-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);transform: skewX(0.390625deg) skewY(0.390625deg);} 88.8% {-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);transform: skewX(-0.1953125deg) skewY(-0.1953125deg);} }@keyframes jello{ from,11.1%,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 22.2% {-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);transform: skewX(-12.5deg) skewY(-12.5deg);} 33.3% {-webkit-transform: skewX(6.25deg) skewY(6.25deg);transform: skewX(6.25deg) skewY(6.25deg);} 44.4% {-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);transform: skewX(-3.125deg) skewY(-3.125deg);} 55.5% {-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);transform: skewX(1.5625deg) skewY(1.5625deg);} 66.6% {-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);transform: skewX(-0.78125deg) skewY(-0.78125deg);} 77.7% {-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);transform: skewX(0.390625deg) skewY(0.390625deg);} 88.8% {-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);transform: skewX(-0.1953125deg) skewY(-0.1953125deg);} }';
            case 'light-speed-in-left':
                return '@-webkit-keyframes lightSpeedInLeft{ from {-webkit-transform: translate3d(-100%, 0, 0) skewX(30deg);transform: translate3d(-100%, 0, 0) skewX(30deg);opacity: 0;} 60% {-webkit-transform: skewX(-20deg);transform: skewX(-20deg);opacity: 1;} 80% {-webkit-transform: skewX(5deg);transform: skewX(5deg);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes lightSpeedInLeft{ from {-webkit-transform: translate3d(-100%, 0, 0) skewX(30deg);transform: translate3d(-100%, 0, 0) skewX(30deg);opacity: 0;} 60% {-webkit-transform: skewX(-20deg);transform: skewX(-20deg);opacity: 1;} 80% {-webkit-transform: skewX(5deg);transform: skewX(5deg);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'light-speed-in-right':
                return '@-webkit-keyframes lightSpeedInRight{ from {-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);transform: translate3d(100%, 0, 0) skewX(-30deg);opacity: 0;} 60% {-webkit-transform: skewX(20deg);transform: skewX(20deg);opacity: 1;} 80% {-webkit-transform: skewX(-5deg);transform: skewX(-5deg);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes lightSpeedInRight{ from {-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);transform: translate3d(100%, 0, 0) skewX(-30deg);opacity: 0;} 60% {-webkit-transform: skewX(20deg);transform: skewX(20deg);opacity: 1;} 80% {-webkit-transform: skewX(-5deg);transform: skewX(-5deg);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            case 'roll-in':
                return '@-webkit-keyframes rollIn{ from {opacity: 0;-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}}@keyframes rollIn{ from {opacity: 0;-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);} to {opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}}';
            case 'pulse':
                return '@-webkit-keyframes pulse{ from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} 50% {-webkit-transform: scale3d(1.05, 1.05, 1.05);transform: scale3d(1.05, 1.05, 1.05);} to {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}}@keyframes pulse{ from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} 50% {-webkit-transform: scale3d(1.05, 1.05, 1.05);transform: scale3d(1.05, 1.05, 1.05);} to {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}}';
            case 'rubber-band':
                return '@-webkit-keyframes rubberBand{ from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} 30% {-webkit-transform: scale3d(1.25, 0.75, 1);transform: scale3d(1.25, 0.75, 1);} 40% {-webkit-transform: scale3d(0.75, 1.25, 1);transform: scale3d(0.75, 1.25, 1);} 50% {-webkit-transform: scale3d(1.15, 0.85, 1);transform: scale3d(1.15, 0.85, 1);} 65% {-webkit-transform: scale3d(0.95, 1.05, 1);transform: scale3d(0.95, 1.05, 1);} 75% {-webkit-transform: scale3d(1.05, 0.95, 1);transform: scale3d(1.05, 0.95, 1);} to {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} }@keyframes rubberBand{ from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} 30% {-webkit-transform: scale3d(1.25, 0.75, 1);transform: scale3d(1.25, 0.75, 1);} 40% {-webkit-transform: scale3d(0.75, 1.25, 1);transform: scale3d(0.75, 1.25, 1);} 50% {-webkit-transform: scale3d(1.15, 0.85, 1);transform: scale3d(1.15, 0.85, 1);} 65% {-webkit-transform: scale3d(0.95, 1.05, 1);transform: scale3d(0.95, 1.05, 1);} 75% {-webkit-transform: scale3d(1.05, 0.95, 1);transform: scale3d(1.05, 0.95, 1);} to {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} }';
            case 'shake-x':
                return '@-webkit-keyframes shakeX{ from,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 10%,30%,50%,70%,90% {-webkit-transform: translate3d(-10px, 0, 0);transform: translate3d(-10px, 0, 0);} 20%,40%,60%,80% {-webkit-transform: translate3d(10px, 0, 0);transform: translate3d(10px, 0, 0);}}@keyframes shakeX{ from,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 10%,30%,50%,70%,90% {-webkit-transform: translate3d(-10px, 0, 0);transform: translate3d(-10px, 0, 0);} 20%,40%,60%,80% {-webkit-transform: translate3d(10px, 0, 0);transform: translate3d(10px, 0, 0);}}';
            case 'shake-y':
                return '@-webkit-keyframes shakeY{ from,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 10%,30%,50%,70%,90% {-webkit-transform: translate3d(0, -10px, 0);transform: translate3d(0, -10px, 0);} 20%,40%,60%,80% {-webkit-transform: translate3d(0, 10px, 0);transform: translate3d(0, 10px, 0);}}@keyframes shakeY{ from,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 10%,30%,50%,70%,90% {-webkit-transform: translate3d(0, -10px, 0);transform: translate3d(0, -10px, 0);} 20%,40%,60%,80% {-webkit-transform: translate3d(0, 10px, 0);transform: translate3d(0, 10px, 0);}}';
            case 'swing':
                return '@-webkit-keyframes swing{ 20% {-webkit-transform: rotate3d(0, 0, 1, 15deg);transform: rotate3d(0, 0, 1, 15deg);} 40% {-webkit-transform: rotate3d(0, 0, 1, -10deg);transform: rotate3d(0, 0, 1, -10deg);} 60% {-webkit-transform: rotate3d(0, 0, 1, 5deg);transform: rotate3d(0, 0, 1, 5deg);} 80% {-webkit-transform: rotate3d(0, 0, 1, -5deg);transform: rotate3d(0, 0, 1, -5deg);} to {-webkit-transform: rotate3d(0, 0, 1, 0deg);transform: rotate3d(0, 0, 1, 0deg);} }@keyframes swing{ 20% {-webkit-transform: rotate3d(0, 0, 1, 15deg);transform: rotate3d(0, 0, 1, 15deg);} 40% {-webkit-transform: rotate3d(0, 0, 1, -10deg);transform: rotate3d(0, 0, 1, -10deg);} 60% {-webkit-transform: rotate3d(0, 0, 1, 5deg);transform: rotate3d(0, 0, 1, 5deg);} 80% {-webkit-transform: rotate3d(0, 0, 1, -5deg);transform: rotate3d(0, 0, 1, -5deg);} to {-webkit-transform: rotate3d(0, 0, 1, 0deg);transform: rotate3d(0, 0, 1, 0deg);} }';
            case 'tada':
                return '@-webkit-keyframes tada{ from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} 10%,20% {-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);} 30%,50%,70%,90% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);} 40%,60%,80% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);} to {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} }@keyframes tada{ from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} 10%,20% {-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);} 30%,50%,70%,90% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);} 40%,60%,80% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);} to {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);} }';
            case 'wobble':
                return '@-webkit-keyframes wobble{ from {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 15% {-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);} 30% {-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);} 45% {-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);} 60% {-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);} 75% {-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }@keyframes wobble { from {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} 15% {-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);} 30% {-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);} 45% {-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);} 60% {-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);} 75% {-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);} to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);} }';
            default:
                return '';
        }
    }