首次提交信息

.hbuilderx/launch.json

@@ -0,0 +1,24 @@
+{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version": "0.0",
+    "configurations": [{
+     	"app-plus" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"default" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"h5" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"mp-weixin" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"type" : "uniCloud"
+     }
+    ]
+}

App.vue

@@ -0,0 +1,158 @@
+<script>
+	import Vue from 'vue'
+	// import TIM from 'tim-wx-sdk';
+	// import COS from 'cos-wx-sdk-v5';
+	export default {
+		globalData: {
+			wsUrl: 'wss://websocket.cdwjyyh.com',
+		},
+		onLaunch: function() {
+			// uni.$TUIKit = TIM.create({
+			// 	SDKAppID: 1400693126
+			// });
+			// uni.$TUIKit.registerPlugin({
+			// 	'cos-wx-sdk': COS
+			// });
+			// uni.$TUIKitTIM = TIM;
+			// uni.$TUIKitEvent = TIM.EVENT;
+			// uni.$TUIKitVersion = TIM.VERSION;
+			// uni.$TUIKitTypes = TIM.TYPES; // 监听系统级事件
+			// uni.$resetLoginData = this.resetLoginData();
+			// uni.$TUIKit.on(uni.$TUIKitEvent.SDK_READY, this.onSDKReady);
+			// uni.$TUIKit.on(uni.$TUIKitEvent.SDK_NOT_READY, this.onSdkNotReady);
+			// uni.$TUIKit.on(uni.$TUIKitEvent.KICKED_OUT, this.onKickedOut);
+			// uni.$TUIKit.on(uni.$TUIKitEvent.ERROR, this.onTIMError);
+			// uni.$TUIKit.on(uni.$TUIKitEvent.NET_STATE_CHANGE, this.onNetStateChange);
+			// uni.$TUIKit.on(uni.$TUIKitEvent.SDK_RELOAD, this.onSDKReload);
+			
+			console.log('IM')
+		},
+		onShow: function () {
+		    console.log('App Show')
+		    uni.getSystemInfo({
+				success: (result) => {
+					// 获取手机系统的状态栏高度（不同手机的状态栏高度不同）
+					// console.log('当前手机的状态栏高度',result.statusBarHeight)
+					let statusBarHeight = result.statusBarHeight + 'px'
+					
+					// 获取右侧胶囊的信息 单位px
+					//#ifndef H5 || APP-PLUS
+					const menuButtonInfo = uni.getMenuButtonBoundingClientRect()
+					
+					//bottom: 胶囊底部距离屏幕顶部的距离
+					//height: 胶囊高度
+					//left:   胶囊左侧距离屏幕左侧的距离
+					//right:  胶囊右侧距离屏幕左侧的距离
+					//top:    胶囊顶部距离屏幕顶部的距离
+					//width:  胶囊宽度
+					// console.log(menuButtonInfo.width, menuButtonInfo.height, menuButtonInfo.top)
+					// console.log('计算胶囊右侧距离屏幕右边距离', result.screenWidth - menuButtonInfo.right)
+					let menuWidth = menuButtonInfo.width + 'px'
+					let menuHeight = menuButtonInfo.height + 'px'
+					let menuBorderRadius = menuButtonInfo.height / 2 + 'px'
+					let menuRight = result.screenWidth - menuButtonInfo.right + 'px'
+					let menuTop = menuButtonInfo.top + 'px'
+					let contentTop = result.statusBarHeight + 44 + 'px'
+			
+					let menuInfo = {
+						statusBarHeight: statusBarHeight,//状态栏高度----用来给自定义导航条页面的顶部导航条设计padding-top使用：目的留出系统的状态栏区域
+						menuWidth: menuWidth,//右侧的胶囊宽度--用来给自定义导航条页面的左侧胶囊设置使用
+						menuHeight: menuHeight,//右侧的胶囊高度--用来给自定义导航条页面的左侧胶囊设置使用
+						menuBorderRadius: menuBorderRadius,//一半的圆角--用来给自定义导航条页面的左侧胶囊设置使用
+						menuRight: menuRight,//右侧的胶囊距离右侧屏幕距离--用来给自定义导航条页面的左侧胶囊设置使用
+						menuTop: menuTop,//右侧的胶囊顶部距离屏幕顶部的距离--用来给自定义导航条页面的左侧胶囊设置使用
+						contentTop: contentTop,//内容区距离页面最上方的高度--用来给自定义导航条页面的内容区定位距离使用
+					}
+					uni.setStorageSync('menuInfo', menuInfo)
+					//#endif
+				},
+				fail: (error) => {
+					console.log(error)
+				}
+		    })
+		},
+		onHide: function() {
+			console.log('App Hide')
+		},
+		 
+		methods: {
+			// TODO:
+			resetLoginData() {
+				// this.globalData.expiresIn = '';
+				// this.globalData.sessionID = '';
+				// this.globalData.userInfo = {
+				// 	userID: '',
+				// 	userSig: '',
+				// 	token: '',
+				// 	phone: ''
+				// };
+				// this.globalData.userProfile = null;
+				// logger.log(`| app |  resetLoginData | globalData: ${this.globalData}`);
+			},
+			onTIMError() {},
+			onSDKReady({name}) {
+				 console.log("im注册:"+name)
+				  const isSDKReady = name === uni.$TUIKitEvent.SDK_READY ? true : false
+				  console.log("im注册:"+isSDKReady)
+					uni.$emit('isSDKReady', {
+						isSDKReady: true
+					});
+			},
+			onNetStateChange() {},
+			onSDKReload() {},
+			onSdkNotReady() {},
+			onKickedOut() {
+				uni.showToast({
+					title: '您被踢下线',
+					icon: 'error'
+				});
+				
+			}
+		}
+	}
+</script>
+ 
+<style lang="less">
+/*每个页面公共css */
+	// @import 'animate.css';
+	@import './assets/iconfont/iconfont.css';
+	@import './assets/css/common.less';
+	page{
+		background-color: #f6f6f6;
+	}
+	::-webkit-scrollbar{
+	    width: 0 !important;
+	    height: 0 !important;
+	    
+	}
+</style>
+<style lang="scss">
+	/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
+	@import "@/uni_modules/uview-ui/index.scss";
+	/*每个页面公共css */
+	/* 解决小程序和app滚动条的问题 */
+	/* #ifdef MP-WEIXIN || APP-PLUS */
+		::v-deep ::-webkit-scrollbar {
+		    display: none !important;
+		    width: 0 !important;
+		    height: 0 !important;
+		    -webkit-appearance: none;
+		    background: transparent;
+		    color: transparent;
+		}
+	/* #endif */
+	
+	/* 解决H5 的问题 */
+	/* #ifdef H5 */
+	    uni-scroll-view .uni-scroll-view::-webkit-scrollbar {
+	    	/* 隐藏滚动条，但依旧具备可以滚动的功能 */
+			display: none;
+		    width: 0 !important;
+		    height: 0 !important;
+		    -webkit-appearance: none;
+		    background: transparent;
+		    color: transparent;
+	    }
+	/* #endif */
+</style>
+ 

api/activity.js

@@ -0,0 +1,24 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ 
+ 
+ 
+ export function getStoreActivity(data) {
+ 	 return request('/app/activity/getStoreActivity',data,'GET');
+ }
+ export function getStoreActivityDetails(data) {
+ 	 return request('/app/activity/getStoreActivityDetails',data,'GET');
+ }
+ export function share(activityId) {
+ 	 return request('/app/activity/share?activityId='+activityId,null,'POST');
+ }
+  
+ 
+ 
+
+ 
+ 
+ 
+ 
+ 
+ 

api/address.js

@@ -0,0 +1,37 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+ export function getCity() {
+ 	 return request('/app/address/getCity',null,'GET');
+ }
+ export function getCitys() {
+ 	 return request('/app/address/getCitys',null,'GET');
+ }
+ export function getAddressList() {
+ 	 return request('/app/address/getAddressList',null,'GET');
+ }
+
+ export function getAddressById(data) {
+ 	 return request('/app/address/getAddressById',data,'GET');
+ } 
+ 
+ export function addAddress(data) {
+ 	return request('/app/address/addAddress',data,'POST','application/json;charset=UTF-8');
+ }
+
+ export function editAddress(data) {
+ 	return request('/app/address/editAddress',data,'POST','application/json;charset=UTF-8');
+ }
+ export function delAddress(data) {
+ 	return request('/app/address/delAddress',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function parseAddress(data) {
+ 	return request('/app/address/parseAddress',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function delAllAddress(data) {
+ 	return request('/app/address/delAllAddress',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ 

api/adv.js

@@ -0,0 +1,6 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ export function getAdv(data) {
+ 	 return request('/app/adv/getAdv',data,'GET');
+ }
+ 

api/article.js

@@ -0,0 +1,26 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+ 
+ export function getArticleCate() {
+ 	 return request('/app/article/getArticleCate',null,'GET');
+ }
+ export function getArticleList(data) {
+ 	 return request('/app/article/getArticleList',data,'GET');
+ }
+
+ export function getArticleByArticleId(data) {
+ 	 return request('/app/article/getArticleByArticleId',data,'GET');
+ } 
+ 
+ export function updateView(articleId) {
+ 	 return request('/app/article/updateView?articleId='+articleId,null,'POST');
+ } 
+ 
+ export function getArticleViewList(data) {
+ 	 return request('/app/article/getArticleViewList',data,'GET');
+ } 
+ 
+ 
+ 
+  

api/common.js

@@ -0,0 +1,27 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+
+ export function uploadOSS(data) {
+ 	 return request('/app/common/uploadOSS',data,'POST');
+ }
+ export function getTlsSig(data) {
+ 	 return request('/app/common/getTlsSig',data,'GET');
+ }
+ 
+ export function getStoreConfig() {
+  	 return request('/app/common/getStoreConfig',null,'GET');
+ } 
+ 
+ export function getWeixinTemps() {
+ 	 return request('/app/common/getWeixinTemps',null,'GET');
+ }
+ export function getWeixinOrderTemps() {
+ 	 return request('/app/common/getWeixinOrderTemps',null,'GET');
+ }
+ export function getWeixinPrescribeTemps() {
+ 	 return request('/app/common/getWeixinPrescribeTemps',null,'GET');
+ }
+ 
+ 
+ 

api/companyOrder.js

@@ -0,0 +1,29 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ 
+ export function getSalesProducts(data) {
+ 	 return request('/app/companyOrder/getSalesProducts',data,'GET');
+ }
+ 
+ export function createSalesOrder(data) {
+ 	 return request('/app/companyOrder/createSalesOrder',data,'GET' );
+ }
+ export function updateSalseOrderMoney(data) {
+ 	 return request('/app/companyOrder/updateSalseOrderMoney',data,'GET' );
+ }
+ 
+ 
+ export function getSalesOrder(data) {
+ 	 return request('/app/companyOrder/getSalesOrder',data,'GET' );
+ }
+ export function addUserCart(data) {
+ 	 return request('/app/companyOrder/addUserCart',data,'GET' );
+ }
+ 
+ export function editOrderMoney(data) {
+ 	 return request('/app/companyOrder/editOrderMoney',data,'GET' );
+ }
+ 
+  
+ 
+ 

api/companyUser.js

@@ -0,0 +1,22 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ 
+ export function login(data) {
+ 	 return request('/app/companyUser/login',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function getUserInfo(data) {
+ 	 return request('/app/companyUser/getUserInfo',data,'GET','application/json;charset=UTF-8');
+ }
+ export function getQrImg(data) {
+ 	 return request('/app/companyUser/getQrImg',data,'GET','application/json;charset=UTF-8');
+ }
+ 
+ export function getCompanyUserCard(data) {
+ 	 return request('/app/companyUser/getCompanyUserCard',data,'GET','application/json;charset=UTF-8');
+ }
+ 
+ 
+  
+ 
+ 

api/coupon.js

@@ -0,0 +1,32 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+ export function getCouponIssueList(data) {
+ 	 return request('/app/coupon/getCouponIssueList',data,'GET');
+ }
+ export function getCompanyCouponIssueList(data) {
+ 	 return request('/app/coupon/getCompanyCouponIssueList',data,'GET');
+ }
+ export function getCouponIssueById(data) {
+ 	 return request('/app/coupon/getCouponIssueById',data,'GET');
+ }
+ 
+ 
+ 
+ export function receive(data) {
+ 	return request('/app/coupon/receive',data,'POST','application/json;charset=UTF-8');
+ }
+ export function companyReceive(data) {
+ 	return request('/app/coupon/companyReceive',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function getMyCouponList(data) {
+ 	 return request('/app/coupon/getMyCouponList',data,'GET');
+ }
+ export function getMyEnableCouponList(data) {
+ 	 return request('/app/coupon/getMyEnableCouponList',data,'GET');
+ }
+ 
+ 
+
+ 

api/course.js

@@ -0,0 +1,110 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+export function loginByMp(data) {
+ 	 return request('/app/wx/courseLogin',data,'POST','application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+ }
+
+// 获取真实链接
+export function getRealLink(data) {
+	return request('/app/course/getRealLink', data, 'GET','','https://h5api.his.cdwjyyh.com');
+}
+
+// h5课程简介
+export function getH5CourseByVideoId(data) {
+	return request('/app/course/getH5CourseByVideoId', data, 'GET','','https://h5api.his.cdwjyyh.com');
+}
+
+// h5课程详情加问答
+export function getH5CourseVideoDetails(data) {
+	return request('/app/course/getH5CourseVideoDetails', data, 'GET','','https://h5api.his.cdwjyyh.com');
+}
+
+// 答题发红包
+export function courseAnswer(data) {
+	return request('/app/course/courseAnswer', data, 'POST', 'application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+}
+
+// // 记录看课时间（旧）
+// export function getFinishCourseVideo(data) {
+// 	return request('/app/course/getFinishCourseVideo', data, 'POST', 'application/json;charset=UTF-8');
+// }
+
+// 记录看课时间（新）
+export function getFinishCourseVideo(data) {
+	return request('/app/course/updateWatchDuration', data, 'POST', 'application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+}
+
+// 关注客服
+export function getIsAddKf(data) {
+	return request('/app/course/isAddKf', data, 'POST', 'application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+}
+
+// 流量(缓冲百分比)
+export function internetTraffic(data) {
+	return request('/app/course/getInternetTraffic', data, 'POST', 'application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+}
+
+// 每十分钟获得积分
+export function getIntegralByH5Video(data) {
+	return request('/app/course/getIntegralByH5Video', data, 'POST', 'application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+}
+
+// 发送奖励
+export function sendReward(data) {
+	return request('/app/course/sendReward', data, 'POST', 'application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+}
+
+// 播放错误上报
+export function getErrMsg(data) {
+	return request('/app/course/getErrMsg', data, 'POST', 'application/x-www-form-urlencoded','https://h5api.his.cdwjyyh.com');
+}
+
+
+// 获取getWxConfig
+export function getWxConfig(data) {
+	return request('/app/wx/mp/getWxConfig', data, 'GET','','https://h5api.his.cdwjyyh.com');
+}
+
+ //获取弹幕列表
+ export function getDanmuList(videoId) {
+ 	 return request('/barrage/barrage/list/'+videoId,null,'GET','','https://h5api.his.cdwjyyh.com');
+ }
+ 
+ // 保存评论数据
+ export function saveMsg(data, type) {
+ 	return request('/app/course/saveMsg', data, 'POST', 'application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+ }
+ 
+ // 撤销评论
+ export function revokeMsg(data, type) {
+ 	return request('/app/course/revokeMsg', data, 'PUT', 'application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+ }
+ 
+ // 获取历史评论数据
+ export function getComments(data, type) {
+ 	return request('/app/course/getComments', data, 'GET','','https://h5api.his.cdwjyyh.com');
+ }
+ 
+ // 错误日志未知异常，请联系管理员
+ export function errorLogUpload(data, type) {
+ 	return request('/app/common/errorLogUpload', data, 'POST','','https://h5api.his.cdwjyyh.com');
+ }
+ 
+ export function getTypeTree(data, type) {
+ 	return request('/app/user/complaint/getTypeTree', null, 'GET','','https://h5api.his.cdwjyyh.com');
+ }
+ export function complaintRecord(data, type) {
+ 	return request('/app/user/complaint/record', data, 'POST','application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+ }
+ 
+ export function uploadOSS(data, type) {
+ 	return request('/app/common/uploadOSS', data, 'POST','application/json;charset=UTF-8','https://h5api.his.cdwjyyh.com');
+ }
+// 公开课
+ export function getAppletCourse(data, type) {
+ 	return request('/app/course/getAppletCourse', null, 'GET','','https://h5api.his.cdwjyyh.com');
+ }
+ export function getAppletCourseVideo(data, type) {
+ 	return request('/app/course/getAppletCourseVideo', data, 'GET','','https://h5api.his.cdwjyyh.com');
+ }

api/doc.js

@@ -0,0 +1,45 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+ 
+ export function getMyDocList(data) {
+ 	 return request('/app/doc/getMyDocList',data,'GET');
+ }
+ 
+ export function getDocDetails(data) {
+ 	 return request('/app/doc/getDocDetails',data,'GET');
+ }
+ 
+ export function addDoc(data) {
+ 	return request('/app/doc/addDoc',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function editDoc(data) {
+ 	return request('/app/doc/editDoc',data,'POST','application/json;charset=UTF-8');
+ }
+ export function delDoc(data) {
+ 	return request('/app/doc/delDoc',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function getMyDocRecordList(data) {
+ 	 return request('/app/doc/getMyDocRecordList',data,'GET');
+ }
+ 
+ export function getDocRecordReplyList(data) {
+ 	 return request('/app/doc/getDocRecordReplyList',data,'GET');
+ }
+ 
+ 
+ export function addDocRecord(data) {
+ 	return request('/app/doc/addDocRecord',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function getMyDocOrderList() {
+ 	 return request('/app/doc/getMyDocOrderList',null,'GET');
+ }
+ 
+ export function addDocOrder(data) {
+ 	return request('/app/doc/addDocOrder',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ 

api/doctorOrder.js

@@ -0,0 +1,47 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+ 
+ 
+ 
+ export function getDepartmentList(data) {
+ 	 return request('/app/doctorOrder/getDepartmentList',data,'GET');
+ } 
+ 
+ export function getDoctorList(data) {
+ 	 return request('/app/doctorOrder/getDoctorList',data,'GET');
+ } 
+ 
+ export function getDoctorCase(data) {
+ 	 return request('/app/doctorOrder/getDoctorCase',data,'GET');
+ } 
+ 
+ 
+ export function getMyDoctorOrderList(data) {
+ 	 return request('/app/doctorOrder/getMyDoctorOrderList',data,'GET');
+ } 
+ 
+ export function getDoctorDetail(data) {
+ 	 return request('/app/doctorOrder/getDoctorDetail',data,'GET');
+ } 
+ 
+ export function getDoctorOrderDetail(data) {
+ 	 return request('/app/doctorOrder/getDoctorOrderDetail',data,'GET');
+ } 
+ export function create(data) {
+ 	 return request('/app/doctorOrder/create',data,'POST','application/json;charset=UTF-8');
+ }
+ export function pay(data) {
+ 	 return request('/app/doctorOrder/pay',data,'POST','application/json;charset=UTF-8');
+ }
+ export function cancelOrder(data) {
+ 	 return request('/app/doctorOrder/cancelOrder',data,'POST','application/json;charset=UTF-8');
+ }
+ export function pingOrder(data) {
+ 	 return request('/app/doctorOrder/pingOrder',data,'POST','application/json;charset=UTF-8');
+ }
+ export function getImOrderDetail(data) {
+ 	 return request('/app/doctorOrder/getImOrderDetail',data,'GET');
+ } 
+ 
+ 

api/index.js

@@ -0,0 +1,39 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+export function getDicts(data) {
+ 	 return request('/app/common/getDicts',data,'GET');
+} 
+
+
+export function getCanvas() {
+ 	 return request('/app/index/getCanvas',null,'GET');
+} 
+
+export function getMenu() {
+ 	 return request('/app/index/getMenu',null,'GET');
+} 
+
+export function getIndexData(data) {
+ 	 return request('/app/index/getIndexData',data,'GET');
+} 
+export function getTuiArticle(data) {
+ 	 return request('/app/index/getTuiArticle',data,'GET');
+} 
+export function getTuiDoctor(data) {
+ 	 return request('/app/index/getTuiDoctor',data,'GET');
+} 
+
+
+
+export function getTuiDoctorOrder(data) {
+ 	 return request('/app/index/getTuiDoctorOrder',data,'GET');
+} 
+
+export function getCartCount() {
+ 	 return request('/app/index/getCartCount',null,'GET');
+} 
+
+
+ 
+ 

api/patient.js

@@ -0,0 +1,22 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+ 
+ export function getPatientList() {
+ 	 return request('/app/patient/getPatientList',null,'GET');
+ }
+
+ export function getPatientById(data) {
+ 	 return request('/app/patient/getPatientById',data,'GET');
+ } 
+ 
+ export function addPatient(data) {
+ 	return request('/app/patient/addPatient',data,'POST','application/json;charset=UTF-8');
+ }
+
+ export function editPatient(data) {
+ 	return request('/app/patient/editPatient',data,'POST','application/json;charset=UTF-8');
+ }
+ export function delPatient(data) {
+ 	return request('/app/patient/delPatient',data,'POST','application/json;charset=UTF-8');
+ }

api/payment.js

@@ -0,0 +1,11 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+  
+ export function payment(data) {
+ 	 return request('/app/payment/payment',data,'POST','application/json;charset=UTF-8');
+ }
+  
+ 
+ 
+ 

api/prescribe.js

@@ -0,0 +1,21 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ 
+ export function doPrescribe(data) {
+ 	 return request('/app/prescribe/doPrescribe',data,'POST','application/json;charset=UTF-8');
+ }
+ export function getMyPrescribeList(data) {
+ 	 return request('/app/prescribe/getMyPrescribeList',data,'GET');
+ }
+ 
+ 
+ 
+ 
+ 
+
+ 
+ 
+ 
+ 
+ 
+ 

api/product.js

@@ -0,0 +1,65 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ 
+
+ export function getProductCate(data) {
+ 	 return request('/app/product/getProductCate',data,'GET');
+ }
+ 
+ export function getProductCateByPid(data) {
+ 	 return request('/app/product/getProductCateByPid',data,'GET');
+ }
+ 
+ export function getProducts(data) {
+ 	 return request('/app/product/getProducts',data,'GET');
+ }
+ export function getProductDetails(data) {
+ 	 return request('/app/product/getProductDetails',data,'GET');
+ }
+ export function getCarts(data) {
+ 	 return request('/app/product/getCarts',data,'GET');
+ }
+ export function addCart(data) {
+ 	 return request('/app/product/addCart',data,'POST','application/json;charset=UTF-8');
+ }
+ export function delCart(data) {
+ 	 return request('/app/product/delCart',data,'POST','application/json;charset=UTF-8');
+ }
+ export function cartNum(data) {
+ 	 return request('/app/product/cartNum',data,'POST','application/json;charset=UTF-8');
+ }
+ export function getCartCount(data) {
+ 	 return request('/app/product/getCartCount',data,'GET');
+ }
+ export function getGoodsProduct() {
+ 	 return request('/app/product/getGoodsProduct',null,'GET');
+ }
+ export function getGoodsProducts(data) {
+ 	 return request('/app/product/getGoodsProducts',data,'GET');
+ }
+ export function getTuiProducts(data) {
+ 	 return request('/app/product/getTuiProducts',data,'GET');
+ }
+ export function getStoreProductAttrValueList(data) {
+ 	 return request('/app/product/getStoreProductAttrValueList',data,'GET');
+ }
+ 
+ 
+ 
+ 
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+
+ 
+ 
+ 
+ 
+ 
+ 

api/storeAfterSales.js

@@ -0,0 +1,29 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ 
+ export function getMyStoreOrderItemByOrderId(data) {
+ 	 return request('/app/storeAfterSales/getMyStoreOrderItemByOrderId',data,'GET');
+ } 
+ export function applyAfterSales(data) {
+ 	 return request('/app/storeAfterSales/applyAfterSales',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function getAfterSalesList(data) {
+ 	 return request('/app/storeAfterSales/getAfterSalesList',data,'GET');
+ } 
+ 
+ export function getAfterSalesDetails(data) {
+ 	 return request('/app/storeAfterSales/getAfterSalesDetails',data,'GET');
+ } 
+ export function revoke(data) {
+ 	 return request('/app/storeAfterSales/revoke',data,'POST','application/json;charset=UTF-8');
+ }
+ export function addDelivery(data) {
+ 	 return request('/app/storeAfterSales/addDelivery',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ 
+ 
+ 
+ 
+ 

api/storeOrder.js

@@ -0,0 +1,81 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+ 
+ export function getMyStoreOrderList(data) {
+ 	 return request('/app/storeOrder/getMyStoreOrderList',data,'GET');
+ } 
+ export function getCompanyStoreOrderList(data) {
+ 	 return request('/app/storeOrder/getCompanyStoreOrderList',data,'GET');
+ } 
+ export function getMyStoreOrderById(data) {
+ 	 return request('/app/storeOrder/getMyStoreOrderById',data,'GET');
+ } 
+ 
+ 
+ export function getStoreOrderById(data) {
+ 	 return request('/app/storeOrder/getStoreOrderById',data,'GET');
+ } 
+ 
+ 
+ export function confirm(data) {
+ 	 return request('/app/storeOrder/confirm',data,'POST','application/json;charset=UTF-8');
+ }
+ export function computed(data) {
+ 	 return request('/app/storeOrder/computed',data,'POST','application/json;charset=UTF-8');
+ }
+ export function create(data) {
+ 	 return request('/app/storeOrder/create',data,'POST','application/json;charset=UTF-8');
+ }
+ export function pay(data) {
+ 	 return request('/app/storeOrder/pay',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function editPayType(data) {
+ 	 return request('/app/storeOrder/editPayType',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function payRemain(data) {
+ 	 return request('/app/storeOrder/payRemain',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function otherPayment(data) {
+ 	 return request('/app/storeOrder/otherPayment',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function otherPaymentRemain(data) {
+ 	 return request('/app/storeOrder/otherPaymentRemain',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ 
+ export function cancelOrder(data) {
+ 	 return request('/app/storeOrder/cancelOrder',data,'POST','application/json;charset=UTF-8');
+ }
+ export function finishOrder(data) {
+ 	 return request('/app/storeOrder/finishOrder',data,'POST','application/json;charset=UTF-8');
+ }
+ export function getExpress(data) {
+ 	 return request('/app/storeOrder/getExpress',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ 
+ export function confirmPackageOrder(data) {
+ 	 return request('/app/storeOrder/confirmPackageOrder',data,'POST','application/json;charset=UTF-8');
+ }
+ export function computedPackageOrder(data) {
+ 	 return request('/app/storeOrder/computedPackageOrder',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function createPackageOrder(data) {
+ 	 return request('/app/storeOrder/createPackageOrder',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function getOrderCount() {
+ 	 return request('/app/storeOrder/getOrderCount',null,'GET');
+ } 
+ //用户取消支付
+ export function userCancelPay(data) {
+ 	 return request('/app/storeOrder/cancelPay',data,'POST','application/json;charset=UTF-8');
+ } 
+ 
+ 

api/storeProductPackage.js

@@ -0,0 +1,15 @@
+import Request from '../common/request.js';
+let request = new Request().http
+
+ export function getStoreProductPackage(data) {
+ 	 return request('/app/storeProductPackage/getStoreProductPackage',data,'GET');
+ } 
+ 
+ export function getStoreProductPackageDetails(data) {
+ 	 return request('/app/storeProductPackage/getStoreProductPackageDetails',data,'GET');
+ } 
+ 
+  
+ 
+ 
+ 

api/user.js

@@ -0,0 +1,83 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ 
+ export function loginByMiniApp(data) {
+ 	 return request('/app/wx/loginByMiniApp',data,'POST','application/json;charset=UTF-8');
+ }
+ export function loginByMp(data) {
+ 	 return request('/app/wx/loginByMp',data,'POST','application/json;charset=UTF-8');
+ }
+ export function getUserInfo() {
+ 	 return request('/app/user/getUserInfo',null,'GET');
+ }
+ 
+ export function editUser(data) {
+ 	return request('/app/user/editUser',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function getWeixinInfo(data) {
+ 	return request('/app/wx/getWeixinInfo',data,'POST','application/json;charset=UTF-8');
+ }
+ export function checkLogin() {
+ 	 return request('/app/user/checkLogin',null,'GET');
+ }
+ export function getTuiImg() {
+ 	 return request('/app/user/getTuiImg',null,'GET');
+ }
+ export function getMyTuiOrderList(data) {
+ 	 return request('/app/user/getMyTuiOrderList',data,'GET');
+ }
+ export function getTuiMoney() {
+ 	 return request('/app/user/getTuiMoney',null,'GET');
+ }
+ export function getMyTuiList(data) {
+ 	 return request('/app/user/getMyTuiList',data,'GET');
+ }
+ export function getTuiMoneyLogs(data) {
+ 	 return request('/app/user/getTuiMoneyLogs',data,'GET');
+ }
+ 
+ export function getProductFoots(data) {
+ 	 return request('/app/user/getProductFoots',data,'GET');
+ }
+ export function delProductFoots(data) {
+ 	 return request('/app/user/delProductFoots',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function doExtract(data) {
+ 	 return request('/app/user/doExtract',data,'POST','application/json;charset=UTF-8');
+ }
+ export function getExtractList(data) {
+ 	 return request('/app/user/getExtractList',data,'GET');
+ }
+ export function applyPromoter(data) {
+ 	 return request('/app/user/applyPromoter',data,'POST','application/json;charset=UTF-8');
+ }
+ export function bindPromoter(data) {
+ 	 return request('/app/user/bindPromoter',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ export function getUserShareList(data) {
+ 	 return request('/app/user/getUserShareList',data,'GET');
+ }
+ //隐私保护
+ export function getyingsi(data) {
+ 	 return request('/h5/privacyPolicyNew',data,'GET');
+ }
+ //用户协议
+ export function getxieyi(data) {
+ 	 return request('/h5/userAgreementNew',data,'GET');
+ }
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 

api/userSign.js

@@ -0,0 +1,16 @@
+import Request from '../common/request.js';
+let request = new Request().http
+ 
+ 
+ export function getUserSign() {
+ 	 return request('/app/sign/getUserSign',null,'GET');
+ }
+ 
+ export function getIntegral(data) {
+ 	 return request('/app/sign/getIntegral',data,'GET');
+ }
+ export function doSign(data) {
+ 	 return request('/app/sign/sign',data,'POST','application/json;charset=UTF-8');
+ }
+ 
+ 

assets/css/common.less

@@ -0,0 +1,262 @@
+ 
+page {
+  background: #f5f5f5;
+  height: 100%;
+}
+.container{
+  height: 100%;
+}
+rich-text {
+  width: 100%;
+  display: block;
+  img,
+  image {
+    display: block;
+    width: 100%;
+  }
+}
+
+/*单行文本溢出省略号*/
+.one-t {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  transition: all linear 0.2s;
+}
+
+/*多行文本溢出省略号*/
+.more-t {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  transition: all linear 0.2s;
+}
+
+/* ==================
+          flex布局(colorui里面也有相关基础样式)
+ ==================== */
+/* x水平排列*/
+.x-f {
+  display: flex;
+  align-items: center;
+}
+
+/*x两端且水平居中*/
+.x-bc {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+/*x平分且水平居中*/
+.x-ac {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+}
+
+/*x水平靠上对齐*/
+.x-start {
+  display: flex;
+  align-items: flex-start;
+}
+
+/*x水平靠下对齐*/
+.x-end {
+  display: flex;
+  align-items: flex-end;
+}
+
+/*上下左右居中*/
+.x-c {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+/*y竖直靠左*/
+.y-start {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+/*y竖直靠右*/
+.y-end {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+}
+
+/*y竖直居中*/
+.y-f {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+// y竖直两端
+.y-b {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+/*y竖直两端居中*/
+.y-bc {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+}
+/* layout */
+.acea-row {
+  display: flex;
+  flex-wrap: wrap;
+  /* 辅助类 */
+}
+.acea-row.row-middle {
+  align-items: center;
+}
+.acea-row.row-top {
+  align-items: flex-start;
+}
+.acea-row.row-bottom {
+  align-items: flex-end;
+}
+.acea-row.row-center {
+  justify-content: center;
+}
+.acea-row.row-right {
+  justify-content: flex-end;
+}
+.acea-row.row-left {
+  justify-content: flex-start;
+}
+.acea-row.row-between {
+  justify-content: space-between;
+}
+.acea-row.row-around {
+  justify-content: space-around;
+}
+.acea-row.row-column-around {
+  flex-direction: column;
+  justify-content: space-around;
+}
+.acea-row.row-column {
+  flex-direction: column;
+}
+.acea-row.row-column-between {
+  flex-direction: column;
+  justify-content: space-between;
+}
+/* 上下左右垂直居中 */
+.acea-row.row-center-wrapper {
+  align-items: center;
+  justify-content: center;
+}
+/* 上下两边居中对齐 */
+.acea-row.row-between-wrapper {
+  align-items: center;
+  justify-content: space-between;
+}
+
+/*每个页面公共css */
+.ellipsis{
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+.ellipsis2{
+	overflow:hidden; 
+	text-overflow:ellipsis;
+	display:-webkit-box; 
+	-webkit-box-orient:vertical;
+	-webkit-line-clamp:2; 
+}
+radio .wx-radio-input{
+  width: 36rpx;
+  height: 36rpx;
+  border: 1px solid #CCCCCC;
+}
+/* 选中后的 背景样式  */
+radio .wx-radio-input.wx-radio-input-checked{
+	background: linear-gradient(135deg, #2BC7B9 0%, #60CDC3 100%);
+	border: 1px solid #2BC7B9;
+}
+/* 选中后的 对勾样式 （白色对勾） */
+radio .wx-radio-input.wx-radio-input-checked::before{
+	color: #ffffff;
+}
+checkbox .wx-checkbox-input{
+	width: 36rpx;
+	height: 36rpx;
+	border: 1px solid #CCCCCC;
+	border-radius: 50%;
+}
+checkbox .wx-checkbox-input.wx-checkbox-input-checked {
+	background: linear-gradient(135deg, #2BC7B9 0%, #60CDC3 100%);
+	border: 1px solid #2BC7B9;
+	border-radius: 50%;
+}
+checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
+	color: #ffffff;
+}
+::-webkit-scrollbar {
+   width: 0;
+   height: 0;
+   color: transparent;
+ }
+ /* 暂无数据 */
+.no-data-box{
+	padding: 100upx 50upx;
+	text-align: center;
+	image{
+		width: 372rpx;
+		height: 240rpx;
+	}
+	.empty-title{
+		margin-top: 20rpx;
+		font-size: 32rpx;
+		color: #bbbbbb;
+		 
+	}
+}
+.Loads {
+  height: 0.8*100rpx;
+  font-size: 0.25*100rpx;
+  color: #000;
+}
+.Loads .iconfont {
+  font-size: 0.3*100rpx;
+  margin-right: 0.1*100rpx;
+  height: 0.32*100rpx;
+  line-height: 0.32*100rpx;
+}
+/*加载动画*/
+@keyframes load {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+.loadingpic {
+  animation: load 3s linear 1s infinite;
+}
+.loading {
+  animation: load linear 1s infinite;
+}
+
+ .back-box{
+	position: relative;
+	.title{
+		position: absolute;
+		left: 50%;
+		top: 50%;
+		transform: translate(-50%,-50%);
+	}
+}

common/request.js

@@ -0,0 +1,91 @@
+// uni-app请求封装
+export default class Request {
+	http(router, data = {}, method,contentType,url) {
+		let that = this;
+		// let path = 'http://localhost:7014';
+		let path = 'https://api.fhzx.runtzh.com'; 
+		uni.setStorageSync('requestPath',path)
+		let token="";
+		let type = 0
+		if(url!=null){
+			path= url;
+			type = 1
+			uni.setStorageSync('requestImagesPath',url)
+			token= uni.getStorageSync('AppTokenmini_RTCourse')
+		}
+		else{
+			type = 0
+			uni.setStorageSync('requestPath',path)
+			token= uni.getStorageSync('AppToken');
+		}
+		// uni.showLoading({
+		// 	title: '加载中'
+		// });
+		return new Promise((resolve, reject) => {
+			// let token = uni.getStorageSync('AppToken');
+			var httpContentType='application/x-www-form-urlencoded';
+			if(contentType!=undefined){
+				//application/json;charset=UTF-8
+				httpContentType=contentType;
+			}
+			var routers=router;
+			// 请求
+			uni.request({
+				header: {
+					// 'Content-Type': 'application/x-www-form-urlencoded',
+					'Content-Type': httpContentType,
+					'AppToken': token
+				},
+				url: `${path}${router}`,
+				data: data,
+				method: method,
+				success: (res) => {
+					//收到开发者服务器成功返回的回调函数
+					if(res.data.code==401){//没有权限直接退出到登录界面
+						let pages = getCurrentPages();
+						pages.forEach(function(element) {
+						  if(element!=undefined&&element.route=="pages/auth/login"){
+						  	resolve(res.data)
+						  	return;
+						  }
+						});
+						// let url = pages[ pages.length - 1]; //当前页页面实例
+						// //如果登录界面已打开,自动关闭
+						// if(url!=undefined&&url.route=="pages/auth/login"){
+						//  	resolve(res.data)
+						// 	return;
+						// }
+						uni.navigateTo({
+							url:'/pages/auth/login',
+							success: () => {
+								uni.hideLoading();
+								
+							},
+							fail: () => {
+								uni.hideLoading();
+							}
+						})
+						return;
+					}
+					if (res.data.token&&type==0) {
+						uni.setStorageSync('AppToken',res.data.token)
+					}
+					resolve(res.data)
+				},
+				fail:(res) =>{
+					//接口调用失败的回调函数
+				},
+				complete:(res) =>{
+					//接口调用结束的回调函数（调用成功、失败都会执行）
+					if (res.data.code == 401) {
+						return false
+					}
+					uni.hideLoading();
+				}
+				
+			})
+		})
+		 
+	}
+	
+}

components/Loading.vue

@@ -0,0 +1,21 @@
+<template>
+  <view class="Loads acea-row row-center-wrapper" v-if="loading || !loaded" style="margin-top: 20rpx;">
+    <template v-if="loading">
+      <view class="iconfont icon-jiazai loading acea-row row-center-wrapper"></view>
+      正在加载中
+    </template>
+    <template v-if="!loading">
+      上拉加载更多
+    </template>
+  </view>
+</template>
+
+<script>
+  export default {
+    name: "Loading",
+    props: {
+      loaded: Boolean,
+      loading: Boolean
+    }
+  };
+</script>

components/Menu.vue

@@ -0,0 +1,147 @@
+<template>
+	<view class="menu-list-box" v-if="carousel" :style="list.length <= menu ? `height:160rpx` : `height:320rpx`">
+		<swiper
+			class="menu-swiper-box"
+			:style="list.length <= menu ? `height:160rpx` : `height:320rpx`"
+			@change="onSwiper"
+			circular
+			:autoplay="false"
+			:interval="3000"
+			:duration="1000"
+		>
+			<swiper-item class="menu-swiper-item" v-for="(itemList, index) in carousel" :key="index" :style="list.length <= menu ? `height:200rpx` : `height:340rpx`">
+				<view class="menu-tab-box">
+					<view class="tab-list"  v-for="item in itemList" :key="item.menuName" @tap="routerTo(item)">
+						<image class="tab-img Shop-selector-circular" :style="{ width: imgW + 'rpx', height: imgW + 'rpx' }" :src="item.icon"></image>
+						<text class="Shop-selector-rect">{{ item.menuName }}</text>
+					</view>
+				</view>
+			</swiper-item>
+		</swiper>
+		<view class="menu-dots" v-if="carousel.length > 1">
+			<text :class="menuCurrent === index ? 'dot-active' : 'dot'" v-for="(dot, index) in carousel.length" :key="index"></text>
+		</view>
+	</view>
+</template>
+
+<script>
+export default {
+	components: {},
+	data() {
+		return {
+			menuCurrent: 0 //轮播下标
+		};
+	},
+	props: {
+		list: {
+			type: Array,
+			default: []
+		},
+		menu: {
+			default: 4
+		},
+		imgW: {
+			type: Number,
+			default: 88
+		}
+	},
+	computed: {
+		carousel() {
+			if (this.list) {
+				let data = this.sortData(this.list, this.menu * 2);
+				return data;
+			}
+		}
+	},
+	created() {},
+	methods: {
+		// 数据分层
+		sortData(oArr, length) {
+			let arr = [];
+			let minArr = [];
+			oArr.forEach(c => {
+				if (minArr.length === length) {
+					minArr = [];
+				}
+				if (minArr.length === 0) {
+					arr.push(minArr);
+				}
+				minArr.push(c);
+			});
+		 
+			return arr;
+		},
+		// 轮播
+		onSwiper(e) {
+			this.menuCurrent = e.detail.current;
+		},
+		routerTo(item) {
+			 this.$emit('menuClick',item);
+		}
+	}
+};
+</script>
+
+<style lang="scss">
+.menu-list-box {
+	padding: 0rpx;
+	background: #fff;
+	box-sizing: border-box;
+	
+}
+.menu-list-box,
+.menu-swiper-box {
+	position: relative;
+	background: #fff;
+	.menu-swiper-item {
+		background: #fff;
+		height: 100%;
+		width: 100%;
+	}
+	.menu-tab-box {
+		display: flex;
+		flex-wrap: wrap;
+		.tab-list {
+			width: 25%;
+			display: -webkit-box;
+			display: -webkit-flex;
+			display: flex;
+			-webkit-box-orient: vertical;
+			-webkit-box-direction: normal;
+			-webkit-flex-direction: column;
+			flex-direction: column;
+			-webkit-box-align: center;
+			-webkit-align-items: center;
+			align-items: center;
+			font-size: 22rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: rgba(51, 51, 51, 1);
+			padding-bottom: 30rpx;
+			.tab-img {
+				border-radius: 25rpx;
+				margin-bottom: 10rpx;
+			}
+		}
+	}
+	.menu-dots {
+		display: flex;
+		position: absolute;
+		left: 50%;
+		transform: translateX(-50%);
+		.dot {
+			width: 40rpx;
+			height: 3rpx;
+			background: #eeeeee;
+			margin-right: 10rpx;
+		}
+
+		.dot-active {
+			width: 40rpx;
+			height: 3rpx;
+			background: #2BC7B9;
+			margin-right: 10rpx;
+		}
+	}
+}
+</style>

components/chengpeng-audio/free-audio.vue

@@ -0,0 +1,166 @@
+<template>
+	<!-- 音频播放器组件 -->
+	<view v-if='url' class='flex justify-between align-center audio' >
+		<view class='mr-3'  @click='start(audioId)'>
+			<image :src='startPic' class='icon' v-show='!status'></image>
+			<image :src='endPic' class='icon' v-show='status'></image>
+		</view>
+		<view class='flex-1'>
+			<slider 
+				@change='changeAudio' 
+				:activeColor='activeColor' 
+				:min='0' 
+				:max='duration.toFixed(0)' 
+				:value='currentTime.toFixed(0)' 
+				:step='0.1'
+				backgroundColor="#E9F0F0"
+				:block-size='14'
+				block-color='#2BC7B9'>
+			</slider>
+		</view>
+		<view class='ml-3'>{{getTime(Math.round(currentTime))}}</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				context: null,
+				currentTime: 0,
+				duration: 100,
+				status: false
+			}
+		},
+		props: {
+			url: String,
+			activeColor: {
+				type: String,
+				default: '#0E7EFC'
+			},
+			startPic: String,
+			endPic: String,
+			audioId: [String,Number]
+		},
+		created() {
+			this.context = uni.createInnerAudioContext();
+			this.context.src = this.url;
+			this.onTimeUpdate();
+			this.onCanplay();
+			this.onEnded();
+			uni.$on('stop',(id)=> {
+				if(id && id != this.audioId) {
+					this.context.stop();
+					this.status = false;
+				} else if(!id){
+					this.context.stop();
+					this.status = false;
+				}
+			})
+		},
+		methods: {
+			start(id) { //点击播放
+				let audioId = id;
+				if(this.status) {
+					this.context.pause();
+					this.status = !this.status;
+				}else {
+					uni.$emit('stop',id)
+					this.context.play()
+					this.status = !this.status;
+				}
+			},
+			onCanplay() { //进入可播放状态
+				this.context.onCanplay(() => {
+					this.context.duration;
+					setTimeout(()=>{
+						this.duration = this.context.duration;
+					},1000)
+				})
+			},
+			onTimeUpdate() { //音频播放进度
+				 this.context.onTimeUpdate(() => {
+					 if (!Number.isFinite( this.context.duration)) {
+						this.context.currentTime = Number.MAX_SAFE_INTEGER;
+						this.context.currentTime = 0;
+					 } else {
+						 this.duration = this.context.duration;
+						 this.currentTime = this.context.currentTime;
+					 }
+				 })
+			},
+			onEnded() { //播放结束
+				this.context.onEnded(()=> {
+					this.status = false;
+					this.currentTime = 0;
+				})
+			},
+			changeAudio(e) {
+				let paused = this.context.paused;
+				this.context.pause();
+				this.context.seek(e.detail.value)
+				if(!paused) {
+					this.context.play();
+				} 
+			},
+			getTime(time) {
+				let m = parseInt(time / 60);
+				let s = time % 60;
+				return this.towNum(m) + ':' + this.towNum(s);
+			},
+			towNum(num) {
+				if(num >= 10) {
+					return num;
+				}else {
+					return '0' + num;
+				}
+			}
+		}
+	}
+</script>
+
+<style>
+	.audio {
+		background: #F5F7F7;
+		padding: 30upx 20upx;
+	}
+	
+	.icon {
+		width: 54upx;
+		height: 54upx;
+	}
+	slider{
+		margin: 0;
+	}
+	.flex {
+		display: flex;
+		flex-direction: row;
+	}
+	
+	.justify-between {
+		justify-content: between;
+	}
+	
+	.align-center {
+		align-items: center;
+	}
+	
+	.flex-1 {
+		flex: 1;
+	}
+	
+	.ml-3 {
+		margin-left: 20upx;
+		font-size: 24upx;
+		font-family: PingFang SC;
+		font-weight: 500;
+		color: #666666;
+	}
+	
+	.mr-3 {
+		margin-right: 30upx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+</style>

components/chengpeng-audio/redme.md

@@ -0,0 +1,42 @@
+## 参数
+
+| url      | activeColor | startPic       | endPic         | 组件id                                                |
+| -------- | ----------- | -------------- | -------------- | ----------------------------------------------------- |
+| 音频链接 | 进度条颜色  | 开始播放的图片 | 暂停播放的图片 | audioId(必填，且id不可为数字0，建议格式 ‘audio’+数字) |
+
+## 使用方法
+
+```javascript
+//html
+<template>
+  <free-audio startPic='/static/images/icon/play.png' endPic='/static/images/icon/stop.png' :audioId='audio1' :url='path'></free-audio>
+</template>
+
+//js
+
+import freeAudio from '@/components/free-audio.vue'
+export default {
+    components: {freeAudio},
+    data() {
+        return{
+            path: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3'
+        }
+    },
+    methods: {
+
+    },
+} 
+
+//暂停所有音频（一般用于页面切换时停止正在播放的音频）
+onUnload() { //普通页面在 onUnload 生命周期中执行
+  uni.$emit('stop')
+},
+onHide() { //tabBar页面在onHide生命周期中执行
+  uni.$emit('stop')
+}
+
+
+
+
+```
+

components/evan-switch/evan-switch.vue

@@ -0,0 +1,143 @@
+<template>
+	<!-- <view @click="toggle" class="evan-switch" :class="{'evan-switch--disabled':disabled}" :style="{width:2*size+'px',height:switchHeight,borderRadius:size+'px',backgroundColor:currentValue===activeValue?activeColor:inactiveColor}">
+		<view class="evan-switch__circle" :style="{width:size+'px',height:size+'px',transform:currentValue===activeValue?`translateX(${size}px)`:`translateX(0)`}"></view>
+	</view> -->
+	<view @click="toggle" class="evan-switch" :class="{'evan-switch--disabled':disabled}" :style="{backgroundColor:currentValue===activeValue?activeColor:inactiveColor}">
+		<view class="evan-switch__circle" :style="{transform:currentValue===activeValue?`translateX(${29}px)`:`translateX(0)`}"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'EvanSwitch',
+		props: {
+			value: {
+				type: [String, Number, Boolean],
+				default: false
+			},
+			activeColor: {
+				type: String,
+				default: '#108ee9'
+			},
+			inactiveColor: {
+				type: String,
+				default: '#fff'
+			},
+			size: {
+				type: Number,
+				default: 30
+			},
+			disabled: {
+				type: Boolean,
+				default: false
+			},
+			activeValue: {
+				type: [String, Number, Boolean],
+				default: true
+			},
+			inactiveValue: {
+				type: [String, Number, Boolean],
+				default: false
+			},
+			beforeChange: {
+				type: Function,
+				default: null
+			},
+			extraData: null,
+			contextLevel: {
+				type: Number,
+				default: 1
+			}
+		},
+		computed: {
+			switchHeight() {
+				// #ifdef APP-NVUE
+				return this.size + 2 + 'px'
+				// #endif
+				// #ifndef APP-NVUE
+				return this.size + 'px'
+				// #endif
+			}
+		},
+		watch: {
+			value: {
+				immediate: true,
+				handler(value) {
+					this.currentValue = value
+				}
+			}
+		},
+		data() {
+			return {
+				currentValue: false
+			}
+		},
+		methods: {
+			toggle() {
+				if (!this.disabled) {
+					if (this.beforeChange && typeof this.beforeChange === 'function') {
+						let context = this
+						for (let i = 0; i < this.contextLevel; i++) {
+							context = context.$options.parent
+						}
+						const result = this.beforeChange(this.currentValue === this.activeValue ? this.inactiveValue : this.activeValue,
+							this.extraData, context)
+						if (typeof result === 'object') {
+							result.then(() => {
+								this.toggleValue()
+							}).catch(() => {})
+						} else if (typeof result === 'boolean' && result) {
+							this.toggleValue()
+						}
+					} else {
+						this.toggleValue()
+					}
+				}
+			},
+			toggleValue() {
+				this.currentValue = this.currentValue === this.activeValue ? this.inactiveValue : this.activeValue
+				this.$emit('input', this.currentValue)
+				this.$emit('change', this.currentValue)
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.evan-switch {
+		position: relative;
+		border-width: 1px;
+		border-color: rgba(0, 0, 0, 0.1);
+		border-style: solid;
+		transition: background-color 0.3s;
+		width: 100upx;
+		height: 36upx;
+		background: #2BC7B9;
+		border-radius: 18upx;
+		/* #ifndef APP-NVUE */
+		box-sizing: content-box;
+		/* #endif */
+	}
+
+	.evan-switch--disabled {
+		opacity: 0.3;
+	}
+
+	.evan-switch__circle {
+		position: absolute;
+		left: -4upx;
+		top: -8upx;
+		width: 50upx;
+		height: 50upx;
+		background: #FFFFFF;
+		box-shadow: 0px 2px 10px 0px rgba(166, 217, 212, 0.49);
+		border-radius: 50%;
+		/* #ifndef APP-NVUE */
+		box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
+		/* #endif */
+		/* #ifdef APP-NVUE */
+		box-shadow: 1px 0 0px 0 rgba(0, 0, 0, 0.05);
+		/* #endif */
+		transition: transform 0.3s;
+	}
+</style>

components/likeProduct.vue

@@ -0,0 +1,181 @@
+<template>
+   <view>
+		<view class="like-title">
+			<image src="/static/images/like.png" mode=""></image>
+			<text class="text">猜你喜欢</text>
+		</view>
+		<view class="like-list">
+			<view class="item" v-for="(item,index) in list" :key="index" @click="showProduct(item)">
+				<view class="img-box">
+					<image :src="item.image" mode=""></image>
+				</view>
+				<view class="info-box">
+					<view class="title ellipsis2">{{ item.productName }}</view>
+					<view class="price-box">
+						<view class="now">
+							<text class="unit">¥</text>
+							<text class="num">{{item.price.toFixed(2)}}</text>
+						</view>
+						<view class="old">¥{{item.otPrice.toFixed(2)}}</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<Loading :loaded="loaded" :loading="loading"></Loading>
+   </view>
+</template>
+
+<script>
+  import {getGoodsProducts} from '@/api/product'
+  import Loading from "@/components/Loading";
+  export default {
+	components: {Loading },
+    name: "likeProduct",
+	data() {
+		return {
+			page:{
+				page: 1,
+				pageSize: 10
+			},
+			total:0,
+			list:[],
+			loaded: false,
+			loading: false
+		};
+	},
+	created() {
+	},
+	mounted() {
+		this.getGoodsProducts();
+	},
+	
+	methods: {
+		getGoodsProducts(){
+			console.log(1)
+			var that=this;
+			if (that.loaded == true || that.loading == true) return;
+			that.loading = true;
+			uni.showLoading({
+				title:"加载中..."
+			})
+			getGoodsProducts(that.page).then(
+				res => {
+					if(res.code==200){
+						that.total=res.data.total;
+						that.list.push.apply(that.list, res.data.list);
+						that.loading = false;
+						that.loaded = that.list.length<that.total?false:true;
+						that.page.page = that.page.page + 1;
+						uni.hideLoading()
+					}
+				},
+				err => {
+					uni.hideLoading()
+					uni.showToast({
+						title: err.msg ,
+						icon: 'none',
+						duration: 2000
+					});
+				}
+			);
+		},
+		showProduct(item){
+			uni.navigateTo({
+				url: '/pages/shopping/productDetails?productId='+item.productId
+			})
+		},
+	}
+ 
+  };
+</script>
+<style lang="scss">
+	.like-title{
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		padding: 30upx 0;
+		image{
+			width: 37upx;
+			height: 37upx;
+			margin-right: 20upx;
+		}
+		.text{
+			font-size: 36upx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #111111;
+			line-height: 1;
+		}
+	}
+	.like-list{
+		display: flex;
+		flex-wrap: wrap;
+		.item{
+			margin-right: 20rpx;
+			margin-bottom: 20rpx;
+			width: 345rpx;
+			background: #FFFFFF;
+			box-shadow: 0px 0px 10rpx 4rpx rgba(199, 199, 199, 0.22);
+			border-radius: 20rpx;
+			overflow: hidden;
+			&:nth-child(2n) {
+				margin-right: 0;
+			}
+			.img-box{
+				width: 100%;
+				height: 334upx;
+				image{
+					width: 100%;
+					height: 100%;
+				}
+			}
+			.info-box{
+				box-sizing: border-box;
+				height: 182upx;
+				padding: 20upx 20upx 30upx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				.title{
+					font-size: 26upx;
+					font-family: PingFang SC;
+					font-weight: 500;
+					color: #111111;
+					line-height: 40upx;
+				}
+				.price-box{
+					display: flex;
+					align-items: flex-end;
+					.now{
+						display: flex;
+						align-items: flex-end;
+						margin-right: 20upx;
+						.unit{
+							font-size: 24upx;
+							font-family: PingFang SC;
+							font-weight: 500;
+							color: #FF6633;
+							line-height: 1.2;
+							margin-right: 4upx;
+						}
+						.num{
+							font-size: 36upx;
+							font-family: PingFang SC;
+							font-weight: bold;
+							color: #FF6633;
+							line-height: 1;
+						}
+					}
+					.old{
+						font-size: 26upx;
+						font-family: PingFang SC;
+						font-weight: 500;
+						text-decoration: line-through;
+						color: #BBBBBB;
+						line-height: 1.1;
+					}
+				}
+			}
+		}
+	}
+</style>

components/px-popup-bottom/px-popup-bottom.vue

@@ -0,0 +1,315 @@
+<template>
+	<view :class="['popup',{'popup-show':show}]" @mousewheel.prevent.stop @touchmove.stop.prevent
+		:style="{'z-index':zindex}">
+		<view class="mask" :style="{'z-index':maskZindex,bottom:bottom+'rpx'}" v-show="show" @click.stop="onClose"
+			@touchmove.prevent.stop></view>
+		<view :class="['content',{show}]" @click.stop @touchmove.prevent.stop :style="{'background-color':bgColor,height:`${height}px`,maxHeight:show ? cotMaxHeight:0,'border-top-right-radius':cotRadius,
+			'border-top-left-radius':cotRadius,transition: `all ${animaTime}s ease-in`,bottom:bottom+'rpx','z-index':zindex}">
+			<view id="title-bar" class="title-bar" v-show="title">
+				<view class="title" :style="{fontWeight:fontweight}">{{title}}</view>
+				<view class="close-wrap" @click.stop="onClose">
+					<image class="close-icon" :src="closeIcon" mode="widthFix"></image>
+				</view>
+			</view>
+			<view class="scroll-wrap">
+				<scroll-view :class="{'scroll-view':isAnimaStart}" scroll-y="true" style="height:100%;"
+					@scrolltolower="onScrollToLower">
+					<view id="popup_content" class="popup_content">
+						<slot></slot>
+					</view>
+				</scroll-view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import iconClose from '@/static/images/close40.png'
+	export default {
+		props: {
+			title: { //标题
+				type: String,
+				default: ''
+			},
+			fontweight: {
+				type: [String, Number],
+				default: 'normal'
+			},
+			visible: { //隐藏显示标识
+				type: Boolean,
+				default: false
+			},
+			maxHeight: { //内容区域最大高度
+				type: [String, Number],
+				default: '75%'
+			},
+			radius: { //顶部圆角
+				type: [String, Number],
+				default: '0'
+			},
+			animaTime: { //弹窗动画时间
+				type: Number,
+				default: 0.2
+			},
+			bottom: { //离底部距离
+				type: [String, Number],
+				default: 0
+			},
+			bgColor: {
+				type: [String],
+				default: '#ffffff'
+			},
+			zindex: {
+				type: [String, Number],
+				default: 1000
+			},
+			maskZindex: {
+				type: [String, Number],
+				default: 999
+			},
+			always: { //是否每次打开都重新计算内容高度
+				type: Boolean,
+				default: false
+			},
+
+		},
+		data() {
+			return {
+				show: false,
+				height: 0,
+				PopHeight: 0,
+				cotMaxHeight: '',
+				isAnimaStart: false,
+				rpxRate: "",
+				cotRadius: 0,
+				closeIcon: iconClose
+			}
+		},
+		watch: {
+			visible(newval) {
+				this.isAnimaStart = true;
+				setTimeout(() => {
+					this.isAnimaStart = false;
+				}, this.animaTime * 1000)
+
+				if (newval && this.height === 0) {
+					if (this.PopHeight === 0 || this.always) {
+						this.setContViewHeight();
+
+					} else {
+						this.height = this.PopHeight
+					}
+
+					// #ifdef H5 
+					this.setBodyOverFlow('hidden') //阻止滚动穿透
+					//#endif
+					this.$emit('open')
+
+				} else {
+					this.height = 0;
+					// #ifdef H5 
+					this.setBodyOverFlow('visible')
+					//#endif
+
+				}
+
+				this.show = newval
+
+			},
+			maxHeight: {
+				handler(newval) {
+					this.cotMaxHeight = this.unitCheck(newval);
+
+				},
+				immediate: true
+			},
+			radius: {
+				handler(newval) {
+					this.cotRadius = this.unitCheck(newval);
+
+				},
+				immediate: true
+			}
+		},
+		created() {
+			this.rpxRate = this.getRpxRate()
+		},
+		mounted() {
+			this.$nextTick(() => {
+				// #ifdef H5
+				this.preventTouch(document.querySelector(
+					'.scroll-wrap .uni-scroll-view .uni-scroll-view')); //防止浏览器报错
+				//#endif
+			})
+		},
+		methods: {
+			onClose() {
+				this.$emit("update:visible", false);
+				this.$emit('close')
+			},
+			//触底
+			onScrollToLower(e) {
+				this.$emit("reachBottom");
+			},
+			getRpxRate() {
+				let res = uni.getSystemInfoSync();
+				let width = res.windowWidth;
+				let rate = 750.00 / width;
+				return rate
+			},
+			unitCheck(value) {
+				const val = String(value);
+				if (!val.includes('px') && !val.includes('%')) {
+					return `${val}rpx`;
+				}
+				return val;
+
+			},
+			preventTouch(el) {
+				el.addEventListener('touchmove', function(e) {
+					e.stopPropagation();
+
+				}, {
+					passive: false
+				});
+			},
+			setBodyOverFlow(val) {
+				document.body.style.overflow = val
+			},
+
+			//设置内容区域高度
+			async setContViewHeight() {
+				let data = await this.computeHeight();
+				this.height = data.height + (this.title ? 100 / parseFloat(this.rpxRate) : 0);
+				this.PopHeight = this.height;
+			},
+			//计算内容区域高度
+			computeHeight() {
+				return new Promise(resolve => {
+					this.$nextTick(() => {
+						const query = uni.createSelectorQuery().in(this);
+						query.select('#popup_content').boundingClientRect(data => {
+							resolve(data)
+						}).exec();
+					})
+				})
+			}
+
+		}
+
+
+	}
+</script>
+
+<style lang="scss" scoped>
+	.popup {
+
+		&.popup-show {
+			position: fixed;
+			top: 0;
+			right: 0;
+			left: 0;
+			bottom: 0;
+			overflow: hidden;
+			z-index: 999;
+		}
+
+		.mask {
+			position: fixed;
+			top: 0;
+			right: 0;
+			bottom: 0;
+			left: 0;
+			background-color: rgba($color: #000000, $alpha: 0.5);
+			z-index: 999;
+		}
+
+		.content {
+			position: fixed;
+			bottom: 0;
+			left: 0;
+			right: 0;
+			height: 0;
+			height: auto;
+			background-color: #ffffff;
+			transition: all 0.2s ease-in;
+			z-index: 1000;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			overflow: hidden;
+
+			.title-bar {
+				width: 100%;
+				flex-shrink: 0;
+				text-align: center;
+				position: relative;
+				padding: 10rpx 70rpx 0;
+				box-sizing: border-box;
+				height: 80rpx;
+
+				.title {
+					font-size: 34upx;
+					font-family: PingFang SC;
+					font-weight: bold !important;
+					color: #111111;
+					width: 100%;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					white-space: nowrap;
+				}
+
+				.close-wrap {
+					position: absolute;
+					top: 20rpx;
+					right: 10rpx;
+					padding: 10rpx 20rpx;
+					box-sizing: border-box;
+				}
+
+				.close-icon {
+					width: 40rpx;
+					height: 40rpx;
+				}
+			}
+
+			.scroll-wrap {
+				flex: 1;
+				height: 0;
+				width: 100%;
+			}
+
+			&.visible {
+				max-height: 75%;
+				overflow-y: hidden;
+				height: auto;
+
+			}
+		}
+	}
+
+	.scroll-view ::-webkit-scrollbar {
+		display: none !important;
+		width: 0 !important;
+		height: 0 !important;
+		-webkit-appearance: none;
+		background: transparent;
+
+	}
+
+	.popup_content {
+		width: 100%;
+		padding: 0rpx 30rpx;
+		box-sizing: border-box;
+
+		&::after {
+			display: block;
+			width: 100%;
+			content: "\00A0";
+			overflow: hidden;
+			opacity: 0;
+			height: 1rpx;
+		}
+
+	}
+</style>

components/tuiProduct.vue

@@ -0,0 +1,181 @@
+<template>
+   <view>
+		<view class="like-title">
+			<image src="/static/images/tui.png" mode=""></image>
+			<text class="text">精选药品</text>
+		</view>
+		<view class="like-list">
+			<view class="item" v-for="(item,index) in list" :key="index" @click="showProduct(item)">
+				<view class="img-box">
+					<image :src="item.image" mode=""></image>
+				</view>
+				<view class="info-box">
+					<view class="title ellipsis2">{{ item.productName }}</view>
+					<view class="price-box">
+						<view class="now">
+							<text class="unit">¥</text>
+							<text class="num">{{item.price.toFixed(2)}}</text>
+						</view>
+						<view class="old">¥{{item.otPrice.toFixed(2)}}</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<Loading :loaded="loaded" :loading="loading"></Loading>
+   </view>
+</template>
+
+<script>
+  import {getTuiProducts} from '@/api/product'
+  import Loading from "@/components/Loading";
+  export default {
+	components: {Loading },
+    name: "likeProduct",
+	data() {
+		return {
+			page:{
+				page: 1,
+				pageSize: 10
+			},
+			total:0,
+			list:[],
+			loaded: false,
+			loading: false
+		};
+	},
+	created() {
+	},
+	mounted() {
+		this.getTuiProducts();
+	},
+	
+	methods: {
+		getTuiProducts(){
+			console.log(1)
+			var that=this;
+			if (that.loaded == true || that.loading == true) return;
+			that.loading = true;
+			uni.showLoading({
+				title:"加载中..."
+			})
+			getTuiProducts(that.page).then(
+				res => {
+					if(res.code==200){
+						that.total=res.data.total;
+						that.list.push.apply(that.list, res.data.list);
+						that.loading = false;
+						that.loaded = that.list.length<that.total?false:true;
+						that.page.page = that.page.page + 1;
+						uni.hideLoading()
+					}
+				},
+				err => {
+					uni.hideLoading()
+					uni.showToast({
+						title: err.msg ,
+						icon: 'none',
+						duration: 2000
+					});
+				}
+			);
+		},
+		showProduct(item){
+			uni.navigateTo({
+				url: '/pages/shopping/productDetails?productId='+item.productId
+			})
+		},
+	}
+ 
+  };
+</script>
+<style lang="scss">
+	.like-title{
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		padding: 15upx 0rpx 30upx 0rpx;
+		image{
+			width: 37upx;
+			height: 37upx;
+			margin-right: 20upx;
+		}
+		.text{
+			font-size: 36upx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #111111;
+			line-height: 1;
+		}
+	}
+	.like-list{
+		display: flex;
+		flex-wrap: wrap;
+		.item{
+			margin-right: 20rpx;
+			margin-bottom: 20rpx;
+			width: 345rpx;
+			background: #FFFFFF;
+			box-shadow: 0px 0px 10rpx 4rpx rgba(199, 199, 199, 0.22);
+			border-radius: 20rpx;
+			overflow: hidden;
+			&:nth-child(2n) {
+				margin-right: 0;
+			}
+			.img-box{
+				width: 100%;
+				height: 334upx;
+				image{
+					width: 100%;
+					height: 100%;
+				}
+			}
+			.info-box{
+				box-sizing: border-box;
+				height: 182upx;
+				padding: 20upx 20upx 30upx;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				.title{
+					font-size: 26upx;
+					font-family: PingFang SC;
+					font-weight: 500;
+					color: #111111;
+					line-height: 40upx;
+				}
+				.price-box{
+					display: flex;
+					align-items: flex-end;
+					.now{
+						display: flex;
+						align-items: flex-end;
+						margin-right: 20upx;
+						.unit{
+							font-size: 24upx;
+							font-family: PingFang SC;
+							font-weight: 500;
+							color: #FF6633;
+							line-height: 1.2;
+							margin-right: 4upx;
+						}
+						.num{
+							font-size: 36upx;
+							font-family: PingFang SC;
+							font-weight: bold;
+							color: #FF6633;
+							line-height: 1;
+						}
+					}
+					.old{
+						font-size: 26upx;
+						font-family: PingFang SC;
+						font-weight: 500;
+						text-decoration: line-through;
+						color: #BBBBBB;
+						line-height: 1.1;
+					}
+				}
+			}
+		}
+	}
+</style>

components/z-modal/z-modal.vue

@@ -0,0 +1,325 @@
+<template>
+	<view>
+		<view class="mask" :style="{'opacity':show?'1':'0','visibility':show?'visible':'hidden'}"></view>
+		<view class="modal-box" :style="{'display':show?'block':'none','width':modalWidth}">
+			<view class="modal-title" :style="{'padding':titlePadding,'fontSize':titleSize,'color':titleColor}">
+				{{titleText}}
+			</view>
+			<view class="modal-content" v-if="contentType==1" :style="{'fontSize':contentSize,'padding':contentPadding,'color':contentColor}">
+				{{contentText}}
+			</view>
+			<view class="modal-content" v-if="contentType==2" :style="{'padding':contentPadding}">
+				<input :placeholder="placeholderText" v-model="inputText" :maxlength="maxLength" :placeholder-style="placeholderStyleString" :style="{'borderColor':inputBorderColor,'fontSize':contentSize,'color':contentColor}" class="input-area"/>
+			</view>
+			<view class="modal-content" v-if="contentType==3" :style="{'padding':contentPadding}">
+				<textarea :placeholder="placeholderText" v-model="textareaText" :maxlength="maxLength" :placeholder-style="placeholderStyleString" :style="{'borderColor':inputBorderColor,'fontSize':contentSize,'color':contentColor}"/>
+			</view>
+			<view class="model-bottom" :style="{'padding':bottomPadding,'justify-content':btnLength>1?'space-between':'center'}">
+				<block v-for="(item,index) in btnGroup" :key='index'>
+					<view class="modal-btn" :style="{'width':item.width,'height':item.height,'color':item.color,'background-color':item.bgColor,'font-size':bottomFontSize,'border-radius':shapeObj[item.shape]}" @tap="btnClick(index)">
+						{{item.text}}
+					</view>
+				</block>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: "z-modal",
+		props: {
+			// **************** 使用配置项 ****************
+			// 文本校验？
+			check:{
+				type:Boolean,
+				default:false
+			},
+			checkItem:{
+				// isRequired-是否必填/ isNumber-是否为纯数字 isChinese-是否为纯中文 isEnglish-是否为纯英文 isEmail-是否为邮箱格式 isIdNum-是否为身份证格式
+				type:Array,
+				default:()=>{
+					return []
+				}
+			},
+			/*
+			支持自定义校验，格式为{
+				key:正则
+			}
+			例如{
+				'isNumber':/^\+?[0-9][0-9]*$/
+			}
+			*/
+			selfCheckItem:{
+				type:Object,
+				default:()=>{
+					return {}
+				}
+			},
+			// 控制modal的显示隐藏
+			show:{
+				type:Boolean,
+				default:false
+			},
+			// 底部按钮组
+			btnGroup: {
+				type: Array,
+				default: () => {
+					return [{
+						text: '取消',
+						color: '#FFFFFF',
+						bgColor: '#999999',
+						width: '220rpx',
+						height: '80rpx',
+						shape: 'circle',
+						eventName: 'cancle'
+					}, {
+						text: '确定',
+						color: '#FFFFFF',
+						bgColor: '#007AFF',
+						width: '220rpx',
+						height: '80rpx',
+						shape: 'circle',
+						eventName: 'sure'
+					}]
+				}
+			},
+			// 文本类型 1-展示文字 2-input 3-textarea
+			contentType:{
+				type:[Number,String],
+				default:1
+			},
+			// contentType为2或3时的字数限制
+			maxLength:{
+				type:Number,
+				default:20
+			},
+			// **************** 尺寸&大小 ****************
+			// modal整体宽度 rpx
+			modalWidth:{
+				type:String,
+				default:'580rpx'
+			},
+			// title区域文字大小
+			titleSize:{
+				type:String,
+				default:'32rpx'
+			},
+			// content区域文字大小
+			contentSize:{
+				type:String,
+				default:'28rpx'
+			},
+			// 底部（按钮）区域的字号
+			bottomFontSize:{
+				type:String,
+				default:'28rpx'
+			},
+			// title(标题) 区域的padding
+			titlePadding:{
+				type:String,
+				default:'20rpx 0'
+			},
+			// content(内容) 区域的padding
+			contentPadding:{
+				type:String,
+				default:'10rpx 40rpx'
+			},
+			// 底部（按钮）区域的padding
+			bottomPadding:{
+				type:String,
+				default:'30rpx 40rpx'
+			},
+			// **************** 颜色 ****************
+			// 标题文字颜色
+			titleColor:{
+				type:String,
+				default:'#333333'
+			},
+			// 内容文字颜色
+			contentColor:{
+				type:String,
+				default:'#333333'
+			},
+			// placeholderColor-提示文字的颜色
+			placeholderColor:{
+				type:String,
+				default:'#999'
+			},
+			inputBorderColor:{
+				type:String,
+				default:'#999'
+			},
+			// **************** 内容 ****************
+			// 标题内容
+			titleText:{
+				type:String,
+				default:'titleText'
+			},
+			// 文本内容
+			contentText:{
+				type:String,
+				default:'Please type in your text'
+			},
+			// input或textarea的placeholder
+			placeholderText:{
+				type:String,
+				default:'请输入你的内容'
+			}
+		},
+		computed:{
+			btnLength(){
+				return this.btnGroup.length
+			},
+			placeholderStyleString(){
+				return `color:${this.placeholderColor};font-size:${this.contentSize}`
+			}
+		},
+		data() {
+			return {
+				// 底部按钮shape对应值
+				shapeObj:{
+					'circle':'1000rpx',
+					'straight':'0',
+					'fillet':'12rpx'
+				},
+				inputText:'',
+				textareaText:'',
+				// ***校验项，是否通过，true-通过，false不通过
+				checkCollection: {
+					isRequired :function(val){
+						return !(val === null || val === '' || val === undefined)
+					},
+					isNumber :function(val){
+						let reg = /^\+?[0-9][0-9]*$/
+						return reg.test(val)
+					},
+					isChinese :function(val){
+						let reg = /^[\u4e00-\u9fa5]+$/
+						return reg.test(val)
+					},
+					isEnglish :function(val){
+						let reg = /^[a-zA-Z]+$/
+						return reg.test(val)
+					},
+					isEmail :function(val){
+						let reg = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/
+						return reg.test(val)
+					},
+					isIdNum :function(val){
+						let reg = /^\d{6}(18|19|20)?\d{2}(0[1-9]|1[12])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i
+						return reg.test(val)
+					}
+				}
+			};
+		},
+		methods:{
+			btnClick(index){
+				let val = this.contentType==2?this.inputText:this.textareaText
+				if(this.check && this.checkItem.length && this.contentType!=1){
+					let err = false
+					// 进入校验，如果不通过直接返回，通过则吐出按钮事件
+					for(let item of this.checkItem){
+						if(!this.checkCollection[item](val)){
+							this.$emit('error',item)
+							err = true
+							break
+						}
+					}
+					if(err) return
+				}
+				let selfCheckArr = Object.entries(this.selfCheckItem)
+				if(this.check && selfCheckArr.length && this.contentType!=1){
+					let err = false
+					for(let item of selfCheckArr){
+						let reg = new RegExp(item[1])
+						if(!reg.test(val)){
+							this.$emit('error',item[0])
+							err = true
+							break
+						}
+					}
+					if(err) return
+				}
+				this.$emit(this.btnGroup[index]['eventName'],{
+					inputText:this.inputText || '',
+					textareaText:this.textareaText || ''
+				})
+				this.inputText = ''
+				this.textareaText = ''
+			}
+		}
+	}
+</script>
+
+<style>
+	.mask {
+		position: fixed;
+		z-index: 98;
+		background-color: rgba(0, 0, 0, .7);
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		visibility: hidden;
+		opacity: 0;
+		transition: all .3s;
+	}
+
+	.modal-box {
+		background-color: #FFFFFF;
+		position: fixed;
+		z-index: 99;
+		border-radius: 12rpx;
+		left: 50%;
+		top: 50%;
+		transform: translate(-50%, -50%);
+	}
+
+	.modal-title {
+		box-sizing: border-box;
+		color: #333333;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.modal-content {
+		box-sizing: border-box;
+		color: #333333;
+		word-break: break-all;
+		display: flex;
+		justify-content: center;
+	}
+
+	.model-bottom {
+		display: flex;
+		align-items: center;
+	}
+
+	.modal-btn {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+	
+	.input-area{
+		border: 1rpx solid #999;
+		width: 100%;
+		padding:0 16rpx;
+		box-sizing: border-box;
+		height: 60rpx;
+		border-radius: 6rpx;
+		outline: none;
+	}
+	
+	textarea{
+		border: 1rpx solid #999;
+		width: 92%;
+		padding:16rpx;
+		box-sizing: border-box;
+		border-radius: 6rpx;
+		height: 200rpx;
+	}
+
+</style>

main.js

@@ -0,0 +1,22 @@
+import Vue from 'vue'
+import App from './App'
+import uView from '@/uni_modules/uview-ui'
+ 
+Vue.config.productionTip = false
+  
+import utils from './utils/common.js'
+Vue.prototype.utils = utils;
+ 
+import {setData} from './utils/common.js'
+Vue.prototype.setData = setData;
+ 
+ 
+App.mpType = 'app'
+const app = new Vue({
+    ...App
+})
+app.$mount()
+
+
+ 
+ 

manifest.json

@@ -0,0 +1,94 @@
+{
+    "name" : "互联网医院",
+    "appid" : "__UNI__FD4A236",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    /* 5+App特有相关 */
+    "app-plus" : {
+        "usingComponents" : true,
+        "nvueStyleCompiler" : "uni-app",
+        "compilerVersion" : 3,
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        /* 模块配置 */
+        "modules" : {},
+        /* 应用发布信息 */
+        "distribute" : {
+            /* android打包配置 */
+            "android" : {
+                "permissions" : [
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ]
+            },
+            /* ios打包配置 */
+            "ios" : {},
+            /* SDK配置 */
+            "sdkConfigs" : {}
+        }
+    },
+    /* 快应用特有相关 */
+    "quickapp" : {},
+    /* 小程序特有相关 */
+    "mp-weixin" : {
+        "appid" : "wx6240d298e0aba8e7",
+        "setting" : {
+            "urlCheck" : false,
+            "minified" : true,
+            "postcss" : false,
+            "es6" : false
+        },
+        "optimization" : {
+            "subPackages" : true
+        },
+        "usingComponents" : true,
+        "permission" : {
+            "scope.userLocation" : {
+                "desc" : "获取位置用于给您推送相关信息"
+            }
+        }
+    },
+    "mp-alipay" : {
+        "usingComponents" : true
+    },
+    "mp-baidu" : {
+        "usingComponents" : true
+    },
+    "mp-toutiao" : {
+        "usingComponents" : true
+    },
+    "uniStatistics" : {
+        "enable" : false
+    },
+    "vueVersion" : "2",
+    "h5" : {
+        "title" : "芳华臻选",
+        "devServer" : {
+            "https" : false
+        },
+        "optimization" : {
+            "treeShaking" : {
+                "enable" : true
+            }
+        }
+    }
+}

node_modules/.bin/mime

@@ -0,0 +1,15 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*) basedir=`cygpath -w "$basedir"`;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  "$basedir/node"  "$basedir/../mime/cli.js" "$@"
+  ret=$?
+else 
+  node  "$basedir/../mime/cli.js" "$@"
+  ret=$?
+fi
+exit $ret

node_modules/.bin/mime.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+"%_prog%"  "%dp0%\..\mime\cli.js" %*
+ENDLOCAL
+EXIT /b %errorlevel%
+:find_dp0
+SET dp0=%~dp0
+EXIT /b

node_modules/.bin/mime.ps1

@@ -0,0 +1,18 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  & "$basedir/node$exe"  "$basedir/../mime/cli.js" $args
+  $ret=$LASTEXITCODE
+} else {
+  & "node$exe"  "$basedir/../mime/cli.js" $args
+  $ret=$LASTEXITCODE
+}
+exit $ret

node_modules/animate.css/.editorconfig

@@ -0,0 +1,12 @@
+# editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+max_line_length = 100
+tab_width = 2
+trim_trailing_whitespace = true

node_modules/animate.css/.prettierignore

@@ -0,0 +1 @@
+animate.min.css

node_modules/animate.css/.travis.yml

@@ -0,0 +1,6 @@
+language: node_js
+node_js:
+- "10"
+before_script:
+  - npm install -g gulp
+script: gulp

node_modules/animate.css/CODE_OF_CONDUCT.md

@@ -0,0 +1,76 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to making participation in our project and
+our community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, sex characteristics, gender identity and expression,
+level of experience, education, socio-economic status, nationality, personal
+appearance, race, religion, or sexual identity and orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+* Using welcoming and inclusive language
+* Being respectful of differing viewpoints and experiences
+* Gracefully accepting constructive criticism
+* Focusing on what is best for the community
+* Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+* The use of sexualized language or imagery and unwelcome sexual attention or
+ advances
+* Trolling, insulting/derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or electronic
+ address, without explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+ professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community. Examples of
+representing a project or community include using an official project e-mail
+address, posting via an official social media account, or acting as an appointed
+representative at an online or offline event. Representation of a project may be
+further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting the project team at callmeelton@gmail.com. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an incident.
+Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
+available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
+
+[homepage]: https://www.contributor-covenant.org
+
+For answers to common questions about this code of conduct, see
+https://www.contributor-covenant.org/faq

node_modules/animate.css/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2019 Daniel Eden
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

node_modules/animate.css/README.md

@@ -0,0 +1,211 @@
+# Animate.css [![GitHub release](https://img.shields.io/github/release/daneden/animate.css.svg)](https://github.com/daneden/animate.css/releases) [![CDNJS](https://img.shields.io/cdnjs/v/animate.css.svg)](https://cdnjs.com/libraries/animate.css) [![Build Status](https://travis-ci.com/daneden/animate.css.svg?branch=master)](https://travis-ci.com/daneden/animate.css) [![devDependencies Status](https://david-dm.org/daneden/animate.css/dev-status.svg)](https://david-dm.org/daneden/animate.css?type=dev) [![chat](https://img.shields.io/badge/chat-gitter-green.svg)](https://gitter.im/animate-css/Lobby) [![npm version](https://badge.fury.io/js/animate.css.svg)](https://www.npmjs.com/package/animate.css)
+
+_Just-add-water CSS animation_
+
+`animate.css` is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
+
+
+## Installation
+
+Install via npm:
+
+```bash
+$ npm install animate.css --save
+```
+
+or yarn:
+
+```bash
+$ yarn add animate.css
+```
+
+
+## Usage
+
+To use animate.css in your website, simply drop the stylesheet into your document's `<head>`, and add the class `animated` to an element, along with any of the animation names. That's it! You've got a CSS animated element. Super!
+
+```html
+<head>
+  <link rel="stylesheet" href="animate.min.css">
+</head>
+```
+
+or use a CDN hosted version by [CDNJS](https://cdnjs.com/libraries/animate.css)
+
+```html
+<head>
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css">
+</head>
+```
+
+
+### Animations
+
+To animate an element, add the class `animated` to an element. You can include the class `infinite` for an infinite loop. Finally you need to add one of the following classes to the element:
+
+| Class Name        |                    |                     |                      |
+| ----------------- | ------------------ | ------------------- | -------------------- |
+| `bounce`          | `flash`            | `pulse`             | `rubberBand`         |
+| `shake`           | `headShake`        | `swing`             | `tada`               |
+| `wobble`          | `jello`            | `bounceIn`          | `bounceInDown`       |
+| `bounceInLeft`    | `bounceInRight`    | `bounceInUp`        | `bounceOut`          |
+| `bounceOutDown`   | `bounceOutLeft`    | `bounceOutRight`    | `bounceOutUp`        |
+| `fadeIn`          | `fadeInDown`       | `fadeInDownBig`     | `fadeInLeft`         |
+| `fadeInLeftBig`   | `fadeInRight`      | `fadeInRightBig`    | `fadeInUp`           |
+| `fadeInUpBig`     | `fadeOut`          | `fadeOutDown`       | `fadeOutDownBig`     |
+| `fadeOutLeft`     | `fadeOutLeftBig`   | `fadeOutRight`      | `fadeOutRightBig`    |
+| `fadeOutUp`       | `fadeOutUpBig`     | `flipInX`           | `flipInY`            |
+| `flipOutX`        | `flipOutY`         | `lightSpeedIn`      | `lightSpeedOut`      |
+| `rotateIn`        | `rotateInDownLeft` | `rotateInDownRight` | `rotateInUpLeft`     |
+| `rotateInUpRight` | `rotateOut`        | `rotateOutDownLeft` | `rotateOutDownRight` |
+| `rotateOutUpLeft` | `rotateOutUpRight` | `hinge`             | `jackInTheBox`       |
+| `rollIn`          | `rollOut`          | `zoomIn`            | `zoomInDown`         |
+| `zoomInLeft`      | `zoomInRight`      | `zoomInUp`          | `zoomOut`            |
+| `zoomOutDown`     | `zoomOutLeft`      | `zoomOutRight`      | `zoomOutUp`          |
+| `slideInDown`     | `slideInLeft`      | `slideInRight`      | `slideInUp`          |
+| `slideOutDown`    | `slideOutLeft`     | `slideOutRight`     | `slideOutUp`         |
+| `heartBeat`       |
+
+Full example:
+
+```html
+<h1 class="animated infinite bounce delay-2s">Example</h1>
+```
+
+[Check out all the animations here!](https://daneden.github.io/animate.css/)
+
+It's possible to change the duration of your animations, add a delay or change the number of times that it plays:
+
+```css
+.yourElement {
+  animation-duration: 3s;
+  animation-delay: 2s;
+  animation-iteration-count: infinite;
+}
+```
+
+## Usage with Javascript
+
+You can do a whole bunch of other stuff with animate.css when you combine it with Javascript. A simple example:
+
+```javascript
+const element =  document.querySelector('.my-element')
+element.classList.add('animated', 'bounceOutLeft')
+```
+
+You can also detect when an animation ends:
+
+```javascript
+const element =  document.querySelector('.my-element')
+element.classList.add('animated', 'bounceOutLeft')
+
+element.addEventListener('animationend', function() { doSomething() })
+```
+
+You can use this simple function to add and remove the animations:
+
+```javascript
+function animateCSS(element, animationName, callback) {
+    const node = document.querySelector(element)
+    node.classList.add('animated', animationName)
+
+    function handleAnimationEnd() {
+        node.classList.remove('animated', animationName)
+        node.removeEventListener('animationend', handleAnimationEnd)
+
+        if (typeof callback === 'function') callback()
+    }
+
+    node.addEventListener('animationend', handleAnimationEnd)
+}
+```
+
+And use it like this:
+
+```javascript
+animateCSS('.my-element', 'bounce')
+
+// or
+animateCSS('.my-element', 'bounce', function() {
+  // Do something after animation
+})
+```
+
+Notice that the examples are using ES6's `const` declaration, dropping support for IE10 and some aging browsers. If you prefer, switch the `const` to `var` declarations and IE10 and some old browsers will get support (they still have to provide [classList](https://developer.mozilla.org/en-US/docs/Web/API/Element/classList) support, so do your [research](https://caniuse.com/#feat=classlist)).
+
+## Setting _Delay_ and _Speed_
+
+### Delay Class
+
+It's possible to add delays directly on the element's class attribute, just like this:
+
+```html
+<div class="animated bounce delay-2s">Example</div>
+```
+
+| Class Name | Delay Time |
+| ---------- | ---------- |
+| `delay-2s` | `2s`       |
+| `delay-3s` | `3s`       |
+| `delay-4s` | `4s`       |
+| `delay-5s` | `5s`       |
+
+> _**Note**: The default delays are from 1 second to 5 seconds only. If you need custom delays, add it directly to your own CSS code._
+
+### Slow, Slower, Fast, and Faster Class
+
+It's possible to control the speed of the animation by adding these classes, as a sample below:
+
+```html
+<div class="animated bounce faster">Example</div>
+```
+
+| Class Name | Speed Time |
+| ---------- | ---------- |
+| `slow`     | `2s`       |
+| `slower`   | `3s`       |
+| `fast`     | `800ms`    |
+| `faster`   | `500ms`    |
+
+> _**Note**: The `animated` class has a default speed of `1s`. If you need custom duration, add it directly to your own CSS code._
+
+## Custom Builds
+
+Animate.css is powered by [gulp.js](http://gulpjs.com/), which means you can create custom builds pretty easily. First of all, you’ll need Gulp and all other dependencies:
+
+```sh
+$ cd path/to/animate.css/
+$ sudo npm install
+```
+
+Next, run `gulp` to compile your custom builds. For example, if you want only some of the “attention seekers”, simply edit the `animate-config.json` file to select only the animations you want to use.
+
+```javascript
+"attention_seekers": {
+  "bounce": true,
+  "flash": false,
+  "pulse": false,
+  "shake": true,
+  "headShake": true,
+  "swing": true,
+  "tada": true,
+  "wobble": true,
+  "jello":true
+}
+```
+
+## Accessibility
+
+Animate.css supports the [`prefers-reduced-motion` media query](https://webkit.org/blog/7551/responsive-design-for-motion/) so that users with motion sensitivity can opt out of animations. On supported platforms (currently Firefox, OSX Safari and iOS Safari), users can select "reduce motion" on their operating system preferences and it will turn off CSS transitions for them without any further work required.
+
+## License
+
+Animate.css is licensed under the MIT license. (http://opensource.org/licenses/MIT)
+
+## Code of Conduct
+
+This project and everyone participating in it is governed by the [Contributor Covenant Code of Conduct](CODE_OF_CONDUCT.md). By participating, you are expected to uphold this code. Please report unacceptable behavior to [callmeelton@gmail.com](mailto:callmeelton@gmail.com).
+
+## Contributing
+
+Pull requests are the way to go here. We only have two rules for submitting a pull request: match the naming convention (camelCase, categorised [fades, bounces, etc]) and let us see a demo of submitted animations in a [pen](http://codepen.io). That **last one is important**.

node_modules/animate.css/animate-config.json

@@ -0,0 +1,121 @@
+{
+  "attention_seekers": {
+    "bounce": true,
+    "flash": true,
+    "pulse": true,
+    "rubberBand": true,
+    "shake": true,
+    "headShake": true,
+    "swing": true,
+    "tada": true,
+    "wobble": true,
+    "jello": true,
+    "heartBeat": true
+  },
+
+  "bouncing_entrances": {
+    "bounceIn": true,
+    "bounceInDown": true,
+    "bounceInLeft": true,
+    "bounceInRight": true,
+    "bounceInUp": true
+  },
+
+  "bouncing_exits": {
+    "bounceOut": true,
+    "bounceOutDown": true,
+    "bounceOutLeft": true,
+    "bounceOutRight": true,
+    "bounceOutUp": true
+  },
+
+  "fading_entrances": {
+    "fadeIn": true,
+    "fadeInDown": true,
+    "fadeInDownBig": true,
+    "fadeInLeft": true,
+    "fadeInLeftBig": true,
+    "fadeInRight": true,
+    "fadeInRightBig": true,
+    "fadeInUp": true,
+    "fadeInUpBig": true
+  },
+
+  "fading_exits": {
+    "fadeOut": true,
+    "fadeOutDown": true,
+    "fadeOutDownBig": true,
+    "fadeOutLeft": true,
+    "fadeOutLeftBig": true,
+    "fadeOutRight": true,
+    "fadeOutRightBig": true,
+    "fadeOutUp": true,
+    "fadeOutUpBig": true
+  },
+
+  "flippers": {
+    "flip": true,
+    "flipInX": true,
+    "flipInY": true,
+    "flipOutX": true,
+    "flipOutY": true
+  },
+
+  "lightspeed": {
+    "lightSpeedIn": true,
+    "lightSpeedOut": true
+  },
+
+  "rotating_entrances": {
+    "rotateIn": true,
+    "rotateInDownLeft": true,
+    "rotateInDownRight": true,
+    "rotateInUpLeft": true,
+    "rotateInUpRight": true
+  },
+
+  "rotating_exits": {
+    "rotateOut": true,
+    "rotateOutDownLeft": true,
+    "rotateOutDownRight": true,
+    "rotateOutUpLeft": true,
+    "rotateOutUpRight": true
+  },
+
+  "specials": {
+    "hinge": true,
+    "jackInTheBox": true,
+    "rollIn": true,
+    "rollOut": true
+  },
+
+  "zooming_entrances": {
+    "zoomIn": true,
+    "zoomInDown": true,
+    "zoomInLeft": true,
+    "zoomInRight": true,
+    "zoomInUp": true
+  },
+
+  "zooming_exits": {
+    "zoomOut": true,
+    "zoomOutDown": true,
+    "zoomOutLeft": true,
+    "zoomOutRight": true,
+    "zoomOutUp": true
+  },
+
+  "sliding_entrances": {
+    "slideInDown": true,
+    "slideInLeft": true,
+    "slideInRight": true,
+    "slideInUp": true
+  },
+
+  "sliding_exits": {
+    "slideOutDown": true,
+    "slideOutLeft": true,
+    "slideOutRight": true,
+    "slideOutUp": true
+  }
+}

node_modules/animate.css/animate.css

@@ -0,0 +1,3625 @@
+@charset "UTF-8";
+
+/*!
+ * animate.css -https://daneden.github.io/animate.css/
+ * Version - 3.7.2
+ * Licensed under the MIT license - http://opensource.org/licenses/MIT
+ *
+ * Copyright (c) 2019 Daniel Eden
+ */
+
+@-webkit-keyframes bounce {
+  from,
+  20%,
+  53%,
+  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);
+    -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);
+    transform: translate3d(0, -30px, 0);
+  }
+
+  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);
+    transform: translate3d(0, -15px, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(0, -4px, 0);
+    transform: translate3d(0, -4px, 0);
+  }
+}
+
+@keyframes bounce {
+  from,
+  20%,
+  53%,
+  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);
+    -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);
+    transform: translate3d(0, -30px, 0);
+  }
+
+  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);
+    transform: translate3d(0, -15px, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(0, -4px, 0);
+    transform: translate3d(0, -4px, 0);
+  }
+}
+
+.bounce {
+  -webkit-animation-name: bounce;
+  animation-name: bounce;
+  -webkit-transform-origin: center bottom;
+  transform-origin: center bottom;
+}
+
+@-webkit-keyframes flash {
+  from,
+  50%,
+  to {
+    opacity: 1;
+  }
+
+  25%,
+  75% {
+    opacity: 0;
+  }
+}
+
+@keyframes flash {
+  from,
+  50%,
+  to {
+    opacity: 1;
+  }
+
+  25%,
+  75% {
+    opacity: 0;
+  }
+}
+
+.flash {
+  -webkit-animation-name: flash;
+  animation-name: flash;
+}
+
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+
+@-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);
+  }
+}
+
+.pulse {
+  -webkit-animation-name: pulse;
+  animation-name: pulse;
+}
+
+@-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);
+  }
+}
+
+.rubberBand {
+  -webkit-animation-name: rubberBand;
+  animation-name: rubberBand;
+}
+
+@-webkit-keyframes shake {
+  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 shake {
+  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);
+  }
+}
+
+.shake {
+  -webkit-animation-name: shake;
+  animation-name: shake;
+}
+
+@-webkit-keyframes headShake {
+  0% {
+    -webkit-transform: translateX(0);
+    transform: translateX(0);
+  }
+
+  6.5% {
+    -webkit-transform: translateX(-6px) rotateY(-9deg);
+    transform: translateX(-6px) rotateY(-9deg);
+  }
+
+  18.5% {
+    -webkit-transform: translateX(5px) rotateY(7deg);
+    transform: translateX(5px) rotateY(7deg);
+  }
+
+  31.5% {
+    -webkit-transform: translateX(-3px) rotateY(-5deg);
+    transform: translateX(-3px) rotateY(-5deg);
+  }
+
+  43.5% {
+    -webkit-transform: translateX(2px) rotateY(3deg);
+    transform: translateX(2px) rotateY(3deg);
+  }
+
+  50% {
+    -webkit-transform: translateX(0);
+    transform: translateX(0);
+  }
+}
+
+@keyframes headShake {
+  0% {
+    -webkit-transform: translateX(0);
+    transform: translateX(0);
+  }
+
+  6.5% {
+    -webkit-transform: translateX(-6px) rotateY(-9deg);
+    transform: translateX(-6px) rotateY(-9deg);
+  }
+
+  18.5% {
+    -webkit-transform: translateX(5px) rotateY(7deg);
+    transform: translateX(5px) rotateY(7deg);
+  }
+
+  31.5% {
+    -webkit-transform: translateX(-3px) rotateY(-5deg);
+    transform: translateX(-3px) rotateY(-5deg);
+  }
+
+  43.5% {
+    -webkit-transform: translateX(2px) rotateY(3deg);
+    transform: translateX(2px) rotateY(3deg);
+  }
+
+  50% {
+    -webkit-transform: translateX(0);
+    transform: translateX(0);
+  }
+}
+
+.headShake {
+  -webkit-animation-timing-function: ease-in-out;
+  animation-timing-function: ease-in-out;
+  -webkit-animation-name: headShake;
+  animation-name: headShake;
+}
+
+@-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);
+  }
+}
+
+.swing {
+  -webkit-transform-origin: top center;
+  transform-origin: top center;
+  -webkit-animation-name: swing;
+  animation-name: swing;
+}
+
+@-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);
+  }
+}
+
+.tada {
+  -webkit-animation-name: tada;
+  animation-name: tada;
+}
+
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+
+@-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);
+  }
+}
+
+.wobble {
+  -webkit-animation-name: wobble;
+  animation-name: wobble;
+}
+
+@-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);
+  }
+}
+
+.jello {
+  -webkit-animation-name: jello;
+  animation-name: jello;
+  -webkit-transform-origin: center;
+  transform-origin: center;
+}
+
+@-webkit-keyframes heartBeat {
+  0% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+
+  14% {
+    -webkit-transform: scale(1.3);
+    transform: scale(1.3);
+  }
+
+  28% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+
+  42% {
+    -webkit-transform: scale(1.3);
+    transform: scale(1.3);
+  }
+
+  70% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+}
+
+@keyframes heartBeat {
+  0% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+
+  14% {
+    -webkit-transform: scale(1.3);
+    transform: scale(1.3);
+  }
+
+  28% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+
+  42% {
+    -webkit-transform: scale(1.3);
+    transform: scale(1.3);
+  }
+
+  70% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+}
+
+.heartBeat {
+  -webkit-animation-name: heartBeat;
+  animation-name: heartBeat;
+  -webkit-animation-duration: 1.3s;
+  animation-duration: 1.3s;
+  -webkit-animation-timing-function: ease-in-out;
+  animation-timing-function: ease-in-out;
+}
+
+@-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);
+  }
+}
+
+.bounceIn {
+  -webkit-animation-duration: 0.75s;
+  animation-duration: 0.75s;
+  -webkit-animation-name: bounceIn;
+  animation-name: bounceIn;
+}
+
+@-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);
+    transform: translate3d(0, -3000px, 0);
+  }
+
+  60% {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 25px, 0);
+    transform: translate3d(0, 25px, 0);
+  }
+
+  75% {
+    -webkit-transform: translate3d(0, -10px, 0);
+    transform: translate3d(0, -10px, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(0, 5px, 0);
+    transform: translate3d(0, 5px, 0);
+  }
+
+  to {
+    -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);
+    transform: translate3d(0, -3000px, 0);
+  }
+
+  60% {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 25px, 0);
+    transform: translate3d(0, 25px, 0);
+  }
+
+  75% {
+    -webkit-transform: translate3d(0, -10px, 0);
+    transform: translate3d(0, -10px, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(0, 5px, 0);
+    transform: translate3d(0, 5px, 0);
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.bounceInDown {
+  -webkit-animation-name: bounceInDown;
+  animation-name: bounceInDown;
+}
+
+@-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);
+    transform: translate3d(-3000px, 0, 0);
+  }
+
+  60% {
+    opacity: 1;
+    -webkit-transform: translate3d(25px, 0, 0);
+    transform: translate3d(25px, 0, 0);
+  }
+
+  75% {
+    -webkit-transform: translate3d(-10px, 0, 0);
+    transform: translate3d(-10px, 0, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(5px, 0, 0);
+    transform: translate3d(5px, 0, 0);
+  }
+
+  to {
+    -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);
+    transform: translate3d(-3000px, 0, 0);
+  }
+
+  60% {
+    opacity: 1;
+    -webkit-transform: translate3d(25px, 0, 0);
+    transform: translate3d(25px, 0, 0);
+  }
+
+  75% {
+    -webkit-transform: translate3d(-10px, 0, 0);
+    transform: translate3d(-10px, 0, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(5px, 0, 0);
+    transform: translate3d(5px, 0, 0);
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.bounceInLeft {
+  -webkit-animation-name: bounceInLeft;
+  animation-name: bounceInLeft;
+}
+
+@-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);
+    transform: translate3d(3000px, 0, 0);
+  }
+
+  60% {
+    opacity: 1;
+    -webkit-transform: translate3d(-25px, 0, 0);
+    transform: translate3d(-25px, 0, 0);
+  }
+
+  75% {
+    -webkit-transform: translate3d(10px, 0, 0);
+    transform: translate3d(10px, 0, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(-5px, 0, 0);
+    transform: translate3d(-5px, 0, 0);
+  }
+
+  to {
+    -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);
+    transform: translate3d(3000px, 0, 0);
+  }
+
+  60% {
+    opacity: 1;
+    -webkit-transform: translate3d(-25px, 0, 0);
+    transform: translate3d(-25px, 0, 0);
+  }
+
+  75% {
+    -webkit-transform: translate3d(10px, 0, 0);
+    transform: translate3d(10px, 0, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(-5px, 0, 0);
+    transform: translate3d(-5px, 0, 0);
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.bounceInRight {
+  -webkit-animation-name: bounceInRight;
+  animation-name: bounceInRight;
+}
+
+@-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);
+    transform: translate3d(0, 3000px, 0);
+  }
+
+  60% {
+    opacity: 1;
+    -webkit-transform: translate3d(0, -20px, 0);
+    transform: translate3d(0, -20px, 0);
+  }
+
+  75% {
+    -webkit-transform: translate3d(0, 10px, 0);
+    transform: translate3d(0, 10px, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(0, -5px, 0);
+    transform: translate3d(0, -5px, 0);
+  }
+
+  to {
+    -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);
+    transform: translate3d(0, 3000px, 0);
+  }
+
+  60% {
+    opacity: 1;
+    -webkit-transform: translate3d(0, -20px, 0);
+    transform: translate3d(0, -20px, 0);
+  }
+
+  75% {
+    -webkit-transform: translate3d(0, 10px, 0);
+    transform: translate3d(0, 10px, 0);
+  }
+
+  90% {
+    -webkit-transform: translate3d(0, -5px, 0);
+    transform: translate3d(0, -5px, 0);
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.bounceInUp {
+  -webkit-animation-name: bounceInUp;
+  animation-name: bounceInUp;
+}
+
+@-webkit-keyframes bounceOut {
+  20% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+    transform: scale3d(0.9, 0.9, 0.9);
+  }
+
+  50%,
+  55% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+    transform: scale3d(1.1, 1.1, 1.1);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+    transform: scale3d(0.3, 0.3, 0.3);
+  }
+}
+
+@keyframes bounceOut {
+  20% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+    transform: scale3d(0.9, 0.9, 0.9);
+  }
+
+  50%,
+  55% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+    transform: scale3d(1.1, 1.1, 1.1);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+    transform: scale3d(0.3, 0.3, 0.3);
+  }
+}
+
+.bounceOut {
+  -webkit-animation-duration: 0.75s;
+  animation-duration: 0.75s;
+  -webkit-animation-name: bounceOut;
+  animation-name: bounceOut;
+}
+
+@-webkit-keyframes bounceOutDown {
+  20% {
+    -webkit-transform: translate3d(0, 10px, 0);
+    transform: translate3d(0, 10px, 0);
+  }
+
+  40%,
+  45% {
+    opacity: 1;
+    -webkit-transform: translate3d(0, -20px, 0);
+    transform: translate3d(0, -20px, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 2000px, 0);
+    transform: translate3d(0, 2000px, 0);
+  }
+}
+
+@keyframes bounceOutDown {
+  20% {
+    -webkit-transform: translate3d(0, 10px, 0);
+    transform: translate3d(0, 10px, 0);
+  }
+
+  40%,
+  45% {
+    opacity: 1;
+    -webkit-transform: translate3d(0, -20px, 0);
+    transform: translate3d(0, -20px, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 2000px, 0);
+    transform: translate3d(0, 2000px, 0);
+  }
+}
+
+.bounceOutDown {
+  -webkit-animation-name: bounceOutDown;
+  animation-name: bounceOutDown;
+}
+
+@-webkit-keyframes bounceOutLeft {
+  20% {
+    opacity: 1;
+    -webkit-transform: translate3d(20px, 0, 0);
+    transform: translate3d(20px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(-2000px, 0, 0);
+    transform: translate3d(-2000px, 0, 0);
+  }
+}
+
+@keyframes bounceOutLeft {
+  20% {
+    opacity: 1;
+    -webkit-transform: translate3d(20px, 0, 0);
+    transform: translate3d(20px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(-2000px, 0, 0);
+    transform: translate3d(-2000px, 0, 0);
+  }
+}
+
+.bounceOutLeft {
+  -webkit-animation-name: bounceOutLeft;
+  animation-name: bounceOutLeft;
+}
+
+@-webkit-keyframes bounceOutRight {
+  20% {
+    opacity: 1;
+    -webkit-transform: translate3d(-20px, 0, 0);
+    transform: translate3d(-20px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(2000px, 0, 0);
+    transform: translate3d(2000px, 0, 0);
+  }
+}
+
+@keyframes bounceOutRight {
+  20% {
+    opacity: 1;
+    -webkit-transform: translate3d(-20px, 0, 0);
+    transform: translate3d(-20px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(2000px, 0, 0);
+    transform: translate3d(2000px, 0, 0);
+  }
+}
+
+.bounceOutRight {
+  -webkit-animation-name: bounceOutRight;
+  animation-name: bounceOutRight;
+}
+
+@-webkit-keyframes bounceOutUp {
+  20% {
+    -webkit-transform: translate3d(0, -10px, 0);
+    transform: translate3d(0, -10px, 0);
+  }
+
+  40%,
+  45% {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 20px, 0);
+    transform: translate3d(0, 20px, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -2000px, 0);
+    transform: translate3d(0, -2000px, 0);
+  }
+}
+
+@keyframes bounceOutUp {
+  20% {
+    -webkit-transform: translate3d(0, -10px, 0);
+    transform: translate3d(0, -10px, 0);
+  }
+
+  40%,
+  45% {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 20px, 0);
+    transform: translate3d(0, 20px, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -2000px, 0);
+    transform: translate3d(0, -2000px, 0);
+  }
+}
+
+.bounceOutUp {
+  -webkit-animation-name: bounceOutUp;
+  animation-name: bounceOutUp;
+}
+
+@-webkit-keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+.fadeIn {
+  -webkit-animation-name: fadeIn;
+  animation-name: fadeIn;
+}
+
+@-webkit-keyframes fadeInDown {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes fadeInDown {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInDown {
+  -webkit-animation-name: fadeInDown;
+  animation-name: fadeInDown;
+}
+
+@-webkit-keyframes fadeInDownBig {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -2000px, 0);
+    transform: translate3d(0, -2000px, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes fadeInDownBig {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -2000px, 0);
+    transform: translate3d(0, -2000px, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInDownBig {
+  -webkit-animation-name: fadeInDownBig;
+  animation-name: fadeInDownBig;
+}
+
+@-webkit-keyframes fadeInLeft {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(-100%, 0, 0);
+    transform: translate3d(-100%, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes fadeInLeft {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(-100%, 0, 0);
+    transform: translate3d(-100%, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInLeft {
+  -webkit-animation-name: fadeInLeft;
+  animation-name: fadeInLeft;
+}
+
+@-webkit-keyframes fadeInLeftBig {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(-2000px, 0, 0);
+    transform: translate3d(-2000px, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes fadeInLeftBig {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(-2000px, 0, 0);
+    transform: translate3d(-2000px, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInLeftBig {
+  -webkit-animation-name: fadeInLeftBig;
+  animation-name: fadeInLeftBig;
+}
+
+@-webkit-keyframes fadeInRight {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes fadeInRight {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInRight {
+  -webkit-animation-name: fadeInRight;
+  animation-name: fadeInRight;
+}
+
+@-webkit-keyframes fadeInRightBig {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(2000px, 0, 0);
+    transform: translate3d(2000px, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes fadeInRightBig {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(2000px, 0, 0);
+    transform: translate3d(2000px, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInRightBig {
+  -webkit-animation-name: fadeInRightBig;
+  animation-name: fadeInRightBig;
+}
+
+@-webkit-keyframes fadeInUp {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes fadeInUp {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInUp {
+  -webkit-animation-name: fadeInUp;
+  animation-name: fadeInUp;
+}
+
+@-webkit-keyframes fadeInUpBig {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 2000px, 0);
+    transform: translate3d(0, 2000px, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes fadeInUpBig {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 2000px, 0);
+    transform: translate3d(0, 2000px, 0);
+  }
+
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInUpBig {
+  -webkit-animation-name: fadeInUpBig;
+  animation-name: fadeInUpBig;
+}
+
+@-webkit-keyframes fadeOut {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes fadeOut {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+.fadeOut {
+  -webkit-animation-name: fadeOut;
+  animation-name: fadeOut;
+}
+
+@-webkit-keyframes fadeOutDown {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+  }
+}
+
+@keyframes fadeOutDown {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+  }
+}
+
+.fadeOutDown {
+  -webkit-animation-name: fadeOutDown;
+  animation-name: fadeOutDown;
+}
+
+@-webkit-keyframes fadeOutDownBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 2000px, 0);
+    transform: translate3d(0, 2000px, 0);
+  }
+}
+
+@keyframes fadeOutDownBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, 2000px, 0);
+    transform: translate3d(0, 2000px, 0);
+  }
+}
+
+.fadeOutDownBig {
+  -webkit-animation-name: fadeOutDownBig;
+  animation-name: fadeOutDownBig;
+}
+
+@-webkit-keyframes fadeOutLeft {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(-100%, 0, 0);
+    transform: translate3d(-100%, 0, 0);
+  }
+}
+
+@keyframes fadeOutLeft {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(-100%, 0, 0);
+    transform: translate3d(-100%, 0, 0);
+  }
+}
+
+.fadeOutLeft {
+  -webkit-animation-name: fadeOutLeft;
+  animation-name: fadeOutLeft;
+}
+
+@-webkit-keyframes fadeOutLeftBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(-2000px, 0, 0);
+    transform: translate3d(-2000px, 0, 0);
+  }
+}
+
+@keyframes fadeOutLeftBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(-2000px, 0, 0);
+    transform: translate3d(-2000px, 0, 0);
+  }
+}
+
+.fadeOutLeftBig {
+  -webkit-animation-name: fadeOutLeftBig;
+  animation-name: fadeOutLeftBig;
+}
+
+@-webkit-keyframes fadeOutRight {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+}
+
+@keyframes fadeOutRight {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+}
+
+.fadeOutRight {
+  -webkit-animation-name: fadeOutRight;
+  animation-name: fadeOutRight;
+}
+
+@-webkit-keyframes fadeOutRightBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(2000px, 0, 0);
+    transform: translate3d(2000px, 0, 0);
+  }
+}
+
+@keyframes fadeOutRightBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(2000px, 0, 0);
+    transform: translate3d(2000px, 0, 0);
+  }
+}
+
+.fadeOutRightBig {
+  -webkit-animation-name: fadeOutRightBig;
+  animation-name: fadeOutRightBig;
+}
+
+@-webkit-keyframes fadeOutUp {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+@keyframes fadeOutUp {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+.fadeOutUp {
+  -webkit-animation-name: fadeOutUp;
+  animation-name: fadeOutUp;
+}
+
+@-webkit-keyframes fadeOutUpBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -2000px, 0);
+    transform: translate3d(0, -2000px, 0);
+  }
+}
+
+@keyframes fadeOutUpBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(0, -2000px, 0);
+    transform: translate3d(0, -2000px, 0);
+  }
+}
+
+.fadeOutUpBig {
+  -webkit-animation-name: fadeOutUpBig;
+  animation-name: fadeOutUpBig;
+}
+
+@-webkit-keyframes flip {
+  from {
+    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, -360deg);
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
+    -webkit-animation-timing-function: ease-out;
+    animation-timing-function: ease-out;
+  }
+
+  40% {
+    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -190deg);
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -190deg);
+    -webkit-animation-timing-function: ease-out;
+    animation-timing-function: ease-out;
+  }
+
+  50% {
+    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -170deg);
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -170deg);
+    -webkit-animation-timing-function: ease-in;
+    animation-timing-function: ease-in;
+  }
+
+  80% {
+    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, 0deg);
+    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, 0deg);
+    -webkit-animation-timing-function: ease-in;
+    animation-timing-function: ease-in;
+  }
+
+  to {
+    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, 0deg);
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
+    -webkit-animation-timing-function: ease-in;
+    animation-timing-function: ease-in;
+  }
+}
+
+@keyframes flip {
+  from {
+    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, -360deg);
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
+    -webkit-animation-timing-function: ease-out;
+    animation-timing-function: ease-out;
+  }
+
+  40% {
+    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -190deg);
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -190deg);
+    -webkit-animation-timing-function: ease-out;
+    animation-timing-function: ease-out;
+  }
+
+  50% {
+    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -170deg);
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -170deg);
+    -webkit-animation-timing-function: ease-in;
+    animation-timing-function: ease-in;
+  }
+
+  80% {
+    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, 0deg);
+    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, 0deg);
+    -webkit-animation-timing-function: ease-in;
+    animation-timing-function: ease-in;
+  }
+
+  to {
+    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, 0deg);
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
+    -webkit-animation-timing-function: ease-in;
+    animation-timing-function: ease-in;
+  }
+}
+
+.animated.flip {
+  -webkit-backface-visibility: visible;
+  backface-visibility: visible;
+  -webkit-animation-name: flip;
+  animation-name: flip;
+}
+
+@-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 {
+    -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 {
+    -webkit-transform: perspective(400px);
+    transform: perspective(400px);
+  }
+}
+
+.flipInX {
+  -webkit-backface-visibility: visible !important;
+  backface-visibility: visible !important;
+  -webkit-animation-name: flipInX;
+  animation-name: flipInX;
+}
+
+@-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 {
+    -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 {
+    -webkit-transform: perspective(400px);
+    transform: perspective(400px);
+  }
+}
+
+.flipInY {
+  -webkit-backface-visibility: visible !important;
+  backface-visibility: visible !important;
+  -webkit-animation-name: flipInY;
+  animation-name: flipInY;
+}
+
+@-webkit-keyframes flipOutX {
+  from {
+    -webkit-transform: perspective(400px);
+    transform: perspective(400px);
+  }
+
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    opacity: 0;
+  }
+}
+
+@keyframes flipOutX {
+  from {
+    -webkit-transform: perspective(400px);
+    transform: perspective(400px);
+  }
+
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    opacity: 0;
+  }
+}
+
+.flipOutX {
+  -webkit-animation-duration: 0.75s;
+  animation-duration: 0.75s;
+  -webkit-animation-name: flipOutX;
+  animation-name: flipOutX;
+  -webkit-backface-visibility: visible !important;
+  backface-visibility: visible !important;
+}
+
+@-webkit-keyframes flipOutY {
+  from {
+    -webkit-transform: perspective(400px);
+    transform: perspective(400px);
+  }
+
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    opacity: 0;
+  }
+}
+
+@keyframes flipOutY {
+  from {
+    -webkit-transform: perspective(400px);
+    transform: perspective(400px);
+  }
+
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    opacity: 0;
+  }
+}
+
+.flipOutY {
+  -webkit-animation-duration: 0.75s;
+  animation-duration: 0.75s;
+  -webkit-backface-visibility: visible !important;
+  backface-visibility: visible !important;
+  -webkit-animation-name: flipOutY;
+  animation-name: flipOutY;
+}
+
+@-webkit-keyframes lightSpeedIn {
+  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 {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes lightSpeedIn {
+  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 {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.lightSpeedIn {
+  -webkit-animation-name: lightSpeedIn;
+  animation-name: lightSpeedIn;
+  -webkit-animation-timing-function: ease-out;
+  animation-timing-function: ease-out;
+}
+
+@-webkit-keyframes lightSpeedOut {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
+    transform: translate3d(100%, 0, 0) skewX(30deg);
+    opacity: 0;
+  }
+}
+
+@keyframes lightSpeedOut {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
+    transform: translate3d(100%, 0, 0) skewX(30deg);
+    opacity: 0;
+  }
+}
+
+.lightSpeedOut {
+  -webkit-animation-name: lightSpeedOut;
+  animation-name: lightSpeedOut;
+  -webkit-animation-timing-function: ease-in;
+  animation-timing-function: ease-in;
+}
+
+@-webkit-keyframes rotateIn {
+  from {
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    -webkit-transform: rotate3d(0, 0, 1, -200deg);
+    transform: rotate3d(0, 0, 1, -200deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+@keyframes rotateIn {
+  from {
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    -webkit-transform: rotate3d(0, 0, 1, -200deg);
+    transform: rotate3d(0, 0, 1, -200deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+.rotateIn {
+  -webkit-animation-name: rotateIn;
+  animation-name: rotateIn;
+}
+
+@-webkit-keyframes rotateInDownLeft {
+  from {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: rotate3d(0, 0, 1, -45deg);
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+@keyframes rotateInDownLeft {
+  from {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: rotate3d(0, 0, 1, -45deg);
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+.rotateInDownLeft {
+  -webkit-animation-name: rotateInDownLeft;
+  animation-name: rotateInDownLeft;
+}
+
+@-webkit-keyframes rotateInDownRight {
+  from {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: rotate3d(0, 0, 1, 45deg);
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+@keyframes rotateInDownRight {
+  from {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: rotate3d(0, 0, 1, 45deg);
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+.rotateInDownRight {
+  -webkit-animation-name: rotateInDownRight;
+  animation-name: rotateInDownRight;
+}
+
+@-webkit-keyframes rotateInUpLeft {
+  from {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: rotate3d(0, 0, 1, 45deg);
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+@keyframes rotateInUpLeft {
+  from {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: rotate3d(0, 0, 1, 45deg);
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+.rotateInUpLeft {
+  -webkit-animation-name: rotateInUpLeft;
+  animation-name: rotateInUpLeft;
+}
+
+@-webkit-keyframes rotateInUpRight {
+  from {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: rotate3d(0, 0, 1, -90deg);
+    transform: rotate3d(0, 0, 1, -90deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+@keyframes rotateInUpRight {
+  from {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: rotate3d(0, 0, 1, -90deg);
+    transform: rotate3d(0, 0, 1, -90deg);
+    opacity: 0;
+  }
+
+  to {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+
+.rotateInUpRight {
+  -webkit-animation-name: rotateInUpRight;
+  animation-name: rotateInUpRight;
+}
+
+@-webkit-keyframes rotateOut {
+  from {
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    -webkit-transform: rotate3d(0, 0, 1, 200deg);
+    transform: rotate3d(0, 0, 1, 200deg);
+    opacity: 0;
+  }
+}
+
+@keyframes rotateOut {
+  from {
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    -webkit-transform: rotate3d(0, 0, 1, 200deg);
+    transform: rotate3d(0, 0, 1, 200deg);
+    opacity: 0;
+  }
+}
+
+.rotateOut {
+  -webkit-animation-name: rotateOut;
+  animation-name: rotateOut;
+}
+
+@-webkit-keyframes rotateOutDownLeft {
+  from {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: rotate3d(0, 0, 1, 45deg);
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+}
+
+@keyframes rotateOutDownLeft {
+  from {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: rotate3d(0, 0, 1, 45deg);
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+}
+
+.rotateOutDownLeft {
+  -webkit-animation-name: rotateOutDownLeft;
+  animation-name: rotateOutDownLeft;
+}
+
+@-webkit-keyframes rotateOutDownRight {
+  from {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: rotate3d(0, 0, 1, -45deg);
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+}
+
+@keyframes rotateOutDownRight {
+  from {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: rotate3d(0, 0, 1, -45deg);
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+}
+
+.rotateOutDownRight {
+  -webkit-animation-name: rotateOutDownRight;
+  animation-name: rotateOutDownRight;
+}
+
+@-webkit-keyframes rotateOutUpLeft {
+  from {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: rotate3d(0, 0, 1, -45deg);
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+}
+
+@keyframes rotateOutUpLeft {
+  from {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: left bottom;
+    transform-origin: left bottom;
+    -webkit-transform: rotate3d(0, 0, 1, -45deg);
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+}
+
+.rotateOutUpLeft {
+  -webkit-animation-name: rotateOutUpLeft;
+  animation-name: rotateOutUpLeft;
+}
+
+@-webkit-keyframes rotateOutUpRight {
+  from {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: rotate3d(0, 0, 1, 90deg);
+    transform: rotate3d(0, 0, 1, 90deg);
+    opacity: 0;
+  }
+}
+
+@keyframes rotateOutUpRight {
+  from {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform-origin: right bottom;
+    transform-origin: right bottom;
+    -webkit-transform: rotate3d(0, 0, 1, 90deg);
+    transform: rotate3d(0, 0, 1, 90deg);
+    opacity: 0;
+  }
+}
+
+.rotateOutUpRight {
+  -webkit-animation-name: rotateOutUpRight;
+  animation-name: rotateOutUpRight;
+}
+
+@-webkit-keyframes hinge {
+  0% {
+    -webkit-transform-origin: top left;
+    transform-origin: top left;
+    -webkit-animation-timing-function: ease-in-out;
+    animation-timing-function: ease-in-out;
+  }
+
+  20%,
+  60% {
+    -webkit-transform: rotate3d(0, 0, 1, 80deg);
+    transform: rotate3d(0, 0, 1, 80deg);
+    -webkit-transform-origin: top left;
+    transform-origin: top left;
+    -webkit-animation-timing-function: ease-in-out;
+    animation-timing-function: ease-in-out;
+  }
+
+  40%,
+  80% {
+    -webkit-transform: rotate3d(0, 0, 1, 60deg);
+    transform: rotate3d(0, 0, 1, 60deg);
+    -webkit-transform-origin: top left;
+    transform-origin: top left;
+    -webkit-animation-timing-function: ease-in-out;
+    animation-timing-function: ease-in-out;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 700px, 0);
+    transform: translate3d(0, 700px, 0);
+    opacity: 0;
+  }
+}
+
+@keyframes hinge {
+  0% {
+    -webkit-transform-origin: top left;
+    transform-origin: top left;
+    -webkit-animation-timing-function: ease-in-out;
+    animation-timing-function: ease-in-out;
+  }
+
+  20%,
+  60% {
+    -webkit-transform: rotate3d(0, 0, 1, 80deg);
+    transform: rotate3d(0, 0, 1, 80deg);
+    -webkit-transform-origin: top left;
+    transform-origin: top left;
+    -webkit-animation-timing-function: ease-in-out;
+    animation-timing-function: ease-in-out;
+  }
+
+  40%,
+  80% {
+    -webkit-transform: rotate3d(0, 0, 1, 60deg);
+    transform: rotate3d(0, 0, 1, 60deg);
+    -webkit-transform-origin: top left;
+    transform-origin: top left;
+    -webkit-animation-timing-function: ease-in-out;
+    animation-timing-function: ease-in-out;
+    opacity: 1;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 700px, 0);
+    transform: translate3d(0, 700px, 0);
+    opacity: 0;
+  }
+}
+
+.hinge {
+  -webkit-animation-duration: 2s;
+  animation-duration: 2s;
+  -webkit-animation-name: hinge;
+  animation-name: hinge;
+}
+
+@-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);
+  }
+}
+
+.jackInTheBox {
+  -webkit-animation-name: jackInTheBox;
+  animation-name: jackInTheBox;
+}
+
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+
+@-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);
+  }
+}
+
+.rollIn {
+  -webkit-animation-name: rollIn;
+  animation-name: rollIn;
+}
+
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+
+@-webkit-keyframes rollOut {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
+    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
+  }
+}
+
+@keyframes rollOut {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
+    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
+  }
+}
+
+.rollOut {
+  -webkit-animation-name: rollOut;
+  animation-name: rollOut;
+}
+
+@-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;
+  }
+}
+
+@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;
+  }
+}
+
+.zoomIn {
+  -webkit-animation-name: zoomIn;
+  animation-name: zoomIn;
+}
+
+@-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);
+  }
+}
+
+@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);
+  }
+}
+
+.zoomInDown {
+  -webkit-animation-name: zoomInDown;
+  animation-name: zoomInDown;
+}
+
+@-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);
+  }
+}
+
+@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);
+  }
+}
+
+.zoomInLeft {
+  -webkit-animation-name: zoomInLeft;
+  animation-name: zoomInLeft;
+}
+
+@-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);
+  }
+}
+
+@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);
+  }
+}
+
+.zoomInRight {
+  -webkit-animation-name: zoomInRight;
+  animation-name: zoomInRight;
+}
+
+@-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);
+  }
+}
+
+@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);
+  }
+}
+
+.zoomInUp {
+  -webkit-animation-name: zoomInUp;
+  animation-name: zoomInUp;
+}
+
+@-webkit-keyframes zoomOut {
+  from {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+    transform: scale3d(0.3, 0.3, 0.3);
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes zoomOut {
+  from {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+    transform: scale3d(0.3, 0.3, 0.3);
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+.zoomOut {
+  -webkit-animation-name: zoomOut;
+  animation-name: zoomOut;
+}
+
+@-webkit-keyframes zoomOutDown {
+  40% {
+    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.55, 0.055, 0.675, 0.19);
+    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
+    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
+    -webkit-transform-origin: center bottom;
+    transform-origin: center bottom;
+    -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);
+  }
+}
+
+@keyframes zoomOutDown {
+  40% {
+    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.55, 0.055, 0.675, 0.19);
+    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
+    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
+    -webkit-transform-origin: center bottom;
+    transform-origin: center bottom;
+    -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);
+  }
+}
+
+.zoomOutDown {
+  -webkit-animation-name: zoomOutDown;
+  animation-name: zoomOutDown;
+}
+
+@-webkit-keyframes zoomOutLeft {
+  40% {
+    opacity: 1;
+    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
+    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
+    transform: scale(0.1) translate3d(-2000px, 0, 0);
+    -webkit-transform-origin: left center;
+    transform-origin: left center;
+  }
+}
+
+@keyframes zoomOutLeft {
+  40% {
+    opacity: 1;
+    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
+    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
+    transform: scale(0.1) translate3d(-2000px, 0, 0);
+    -webkit-transform-origin: left center;
+    transform-origin: left center;
+  }
+}
+
+.zoomOutLeft {
+  -webkit-animation-name: zoomOutLeft;
+  animation-name: zoomOutLeft;
+}
+
+@-webkit-keyframes zoomOutRight {
+  40% {
+    opacity: 1;
+    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
+    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
+    transform: scale(0.1) translate3d(2000px, 0, 0);
+    -webkit-transform-origin: right center;
+    transform-origin: right center;
+  }
+}
+
+@keyframes zoomOutRight {
+  40% {
+    opacity: 1;
+    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
+    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
+    transform: scale(0.1) translate3d(2000px, 0, 0);
+    -webkit-transform-origin: right center;
+    transform-origin: right center;
+  }
+}
+
+.zoomOutRight {
+  -webkit-animation-name: zoomOutRight;
+  animation-name: zoomOutRight;
+}
+
+@-webkit-keyframes zoomOutUp {
+  40% {
+    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.55, 0.055, 0.675, 0.19);
+    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
+    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
+    -webkit-transform-origin: center bottom;
+    transform-origin: center bottom;
+    -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);
+  }
+}
+
+@keyframes zoomOutUp {
+  40% {
+    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.55, 0.055, 0.675, 0.19);
+    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+  }
+
+  to {
+    opacity: 0;
+    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
+    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
+    -webkit-transform-origin: center bottom;
+    transform-origin: center bottom;
+    -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);
+  }
+}
+
+.zoomOutUp {
+  -webkit-animation-name: zoomOutUp;
+  animation-name: zoomOutUp;
+}
+
+@-webkit-keyframes slideInDown {
+  from {
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+    visibility: visible;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes slideInDown {
+  from {
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+    visibility: visible;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.slideInDown {
+  -webkit-animation-name: slideInDown;
+  animation-name: slideInDown;
+}
+
+@-webkit-keyframes slideInLeft {
+  from {
+    -webkit-transform: translate3d(-100%, 0, 0);
+    transform: translate3d(-100%, 0, 0);
+    visibility: visible;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes slideInLeft {
+  from {
+    -webkit-transform: translate3d(-100%, 0, 0);
+    transform: translate3d(-100%, 0, 0);
+    visibility: visible;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.slideInLeft {
+  -webkit-animation-name: slideInLeft;
+  animation-name: slideInLeft;
+}
+
+@-webkit-keyframes slideInRight {
+  from {
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+    visibility: visible;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes slideInRight {
+  from {
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+    visibility: visible;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.slideInRight {
+  -webkit-animation-name: slideInRight;
+  animation-name: slideInRight;
+}
+
+@-webkit-keyframes slideInUp {
+  from {
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+    visibility: visible;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes slideInUp {
+  from {
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+    visibility: visible;
+  }
+
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.slideInUp {
+  -webkit-animation-name: slideInUp;
+  animation-name: slideInUp;
+}
+
+@-webkit-keyframes slideOutDown {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+  }
+}
+
+@keyframes slideOutDown {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
+  }
+}
+
+.slideOutDown {
+  -webkit-animation-name: slideOutDown;
+  animation-name: slideOutDown;
+}
+
+@-webkit-keyframes slideOutLeft {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(-100%, 0, 0);
+    transform: translate3d(-100%, 0, 0);
+  }
+}
+
+@keyframes slideOutLeft {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(-100%, 0, 0);
+    transform: translate3d(-100%, 0, 0);
+  }
+}
+
+.slideOutLeft {
+  -webkit-animation-name: slideOutLeft;
+  animation-name: slideOutLeft;
+}
+
+@-webkit-keyframes slideOutRight {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+}
+
+@keyframes slideOutRight {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+}
+
+.slideOutRight {
+  -webkit-animation-name: slideOutRight;
+  animation-name: slideOutRight;
+}
+
+@-webkit-keyframes slideOutUp {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+@keyframes slideOutUp {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+.slideOutUp {
+  -webkit-animation-name: slideOutUp;
+  animation-name: slideOutUp;
+}
+
+.animated {
+  -webkit-animation-duration: 1s;
+  animation-duration: 1s;
+  -webkit-animation-fill-mode: both;
+  animation-fill-mode: both;
+}
+
+.animated.infinite {
+  -webkit-animation-iteration-count: infinite;
+  animation-iteration-count: infinite;
+}
+
+.animated.delay-1s {
+  -webkit-animation-delay: 1s;
+  animation-delay: 1s;
+}
+
+.animated.delay-2s {
+  -webkit-animation-delay: 2s;
+  animation-delay: 2s;
+}
+
+.animated.delay-3s {
+  -webkit-animation-delay: 3s;
+  animation-delay: 3s;
+}
+
+.animated.delay-4s {
+  -webkit-animation-delay: 4s;
+  animation-delay: 4s;
+}
+
+.animated.delay-5s {
+  -webkit-animation-delay: 5s;
+  animation-delay: 5s;
+}
+
+.animated.fast {
+  -webkit-animation-duration: 800ms;
+  animation-duration: 800ms;
+}
+
+.animated.faster {
+  -webkit-animation-duration: 500ms;
+  animation-duration: 500ms;
+}
+
+.animated.slow {
+  -webkit-animation-duration: 2s;
+  animation-duration: 2s;
+}
+
+.animated.slower {
+  -webkit-animation-duration: 3s;
+  animation-duration: 3s;
+}
+
+@media (print), (prefers-reduced-motion: reduce) {
+  .animated {
+    -webkit-animation-duration: 1ms !important;
+    animation-duration: 1ms !important;
+    -webkit-transition-duration: 1ms !important;
+    transition-duration: 1ms !important;
+    -webkit-animation-iteration-count: 1 !important;
+    animation-iteration-count: 1 !important;
+  }
+}

node_modules/animate.css/bower.json

@@ -0,0 +1,5 @@
+{
+  "name": "animate.css",
+  "main": "./animate.css",
+  "ignore": [".*", "*.yml", "Gemfile", "Gemfile.lock", "*.md"]
+}

node_modules/animate.css/gulpfile.js

@@ -0,0 +1,107 @@
+// Utilities
+var autoprefixer = require('autoprefixer');
+var cssnano = require('cssnano');
+var fs = require('fs');
+
+// Gulp
+var gulp = require('gulp');
+
+// Gulp plugins
+var concat = require('gulp-concat');
+var gutil = require('gulp-util');
+var header = require('gulp-header');
+var postcss = require('gulp-postcss');
+var rename = require('gulp-rename');
+var runSequence = require('run-sequence');
+
+// Misc/global vars
+var pkg = JSON.parse(fs.readFileSync('package.json'));
+var activatedAnimations = activateAnimations();
+
+// Task options
+var opts = {
+  destPath: './',
+  concatName: 'animate.css',
+
+  autoprefixer: {
+    browsers: ['> 1%', 'last 2 versions', 'Firefox ESR'],
+    cascade: false,
+  },
+
+  minRename: {
+    suffix: '.min',
+  },
+
+  banner: [
+    '@charset "UTF-8";\n',
+    '/*!',
+    ' * <%= name %> -<%= homepage %>',
+    ' * Version - <%= version %>',
+    ' * Licensed under the MIT license - http://opensource.org/licenses/MIT',
+    ' *',
+    ' * Copyright (c) <%= new Date().getFullYear() %> <%= author.name %>',
+    ' */\n\n',
+  ].join('\n'),
+};
+
+// ----------------------------
+// Gulp task definitions
+// ----------------------------
+
+gulp.task('createCSS', function() {
+  return gulp
+    .src(activatedAnimations)
+    .pipe(concat(opts.concatName))
+    .pipe(postcss([autoprefixer(opts.autoprefixer)]))
+    .pipe(gulp.dest(opts.destPath))
+    .pipe(postcss([cssnano({reduceIdents: {keyframes: false}})]))
+    .pipe(rename(opts.minRename))
+    .pipe(gulp.dest(opts.destPath));
+});
+
+gulp.task('addHeader', function() {
+  return gulp
+    .src('*.css')
+    .pipe(header(opts.banner, pkg))
+    .pipe(gulp.dest(opts.destPath));
+});
+
+gulp.task('default', gulp.series('createCSS', 'addHeader'));
+
+// ----------------------------
+// Helpers/functions
+// ----------------------------
+
+// Read the config file and return an array of the animations to be activated
+function activateAnimations() {
+  var categories = JSON.parse(fs.readFileSync('animate-config.json')),
+    category,
+    files,
+    file,
+    target = [],
+    count = 0;
+
+  for (category in categories) {
+    if (categories.hasOwnProperty(category)) {
+      files = categories[category];
+
+      for (file in files) {
+        if (files[file]) {
+          // marked as true
+          target.push('source/' + category + '/' + file + '.css');
+          count += 1;
+        }
+      }
+    }
+  }
+  // prepend base CSS
+  target.push('source/_base.css');
+
+  if (!count) {
+    gutil.log('No animations activated.');
+  } else {
+    gutil.log(count + (count > 1 ? ' animations' : ' animation') + ' activated.');
+  }
+
+  return target;
+}

node_modules/animate.css/package.json

@@ -0,0 +1,90 @@
+{
+  "_args": [
+    [
+      "animate.css@3.7.2",
+      "D:\\work\\root\\user_uniapp"
+    ]
+  ],
+  "_from": "animate.css@3.7.2",
+  "_id": "animate.css@3.7.2",
+  "_inBundle": false,
+  "_integrity": "sha512-0bE8zYo7C0KvgOYrSVfrzkbYk6IOTVPNqkiHg2cbyF4Pq/PXzilz4BRWA3hwEUBoMp5VBgrC29lQIZyhRWdBTw==",
+  "_location": "/animate.css",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "version",
+    "registry": true,
+    "raw": "animate.css@3.7.2",
+    "name": "animate.css",
+    "escapedName": "animate.css",
+    "rawSpec": "3.7.2",
+    "saveSpec": null,
+    "fetchSpec": "3.7.2"
+  },
+  "_requiredBy": [
+    "/"
+  ],
+  "_resolved": "https://registry.npmmirror.com/animate.css/-/animate.css-3.7.2.tgz",
+  "_spec": "3.7.2",
+  "_where": "D:\\work\\root\\user_uniapp",
+  "author": {
+    "name": "Daniel Eden"
+  },
+  "bugs": {
+    "url": "https://github.com/daneden/animate.css/issues"
+  },
+  "description": "_Just-add-water CSS animation_",
+  "devDependencies": {
+    "autoprefixer": "^9.0.1",
+    "cssnano": "^4.0.3",
+    "eslint": "^5.2.0",
+    "gulp": "^4.0.0",
+    "gulp-concat": "^2.6.1",
+    "gulp-header": "^2.0.1",
+    "gulp-postcss": "^8.0.0",
+    "gulp-rename": "^1.2.2",
+    "gulp-util": "^3.0.8",
+    "husky": "^1.2.0",
+    "lint-staged": "^8.1.0",
+    "prettier": "^1.10.2",
+    "run-sequence": "^2.2.1"
+  },
+  "homepage": "https://daneden.github.io/animate.css/",
+  "jspm": {
+    "main": "animate.css!",
+    "format": "global",
+    "directories": {
+      "lib": "./"
+    }
+  },
+  "license": "MIT",
+  "lint-staged": {
+    "*.{js,json,md,css}": [
+      "prettier --write",
+      "git add"
+    ]
+  },
+  "main": "animate.css",
+  "name": "animate.css",
+  "prettier": {
+    "bracketSpacing": false,
+    "proseWrap": "never",
+    "singleQuote": true,
+    "trailingComma": "all"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/daneden/animate.css.git"
+  },
+  "scripts": {
+    "gulp": "./node_modules/gulp/bin/gulp.js",
+    "precommit": "lint-staged",
+    "prettier": "prettier --write \"**/*.{js,json,md,css}\"",
+    "start": "gulp"
+  },
+  "spm": {
+    "main": "./animate.css"
+  },
+  "style": "./animate.css",
+  "version": "3.7.2"
+}

node_modules/animate.css/source/_base.css

@@ -0,0 +1,52 @@
+.animated {
+  animation-duration: 1s;
+  animation-fill-mode: both;
+}
+
+.animated.infinite {
+  animation-iteration-count: infinite;
+}
+
+.animated.delay-1s {
+  animation-delay: 1s;
+}
+
+.animated.delay-2s {
+  animation-delay: 2s;
+}
+
+.animated.delay-3s {
+  animation-delay: 3s;
+}
+
+.animated.delay-4s {
+  animation-delay: 4s;
+}
+
+.animated.delay-5s {
+  animation-delay: 5s;
+}
+
+.animated.fast {
+  animation-duration: 800ms;
+}
+
+.animated.faster {
+  animation-duration: 500ms;
+}
+
+.animated.slow {
+  animation-duration: 2s;
+}
+
+.animated.slower {
+  animation-duration: 3s;
+}
+
+@media (print), (prefers-reduced-motion: reduce) {
+  .animated {
+    animation-duration: 1ms !important;
+    transition-duration: 1ms !important;
+    animation-iteration-count: 1 !important; 
+  }
+}

node_modules/animate.css/source/_vars.css

@@ -0,0 +1,4 @@
+.animated {
+  --animate-duration: 1s;
+  --animate-delay: 1s;
+}

node_modules/animate.css/source/attention_seekers/bounce.css

@@ -0,0 +1,30 @@
+@keyframes bounce {
+  from,
+  20%,
+  53%,
+  80%,
+  to {
+    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+    transform: translate3d(0, 0, 0);
+  }
+
+  40%,
+  43% {
+    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+    transform: translate3d(0, -30px, 0);
+  }
+
+  70% {
+    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+    transform: translate3d(0, -15px, 0);
+  }
+
+  90% {
+    transform: translate3d(0, -4px, 0);
+  }
+}
+
+.bounce {
+  animation-name: bounce;
+  transform-origin: center bottom;
+}

node_modules/animate.css/source/attention_seekers/flash.css

@@ -0,0 +1,16 @@
+@keyframes flash {
+  from,
+  50%,
+  to {
+    opacity: 1;
+  }
+
+  25%,
+  75% {
+    opacity: 0;
+  }
+}
+
+.flash {
+  animation-name: flash;
+}

node_modules/animate.css/source/attention_seekers/headShake.css

@@ -0,0 +1,30 @@
+@keyframes headShake {
+  0% {
+    transform: translateX(0);
+  }
+
+  6.5% {
+    transform: translateX(-6px) rotateY(-9deg);
+  }
+
+  18.5% {
+    transform: translateX(5px) rotateY(7deg);
+  }
+
+  31.5% {
+    transform: translateX(-3px) rotateY(-5deg);
+  }
+
+  43.5% {
+    transform: translateX(2px) rotateY(3deg);
+  }
+
+  50% {
+    transform: translateX(0);
+  }
+}
+
+.headShake {
+  animation-timing-function: ease-in-out;
+  animation-name: headShake;
+}

node_modules/animate.css/source/attention_seekers/heartBeat.css

@@ -0,0 +1,27 @@
+@keyframes heartBeat {
+  0% {
+    transform: scale(1);
+  }
+
+  14% {
+    transform: scale(1.3);
+  }
+
+  28% {
+    transform: scale(1);
+  }
+
+  42% {
+    transform: scale(1.3);
+  }
+
+  70% {
+    transform: scale(1);
+  }
+}
+
+.heartBeat {
+  animation-name: heartBeat;
+  animation-duration: 1.3s;
+  animation-timing-function: ease-in-out;
+}

node_modules/animate.css/source/attention_seekers/jello.css

@@ -0,0 +1,40 @@
+@keyframes jello {
+  from,
+  11.1%,
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+
+  22.2% {
+    transform: skewX(-12.5deg) skewY(-12.5deg);
+  }
+
+  33.3% {
+    transform: skewX(6.25deg) skewY(6.25deg);
+  }
+
+  44.4% {
+    transform: skewX(-3.125deg) skewY(-3.125deg);
+  }
+
+  55.5% {
+    transform: skewX(1.5625deg) skewY(1.5625deg);
+  }
+
+  66.6% {
+    transform: skewX(-0.78125deg) skewY(-0.78125deg);
+  }
+
+  77.7% {
+    transform: skewX(0.390625deg) skewY(0.390625deg);
+  }
+
+  88.8% {
+    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
+  }
+}
+
+.jello {
+  animation-name: jello;
+  transform-origin: center;
+}

node_modules/animate.css/source/attention_seekers/pulse.css

@@ -0,0 +1,19 @@
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+
+@keyframes pulse {
+  from {
+    transform: scale3d(1, 1, 1);
+  }
+
+  50% {
+    transform: scale3d(1.05, 1.05, 1.05);
+  }
+
+  to {
+    transform: scale3d(1, 1, 1);
+  }
+}
+
+.pulse {
+  animation-name: pulse;
+}

node_modules/animate.css/source/attention_seekers/rubberBand.css

@@ -0,0 +1,33 @@
+@keyframes rubberBand {
+  from {
+    transform: scale3d(1, 1, 1);
+  }
+
+  30% {
+    transform: scale3d(1.25, 0.75, 1);
+  }
+
+  40% {
+    transform: scale3d(0.75, 1.25, 1);
+  }
+
+  50% {
+    transform: scale3d(1.15, 0.85, 1);
+  }
+
+  65% {
+    transform: scale3d(0.95, 1.05, 1);
+  }
+
+  75% {
+    transform: scale3d(1.05, 0.95, 1);
+  }
+
+  to {
+    transform: scale3d(1, 1, 1);
+  }
+}
+
+.rubberBand {
+  animation-name: rubberBand;
+}

node_modules/animate.css/source/attention_seekers/shake.css

@@ -0,0 +1,25 @@
+@keyframes shake {
+  from,
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+
+  10%,
+  30%,
+  50%,
+  70%,
+  90% {
+    transform: translate3d(-10px, 0, 0);
+  }
+
+  20%,
+  40%,
+  60%,
+  80% {
+    transform: translate3d(10px, 0, 0);
+  }
+}
+
+.shake {
+  animation-name: shake;
+}

node_modules/animate.css/source/attention_seekers/swing.css

@@ -0,0 +1,26 @@
+@keyframes swing {
+  20% {
+    transform: rotate3d(0, 0, 1, 15deg);
+  }
+
+  40% {
+    transform: rotate3d(0, 0, 1, -10deg);
+  }
+
+  60% {
+    transform: rotate3d(0, 0, 1, 5deg);
+  }
+
+  80% {
+    transform: rotate3d(0, 0, 1, -5deg);
+  }
+
+  to {
+    transform: rotate3d(0, 0, 1, 0deg);
+  }
+}
+
+.swing {
+  transform-origin: top center;
+  animation-name: swing;
+}

node_modules/animate.css/source/attention_seekers/tada.css

@@ -0,0 +1,31 @@
+@keyframes tada {
+  from {
+    transform: scale3d(1, 1, 1);
+  }
+
+  10%,
+  20% {
+    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
+  }
+
+  30%,
+  50%,
+  70%,
+  90% {
+    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
+  }
+
+  40%,
+  60%,
+  80% {
+    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
+  }
+
+  to {
+    transform: scale3d(1, 1, 1);
+  }
+}
+
+.tada {
+  animation-name: tada;
+}

node_modules/animate.css/source/attention_seekers/wobble.css

@@ -0,0 +1,35 @@
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+
+@keyframes wobble {
+  from {
+    transform: translate3d(0, 0, 0);
+  }
+
+  15% {
+    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
+  }
+
+  30% {
+    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
+  }
+
+  45% {
+    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
+  }
+
+  60% {
+    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
+  }
+
+  75% {
+    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
+  }
+
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.wobble {
+  animation-name: wobble;
+}

node_modules/animate.css/source/bouncing_entrances/bounceIn.css

@@ -0,0 +1,42 @@
+@keyframes bounceIn {
+  from,
+  20%,
+  40%,
+  60%,
+  80%,
+  to {
+    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+
+  0% {
+    opacity: 0;
+    transform: scale3d(0.3, 0.3, 0.3);
+  }
+
+  20% {
+    transform: scale3d(1.1, 1.1, 1.1);
+  }
+
+  40% {
+    transform: scale3d(0.9, 0.9, 0.9);
+  }
+
+  60% {
+    opacity: 1;
+    transform: scale3d(1.03, 1.03, 1.03);
+  }
+
+  80% {
+    transform: scale3d(0.97, 0.97, 0.97);
+  }
+
+  to {
+    opacity: 1;
+    transform: scale3d(1, 1, 1);
+  }
+}
+
+.bounceIn {
+  animation-duration: 0.75s;
+  animation-name: bounceIn;
+}

node_modules/animate.css/source/bouncing_entrances/bounceInDown.css

@@ -0,0 +1,35 @@
+@keyframes bounceInDown {
+  from,
+  60%,
+  75%,
+  90%,
+  to {
+    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+
+  0% {
+    opacity: 0;
+    transform: translate3d(0, -3000px, 0);
+  }
+
+  60% {
+    opacity: 1;
+    transform: translate3d(0, 25px, 0);
+  }
+
+  75% {
+    transform: translate3d(0, -10px, 0);
+  }
+
+  90% {
+    transform: translate3d(0, 5px, 0);
+  }
+
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.bounceInDown {
+  animation-name: bounceInDown;
+}

node_modules/animate.css/source/bouncing_entrances/bounceInLeft.css

@@ -0,0 +1,35 @@
+@keyframes bounceInLeft {
+  from,
+  60%,
+  75%,
+  90%,
+  to {
+    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+
+  0% {
+    opacity: 0;
+    transform: translate3d(-3000px, 0, 0);
+  }
+
+  60% {
+    opacity: 1;
+    transform: translate3d(25px, 0, 0);
+  }
+
+  75% {
+    transform: translate3d(-10px, 0, 0);
+  }
+
+  90% {
+    transform: translate3d(5px, 0, 0);
+  }
+
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.bounceInLeft {
+  animation-name: bounceInLeft;
+}

node_modules/animate.css/source/bouncing_entrances/bounceInRight.css

@@ -0,0 +1,35 @@
+@keyframes bounceInRight {
+  from,
+  60%,
+  75%,
+  90%,
+  to {
+    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+
+  from {
+    opacity: 0;
+    transform: translate3d(3000px, 0, 0);
+  }
+
+  60% {
+    opacity: 1;
+    transform: translate3d(-25px, 0, 0);
+  }
+
+  75% {
+    transform: translate3d(10px, 0, 0);
+  }
+
+  90% {
+    transform: translate3d(-5px, 0, 0);
+  }
+
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.bounceInRight {
+  animation-name: bounceInRight;
+}

node_modules/animate.css/source/bouncing_entrances/bounceInUp.css

@@ -0,0 +1,35 @@
+@keyframes bounceInUp {
+  from,
+  60%,
+  75%,
+  90%,
+  to {
+    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+
+  from {
+    opacity: 0;
+    transform: translate3d(0, 3000px, 0);
+  }
+
+  60% {
+    opacity: 1;
+    transform: translate3d(0, -20px, 0);
+  }
+
+  75% {
+    transform: translate3d(0, 10px, 0);
+  }
+
+  90% {
+    transform: translate3d(0, -5px, 0);
+  }
+
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.bounceInUp {
+  animation-name: bounceInUp;
+}

node_modules/animate.css/source/bouncing_exits/bounceOut.css

@@ -0,0 +1,21 @@
+@keyframes bounceOut {
+  20% {
+    transform: scale3d(0.9, 0.9, 0.9);
+  }
+
+  50%,
+  55% {
+    opacity: 1;
+    transform: scale3d(1.1, 1.1, 1.1);
+  }
+
+  to {
+    opacity: 0;
+    transform: scale3d(0.3, 0.3, 0.3);
+  }
+}
+
+.bounceOut {
+  animation-duration: 0.75s;
+  animation-name: bounceOut;
+}

node_modules/animate.css/source/bouncing_exits/bounceOutDown.css

@@ -0,0 +1,20 @@
+@keyframes bounceOutDown {
+  20% {
+    transform: translate3d(0, 10px, 0);
+  }
+
+  40%,
+  45% {
+    opacity: 1;
+    transform: translate3d(0, -20px, 0);
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(0, 2000px, 0);
+  }
+}
+
+.bounceOutDown {
+  animation-name: bounceOutDown;
+}

node_modules/animate.css/source/bouncing_exits/bounceOutLeft.css

@@ -0,0 +1,15 @@
+@keyframes bounceOutLeft {
+  20% {
+    opacity: 1;
+    transform: translate3d(20px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(-2000px, 0, 0);
+  }
+}
+
+.bounceOutLeft {
+  animation-name: bounceOutLeft;
+}

node_modules/animate.css/source/bouncing_exits/bounceOutRight.css

@@ -0,0 +1,15 @@
+@keyframes bounceOutRight {
+  20% {
+    opacity: 1;
+    transform: translate3d(-20px, 0, 0);
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(2000px, 0, 0);
+  }
+}
+
+.bounceOutRight {
+  animation-name: bounceOutRight;
+}

node_modules/animate.css/source/bouncing_exits/bounceOutUp.css

@@ -0,0 +1,20 @@
+@keyframes bounceOutUp {
+  20% {
+    transform: translate3d(0, -10px, 0);
+  }
+
+  40%,
+  45% {
+    opacity: 1;
+    transform: translate3d(0, 20px, 0);
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(0, -2000px, 0);
+  }
+}
+
+.bounceOutUp {
+  animation-name: bounceOutUp;
+}

node_modules/animate.css/source/fading_entrances/fadeIn.css

@@ -0,0 +1,13 @@
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+.fadeIn {
+  animation-name: fadeIn;
+}

node_modules/animate.css/source/fading_entrances/fadeInDown.css

@@ -0,0 +1,15 @@
+@keyframes fadeInDown {
+  from {
+    opacity: 0;
+    transform: translate3d(0, -100%, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInDown {
+  animation-name: fadeInDown;
+}

node_modules/animate.css/source/fading_entrances/fadeInDownBig.css

@@ -0,0 +1,15 @@
+@keyframes fadeInDownBig {
+  from {
+    opacity: 0;
+    transform: translate3d(0, -2000px, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInDownBig {
+  animation-name: fadeInDownBig;
+}

node_modules/animate.css/source/fading_entrances/fadeInLeft.css

@@ -0,0 +1,15 @@
+@keyframes fadeInLeft {
+  from {
+    opacity: 0;
+    transform: translate3d(-100%, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInLeft {
+  animation-name: fadeInLeft;
+}

node_modules/animate.css/source/fading_entrances/fadeInLeftBig.css

@@ -0,0 +1,15 @@
+@keyframes fadeInLeftBig {
+  from {
+    opacity: 0;
+    transform: translate3d(-2000px, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInLeftBig {
+  animation-name: fadeInLeftBig;
+}

node_modules/animate.css/source/fading_entrances/fadeInRight.css

@@ -0,0 +1,15 @@
+@keyframes fadeInRight {
+  from {
+    opacity: 0;
+    transform: translate3d(100%, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInRight {
+  animation-name: fadeInRight;
+}

node_modules/animate.css/source/fading_entrances/fadeInRightBig.css

@@ -0,0 +1,15 @@
+@keyframes fadeInRightBig {
+  from {
+    opacity: 0;
+    transform: translate3d(2000px, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInRightBig {
+  animation-name: fadeInRightBig;
+}

node_modules/animate.css/source/fading_entrances/fadeInUp.css

@@ -0,0 +1,15 @@
+@keyframes fadeInUp {
+  from {
+    opacity: 0;
+    transform: translate3d(0, 100%, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInUp {
+  animation-name: fadeInUp;
+}

node_modules/animate.css/source/fading_entrances/fadeInUpBig.css

@@ -0,0 +1,15 @@
+@keyframes fadeInUpBig {
+  from {
+    opacity: 0;
+    transform: translate3d(0, 2000px, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.fadeInUpBig {
+  animation-name: fadeInUpBig;
+}

node_modules/animate.css/source/fading_exits/fadeOut.css

@@ -0,0 +1,13 @@
+@keyframes fadeOut {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+.fadeOut {
+  animation-name: fadeOut;
+}

node_modules/animate.css/source/fading_exits/fadeOutDown.css

@@ -0,0 +1,14 @@
+@keyframes fadeOutDown {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(0, 100%, 0);
+  }
+}
+
+.fadeOutDown {
+  animation-name: fadeOutDown;
+}

node_modules/animate.css/source/fading_exits/fadeOutDownBig.css

@@ -0,0 +1,14 @@
+@keyframes fadeOutDownBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(0, 2000px, 0);
+  }
+}
+
+.fadeOutDownBig {
+  animation-name: fadeOutDownBig;
+}

node_modules/animate.css/source/fading_exits/fadeOutLeft.css

@@ -0,0 +1,14 @@
+@keyframes fadeOutLeft {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(-100%, 0, 0);
+  }
+}
+
+.fadeOutLeft {
+  animation-name: fadeOutLeft;
+}

node_modules/animate.css/source/fading_exits/fadeOutLeftBig.css

@@ -0,0 +1,14 @@
+@keyframes fadeOutLeftBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(-2000px, 0, 0);
+  }
+}
+
+.fadeOutLeftBig {
+  animation-name: fadeOutLeftBig;
+}

node_modules/animate.css/source/fading_exits/fadeOutRight.css

@@ -0,0 +1,14 @@
+@keyframes fadeOutRight {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(100%, 0, 0);
+  }
+}
+
+.fadeOutRight {
+  animation-name: fadeOutRight;
+}

node_modules/animate.css/source/fading_exits/fadeOutRightBig.css

@@ -0,0 +1,14 @@
+@keyframes fadeOutRightBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(2000px, 0, 0);
+  }
+}
+
+.fadeOutRightBig {
+  animation-name: fadeOutRightBig;
+}

node_modules/animate.css/source/fading_exits/fadeOutUp.css

@@ -0,0 +1,14 @@
+@keyframes fadeOutUp {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+.fadeOutUp {
+  animation-name: fadeOutUp;
+}

node_modules/animate.css/source/fading_exits/fadeOutUpBig.css

@@ -0,0 +1,14 @@
+@keyframes fadeOutUpBig {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(0, -2000px, 0);
+  }
+}
+
+.fadeOutUpBig {
+  animation-name: fadeOutUpBig;
+}

node_modules/animate.css/source/flippers/flip.css

@@ -0,0 +1,34 @@
+@keyframes flip {
+  from {
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
+    animation-timing-function: ease-out;
+  }
+
+  40% {
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -190deg);
+    animation-timing-function: ease-out;
+  }
+
+  50% {
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -170deg);
+    animation-timing-function: ease-in;
+  }
+
+  80% {
+    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, 0deg);
+    animation-timing-function: ease-in;
+  }
+
+  to {
+    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
+    animation-timing-function: ease-in;
+  }
+}
+
+.animated.flip {
+  backface-visibility: visible;
+  animation-name: flip;
+}

node_modules/animate.css/source/flippers/flipInX.css

@@ -0,0 +1,30 @@
+@keyframes flipInX {
+  from {
+    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    animation-timing-function: ease-in;
+    opacity: 0;
+  }
+
+  40% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    animation-timing-function: ease-in;
+  }
+
+  60% {
+    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+    opacity: 1;
+  }
+
+  80% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
+  }
+
+  to {
+    transform: perspective(400px);
+  }
+}
+
+.flipInX {
+  backface-visibility: visible !important;
+  animation-name: flipInX;
+}

node_modules/animate.css/source/flippers/flipInY.css

@@ -0,0 +1,30 @@
+@keyframes flipInY {
+  from {
+    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    animation-timing-function: ease-in;
+    opacity: 0;
+  }
+
+  40% {
+    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+    animation-timing-function: ease-in;
+  }
+
+  60% {
+    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+    opacity: 1;
+  }
+
+  80% {
+    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
+  }
+
+  to {
+    transform: perspective(400px);
+  }
+}
+
+.flipInY {
+  backface-visibility: visible !important;
+  animation-name: flipInY;
+}

node_modules/animate.css/source/flippers/flipOutX.css

@@ -0,0 +1,21 @@
+@keyframes flipOutX {
+  from {
+    transform: perspective(400px);
+  }
+
+  30% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    opacity: 1;
+  }
+
+  to {
+    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    opacity: 0;
+  }
+}
+
+.flipOutX {
+  animation-duration: 0.75s;
+  animation-name: flipOutX;
+  backface-visibility: visible !important;
+}