2 nedēļas atpakaļ · bb66370356
--- a/favicon.ico
+++ b/favicon.ico
--- a/index.html
+++ b/index.html
@@ -0,0 +1,253 @@
 
				+<!DOCTYPE html>

			
 
				+<html lang="en">

			
 
				+<head>

			
 
				+    <meta charset="UTF-8">

			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

			
 
				+    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">

			
 
				+    <meta name="apple-mobile-web-app-status-bar-style" content="black">

			
 
				+    <meta name="apple-mobile-web-app-title" content="智慧城科技">

			
 
				+    <title>智慧城科技</title>

			
 
				+    <link rel="stylesheet" href="./static/css/animate.css"/>

			
 
				+    <link rel="stylesheet" href="./static/css/main.css"/>

			
 
				+    <link rel="icon" href="favicon.ico" mce_href="favicon.ico" type=”image/x-icon”>

			
 
				+</head>

			
 
				+<body>

			
 
				+<div class="header">

			
 
				+    <div class="container">

			
 
				+        <div class="collapse r">

			
 
				+            <a class="touch" href="javascript:;"></a>

			
 
				+            <ul class="nav">

			
 
				+                <li class="active"><a href="/">首页</a></li>

			
 
				+                <li><a href="#about">关于智慧城科技</a></li>

			
 
				+                <li><a href="#case">演示示例</a></li>

			
 
				+                <li><a href="#join">加盟流程</a></li>

			
 
				+                <li><a href="#cooperation">合作单位</a></li>

			
 
				+            </ul>

			
 
				+            <div class="timber" style="left: 60px;"></div>

			
 
				+        </div>

			
 
				+        <a class="logo_zhc l" href="/" title="智慧城科技"></a>

			
 
				+    </div>

			
 
				+</div>

			
 
				+<div class="main">

			
 
				+    <div class="banner">

			
 
				+        <div class="intro">

			
 
				+            <h1>点亮社区智慧 改变社区生活</h1>

			
 
				+            <div class="bottom">

			
 
				+                <p class="l">智慧城科技以技术研发为核心，以“点亮社区智慧，改变社区生活”为使命，

			
 
				+                    致力于借助互（物）联网、云计算、大数据分析等技术推动物业行业智能化改造，

			
 
				+                    提升物业服务品质，简化物业管理工作，提高企业管理效率，赋能社区，创造更便捷、更智能、更和谐的社区，进而改变社区生活。

			
 
				+                </p>

			
 
				+                <div class="r">

			
 
				+                    <img src="./static/images/qrcode-3.jpg"/>

			
 
				+                    <p>扫码关注智慧城科技</p>

			
 
				+                </div>

			
 
				+            </div>

			
 
				+        </div>

			
 
				+    </div>

			
 
				+    <a name="about"></a>

			
 
				+    <div class="floor-1">

			
 
				+        <div class="container">

			
 
				+            <div class="whole">

			
 
				+                <div class="hd">

			
 
				+                    <h1>关于智慧城科技</h1>

			
 
				+                    <p>

			
 
				+                        海南智慧城科技有限公司注册成立于2016年，为国家高新技术企业、海南省物联网产业协会副理事长单位、

			
 
				+                        海南省物业管理协会战略合作单位。 公司实力雄厚，拥有超过1300平米的自有办公环境，团队拥有多名985、

			
 
				+                        211计算机相关专业的研发工程师。公司矢志成为优秀的智慧社区整体 解决方案供应商。公司以技术研发为核心，

			
 
				+                        深耕物业行业，致力于借助智能硬件、互联网、物联网、云计算、大数据分析、人工智能等技术推动

			
 
				+                        物业行业的智能化改造，提升物业服务品质，提高企业管理效率，助力智慧社区建设。目前，公司拥有

			
 
				+                        绘管家物业综合管理云平台、绘服务居民 在线服务平台、绘享云大数据分析平台、智能停车场、智能门禁、

			
 
				+                        智能监控、智能充电桩、远程抄表、机械环保作业设备、地勤指挥中心、物业 综合配套等全方位的智慧物业

			
 
				+                        和智慧社区解决方案及服务体系。以科技赋能物业企业，助力物业企业转型升级是海南智慧城科技的长远使命。

			
 
				+                        我们相信，为物业企业和社区插上科技的翅膀，定能长远翱翔！

			
 
				+                    </p>

			
 
				+                </div>

			
 
				+                <div class="bd cf mt50">

			
 
				+                    <ul class="about-r">

			
 
				+                        <li>

			
 
				+                            <i class="icon-about-1"></i>

			
 
				+                            <h2>跨区域管理</h2>

			
 
				+                            <p>支持集团型物业公司跨区域统一管理。可在线管理全国各地的分公司，物业项目。通过数据权限的方式将分公司、分公司在管项目分配给对应区域的人员进行管理。

			
 
				+                                同时，整个公司的数据都可以汇总到系统，达到集团跨区域统一管理的目的。</p>

			
 
				+                        </li>

			
 
				+                        <li>

			
 
				+                            <i class="icon-about-2"></i>

			
 
				+                            <h2>数据安全</h2>

			
 
				+                            <p>采用了国际标准的SSL数据传输加密技术，数据库使用双主热备架构，使用内外网隔离的云服务器，确保了用户数据传输、存储的永久可靠安全。</p>

			
 
				+                        </li>

			
 
				+                        <li>

			
 
				+                            <i class="icon-about-3"></i>

			
 
				+                            <h2>资金安全</h2>

			
 
				+                            <p>平台自身不设立资金池，不做资金归集。物业企业直接与第三方支付机构签订资金结算协议，所有在线缴费资金均直接进入物业企业的对公账户 ，

			
 
				+                                彻底防范资金漏洞，保障物业企业资金安全。</p>

			
 
				+                        </li>

			
 
				+                    </ul>

			
 
				+                    <img src="./static/images/iphone.png" class="about-l" id="about_l"/>

			
 
				+                </div>

			
 
				+            </div>

			
 
				+        </div>

			
 
				+    </div>

			
 
				+    <a name="case"></a>

			
 
				+    <div class="floor-2">

			
 
				+        <div class="container">

			
 
				+            <div class="whole">

			
 
				+                <div class="hd">

			
 
				+                    <h1 class="white">案例展示</h1>

			
 
				+                </div>

			
 
				+                <div class="bd">

			
 
				+                    <div class="zs" id="zs">

			
 
				+                        <div class="item">

			
 
				+                            <div class="qrcode" id="qrcode_1">

			
 
				+                                <img src="./static/images/qrcode-1.png"/>

			
 
				+                                <h3>公众号示例</h3>

			
 
				+                                <p><i class="icon-er"></i>微信扫一扫</p>

			
 
				+                            </div>

			
 
				+                        </div>

			
 
				+                        <div class="item">

			
 
				+                            <div class="qrcode" id="qrcode_2">

			
 
				+                                <img src="./static/images/qrcode-2.jpg"/>

			
 
				+                                <h3>小程序示例</h3>

			
 
				+                                <p><i class="icon-er"></i>微信扫一扫</p>

			
 
				+                            </div>

			
 
				+                        </div>

			
 
				+                    </div>

			
 
				+                </div>

			
 
				+            </div>

			
 
				+        </div>

			
 
				+    </div>

			
 
				+    <div class="floor-3">

			
 
				+        <div class="container">

			
 
				+            <div class="whole">

			
 
				+                <div class="hd">

			
 
				+                    <h1>物业管理平台</h1>

			
 
				+                </div>

			
 
				+                <div class="bd relative">

			
 
				+                    <ul class="pt">

			
 
				+                        <li>

			
 
				+                            <i class="icon-pt-1"></i>

			
 
				+                            <h2>客服系统 </h2>

			
 
				+                            <p>客户服务信息化管理，留存服务痕迹，提升服务品质。</p>

			
 
				+                        </li>

			
 
				+                        <li>

			
 
				+                            <i class="icon-pt-2"></i>

			
 
				+                            <h2>收费系统 </h2>

			
 
				+                            <p>简单易上手的一站式收银台，收费数据精细化管理，报表自动汇总。</p>

			
 
				+                        </li>

			
 
				+                        <li>

			
 
				+                            <i class="icon-pt-3"></i>

			
 
				+                            <h2>档案系统</h2>

			
 
				+                            <p>房屋、住户、车辆、车位、水电表、设施设备永久存储，快速查阅和维护。</p>

			
 
				+                        </li>

			
 
				+                        <li>

			
 
				+                            <i class="icon-pt-4"></i>

			
 
				+                            <h2>数据大屏</h2>

			
 
				+                            <p>数据汇总展示，经营情况一目了然，助力数字化管理。</p>

			
 
				+                        </li>

			
 
				+                    </ul>

			
 
				+                    <div class="pt-img" id="pt_img">

			
 
				+                        <img src="./static/images/pt-img.png"/>

			
 
				+                    </div>

			
 
				+                </div>

			
 
				+            </div>

			
 
				+        </div>

			
 
				+    </div>

			
 
				+    <a name="join"></a>

			
 
				+    <div class="floor-4">

			
 
				+        <div class="container">

			
 
				+            <div class="whole">

			
 
				+                <div class="hd">

			
 
				+                    <h1>加盟流程</h1>

			
 
				+                </div>

			
 
				+                <div class="bd">

			
 
				+                    <div class="jm">

			
 
				+                        <a href="javascript:;" class="l">

			
 
				+                            <i class="icon-step-1"></i>

			
 
				+                            <div class="txt">

			
 
				+                                <h2>电话咨询 </h2>

			
 
				+                                <p>致电咨询加盟事宜</p>

			
 
				+                            </div>

			
 
				+                        </a>

			
 
				+                        <a href="javascript:;" class="r">

			
 
				+                            <i class="icon-step-2"></i>

			
 
				+                            <div class="txt">

			
 
				+                                <h2>资料提交</h2>

			
 
				+                                <p>提交企业基础资料供审核</p>

			
 
				+                            </div>

			
 
				+                        </a>

			
 
				+                    </div>

			
 
				+                    <div class="jm">

			
 
				+                        <a href="javascript:;" class="l">

			
 
				+                            <i class="icon-step-3"></i>

			
 
				+                            <div class="txt">

			
 
				+                                <h2>开始进化 </h2>

			
 
				+                            </div>

			
 
				+                        </a>

			
 
				+                        <a href="javascript:;" class="r">

			
 
				+                            <i class="icon-step-4"></i>

			
 
				+                            <div class="txt">

			
 
				+                                <h2>开通账号、培训</h2>

			
 
				+                                <p>平台方为物业客户开通账号平台方对接信息员培训</p>

			
 
				+                            </div>

			
 
				+                        </a>

			
 
				+                    </div>

			
 
				+                </div>

			
 
				+            </div>

			
 
				+        </div>

			
 
				+    </div>

			
 
				+    <a name="cooperation"></a>

			
 
				+    <div class="floor-1 mb55">

			
 
				+        <div class="container">

			
 
				+            <div class="whole">

			
 
				+                <div class="hd">

			
 
				+                    <h1>合作单位</h1>

			
 
				+                </div>

			
 
				+                <div class="bd">

			
 
				+                    <ul class="co">

			
 
				+                        <li><a href="#"><img src="./static/images/co-1.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-2.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-3.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-4.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-5.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-6.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-7.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-8.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-9.png"/></a></li>

			
 
				+                        <li><a href="#"><img src="./static/images/co-10.png"/></a></li>

			
 
				+                    </ul>

			
 
				+                </div>

			
 
				+            </div>

			
 
				+        </div>

			
 
				+    </div>

			
 
				+</div>

			
 
				+<div class="footer">

			
 
				+    <div class="t">

			
 
				+        <div class="container">

			
 
				+            <div class="l">

			
 
				+                <h3>联系我们</h3>

			
 
				+                <p><i class="icon-in-1"></i>联系地址</p>

			
 
				+                <p>总部：海口市美兰区和平大道35号蓝岛康城2号楼2层</p>

			
 
				+            </div>

			
 
				+            <div class="l">

			
 
				+                <p><i class="icon-in-2"></i>电话：<a href="tel:400-829-0600">400-600-7709</a></p>

			
 
				+                <p><i class="icon-in-3"></i>Email: <em class="blue">wg@wisdomcity.com.cn</em></p>

			
 
				+                <p><i class="icon-in-4"></i>网址：<a class="blue" href="http://www.wisdomcity.com.cn">www.wisdomcity.com.cn</a></p>

			
 
				+            </div>

			
 
				+            <div class="r qrcode">

			
 
				+                <img src="./static/images/qrcode-3.jpg"/>

			
 
				+                <p>扫一扫关注我们</p>

			
 
				+            </div>

			
 
				+        </div>

			
 
				+    </div>

			
 
				+    <div class="b">

			
 
				+        <div class="container">

			
 
				+            <p class="l mt13">2021 © Copyrights <em  class="blue">海南智慧城科技有限公司</em>

			
 
				+                <a href="http://www.beian.miit.gov.cn/" target="_blank">琼ICP备18001846号-1</a>

			
 
				+            </p>

			
 
				+            <img class="r" src="./static/images/logo_zhc.png" alt="智慧城科技"/>

			
 
				+        </div>

			
 
				+    </div>

			
 
				+</div>

			
 
				+<script src="./static/js/jquery-1.11.3.min.js"></script>

			
 
				+<script src="./static/js/main.js"></script>

			
 
				+</body>

			
 
				+</html>

			
--- a/privacy.html
+++ b/privacy.html
@@ -0,0 +1,43 @@
 
				+<!DOCTYPE html>
			
 
				+<!-- saved from url=(0039)http://dj.oscaches.com/DJ97Privacy.html -->
			
 
				+<html>
			
 
				+<head>
			
 
				+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
			
 
				+        
			
 
				+        <title>绘管家个人信息保护政策</title>
			
 
				+</head>
			
 
				+<body class="B_register">
			
 
				+        <div class="W_nologin">
			
 
				+            <div class="W_reg_header">
			
 
				+                <div class="W_nologin_logo"><a href="http://www.huiguanjia.cn/"></a></div>
			
 
				+            </div>
			
 
				+            <div class="W_nologin_main">
			
 
				+                <div class="private_cont">
			
 
				+                    <p class="para">为切实保护绘管家用户隐私权，优化用户体验，绘管家根据现行法规及政策，制定本《个人信息保护政策》。 本《个人信息保护政策》将详细说明绘管家在获取、管理及保护用户个人信息方面的政策及措施。本《个人信息保护政策》适用于绘管家向您提供的所有服务，无论您是通过计算机设备、移动终端或其他设备获得的绘管家服务。</p>
			
 
				+                    <h3 class="para_title  W_f14 W_fb">个人信息的收集</h3>
			
 
				+                    <p class="para">您已知悉且同意，在您注册绘管家帐号或使用绘管家提供的服务时，绘管家将记录您提供的相关个人信息，如：姓名、手机号码等，上述个人信息是您获得绘管家提供服务的基础，绘管家还会收集IMEI、已安装的软件、MAC地址等以便在您使用遇到问题快速定位和解决问题。同时，基于优化用户体验之目的，绘管家会获取与提升绘管家服务有关的其他信息，例如当您签到后，我们会使用您当前的位置信息等，以便优化我们的服务。同时，为了提醒您的工作任务，我们会推送消息到提醒您，因此需要您同意接收推送消息。</p>
			
 
				+                    <h3 class="para_title  W_f14 W_fb">个人信息的管理</h3>
			
 
				+                    <p class="para">为了向您提供更好的服务或产品，绘管家会在下述情形使用您的个人信息：      					<br>1)根据相关法律法规的要求；                        <br>2)根据您的授权；                        <br>3)根据绘管家相关服务条款、应用许可使用协议的约定。                </p>
			
 
				+                    <p class="para">此外，您已知悉并同意：在现行法律法规允许的范围内，绘管家可能会将您非隐私的个人信息用于市场营销，使用方式包括但不限于：在绘管家平台中向您展示或提供广告和促销资料，向您通告或推荐绘管家的服务或产品信息，以及其他此类根据您使用绘管家服务或产品的情况所认为您可能会感兴趣的信息。其中也包括您在采取授权等某动作时选择分享的信息，例如您管辖的项目、使用绘管家的分享工具等。</p>
			
 
				+                    <p class="para">未经您本人允许，绘管家不会向任何第三方披露您的个人信息，下列情形除外：　　<br>1)绘管家已经取得您或您监护人的授权；　  <br>2)司法机关或行政机关给予法定程序要求绘管家披露的；　　<br>3)绘管家为维护自身合法权益而向用户提起诉讼或仲裁时；　　<br>4)根据您与绘管家相关服务条款、应用许可使用协议的约定；　　<br>5)法律法规规定的其他情形。</p>
			
 
				+                    
			
 
				+                    <h3 class="para_title  W_f14 W_fb">个人信息的保护</h3>
			
 
				+                    <p class="para">绘管家将尽一切合理努力保护其获得的用户个人信息。为防止用户个人信息在意外的、未经授权的情况下被非法访问、复制、修改、传送、遗失、破坏、处理或使用，绘管家已经并将继续采取以下措施保护您的个人信息：　　<br>1)以适当的方式对用户的个人信息进行加密处理；　　<br>2)在适当的位置使用密码对用户个人信息进行保护；　　<br>3)限制对用户个人信息的访问；　　<br>4)其他的合理措施 </p>
			
 
				+                    <p class="para">尽管已经采取了上述合理有效措施，并已经遵守了相关法律规定要求的标准，但绘管家仍然无法保证您的个人信息通过不安全途径进行交流时的安全性。因此，用户个人应采取积极措施保证个人信息的安全，如：定期修改帐号密码，不将自己的帐号密码等个人信息透露给他人。</p>
			
 
				+                    <p class="para">您知悉：绘管家提供的个人信息保护措施仅适用于绘管家平台，一旦您离开绘管家，浏览或使用其他网站、服务及内容资源，绘管家即没有能力及义务保护您在绘管家以外的网站提交的任何个人信息，无论您登陆或浏览上述网站是否基于绘管家的链接或引导。</p>
			
 
				+                    <h3 class="para_title  W_f14 W_fb">个人信息的访问</h3>
			
 
				+                    <p class="para">当您完成绘管家的帐号注册后，您可以查阅或修改您提交给绘管家的个人信息。一般情况下，您可随时浏览、修改自己提交的信息，但出于安全性和身份识别（如钥匙申请认证服务）的考虑，您可能无法修改注册时提供的某些初始注册信息及验证信息。</p>
			
 
				+                    <h3 class="para_title  W_f14 W_fb">个人信息的发布</h3>
			
 
				+                    <p class="para">用户不得利用绘管家或绘管家服务制作、上传、复制、发送以下内容：<br>1)反对宪法所确定的基本原则的；<br>2)危害国家安全，泄漏国家机密，颠覆国家政权，破坏国家统一的；<br>3)损害国家荣誉和利益的‘<br>4)煽动民族仇恨、民族或种族歧视，破坏民族团结的；<br>5)破坏国家宗教政策，宣扬邪教和封建迷信的；<br>6)散布谣言，扰乱社会秩序，破坏社会稳定的；<br>7)散布淫秽、色情、赌博、暴力、凶杀、恐怖或教唆犯罪的；<br>8)侮辱或者诽谤他人，侵害他人合法权益的；<br>9)还有法律、行政法规禁止的其他内容的信息。</p>
			
 
				+                    <p class="para">对于已经发布上述内容的用户，绘管家有权删除这些发布的内容。情节严重者，绘管家会向相关检查、公安等机关举报，由这些机关追究发布者的法律责任。</p>
			
 
				+                    <h3 class="para_title  W_f14 W_fb">对未成年人个人信息的特别保护</h3>
			
 
				+                    <p class="para">绘管家非常重视对未成年人个人信息的保护。若您是18周岁以下的未成年人，在使用绘管家的服务前，应确保事先取得监护人的同意，如您在绘管家上申请注册账号，绘管家将默认为您已得到前述同意。绘管家将根据国家相关法律法规及本《个人信息保护政策》的规定保护未成年人的个人信息。</p>
			
 
				+                    <h3 class="para_title  W_f14 W_fb">隐私保护政策的修改</h3>
			
 
				+                    <p class="para">绘管家有权随时修改《个人信息保护政策》的任何条款，一旦《个人信息保护政策》的内容发生变动，绘管家将会直接在绘管家网站上公布修改之后的《个人信息保护政策》，该公布行为视为绘管家已经通知您修改内容。绘管家也可通过其他适当方式向用户提示修改内容。如果您不同意绘管家对本《个人信息保护政策》相关条款所做的修改，您有权停止使用绘管家服务。如果您继续使用绘管家服务，则视为您接受绘管家对本协议相关条款所做的修改。</p>
			
 
				+                    <h3 class="para_title  W_f14 W_fb">个人信息保护政策承诺方</h3>
			
 
				+                    <p class="para">本《个人信息保护政策》由海南智慧城科技有限公司出具，海南智慧城科技有限公司将恪守承诺，保护您的隐私，监督邮件地址：service@wisdomcity.com.cn。</p>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+        </div>
			
 
				+</body>
			
 
				+</html>
			
--- a/static/css/animate.css
+++ b/static/css/animate.css
@@ -0,0 +1,1579 @@
 
				+@charset "UTF-8";
			
 
				+
			
 
				+/*!
			
 
				+ * animate.css -http://daneden.me/animate
			
 
				+ * Version - 3.5.2
			
 
				+ * Licensed under the MIT license - http://opensource.org/licenses/MIT
			
 
				+ *
			
 
				+ * Copyright (c) 2017 Daniel Eden
			
 
				+ */
			
 
				+
			
 
				+.animated {
			
 
				+  animation-duration: 1s;
			
 
				+  animation-fill-mode: both;
			
 
				+}
			
 
				+
			
 
				+.animated.infinite {
			
 
				+  animation-iteration-count: infinite;
			
 
				+}
			
 
				+
			
 
				+.animated.hinge {
			
 
				+  animation-duration: 2s;
			
 
				+}
			
 
				+
			
 
				+.animated.flipOutX,
			
 
				+.animated.flipOutY,
			
 
				+.animated.bounceIn,
			
 
				+.animated.bounceOut {
			
 
				+  animation-duration: .75s;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounce {
			
 
				+  from, 20%, 53%, 80%, to {
			
 
				+    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			
 
				+    transform: translate3d(0,0,0);
			
 
				+  }
			
 
				+
			
 
				+  40%, 43% {
			
 
				+    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			
 
				+    transform: translate3d(0, -30px, 0);
			
 
				+  }
			
 
				+
			
 
				+  70% {
			
 
				+    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			
 
				+    transform: translate3d(0, -15px, 0);
			
 
				+  }
			
 
				+
			
 
				+  90% {
			
 
				+    transform: translate3d(0,-4px,0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.bounce {
			
 
				+  animation-name: bounce;
			
 
				+  transform-origin: center bottom;
			
 
				+}
			
 
				+
			
 
				+@keyframes flash {
			
 
				+  from, 50%, to {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  25%, 75% {
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.flash {
			
 
				+  animation-name: flash;
			
 
				+}
			
 
				+
			
 
				+/* 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;
			
 
				+}
			
 
				+
			
 
				+@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(.95, 1.05, 1);
			
 
				+  }
			
 
				+
			
 
				+  75% {
			
 
				+    transform: scale3d(1.05, .95, 1);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: scale3d(1, 1, 1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rubberBand {
			
 
				+  animation-name: rubberBand;
			
 
				+}
			
 
				+
			
 
				+@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;
			
 
				+}
			
 
				+
			
 
				+@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;
			
 
				+}
			
 
				+
			
 
				+@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;
			
 
				+}
			
 
				+
			
 
				+@keyframes tada {
			
 
				+  from {
			
 
				+    transform: scale3d(1, 1, 1);
			
 
				+  }
			
 
				+
			
 
				+  10%, 20% {
			
 
				+    transform: scale3d(.9, .9, .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;
			
 
				+}
			
 
				+
			
 
				+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
			
 
				+
			
 
				+@keyframes wobble {
			
 
				+  from {
			
 
				+    transform: none;
			
 
				+  }
			
 
				+
			
 
				+  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: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.wobble {
			
 
				+  animation-name: wobble;
			
 
				+}
			
 
				+
			
 
				+@keyframes jello {
			
 
				+  from, 11.1%, to {
			
 
				+    transform: none;
			
 
				+  }
			
 
				+
			
 
				+  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;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounceIn {
			
 
				+  from, 20%, 40%, 60%, 80%, to {
			
 
				+    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			
 
				+  }
			
 
				+
			
 
				+  0% {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.3, .3, .3);
			
 
				+  }
			
 
				+
			
 
				+  20% {
			
 
				+    transform: scale3d(1.1, 1.1, 1.1);
			
 
				+  }
			
 
				+
			
 
				+  40% {
			
 
				+    transform: scale3d(.9, .9, .9);
			
 
				+  }
			
 
				+
			
 
				+  60% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(1.03, 1.03, 1.03);
			
 
				+  }
			
 
				+
			
 
				+  80% {
			
 
				+    transform: scale3d(.97, .97, .97);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(1, 1, 1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.bounceIn {
			
 
				+  animation-name: bounceIn;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounceInDown {
			
 
				+  from, 60%, 75%, 90%, to {
			
 
				+    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			
 
				+  }
			
 
				+
			
 
				+  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: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.bounceInDown {
			
 
				+  animation-name: bounceInDown;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounceInLeft {
			
 
				+  from, 60%, 75%, 90%, to {
			
 
				+    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			
 
				+  }
			
 
				+
			
 
				+  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: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.bounceInLeft {
			
 
				+  animation-name: bounceInLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounceInRight {
			
 
				+  from, 60%, 75%, 90%, to {
			
 
				+    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			
 
				+  }
			
 
				+
			
 
				+  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: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.bounceInRight {
			
 
				+  animation-name: bounceInRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounceInUp {
			
 
				+  from, 60%, 75%, 90%, to {
			
 
				+    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			
 
				+  }
			
 
				+
			
 
				+  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;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounceOut {
			
 
				+  20% {
			
 
				+    transform: scale3d(.9, .9, .9);
			
 
				+  }
			
 
				+
			
 
				+  50%, 55% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(1.1, 1.1, 1.1);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.3, .3, .3);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.bounceOut {
			
 
				+  animation-name: bounceOut;
			
 
				+}
			
 
				+
			
 
				+@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;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounceOutLeft {
			
 
				+  20% {
			
 
				+    opacity: 1;
			
 
				+    transform: translate3d(20px, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(-2000px, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.bounceOutLeft {
			
 
				+  animation-name: bounceOutLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes bounceOutRight {
			
 
				+  20% {
			
 
				+    opacity: 1;
			
 
				+    transform: translate3d(-20px, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(2000px, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.bounceOutRight {
			
 
				+  animation-name: bounceOutRight;
			
 
				+}
			
 
				+
			
 
				+@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;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeIn {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeIn {
			
 
				+  animation-name: fadeIn;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeInDown {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(0, -100%, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeInDown {
			
 
				+  animation-name: fadeInDown;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeInDownBig {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(0, -2000px, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeInDownBig {
			
 
				+  animation-name: fadeInDownBig;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeInLeft {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(-100%, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeInLeft {
			
 
				+  animation-name: fadeInLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeInLeftBig {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(-2000px, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeInLeftBig {
			
 
				+  animation-name: fadeInLeftBig;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeInRight {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(100%, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeInRight {
			
 
				+  animation-name: fadeInRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeInRightBig {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(2000px, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeInRightBig {
			
 
				+  animation-name: fadeInRightBig;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeInUp {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(0, 100%, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeInUp {
			
 
				+  animation-name: fadeInUp;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeInUpBig {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(0, 2000px, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeInUpBig {
			
 
				+  animation-name: fadeInUpBig;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOut {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOut {
			
 
				+  animation-name: fadeOut;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOutDown {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(0, 100%, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOutDown {
			
 
				+  animation-name: fadeOutDown;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOutDownBig {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(0, 2000px, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOutDownBig {
			
 
				+  animation-name: fadeOutDownBig;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOutLeft {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(-100%, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOutLeft {
			
 
				+  animation-name: fadeOutLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOutLeftBig {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(-2000px, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOutLeftBig {
			
 
				+  animation-name: fadeOutLeftBig;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOutRight {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(100%, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOutRight {
			
 
				+  animation-name: fadeOutRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOutRightBig {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(2000px, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOutRightBig {
			
 
				+  animation-name: fadeOutRightBig;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOutUp {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(0, -100%, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOutUp {
			
 
				+  animation-name: fadeOutUp;
			
 
				+}
			
 
				+
			
 
				+@keyframes fadeOutUpBig {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(0, -2000px, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.fadeOutUpBig {
			
 
				+  animation-name: fadeOutUpBig;
			
 
				+}
			
 
				+
			
 
				+@keyframes flip {
			
 
				+  from {
			
 
				+    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
			
 
				+    animation-timing-function: ease-out;
			
 
				+  }
			
 
				+
			
 
				+  40% {
			
 
				+    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
			
 
				+    animation-timing-function: ease-out;
			
 
				+  }
			
 
				+
			
 
				+  50% {
			
 
				+    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
			
 
				+    animation-timing-function: ease-in;
			
 
				+  }
			
 
				+
			
 
				+  80% {
			
 
				+    transform: perspective(400px) scale3d(.95, .95, .95);
			
 
				+    animation-timing-function: ease-in;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: perspective(400px);
			
 
				+    animation-timing-function: ease-in;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.animated.flip {
			
 
				+  -webkit-backface-visibility: visible;
			
 
				+  backface-visibility: visible;
			
 
				+  animation-name: flip;
			
 
				+}
			
 
				+
			
 
				+@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 {
			
 
				+  -webkit-backface-visibility: visible !important;
			
 
				+  backface-visibility: visible !important;
			
 
				+  animation-name: flipInX;
			
 
				+}
			
 
				+
			
 
				+@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 {
			
 
				+  -webkit-backface-visibility: visible !important;
			
 
				+  backface-visibility: visible !important;
			
 
				+  animation-name: flipInY;
			
 
				+}
			
 
				+
			
 
				+@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-name: flipOutX;
			
 
				+  -webkit-backface-visibility: visible !important;
			
 
				+  backface-visibility: visible !important;
			
 
				+}
			
 
				+
			
 
				+@keyframes flipOutY {
			
 
				+  from {
			
 
				+    transform: perspective(400px);
			
 
				+  }
			
 
				+
			
 
				+  30% {
			
 
				+    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.flipOutY {
			
 
				+  -webkit-backface-visibility: visible !important;
			
 
				+  backface-visibility: visible !important;
			
 
				+  animation-name: flipOutY;
			
 
				+}
			
 
				+
			
 
				+@keyframes lightSpeedIn {
			
 
				+  from {
			
 
				+    transform: translate3d(100%, 0, 0) skewX(-30deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+
			
 
				+  60% {
			
 
				+    transform: skewX(20deg);
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  80% {
			
 
				+    transform: skewX(-5deg);
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: none;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.lightSpeedIn {
			
 
				+  animation-name: lightSpeedIn;
			
 
				+  animation-timing-function: ease-out;
			
 
				+}
			
 
				+
			
 
				+@keyframes lightSpeedOut {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: translate3d(100%, 0, 0) skewX(30deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.lightSpeedOut {
			
 
				+  animation-name: lightSpeedOut;
			
 
				+  animation-timing-function: ease-in;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateIn {
			
 
				+  from {
			
 
				+    transform-origin: center;
			
 
				+    transform: rotate3d(0, 0, 1, -200deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: center;
			
 
				+    transform: none;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateIn {
			
 
				+  animation-name: rotateIn;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateInDownLeft {
			
 
				+  from {
			
 
				+    transform-origin: left bottom;
			
 
				+    transform: rotate3d(0, 0, 1, -45deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: left bottom;
			
 
				+    transform: none;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateInDownLeft {
			
 
				+  animation-name: rotateInDownLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateInDownRight {
			
 
				+  from {
			
 
				+    transform-origin: right bottom;
			
 
				+    transform: rotate3d(0, 0, 1, 45deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: right bottom;
			
 
				+    transform: none;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateInDownRight {
			
 
				+  animation-name: rotateInDownRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateInUpLeft {
			
 
				+  from {
			
 
				+    transform-origin: left bottom;
			
 
				+    transform: rotate3d(0, 0, 1, 45deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: left bottom;
			
 
				+    transform: none;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateInUpLeft {
			
 
				+  animation-name: rotateInUpLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateInUpRight {
			
 
				+  from {
			
 
				+    transform-origin: right bottom;
			
 
				+    transform: rotate3d(0, 0, 1, -90deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: right bottom;
			
 
				+    transform: none;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateInUpRight {
			
 
				+  animation-name: rotateInUpRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateOut {
			
 
				+  from {
			
 
				+    transform-origin: center;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: center;
			
 
				+    transform: rotate3d(0, 0, 1, 200deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateOut {
			
 
				+  animation-name: rotateOut;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateOutDownLeft {
			
 
				+  from {
			
 
				+    transform-origin: left bottom;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: left bottom;
			
 
				+    transform: rotate3d(0, 0, 1, 45deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateOutDownLeft {
			
 
				+  animation-name: rotateOutDownLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateOutDownRight {
			
 
				+  from {
			
 
				+    transform-origin: right bottom;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: right bottom;
			
 
				+    transform: rotate3d(0, 0, 1, -45deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateOutDownRight {
			
 
				+  animation-name: rotateOutDownRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateOutUpLeft {
			
 
				+  from {
			
 
				+    transform-origin: left bottom;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: left bottom;
			
 
				+    transform: rotate3d(0, 0, 1, -45deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateOutUpLeft {
			
 
				+  animation-name: rotateOutUpLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes rotateOutUpRight {
			
 
				+  from {
			
 
				+    transform-origin: right bottom;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform-origin: right bottom;
			
 
				+    transform: rotate3d(0, 0, 1, 90deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rotateOutUpRight {
			
 
				+  animation-name: rotateOutUpRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes hinge {
			
 
				+  0% {
			
 
				+    transform-origin: top left;
			
 
				+    animation-timing-function: ease-in-out;
			
 
				+  }
			
 
				+
			
 
				+  20%, 60% {
			
 
				+    transform: rotate3d(0, 0, 1, 80deg);
			
 
				+    transform-origin: top left;
			
 
				+    animation-timing-function: ease-in-out;
			
 
				+  }
			
 
				+
			
 
				+  40%, 80% {
			
 
				+    transform: rotate3d(0, 0, 1, 60deg);
			
 
				+    transform-origin: top left;
			
 
				+    animation-timing-function: ease-in-out;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: translate3d(0, 700px, 0);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.hinge {
			
 
				+  animation-name: hinge;
			
 
				+}
			
 
				+
			
 
				+@keyframes jackInTheBox {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: scale(0.1) rotate(30deg);
			
 
				+    transform-origin: center bottom;
			
 
				+  }
			
 
				+
			
 
				+  50% {
			
 
				+    transform: rotate(-10deg);
			
 
				+  }
			
 
				+
			
 
				+  70% {
			
 
				+    transform: rotate(3deg);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: scale(1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.jackInTheBox {
			
 
				+  animation-name: jackInTheBox;
			
 
				+}
			
 
				+
			
 
				+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
			
 
				+
			
 
				+@keyframes rollIn {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 1;
			
 
				+    transform: none;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rollIn {
			
 
				+  animation-name: rollIn;
			
 
				+}
			
 
				+
			
 
				+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
			
 
				+
			
 
				+@keyframes rollOut {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.rollOut {
			
 
				+  animation-name: rollOut;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomIn {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.3, .3, .3);
			
 
				+  }
			
 
				+
			
 
				+  50% {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomIn {
			
 
				+  animation-name: zoomIn;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomInDown {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
			
 
				+  }
			
 
				+
			
 
				+  60% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomInDown {
			
 
				+  animation-name: zoomInDown;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomInLeft {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
			
 
				+  }
			
 
				+
			
 
				+  60% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomInLeft {
			
 
				+  animation-name: zoomInLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomInRight {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
			
 
				+  }
			
 
				+
			
 
				+  60% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomInRight {
			
 
				+  animation-name: zoomInRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomInUp {
			
 
				+  from {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
			
 
				+  }
			
 
				+
			
 
				+  60% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomInUp {
			
 
				+  animation-name: zoomInUp;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomOut {
			
 
				+  from {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+
			
 
				+  50% {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.3, .3, .3);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomOut {
			
 
				+  animation-name: zoomOut;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomOutDown {
			
 
				+  40% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
			
 
				+    transform-origin: center bottom;
			
 
				+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomOutDown {
			
 
				+  animation-name: zoomOutDown;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomOutLeft {
			
 
				+  40% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: scale(.1) translate3d(-2000px, 0, 0);
			
 
				+    transform-origin: left center;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomOutLeft {
			
 
				+  animation-name: zoomOutLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomOutRight {
			
 
				+  40% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: scale(.1) translate3d(2000px, 0, 0);
			
 
				+    transform-origin: right center;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomOutRight {
			
 
				+  animation-name: zoomOutRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes zoomOutUp {
			
 
				+  40% {
			
 
				+    opacity: 1;
			
 
				+    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
			
 
				+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    opacity: 0;
			
 
				+    transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
			
 
				+    transform-origin: center bottom;
			
 
				+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.zoomOutUp {
			
 
				+  animation-name: zoomOutUp;
			
 
				+}
			
 
				+
			
 
				+@keyframes slideInDown {
			
 
				+  from {
			
 
				+    transform: translate3d(0, -100%, 0);
			
 
				+    visibility: visible;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: translate3d(0, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.slideInDown {
			
 
				+  animation-name: slideInDown;
			
 
				+}
			
 
				+
			
 
				+@keyframes slideInLeft {
			
 
				+  from {
			
 
				+    transform: translate3d(-100%, 0, 0);
			
 
				+    visibility: visible;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: translate3d(0, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.slideInLeft {
			
 
				+  animation-name: slideInLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes slideInRight {
			
 
				+  from {
			
 
				+    transform: translate3d(100%, 0, 0);
			
 
				+    visibility: visible;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: translate3d(0, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.slideInRight {
			
 
				+  animation-name: slideInRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes slideInUp {
			
 
				+  from {
			
 
				+    transform: translate3d(0, 100%, 0);
			
 
				+    visibility: visible;
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    transform: translate3d(0, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.slideInUp {
			
 
				+  animation-name: slideInUp;
			
 
				+}
			
 
				+
			
 
				+@keyframes slideOutDown {
			
 
				+  from {
			
 
				+    transform: translate3d(0, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    visibility: hidden;
			
 
				+    transform: translate3d(0, 100%, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.slideOutDown {
			
 
				+  animation-name: slideOutDown;
			
 
				+}
			
 
				+
			
 
				+@keyframes slideOutLeft {
			
 
				+  from {
			
 
				+    transform: translate3d(0, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    visibility: hidden;
			
 
				+    transform: translate3d(-100%, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.slideOutLeft {
			
 
				+  animation-name: slideOutLeft;
			
 
				+}
			
 
				+
			
 
				+@keyframes slideOutRight {
			
 
				+  from {
			
 
				+    transform: translate3d(0, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    visibility: hidden;
			
 
				+    transform: translate3d(100%, 0, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.slideOutRight {
			
 
				+  animation-name: slideOutRight;
			
 
				+}
			
 
				+
			
 
				+@keyframes slideOutUp {
			
 
				+  from {
			
 
				+    transform: translate3d(0, 0, 0);
			
 
				+  }
			
 
				+
			
 
				+  to {
			
 
				+    visibility: hidden;
			
 
				+    transform: translate3d(0, -100%, 0);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.slideOutUp {
			
 
				+  animation-name: slideOutUp;
			
 
				+}
			
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -0,0 +1,405 @@
 
				+html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

			
 
				+

			
 
				+body { margin: 0; }

			
 
				+

			
 
				+article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

			
 
				+

			
 
				+audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }

			
 
				+

			
 
				+audio:not([controls]) { display: none; height: 0; }

			
 
				+

			
 
				+[hidden], template { display: none; }

			
 
				+

			
 
				+a { background-color: transparent; }

			
 
				+

			
 
				+a:active, a:hover { outline: 0; }

			
 
				+

			
 
				+abbr[title] { border-bottom: 1px dotted; }

			
 
				+

			
 
				+b, strong { font-weight: bold; }

			
 
				+

			
 
				+dfn { font-style: italic; }

			
 
				+

			
 
				+h1 { font-size: 2em; margin: 0.67em 0; }

			
 
				+

			
 
				+mark { background: #ff0; color: #000; }

			
 
				+

			
 
				+small { font-size: 80%; }

			
 
				+

			
 
				+sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

			
 
				+

			
 
				+sup { top: -0.5em; }

			
 
				+

			
 
				+sub { bottom: -0.25em; }

			
 
				+

			
 
				+img { border: 0; }

			
 
				+

			
 
				+svg:not(:root) { overflow: hidden; }

			
 
				+

			
 
				+figure { margin: 1em 40px; }

			
 
				+

			
 
				+hr { box-sizing: content-box; height: 0; }

			
 
				+

			
 
				+pre { overflow: auto; }

			
 
				+

			
 
				+code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

			
 
				+

			
 
				+button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }

			
 
				+

			
 
				+button { overflow: visible; }

			
 
				+

			
 
				+button, select { text-transform: none; }

			
 
				+

			
 
				+button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }

			
 
				+

			
 
				+button[disabled], html input[disabled] { cursor: default; }

			
 
				+

			
 
				+button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

			
 
				+

			
 
				+input { line-height: normal; }

			
 
				+

			
 
				+input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }

			
 
				+

			
 
				+input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

			
 
				+

			
 
				+input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; }

			
 
				+

			
 
				+input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

			
 
				+

			
 
				+fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

			
 
				+

			
 
				+legend { border: 0; padding: 0; }

			
 
				+

			
 
				+textarea { overflow: auto; }

			
 
				+

			
 
				+optgroup { font-weight: bold; }

			
 
				+

			
 
				+table { border-collapse: collapse; border-spacing: 0; }

			
 
				+

			
 
				+td, th { padding: 0; }

			
 
				+

			
 
				+body { line-height: 1.5em; font-family: "microsoft yahei"; font-size: 14px; color: #202020; }

			
 
				+

			
 
				+ul { margin: 0; padding: 0; list-style: none; }

			
 
				+

			
 
				+em, i { font-style: normal; }

			
 
				+

			
 
				+a { text-decoration: none; }

			
 
				+

			
 
				+h1, h2, h3, h4, h5, h6, p { margin: 0; font-weight: normal; }

			
 
				+

			
 
				+input[type=text], input[type=password], button { -webkit-appearance: none; }

			
 
				+

			
 
				+button { border: 0; }

			
 
				+

			
 
				+.mt10 { margin-top: 10px; }

			
 
				+

			
 
				+.mt15 { margin-top: 15px; }

			
 
				+

			
 
				+.mr10 { margin-right: 10px; }

			
 
				+

			
 
				+.mr15 { margin-right: 15px; }

			
 
				+

			
 
				+.mb10 { margin-bottom: 10px; }

			
 
				+

			
 
				+.mb15 { margin-bottom: 15px; }

			
 
				+

			
 
				+.ml10 { margin-left: 10px; }

			
 
				+

			
 
				+.ml15 { margin-left: 15px; }

			
 
				+

			
 
				+.mt20 { margin-top: 20px; }

			
 
				+

			
 
				+.mt25 { margin-top: 25px; }

			
 
				+

			
 
				+.mr20 { margin-right: 20px; }

			
 
				+

			
 
				+.mr25 { margin-right: 25px; }

			
 
				+

			
 
				+.mb20 { margin-bottom: 20px; }

			
 
				+

			
 
				+.mb25 { margin-bottom: 25px; }

			
 
				+

			
 
				+.ml20 { margin-left: 20px; }

			
 
				+

			
 
				+.ml25 { margin-left: 25px; }

			
 
				+

			
 
				+.mt30 { margin-top: 30px; }

			
 
				+

			
 
				+.mt35 { margin-top: 35px; }

			
 
				+

			
 
				+.mr30 { margin-right: 30px; }

			
 
				+

			
 
				+.mr35 { margin-right: 35px; }

			
 
				+

			
 
				+.mb30 { margin-bottom: 30px; }

			
 
				+

			
 
				+.mb35 { margin-bottom: 35px; }

			
 
				+

			
 
				+.ml30 { margin-left: 30px; }

			
 
				+

			
 
				+.ml35 { margin-left: 35px; }

			
 
				+

			
 
				+.mt40 { margin-top: 40px; }

			
 
				+

			
 
				+.mt45 { margin-top: 45px; }

			
 
				+

			
 
				+.mr40 { margin-right: 40px; }

			
 
				+

			
 
				+.mr45 { margin-right: 45px; }

			
 
				+

			
 
				+.mb40 { margin-bottom: 40px; }

			
 
				+

			
 
				+.mb45 { margin-bottom: 45px; }

			
 
				+

			
 
				+.ml40 { margin-left: 40px; }

			
 
				+

			
 
				+.ml45 { margin-left: 45px; }

			
 
				+

			
 
				+.mt50 { margin-top: 50px; }

			
 
				+

			
 
				+.mt55 { margin-top: 55px; }

			
 
				+

			
 
				+.mr50 { margin-right: 50px; }

			
 
				+

			
 
				+.mr55 { margin-right: 55px; }

			
 
				+

			
 
				+.mb50 { margin-bottom: 50px; }

			
 
				+

			
 
				+.mb55 { margin-bottom: 55px; }

			
 
				+

			
 
				+.ml50 { margin-left: 50px; }

			
 
				+

			
 
				+.ml55 { margin-left: 55px; }

			
 
				+

			
 
				+[class^="icon-"], [class*=" icon-"] { display: inline-block; background-repeat: no-repeat; background-size: 100%; overflow: hidden; }

			
 
				+

			
 
				+.l { float: left; }

			
 
				+

			
 
				+.r { float: right; }

			
 
				+

			
 
				+.text-center { text-align: center; }

			
 
				+

			
 
				+.container { *zoom: 1; margin: 0 auto; width: 1170px; }

			
 
				+.container:after, .container:before { content: ""; display: table; }

			
 
				+.container:after { clear: both; overflow: hidden; }

			
 
				+@media screen and (max-width: 1170px) { .container { width: 100%; } }

			
 
				+

			
 
				+.icon-about-1 { width: 80px; height: 80px; background-image: url("../images/icon-about-1.png"); }

			
 
				+

			
 
				+.icon-about-2 { width: 80px; height: 80px; background-image: url("../images/icon-about-2.png"); }

			
 
				+

			
 
				+.icon-about-3 { width: 80px; height: 80px; background-image: url("../images/icon-about-3.png"); }

			
 
				+

			
 
				+.icon-pt-1 { width: 60px; height: 60px; background-image: url("../images/icon-pt-1.png"); }

			
 
				+

			
 
				+.icon-step-1 { width: 100px; height: 100px; background-image: url("../images/icon-step-1.png"); }

			
 
				+

			
 
				+a:hover .icon-step-1 { background-image: url("../images/icon-step-1_hover.png"); }

			
 
				+

			
 
				+.icon-pt-2 { width: 60px; height: 60px; background-image: url("../images/icon-pt-2.png"); }

			
 
				+

			
 
				+.icon-step-2 { width: 100px; height: 100px; background-image: url("../images/icon-step-2.png"); }

			
 
				+

			
 
				+a:hover .icon-step-2 { background-image: url("../images/icon-step-2_hover.png"); }

			
 
				+

			
 
				+.icon-pt-3 { width: 60px; height: 60px; background-image: url("../images/icon-pt-3.png"); }

			
 
				+

			
 
				+.icon-step-3 { width: 100px; height: 100px; background-image: url("../images/icon-step-3.png"); }

			
 
				+

			
 
				+a:hover .icon-step-3 { background-image: url("../images/icon-step-3_hover.png"); }

			
 
				+

			
 
				+.icon-pt-4 { width: 60px; height: 60px; background-image: url("../images/icon-pt-4.png"); }

			
 
				+

			
 
				+.icon-step-4 { width: 100px; height: 100px; background-image: url("../images/icon-step-4.png"); }

			
 
				+

			
 
				+a:hover .icon-step-4 { background-image: url("../images/icon-step-4_hover.png"); }

			
 
				+

			
 
				+.icon-in-1 { width: 22px; height: 22px; background-image: url("../images/icon-in-1.png"); }

			
 
				+

			
 
				+.icon-in-2 { width: 22px; height: 22px; background-image: url("../images/icon-in-2.png"); }

			
 
				+

			
 
				+.icon-in-3 { width: 22px; height: 22px; background-image: url("../images/icon-in-3.png"); }

			
 
				+

			
 
				+.icon-in-4 { width: 22px; height: 22px; background-image: url("../images/icon-in-4.png"); }

			
 
				+

			
 
				+.icon-er { width: 27px; height: 27px; background-image: url("../images/icon-er.png"); }

			
 
				+

			
 
				+.btn, .btn-small, .btn-magnify { display: inline-block; border-radius: 20px; width: 170px; line-height: 40px; font-size: 16px; text-align: center; color: #fff; background-color: #70b94c; }

			
 
				+.btn:hover, .btn-small:hover, .btn-magnify:hover { background-color: #59973b; }

			
 
				+

			
 
				+.btn-small { border-radius: 3px; width: 130px; }

			
 
				+

			
 
				+.btn-magnify { border-radius: 3px; width: 100px; }

			
 
				+

			
 
				+.header { position: absolute; left: 0; right: 0; top: 0; z-index: 2000; padding: 15px 0; }

			
 
				+.header .logo { display: block; width: 147px; height: 48px; background: url("../images/logo_pc.png") no-repeat; background-size: 100%; }

			
 
				+.header .logo_hfw { display: block; width: 147px; height: 48px; background: url("../images/huifuwu_logo.png") no-repeat; background-size: 100%; }

			
 
				+.header .logo_zhc { display: block; width: 147px; height: 48px; background: url("../images/logo_zhc.png") no-repeat; background-size: 100%; }

			
 
				+.header.fixed { position: fixed; background-color: rgba(255, 255, 255, 0.8); }

			
 
				+.header.fixed .logo { background-image: url("../images/logo_m.png"); }

			
 
				+.header.fixed .nav li a { color: #202020; }

			
 
				+.header.fixed .timber { background-color: #00acf1; }

			
 
				+.header.fixed .logo_hfw { background-image: url("../images/huifuwu_logo_m.png"); }

			
 
				+.header.fixed .logo_zhc { background-image: url("../images/logo_zhc_m.png"); }

			
 
				+.header.borb { border-bottom: #eaeaea solid 1px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); }

			
 
				+@media screen and (max-width: 800px) { .header { position: relative; padding: 10px; }

			
 
				+  .header .logo { width: 120px; height: 40px; background-image: url("../images/logo_m.png"); }

			
 
				+  .header .logo_hfw { width: 120px; height: 40px; background-image: url("../images/huifuwu_logo_m.png"); }

			
 
				+  .header .logo_zhc { width: 120px; height: 40px; background-image: url("../images/logo_zhc_m.png"); }

			
 
				+}

			
 
				+

			
 
				+.collapse { position: relative; }

			
 
				+.collapse .touch { display: none; }

			
 
				+.collapse .timber { position: absolute; left: 58px; top: -15px; width: 64px; height: 4px; transition: left .5s ease-out; background-color: #fff; }

			
 
				+@media screen and (max-width: 800px) { .collapse { margin-top: 15px; }

			
 
				+  .collapse .touch { position: relative; display: block; border: #555 solid; border-width: 2px 0; width: 22px; height: 10px; }

			
 
				+  .collapse .touch:after { position: absolute; top: 4px; width: 100%; height: 2px; content: ''; background-color: #555; }

			
 
				+  .collapse .timber { display: none; } }

			
 
				+

			
 
				+.nav { *zoom: 1; margin-top: 14px; }

			
 
				+.nav:after, .nav:before { content: ""; display: table; }

			
 
				+.nav:after { clear: both; overflow: hidden; }

			
 
				+.nav li { float: left; margin-left: 60px; }

			
 
				+.nav li a { position: relative; font-size: 16px; color: #fff; }

			
 
				+@media screen and (max-width: 800px) { .nav { display: none; position: absolute; top: 35px; right: -10px; z-index: 100; margin-top: 0; border-top: #eee solid 1px; background-color: rgba(255, 255, 255, 0.8); }

			
 
				+  .nav li { width: 100%; margin-left: 0; padding: 10px 0; }

			
 
				+  .nav li a { display: block; text-align: center; color: #202020; }

			
 
				+  .nav li.active a { color: #70b94c; }

			
 
				+  .nav li.active a:after { position: absolute; content: ''; bottom: -7px; left: 50%; margin-left: -3px; border-radius: 50%; width: 6px; height: 6px; background-color: #70b94c; } }

			
 
				+

			
 
				+.banner { position: relative; width: 100%; height: 920px; background: url("../images/banner.jpg") no-repeat center; }

			
 
				+.banner .intro { position: absolute; left: 50%; top: 50%; z-index: 1000; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 630px; text-align: center; font-size: 16px; color: #fff; }

			
 
				+.banner .intro h1 { border-bottom: rgba(255, 255, 255, 0.3) solid 1px; padding-bottom: 30px; line-height: 45px; letter-spacing: 7px; font-size: 38px; }

			
 
				+.banner .intro .bottom { *zoom: 1; padding: 25px 200px 0 0; }

			
 
				+.banner .intro .bottom:after, .banner .intro .bottom:before { content: ""; display: table; }

			
 
				+.banner .intro .bottom:after { clear: both; overflow: hidden; }

			
 
				+.banner .intro .r { margin-right: -200px; padding: 5px; border-radius: 3px; width: 160px; background-color: #fff; }

			
 
				+.banner .intro .r p { padding-bottom: 5px; color: #202020; }

			
 
				+.banner .intro .l { text-align: left; line-height: 27px; }

			
 
				+.banner .intro img { width: 100%; }

			
 
				+@media screen and (max-width: 800px) { .banner { height: auto; background-size: cover; }

			
 
				+  .banner .intro { box-sizing: border-box; position: static; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); padding: 30px; width: 100%; }

			
 
				+  .banner .intro h1 { font-size: 24px; }

			
 
				+  .banner .intro p { margin: 10px 0 20px; } }

			
 
				+@media screen and (max-width: 600px) { .banner .intro .bottom { padding-right: 0; }

			
 
				+  .banner .intro .l { float: none; text-align: center; }

			
 
				+  .banner .intro .r { float: none; margin: 0 auto; } }

			
 
				+

			
 
				+.whole .hd { text-align: center; }

			
 
				+.whole .hd h1 { position: relative; padding: 25px 0; font-size: 36px; line-height: 1.5em; }

			
 
				+.whole .hd h1:after { position: absolute; left: 50%; bottom: 5px; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 110px; height: 1px; content: ''; background-color: #ebebeb; }

			
 
				+.whole .hd h1.white { color: #fff; }

			
 
				+.whole .hd h1.white:after { background-color: #fff; }

			
 
				+.whole .hd p { padding: 25px 285px; color: #959595; }

			
 
				+.whole.bt { border-top: #e7e7e7 solid 1px; }

			
 
				+@media screen and (max-width: 800px) { .whole.bt { margin: 0 15px; } }

			
 
				+.whole.half { position: absolute; left: 0; top: 50%; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); width: 50%; }

			
 
				+.whole.half .hd h1 { padding-top: 0; }

			
 
				+@media screen and (max-width: 800px) { .whole.half { position: static; float: left; width: 100%; -webkit-transform: translate(0); -moz-transform: translate(0); -ms-transform: translate(0); -o-transform: translate(0); transform: translate(0); }

			
 
				+  .whole.half .hd h1 { padding-top: 25px; } }

			
 
				+@media screen and (max-width: 800px) { .whole .hd p { padding: 25px 30px; }

			
 
				+  .whole .bd { margin-top: 0; } }

			
 
				+

			
 
				+.cf { *zoom: 1; }

			
 
				+.cf:after, .cf:before { content: ""; display: table; }

			
 
				+.cf:after { clear: both; overflow: hidden; }

			
 
				+

			
 
				+.floor-1 { padding-top: 20px; }

			
 
				+@media screen and (max-width: 800px) { .floor-1 { margin: 0; padding: 0; } }

			
 
				+

			
 
				+.about-r { float: right; }

			
 
				+.about-r li { margin-top: 40px; margin-bottom: 80px; padding-left: 110px; width: 475px; }

			
 
				+.about-r i { float: left; margin-left: -110px; }

			
 
				+.about-r h2 { font-size: 28px; color: #00acf1; }

			
 
				+.about-r p { margin-top: 20px; line-height: 25px; color: #959595; }

			
 
				+@media screen and (max-width: 800px) { .about-r { padding: 0 30px; }

			
 
				+  .about-r li { box-sizing: border-box; margin-bottom: 40px; width: 100%; } }

			
 
				+

			
 
				+.about-l { float: left; width: 430px; }

			
 
				+@media screen and (max-width: 800px) { .about-l { display: none; } }

			
 
				+

			
 
				+.floor-2 { padding-top: 70px; height: 638px; background: url("../images/floor-2_bg.jpg") no-repeat center; }

			
 
				+@media screen and (max-width: 800px) { .floor-2 { padding: 0; height: auto; background-size: cover; } }

			
 
				+

			
 
				+.zs { display: table; table-layout: fixed; margin-top: 70px; width: 100%; }

			
 
				+.zs .item { display: table-cell; text-align: center; }

			
 
				+.zs .qrcode { display: inline-block; opacity: 0; padding: 20px; width: 225px; font-size: 18px; color: #fff; background-color: rgba(0, 0, 0, 0.2); }

			
 
				+.zs img { width: 100%; }

			
 
				+.zs h3 { margin: 20px 0; font-size: 24px; }

			
 
				+.zs i { margin-right: 10px; vertical-align: middle; }

			
 
				+@media screen and (max-width: 800px) { .zs { margin: 30px 0; }

			
 
				+  .zs .qrcode { width: 165px; } }

			
 
				+@media screen and (max-width: 600px) { .zs { display: block; }

			
 
				+  .zs .item { display: block; margin: 30px 0; } }

			
 
				+

			
 
				+.floor-3 { padding: 40px 0 300px; background-color: #f4fbff; }

			
 
				+@media screen and (max-width: 800px) { .floor-3 { padding: 0; } }

			
 
				+

			
 
				+.relative { position: relative; }

			
 
				+

			
 
				+.pt { *zoom: 1; padding-top: 30px; }

			
 
				+.pt:after, .pt:before { content: ""; display: table; }

			
 
				+.pt:after { clear: both; overflow: hidden; }

			
 
				+.pt li { box-sizing: border-box; float: left; padding: 30px 30px 30px 110px; width: 50%; }

			
 
				+.pt h2 { margin-bottom: 10px; font-size: 28px; }

			
 
				+.pt p { color: #959595; }

			
 
				+.pt i { float: left; margin-left: -90px; }

			
 
				+@media screen and (max-width: 630px) { .pt li { width: 100%; } }

			
 
				+

			
 
				+.pt-img { position: absolute; bottom: -470px; left: 50%; margin-left: -500px; width: 1000px; }

			
 
				+.pt-img img { width: 100%; }

			
 
				+@media screen and (max-width: 800px) { .pt-img { display: none; } }

			
 
				+

			
 
				+.co { *zoom: 1; margin: 30px 0 50px; }

			
 
				+.co:after, .co:before { content: ""; display: table; }

			
 
				+.co:after { clear: both; overflow: hidden; }

			
 
				+.co li { box-sizing: border-box; float: left; padding: 10px; width: 20%; }

			
 
				+.co img { width: 100%; }

			
 
				+@media screen and (max-width: 800px) { .co li { width: 25%; } }

			
 
				+@media screen and (max-width: 600px) { .co li { width: 33.3%; } }

			
 
				+@media screen and (max-width: 400px) { .co li { width: 50%; } }

			
 
				+

			
 
				+.footer { font-size: 16px; color: #95a9b1; }

			
 
				+.footer .t { padding: 60px 0 40px; background-color: #212331; }

			
 
				+.footer .t .l { margin-right: 120px; }

			
 
				+.footer .t p { margin-top: 20px; }

			
 
				+.footer .t i { margin-right: 7px; vertical-align: top; }

			
 
				+.footer .b { padding: 20px 0; background-color: #181828; }

			
 
				+.footer .b img { width: 147px; }

			
 
				+.footer h3 { position: relative; margin-bottom: 41px; font-size: 18px; color: #fff; }

			
 
				+.footer h3:after { position: absolute; left: 80px; bottom: 0; border: 6px solid; border-color: transparent transparent #00acf1 #00acf1; width: 0; height: 0; content: ''; }

			
 
				+.footer .qrcode { padding: 10px; width: 155px; background-color: rgba(0, 0, 0, 0.2); text-align: center; color: #fff; }

			
 
				+.footer .qrcode img { width: 100%; }

			
 
				+.footer .qrcode p { margin: 10px 0; }

			
 
				+.footer a { color: #95a9b1; }

			
 
				+.footer .blue { color: #00acf1; }

			
 
				+.footer .mt13 { margin-top: 13px; }

			
 
				+@media screen and (max-width: 800px) { .footer .t { padding: 30px 150px; text-align: center; }

			
 
				+  .footer .t .l { float: none; display: inline-block; margin-right: 0; }

			
 
				+  .footer .qrcode { float: none; margin: 20px auto 0; }

			
 
				+  .footer h3 { margin-bottom: 20px; }

			
 
				+  .footer h3:after { left: 50%; -webkit-transform: translate(45px, 0); -moz-transform: translate(45px, 0); -ms-transform: translate(45px, 0); -o-transform: translate(45px, 0); transform: translate(45px, 0); }

			
 
				+  .footer .b { padding: 20px 30px; } }

			
 
				+@media screen and (max-width: 600px) { .footer .t { padding: 30px; } }

			
 
				+@media screen and (max-width: 400px) { .footer .b { text-align: center; }

			
 
				+  .footer .b .l { float: none; }

			
 
				+  .footer .b .r { float: none; margin-top: 20px; } }

			
 
				+

			
 
				+.floor-4 { padding-top: 220px; }

			
 
				+@media screen and (max-width: 800px) { .floor-4 { padding-top: 0; } }

			
 
				+

			
 
				+.jm { *zoom: 1; padding: 30px 220px; background: url("../images/jm_bg.png") no-repeat center; background-size: 200px; }

			
 
				+.jm:after, .jm:before { content: ""; display: table; }

			
 
				+.jm:after { clear: both; overflow: hidden; }

			
 
				+.jm a { position: relative; display: inline-block; padding-top: 70px; width: 200px; text-align: center; color: #202020; }

			
 
				+.jm a:hover i { top: -30px; }

			
 
				+.jm i { position: absolute; left: 50%; top: 0; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); transition: top .3s linear; }

			
 
				+.jm .txt { position: relative; z-index: 10; border-top: #e1e1e1 solid 1px; background-color: #fff; }

			
 
				+.jm h2 { padding-top: 10px; line-height: 1.4; font-size: 28px; }

			
 
				+.jm p { color: #959595; }

			
 
				+@media screen and (max-width: 800px) { .jm { padding: 30px 50px; background: none; } }

			
 
				+@media screen and (max-width: 600px) { .jm { padding: 0 100px; text-align: center; }

			
 
				+  .jm a { float: none; margin: 30px 0; } }

			
 
				+

			
 
				+/*# sourceMappingURL=main.css.map */

			
--- a/static/css/main.css.map
+++ b/static/css/main.css.map
--- a/static/images/banner.jpg
+++ b/static/images/banner.jpg
--- a/static/images/co-1.png
+++ b/static/images/co-1.png
--- a/static/images/co-10.png
+++ b/static/images/co-10.png
--- a/static/images/co-2.png
+++ b/static/images/co-2.png
--- a/static/images/co-3.png
+++ b/static/images/co-3.png
--- a/static/images/co-4.png
+++ b/static/images/co-4.png
--- a/static/images/co-5.png
+++ b/static/images/co-5.png
--- a/static/images/co-6.png
+++ b/static/images/co-6.png
--- a/static/images/co-7.png
+++ b/static/images/co-7.png
--- a/static/images/co-8.png
+++ b/static/images/co-8.png
--- a/static/images/co-9.png
+++ b/static/images/co-9.png
--- a/static/images/floor-2_bg.jpg
+++ b/static/images/floor-2_bg.jpg
--- a/static/images/huifuwu_logo.png
+++ b/static/images/huifuwu_logo.png
--- a/static/images/huifuwu_logo_m.png
+++ b/static/images/huifuwu_logo_m.png
--- a/static/images/icon-about-1.png
+++ b/static/images/icon-about-1.png
--- a/static/images/icon-about-2.png
+++ b/static/images/icon-about-2.png
--- a/static/images/icon-about-3.png
+++ b/static/images/icon-about-3.png
--- a/static/images/icon-er.png
+++ b/static/images/icon-er.png
--- a/static/images/icon-in-1.png
+++ b/static/images/icon-in-1.png
--- a/static/images/icon-in-2.png
+++ b/static/images/icon-in-2.png
--- a/static/images/icon-in-3.png
+++ b/static/images/icon-in-3.png
--- a/static/images/icon-in-4.png
+++ b/static/images/icon-in-4.png
--- a/static/images/icon-pt-1.png
+++ b/static/images/icon-pt-1.png
--- a/static/images/icon-pt-2.png
+++ b/static/images/icon-pt-2.png
--- a/static/images/icon-pt-3.png
+++ b/static/images/icon-pt-3.png
--- a/static/images/icon-pt-4.png
+++ b/static/images/icon-pt-4.png
--- a/static/images/icon-step-1.png
+++ b/static/images/icon-step-1.png
--- a/static/images/icon-step-1_hover.png
+++ b/static/images/icon-step-1_hover.png
--- a/static/images/icon-step-2.png
+++ b/static/images/icon-step-2.png
--- a/static/images/icon-step-2_hover.png
+++ b/static/images/icon-step-2_hover.png
--- a/static/images/icon-step-3.png
+++ b/static/images/icon-step-3.png
--- a/static/images/icon-step-3_hover.png
+++ b/static/images/icon-step-3_hover.png
--- a/static/images/icon-step-4.png
+++ b/static/images/icon-step-4.png
--- a/static/images/icon-step-4_hover.png
+++ b/static/images/icon-step-4_hover.png
--- a/static/images/iphone.png
+++ b/static/images/iphone.png
--- a/static/images/jm_bg.png
+++ b/static/images/jm_bg.png
--- a/static/images/logo_m.png
+++ b/static/images/logo_m.png
--- a/static/images/logo_pc.png
+++ b/static/images/logo_pc.png
--- a/static/images/logo_zhc.png
+++ b/static/images/logo_zhc.png
--- a/static/images/logo_zhc_m.png
+++ b/static/images/logo_zhc_m.png
--- a/static/images/pt-img.png
+++ b/static/images/pt-img.png
--- a/static/images/qrcode-1.png
+++ b/static/images/qrcode-1.png
--- a/static/images/qrcode-2.jpg
+++ b/static/images/qrcode-2.jpg
--- a/static/images/qrcode-3.jpg
+++ b/static/images/qrcode-3.jpg
--- a/static/js/jquery-1.11.3.min.js
+++ b/static/js/jquery-1.11.3.min.js
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -0,0 +1,82 @@
 
				+(function ($) {

			
 
				+    // 导航

			
 
				+    $('.touch').on('click', function () {

			
 
				+        $('.nav').width(window.innerWidth).toggle();

			
 
				+    });

			
 
				+

			
 
				+    var $timber = $('.timber'),

			
 
				+        left;

			
 
				+    left = $timber.css('left');

			
 
				+    $('.nav li').hover(function () {

			
 
				+        var index = $(this).index('.nav li');

			
 
				+

			
 
				+        switch (index) {

			
 
				+            case 0:

			
 
				+                $timber.css('left', 58);

			
 
				+                break;

			
 
				+            case 1:

			
 
				+                $timber.css('left', 191);

			
 
				+                break;

			
 
				+            case 2:

			
 
				+                $timber.css('left', 306);

			
 
				+                break;

			
 
				+            case 3:

			
 
				+                $timber.css('left', 415);

			
 
				+                break;

			
 
				+        }

			
 
				+

			
 
				+    }, function () {

			
 
				+        $timber.css('left', left);

			
 
				+    });

			
 
				+

			
 
				+

			
 
				+    // animate

			
 
				+    var h = window.innerHeight,

			
 
				+        w,

			
 
				+    // .header

			
 
				+        $header = $('.header'),

			
 
				+        headerH = $header.outerHeight(),

			
 
				+    // #pt-img

			
 
				+        $ptImg = $('#pt_img'),

			
 
				+        ptImgTop = $ptImg.offset().top,

			
 
				+        ptImgH = $ptImg.outerHeight(),

			
 
				+    // #zs

			
 
				+        $zs = $('#zs'),

			
 
				+        zsImgTop = $zs.offset().top,

			
 
				+        zsImgH = $zs.outerHeight(),

			
 
				+    // #about_l

			
 
				+        $aboutL = $('#about_l'),

			
 
				+        abImgTop = $aboutL.offset().top,

			
 
				+        abImgH = $aboutL.outerHeight();

			
 
				+

			
 
				+    $(window).resize(function () {

			
 
				+        w = window.innerWidth;

			
 
				+        if (w > 800) {

			
 
				+            $('.nav').show().css('width', 'auto');

			
 
				+        } else {

			
 
				+            $('.nav').hide().width(w);

			
 
				+        }

			
 
				+    }).

			
 
				+        on('scroll', function () {

			
 
				+            var scrollTop = $(window).scrollTop();

			
 
				+

			
 
				+            if(headerH < scrollTop && w > 800){

			
 
				+                $header.addClass('fixed');

			
 
				+            } else{

			
 
				+                $header.removeClass('fixed');

			
 
				+            }

			
 
				+

			
 
				+            if (ptImgTop - h + ptImgH < scrollTop && ptImgTop > scrollTop) {

			
 
				+                $ptImg.addClass('animated pulse');

			
 
				+            }

			
 
				+

			
 
				+            if (zsImgTop - h + zsImgH < scrollTop && zsImgTop > scrollTop) {

			
 
				+                $('#qrcode_1').addClass('animated fadeInLeft');

			
 
				+                $('#qrcode_2').addClass('animated fadeInRight');

			
 
				+            }

			
 
				+

			
 
				+            if (abImgTop - h + abImgH < scrollTop && abImgTop > scrollTop) {

			
 
				+                $aboutL.addClass('animated flipInY');

			
 
				+            }

			
 
				+        });

			
 
				+})(jQuery);
			
--- a/static/sass/index.scss
+++ b/static/sass/index.scss
@@ -0,0 +1,739 @@
 
				+.container {

			
 
				+    @include clearfix;

			
 
				+    margin: 0 auto;

			
 
				+    width: 1170px;

			
 
				+    @media screen and (max-width: 1170px) {

			
 
				+        width: 100%;

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+// icon

			
 
				+@for $i from 1 through 3{

			
 
				+    .icon-about-#{$i}{

			
 
				+        width: 80px;

			
 
				+        height: 80px;

			
 
				+        background-image: url("../images/icon-about-#{$i}.png");

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+@for $i from 1 through 4{

			
 
				+    .icon-pt-#{$i}{

			
 
				+        width: 60px;

			
 
				+        height: 60px;

			
 
				+        background-image: url("../images/icon-pt-#{$i}.png");

			
 
				+    }

			
 
				+    .icon-step-#{$i}{

			
 
				+        width: 100px;

			
 
				+        height: 100px;

			
 
				+        background-image: url("../images/icon-step-#{$i}.png");

			
 
				+    }

			
 
				+    a:hover{

			
 
				+        .icon-step-#{$i}{

			
 
				+            background-image: url("../images/icon-step-#{$i}_hover.png");

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+@for $i from 1 through 4{

			
 
				+    .icon-in-#{$i}{

			
 
				+        width: 22px;

			
 
				+        height: 22px;

			
 
				+        background-image: url("../images/icon-in-#{$i}.png");

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.icon-er{

			
 
				+    width: 27px;

			
 
				+    height: 27px;

			
 
				+    background-image: url("../images/icon-er.png");

			
 
				+}

			
 
				+

			
 
				+.btn {

			
 
				+    display: inline-block;

			
 
				+    border-radius: 20px;

			
 
				+    width: 170px;

			
 
				+    line-height: 40px;

			
 
				+    font-size: 16px;

			
 
				+    text-align: center;

			
 
				+    color: #fff;

			
 
				+    background-color: $theme-color;

			
 
				+    &:hover{

			
 
				+        background-color: darken($theme-color, 10%);

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.btn-small{

			
 
				+    @extend .btn;

			
 
				+    border-radius: 3px;

			
 
				+    width: 130px;

			
 
				+}

			
 
				+

			
 
				+.btn-magnify{

			
 
				+    @extend .btn;

			
 
				+    border-radius: 3px;

			
 
				+    width: 100px;

			
 
				+}

			
 
				+

			
 
				+.header {

			
 
				+    position: absolute;

			
 
				+    left: 0;

			
 
				+    right: 0;

			
 
				+    top: 0;

			
 
				+    z-index: 2000;

			
 
				+    padding: 15px 0;

			
 
				+    .logo {

			
 
				+        display: block;

			
 
				+        width: 147px;

			
 
				+        height: 48px;

			
 
				+        background: url("../images/logo_pc.png") no-repeat;

			
 
				+        background-size: 100%;

			
 
				+    }

			
 
				+    &.fixed{

			
 
				+        position: fixed;

			
 
				+        background-color: rgba(#fff, .8);

			
 
				+        .logo{

			
 
				+            background-image: url("../images/logo_m.png");

			
 
				+        }

			
 
				+        .nav li a{

			
 
				+            color: #202020;

			
 
				+        }

			
 
				+        .timber{

			
 
				+            background-color: #00acf1;

			
 
				+        }

			
 
				+    }

			
 
				+    &.borb{

			
 
				+        border-bottom: #eaeaea solid 1px;

			
 
				+        box-shadow: 0 0 5px rgba(0, 0, 0, .1);

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        position: relative;

			
 
				+        padding: 10px;

			
 
				+        .logo{

			
 
				+            width: 120px;

			
 
				+            height: 40px;

			
 
				+            background-image: url("../images/logo_m.png");

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+

			
 
				+.collapse {

			
 
				+    position: relative;

			
 
				+    .touch {

			
 
				+        display: none;

			
 
				+    }

			
 
				+    .timber{

			
 
				+        position: absolute;

			
 
				+        left: 58px;

			
 
				+        top: -15px;

			
 
				+        width: 64px;

			
 
				+        height: 4px;

			
 
				+        transition: left .5s ease-out;

			
 
				+        background-color: #fff;

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        margin-top: 15px;

			
 
				+        .touch{

			
 
				+            position: relative;

			
 
				+            display: block;

			
 
				+            border: #555 solid;

			
 
				+            border-width: 2px 0;

			
 
				+            width: 22px;

			
 
				+            height: 10px;

			
 
				+            &:after{

			
 
				+                position: absolute;

			
 
				+                top: 4px;

			
 
				+                width: 100%;

			
 
				+                height: 2px;

			
 
				+                content: '';

			
 
				+                background-color: #555;

			
 
				+            }

			
 
				+        }

			
 
				+        .timber{

			
 
				+            display: none;

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.nav {

			
 
				+    @include clearfix;

			
 
				+    margin-top: 14px;

			
 
				+    li {

			
 
				+        float: left;

			
 
				+        margin-left: 60px;

			
 
				+        a {

			
 
				+            position: relative;

			
 
				+            font-size: 16px;

			
 
				+            color: #fff;

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        display: none;

			
 
				+        position: absolute;

			
 
				+        top: 35px;

			
 
				+        right: -10px;

			
 
				+        z-index: 100;

			
 
				+        margin-top: 0;

			
 
				+        border-top: #eee solid 1px;

			
 
				+        background-color: rgba(255, 255, 255, .8);

			
 
				+        li{

			
 
				+            width: 100%;

			
 
				+            margin-left: 0;

			
 
				+            padding: 10px 0;

			
 
				+            a{

			
 
				+                display: block;

			
 
				+                text-align: center;

			
 
				+                color: #202020;

			
 
				+            }

			
 
				+            &.active {

			
 
				+                a {

			
 
				+                    color: $theme-color;

			
 
				+                    &:after {

			
 
				+                        position: absolute;

			
 
				+                        content: '';

			
 
				+                        bottom: -7px;

			
 
				+                        left: 50%;

			
 
				+                        margin-left: -3px;

			
 
				+                        border-radius: 50%;

			
 
				+                        width: 6px;

			
 
				+                        height: 6px;

			
 
				+                        background-color: $theme-color;

			
 
				+                    }

			
 
				+                }

			
 
				+            }

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.banner {

			
 
				+    position: relative;

			
 
				+    width: 100%;

			
 
				+    height: 920px;

			
 
				+    background: url("../images/banner.jpg") no-repeat center;

			
 
				+    .intro{

			
 
				+        position: absolute;

			
 
				+        left: 50%;

			
 
				+        top: 50%;

			
 
				+        z-index: 1000;

			
 
				+        -webkit-transform: translate(-50%, -50%);

			
 
				+        -moz-transform: translate(-50%, -50%);

			
 
				+        -ms-transform: translate(-50%, -50%);

			
 
				+        -o-transform: translate(-50%, -50%);

			
 
				+        transform: translate(-50%, -50%);

			
 
				+        width: 630px;

			
 
				+        text-align: center;

			
 
				+        font-size: 16px;

			
 
				+        color: #fff;

			
 
				+        h1{

			
 
				+            border-bottom: rgba(#fff, .3) solid 1px;

			
 
				+            padding-bottom: 30px;

			
 
				+            line-height: 45px;

			
 
				+            letter-spacing: 7px;

			
 
				+            font-size: 38px;

			
 
				+        }

			
 
				+        .bottom{

			
 
				+            @include clearfix;

			
 
				+            padding: 25px 200px 0 0;

			
 
				+        }

			
 
				+        .r{

			
 
				+            margin-right: -200px;

			
 
				+            padding: 5px;

			
 
				+            border-radius: 3px;

			
 
				+            width: 160px;

			
 
				+            background-color: #fff;

			
 
				+            p{

			
 
				+                padding-bottom: 5px;

			
 
				+                color: #202020;

			
 
				+            }

			
 
				+        }

			
 
				+        .l{

			
 
				+            text-align: left;

			
 
				+            line-height: 27px;

			
 
				+        }

			
 
				+        img{

			
 
				+            width: 100%;

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px) {

			
 
				+        height: auto;

			
 
				+        background-size: cover;

			
 
				+        .intro{

			
 
				+            box-sizing: border-box;

			
 
				+            position: static;

			
 
				+            -webkit-transform: translate(0, 0);

			
 
				+            -moz-transform: translate(0, 0);

			
 
				+            -ms-transform: translate(0, 0);

			
 
				+            -o-transform: translate(0, 0);

			
 
				+            transform: translate(0, 0);

			
 
				+            padding: 30px;

			
 
				+            width: 100%;

			
 
				+            h1{

			
 
				+                font-size: 24px;

			
 
				+            }

			
 
				+            p{

			
 
				+                margin: 10px 0 20px;

			
 
				+            }

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 600px) {

			
 
				+        .intro{

			
 
				+            .bottom{

			
 
				+                padding-right: 0;

			
 
				+            }

			
 
				+            .l{

			
 
				+                float: none;

			
 
				+                text-align: center;

			
 
				+            }

			
 
				+            .r{

			
 
				+                float: none;

			
 
				+                margin: 0 auto;

			
 
				+            }

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.whole {

			
 
				+    .hd {

			
 
				+        text-align: center;

			
 
				+        h1 {

			
 
				+            position: relative;

			
 
				+            padding: 25px 0;

			
 
				+            font-size: 36px;

			
 
				+            line-height: 1.5em;

			
 
				+            &:after{

			
 
				+                position: absolute;

			
 
				+                left: 50%;

			
 
				+                bottom: 5px;

			
 
				+                -webkit-transform: translate(-50%, 0);

			
 
				+                -moz-transform: translate(-50%, 0);

			
 
				+                -ms-transform: translate(-50%, 0);

			
 
				+                -o-transform: translate(-50%, 0);

			
 
				+                transform: translate(-50%, 0);

			
 
				+                width: 110px;

			
 
				+                height: 1px;

			
 
				+                content: '';

			
 
				+                background-color: #ebebeb;

			
 
				+            }

			
 
				+            &.white{

			
 
				+                color: #fff;

			
 
				+                &:after{

			
 
				+                    background-color: #fff;

			
 
				+                }

			
 
				+            }

			
 
				+        }

			
 
				+        p {

			
 
				+            padding: 25px 285px;

			
 
				+            color: #959595;

			
 
				+        }

			
 
				+    }

			
 
				+    &.bt{

			
 
				+        border-top: #e7e7e7 solid 1px;

			
 
				+        @media screen and (max-width: 800px) {

			
 
				+            margin: 0 15px;

			
 
				+        }

			
 
				+    }

			
 
				+    &.half{

			
 
				+        position: absolute;

			
 
				+        left: 0;

			
 
				+        top: 50%;

			
 
				+        -webkit-transform: translate(0, -50%);

			
 
				+        -moz-transform: translate(0, -50%);

			
 
				+        -ms-transform: translate(0, -50%);

			
 
				+        -o-transform: translate(0, -50%);

			
 
				+        transform: translate(0, -50%);

			
 
				+        width: 50%;

			
 
				+        .hd{

			
 
				+            h1{

			
 
				+                padding-top: 0;

			
 
				+            }

			
 
				+        }

			
 
				+        @media screen and (max-width: 800px) {

			
 
				+            position: static;

			
 
				+            float: left;

			
 
				+            width: 100%;

			
 
				+            -webkit-transform: translate(0);

			
 
				+            -moz-transform: translate(0);

			
 
				+            -ms-transform: translate(0);

			
 
				+            -o-transform: translate(0);

			
 
				+            transform: translate(0);

			
 
				+            .hd{

			
 
				+                h1{

			
 
				+                    padding-top: 25px;

			
 
				+                }

			
 
				+            }

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        .hd{

			
 
				+            p{

			
 
				+                padding: 25px 30px;

			
 
				+            }

			
 
				+        }

			
 
				+        .bd{

			
 
				+            margin-top: 0;

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.cf{

			
 
				+    @include clearfix;

			
 
				+}

			
 
				+

			
 
				+.floor-1{

			
 
				+    padding-top: 20px;

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        margin: 0;

			
 
				+        padding: 0;

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.about-r{

			
 
				+    float: right;

			
 
				+    li{

			
 
				+        margin-top: 40px;

			
 
				+        margin-bottom: 80px;

			
 
				+        padding-left: 110px;

			
 
				+        width: 475px;

			
 
				+    }

			
 
				+    i{

			
 
				+        float: left;

			
 
				+        margin-left: -110px;

			
 
				+    }

			
 
				+    h2{

			
 
				+        font-size: 28px;

			
 
				+        color: #00acf1;

			
 
				+    }

			
 
				+    p{

			
 
				+        margin-top: 20px;

			
 
				+        line-height: 25px;

			
 
				+        color: #959595;

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        padding: 0 30px;

			
 
				+        li{

			
 
				+            box-sizing: border-box;

			
 
				+            margin-bottom: 40px;

			
 
				+            width: 100%;

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.about-l{

			
 
				+    float: left;

			
 
				+    width: 430px;

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        display: none;

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.floor-2{

			
 
				+    padding-top: 70px;

			
 
				+    height: 638px;

			
 
				+    background: url("../images/floor-2_bg.jpg") no-repeat center;

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        padding: 0;

			
 
				+        height: auto;

			
 
				+        background-size: cover;

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.zs{

			
 
				+    display: table;

			
 
				+    table-layout: fixed;

			
 
				+    margin-top: 70px;

			
 
				+    width: 100%;

			
 
				+    .item{

			
 
				+        display: table-cell;

			
 
				+        text-align: center;

			
 
				+    }

			
 
				+    .qrcode{

			
 
				+        display: inline-block;

			
 
				+        opacity: 0;

			
 
				+        padding: 20px;

			
 
				+        width: 225px;

			
 
				+        font-size: 18px;

			
 
				+        color: #fff;

			
 
				+        background-color: rgba(#000, .2);

			
 
				+    }

			
 
				+    img{

			
 
				+        width: 100%;

			
 
				+    }

			
 
				+    h3{

			
 
				+        margin: 20px 0;

			
 
				+        font-size: 24px;

			
 
				+    }

			
 
				+    i{

			
 
				+        margin-right: 10px;

			
 
				+        vertical-align: middle;

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        margin: 30px 0;

			
 
				+        .qrcode{

			
 
				+            width: 165px;

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 600px){

			
 
				+        display: block;

			
 
				+        .item{

			
 
				+            display: block;

			
 
				+            margin: 30px 0;

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.floor-3{

			
 
				+    padding: 40px 0 300px;

			
 
				+    background-color: #f4fbff;

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        padding: 0;

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.relative{

			
 
				+    position: relative;

			
 
				+}

			
 
				+

			
 
				+.pt{

			
 
				+    @include clearfix;

			
 
				+    padding-top: 30px;

			
 
				+    li{

			
 
				+        box-sizing: border-box;

			
 
				+        float: left;

			
 
				+        padding: 30px 30px 30px 110px;

			
 
				+        width: 50%;

			
 
				+    }

			
 
				+    h2{

			
 
				+        margin-bottom: 10px;

			
 
				+        font-size: 28px;

			
 
				+    }

			
 
				+    p{

			
 
				+        color: #959595;

			
 
				+    }

			
 
				+    i{

			
 
				+        float: left;

			
 
				+        margin-left: -90px;

			
 
				+    }

			
 
				+    @media screen and (max-width: 630px){

			
 
				+        li{

			
 
				+            width: 100%;

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.pt-img{

			
 
				+    position: absolute;

			
 
				+    bottom: -470px;

			
 
				+    left: 50%;

			
 
				+    margin-left: -500px;

			
 
				+    width: 1000px;

			
 
				+    img{

			
 
				+        width: 100%;

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        display: none;

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.co{

			
 
				+    @include clearfix;

			
 
				+    margin: 30px 0 50px;

			
 
				+    li{

			
 
				+        box-sizing: border-box;

			
 
				+        float: left;

			
 
				+        padding: 10px;

			
 
				+        width: 20%;

			
 
				+    }

			
 
				+    img{

			
 
				+        width: 100%;

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        li{

			
 
				+            width: 25%;

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 600px){

			
 
				+        li{

			
 
				+            width: 33.3%;

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 400px){

			
 
				+        li{

			
 
				+            width: 50%;

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.footer{

			
 
				+    font-size: 16px;

			
 
				+    color: #95a9b1;

			
 
				+    .t{

			
 
				+        padding: 60px 0 40px;

			
 
				+        background-color: #212331;

			
 
				+        .l{

			
 
				+            margin-right: 120px;

			
 
				+        }

			
 
				+        p{

			
 
				+            margin-top: 20px;

			
 
				+        }

			
 
				+        i{

			
 
				+            margin-right: 7px;

			
 
				+            vertical-align: top;

			
 
				+        }

			
 
				+    }

			
 
				+    .b{

			
 
				+        padding: 20px 0;

			
 
				+        background-color: #181828;

			
 
				+        img{

			
 
				+            width: 147px;

			
 
				+        }

			
 
				+    }

			
 
				+    h3{

			
 
				+        position: relative;

			
 
				+        margin-bottom: 41px;

			
 
				+        font-size: 18px;

			
 
				+        color: #fff;

			
 
				+        &:after{

			
 
				+            position: absolute;

			
 
				+            left: 80px;

			
 
				+            bottom: 0;

			
 
				+            border: 6px solid;

			
 
				+            border-color: transparent transparent #00acf1 #00acf1;

			
 
				+            width: 0;

			
 
				+            height: 0;

			
 
				+            content: '';

			
 
				+        }

			
 
				+    }

			
 
				+    .qrcode{

			
 
				+        padding: 10px;

			
 
				+        width: 155px;

			
 
				+        background-color: rgba(#000, .2);

			
 
				+        text-align: center;

			
 
				+        color: #fff;

			
 
				+        img{

			
 
				+            width: 100%;

			
 
				+        }

			
 
				+        p{

			
 
				+            margin: 10px 0;

			
 
				+        }

			
 
				+    }

			
 
				+    a{

			
 
				+        color: #95a9b1;

			
 
				+    }

			
 
				+    .blue{

			
 
				+        color: #00acf1;

			
 
				+    }

			
 
				+    .mt13{

			
 
				+        margin-top: 13px;

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        .t{

			
 
				+            padding: 30px 150px;

			
 
				+            text-align: center;

			
 
				+            .l{

			
 
				+                float: none;

			
 
				+                display: inline-block;

			
 
				+                margin-right: 0;

			
 
				+            }

			
 
				+        }

			
 
				+        .qrcode{

			
 
				+            float: none;

			
 
				+            margin: 20px auto 0;

			
 
				+        }

			
 
				+        h3{

			
 
				+            margin-bottom: 20px;

			
 
				+            &:after{

			
 
				+                left: 50%;

			
 
				+                -webkit-transform: translate(45px, 0);

			
 
				+                -moz-transform: translate(45px, 0);

			
 
				+                -ms-transform: translate(45px, 0);

			
 
				+                -o-transform: translate(45px, 0);

			
 
				+                transform: translate(45px, 0);

			
 
				+            }

			
 
				+        }

			
 
				+        .b{

			
 
				+            padding: 20px 30px;

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 600px){

			
 
				+        .t{

			
 
				+            padding: 30px;

			
 
				+        }

			
 
				+    }

			
 
				+    @media screen and (max-width: 400px){

			
 
				+        .b{

			
 
				+            text-align: center;

			
 
				+            .l{

			
 
				+                float: none;

			
 
				+            }

			
 
				+            .r{

			
 
				+                float: none;

			
 
				+                margin-top: 20px;

			
 
				+            }

			
 
				+        }

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+.floor-4{

			
 
				+    padding-top: 220px;

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        padding-top: 0;

			
 
				+    }

			
 
				+

			
 
				+}

			
 
				+

			
 
				+.jm{

			
 
				+    @include clearfix;

			
 
				+    padding: 30px 220px;

			
 
				+    background: url("../images/jm_bg.png") no-repeat center;

			
 
				+    background-size: 200px;

			
 
				+    a{

			
 
				+        position: relative;

			
 
				+        display: inline-block;

			
 
				+        padding-top: 70px;

			
 
				+        width: 200px;

			
 
				+        text-align: center;

			
 
				+        color: #202020;

			
 
				+        &:hover{

			
 
				+            i{

			
 
				+                top: -30px;

			
 
				+            }

			
 
				+        }

			
 
				+    }

			
 
				+    i{

			
 
				+        position: absolute;

			
 
				+        left: 50%;

			
 
				+        top: 0;

			
 
				+        -webkit-transform: translate(-50%, 0);

			
 
				+        -moz-transform: translate(-50%, 0);

			
 
				+        -ms-transform: translate(-50%, 0);

			
 
				+        -o-transform: translate(-50%, 0);

			
 
				+        transform: translate(-50%, 0);

			
 
				+        transition: top .3s linear;

			
 
				+    }

			
 
				+    .txt{

			
 
				+        position: relative;

			
 
				+        z-index: 10;

			
 
				+        border-top: #e1e1e1 solid 1px;

			
 
				+        background-color: #fff;

			
 
				+    }

			
 
				+    h2{

			
 
				+        padding-top: 10px;

			
 
				+        line-height: 1.4;

			
 
				+        font-size: 28px;

			
 
				+    }

			
 
				+    p{

			
 
				+        color: #959595;

			
 
				+    }

			
 
				+    @media screen and (max-width: 800px){

			
 
				+        padding: 30px 50px;

			
 
				+        background: none;

			
 
				+    }

			
 
				+    @media screen and (max-width: 600px){

			
 
				+        padding: 0 100px;

			
 
				+        text-align: center;

			
 
				+        a{

			
 
				+            float: none;

			
 
				+            margin: 30px 0;

			
 
				+        }

			
 
				+    }

			
 
				+}
			
--- a/static/sass/main.scss
+++ b/static/sass/main.scss
@@ -0,0 +1,4 @@
 
				+@import "normalize";

			
 
				+@import "mixins";

			
 
				+@import "scaffolding";

			
 
				+@import "index";
			
--- a/static/sass/mixins.scss
+++ b/static/sass/mixins.scss
@@ -0,0 +1,18 @@
 
				+@mixin clearfix {

			
 
				+    *zoom: 1;

			
 
				+    &:after,

			
 
				+    &:before {

			
 
				+        content: "";

			
 
				+        display: table;

			
 
				+    }

			
 
				+    &:after {

			
 
				+        clear: both;

			
 
				+        overflow: hidden;

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+@mixin hide-text{

			
 
				+    text-indent: -999em;

			
 
				+    overflow: hidden;

			
 
				+    color: transparent;

			
 
				+}
			
--- a/static/sass/normalize.scss
+++ b/static/sass/normalize.scss
@@ -0,0 +1,422 @@
 
				+//

			
 
				+// 1. Set default font family to sans-serif.

			
 
				+// 2. Prevent iOS and IE text size adjust after device orientation change,

			
 
				+//    without disabling user zoom.

			
 
				+//

			
 
				+

			
 
				+html {

			
 
				+    font-family: sans-serif; // 1

			
 
				+    -ms-text-size-adjust: 100%; // 2

			
 
				+    -webkit-text-size-adjust: 100%; // 2

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Remove default margin.

			
 
				+//

			
 
				+

			
 
				+body {

			
 
				+    margin: 0;

			
 
				+}

			
 
				+

			
 
				+// HTML5 display definitions

			
 
				+// ==========================================================================

			
 
				+

			
 
				+//

			
 
				+// Correct `block` display not defined for any HTML5 element in IE 8/9.

			
 
				+// Correct `block` display not defined for `details` or `summary` in IE 10/11

			
 
				+// and Firefox.

			
 
				+// Correct `block` display not defined for `main` in IE 11.

			
 
				+//

			
 
				+

			
 
				+article,

			
 
				+aside,

			
 
				+details,

			
 
				+figcaption,

			
 
				+figure,

			
 
				+footer,

			
 
				+header,

			
 
				+hgroup,

			
 
				+main,

			
 
				+menu,

			
 
				+nav,

			
 
				+section,

			
 
				+summary {

			
 
				+    display: block;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// 1. Correct `inline-block` display not defined in IE 8/9.

			
 
				+// 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.

			
 
				+//

			
 
				+

			
 
				+audio,

			
 
				+canvas,

			
 
				+progress,

			
 
				+video {

			
 
				+    display: inline-block; // 1

			
 
				+    vertical-align: baseline; // 2

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Prevent modern browsers from displaying `audio` without controls.

			
 
				+// Remove excess height in iOS 5 devices.

			
 
				+//

			
 
				+

			
 
				+audio:not([controls]) {

			
 
				+    display: none;

			
 
				+    height: 0;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address `[hidden]` styling not present in IE 8/9/10.

			
 
				+// Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.

			
 
				+//

			
 
				+

			
 
				+[hidden],

			
 
				+template {

			
 
				+    display: none;

			
 
				+}

			
 
				+

			
 
				+// Links

			
 
				+// ==========================================================================

			
 
				+

			
 
				+//

			
 
				+// Remove the gray background color from active links in IE 10.

			
 
				+//

			
 
				+

			
 
				+a {

			
 
				+    background-color: transparent;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Improve readability of focused elements when they are also in an

			
 
				+// active/hover state.

			
 
				+//

			
 
				+

			
 
				+a:active,

			
 
				+a:hover {

			
 
				+    outline: 0;

			
 
				+}

			
 
				+

			
 
				+// Text-level semantics

			
 
				+// ==========================================================================

			
 
				+

			
 
				+//

			
 
				+// Address styling not present in IE 8/9/10/11, Safari, and Chrome.

			
 
				+//

			
 
				+

			
 
				+abbr[title] {

			
 
				+    border-bottom: 1px dotted;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address style set to `bolder` in Firefox 4+, Safari, and Chrome.

			
 
				+//

			
 
				+

			
 
				+b,

			
 
				+strong {

			
 
				+    font-weight: bold;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address styling not present in Safari and Chrome.

			
 
				+//

			
 
				+

			
 
				+dfn {

			
 
				+    font-style: italic;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address variable `h1` font-size and margin within `section` and `article`

			
 
				+// contexts in Firefox 4+, Safari, and Chrome.

			
 
				+//

			
 
				+

			
 
				+h1 {

			
 
				+    font-size: 2em;

			
 
				+    margin: 0.67em 0;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address styling not present in IE 8/9.

			
 
				+//

			
 
				+

			
 
				+mark {

			
 
				+    background: #ff0;

			
 
				+    color: #000;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address inconsistent and variable font size in all browsers.

			
 
				+//

			
 
				+

			
 
				+small {

			
 
				+    font-size: 80%;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Prevent `sub` and `sup` affecting `line-height` in all browsers.

			
 
				+//

			
 
				+

			
 
				+sub,

			
 
				+sup {

			
 
				+    font-size: 75%;

			
 
				+    line-height: 0;

			
 
				+    position: relative;

			
 
				+    vertical-align: baseline;

			
 
				+}

			
 
				+

			
 
				+sup {

			
 
				+    top: -0.5em;

			
 
				+}

			
 
				+

			
 
				+sub {

			
 
				+    bottom: -0.25em;

			
 
				+}

			
 
				+

			
 
				+// Embedded content

			
 
				+// ==========================================================================

			
 
				+

			
 
				+//

			
 
				+// Remove border when inside `a` element in IE 8/9/10.

			
 
				+//

			
 
				+

			
 
				+img {

			
 
				+    border: 0;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Correct overflow not hidden in IE 9/10/11.

			
 
				+//

			
 
				+

			
 
				+svg:not(:root) {

			
 
				+    overflow: hidden;

			
 
				+}

			
 
				+

			
 
				+// Grouping content

			
 
				+// ==========================================================================

			
 
				+

			
 
				+//

			
 
				+// Address margin not present in IE 8/9 and Safari.

			
 
				+//

			
 
				+

			
 
				+figure {

			
 
				+    margin: 1em 40px;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address differences between Firefox and other browsers.

			
 
				+//

			
 
				+

			
 
				+hr {

			
 
				+    box-sizing: content-box;

			
 
				+    height: 0;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Contain overflow in all browsers.

			
 
				+//

			
 
				+

			
 
				+pre {

			
 
				+    overflow: auto;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address odd `em`-unit font size rendering in all browsers.

			
 
				+//

			
 
				+

			
 
				+code,

			
 
				+kbd,

			
 
				+pre,

			
 
				+samp {

			
 
				+    font-family: monospace, monospace;

			
 
				+    font-size: 1em;

			
 
				+}

			
 
				+

			
 
				+// Forms

			
 
				+// ==========================================================================

			
 
				+

			
 
				+//

			
 
				+// Known limitation: by default, Chrome and Safari on OS X allow very limited

			
 
				+// styling of `select`, unless a `border` property is set.

			
 
				+//

			
 
				+

			
 
				+//

			
 
				+// 1. Correct color not being inherited.

			
 
				+//    Known issue: affects color of disabled elements.

			
 
				+// 2. Correct font properties not being inherited.

			
 
				+// 3. Address margins set differently in Firefox 4+, Safari, and Chrome.

			
 
				+//

			
 
				+

			
 
				+button,

			
 
				+input,

			
 
				+optgroup,

			
 
				+select,

			
 
				+textarea {

			
 
				+    color: inherit; // 1

			
 
				+    font: inherit; // 2

			
 
				+    margin: 0; // 3

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address `overflow` set to `hidden` in IE 8/9/10/11.

			
 
				+//

			
 
				+

			
 
				+button {

			
 
				+    overflow: visible;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address inconsistent `text-transform` inheritance for `button` and `select`.

			
 
				+// All other form control elements do not inherit `text-transform` values.

			
 
				+// Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.

			
 
				+// Correct `select` style inheritance in Firefox.

			
 
				+//

			
 
				+

			
 
				+button,

			
 
				+select {

			
 
				+    text-transform: none;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`

			
 
				+//    and `video` controls.

			
 
				+// 2. Correct inability to style clickable `input` types in iOS.

			
 
				+// 3. Improve usability and consistency of cursor style between image-type

			
 
				+//    `input` and others.

			
 
				+//

			
 
				+

			
 
				+button,

			
 
				+html input[type="button"], // 1

			
 
				+input[type="reset"],

			
 
				+input[type="submit"] {

			
 
				+    -webkit-appearance: button; // 2

			
 
				+    cursor: pointer; // 3

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Re-set default cursor for disabled elements.

			
 
				+//

			
 
				+

			
 
				+button[disabled],

			
 
				+html input[disabled] {

			
 
				+    cursor: default;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Remove inner padding and border in Firefox 4+.

			
 
				+//

			
 
				+

			
 
				+button::-moz-focus-inner,

			
 
				+input::-moz-focus-inner {

			
 
				+    border: 0;

			
 
				+    padding: 0;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Address Firefox 4+ setting `line-height` on `input` using `!important` in

			
 
				+// the UA stylesheet.

			
 
				+//

			
 
				+

			
 
				+input {

			
 
				+    line-height: normal;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// It's recommended that you don't attempt to style these elements.

			
 
				+// Firefox's implementation doesn't respect box-sizing, padding, or width.

			
 
				+//

			
 
				+// 1. Address box sizing set to `content-box` in IE 8/9/10.

			
 
				+// 2. Remove excess padding in IE 8/9/10.

			
 
				+//

			
 
				+

			
 
				+input[type="checkbox"],

			
 
				+input[type="radio"] {

			
 
				+    box-sizing: border-box; // 1

			
 
				+    padding: 0; // 2

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Fix the cursor style for Chrome's increment/decrement buttons. For certain

			
 
				+// `font-size` values of the `input`, it causes the cursor style of the

			
 
				+// decrement button to change from `default` to `text`.

			
 
				+//

			
 
				+

			
 
				+input[type="number"]::-webkit-inner-spin-button,

			
 
				+input[type="number"]::-webkit-outer-spin-button {

			
 
				+    height: auto;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// 1. Address `appearance` set to `searchfield` in Safari and Chrome.

			
 
				+// 2. Address `box-sizing` set to `border-box` in Safari and Chrome.

			
 
				+//

			
 
				+

			
 
				+input[type="search"] {

			
 
				+    -webkit-appearance: textfield; // 1

			
 
				+    box-sizing: content-box; //2

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Remove inner padding and search cancel button in Safari and Chrome on OS X.

			
 
				+// Safari (but not Chrome) clips the cancel button when the search input has

			
 
				+// padding (and `textfield` appearance).

			
 
				+//

			
 
				+

			
 
				+input[type="search"]::-webkit-search-cancel-button,

			
 
				+input[type="search"]::-webkit-search-decoration {

			
 
				+    -webkit-appearance: none;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Define consistent border, margin, and padding.

			
 
				+//

			
 
				+

			
 
				+fieldset {

			
 
				+    border: 1px solid #c0c0c0;

			
 
				+    margin: 0 2px;

			
 
				+    padding: 0.35em 0.625em 0.75em;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// 1. Correct `color` not being inherited in IE 8/9/10/11.

			
 
				+// 2. Remove padding so people aren't caught out if they zero out fieldsets.

			
 
				+//

			
 
				+

			
 
				+legend {

			
 
				+    border: 0; // 1

			
 
				+    padding: 0; // 2

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Remove default vertical scrollbar in IE 8/9/10/11.

			
 
				+//

			
 
				+

			
 
				+textarea {

			
 
				+    overflow: auto;

			
 
				+}

			
 
				+

			
 
				+//

			
 
				+// Don't inherit the `font-weight` (applied by a rule above).

			
 
				+// NOTE: the default cannot safely be changed in Chrome and Safari on OS X.

			
 
				+//

			
 
				+

			
 
				+optgroup {

			
 
				+    font-weight: bold;

			
 
				+}

			
 
				+

			
 
				+// Tables

			
 
				+// ==========================================================================

			
 
				+

			
 
				+//

			
 
				+// Remove most spacing between table cells.

			
 
				+//

			
 
				+

			
 
				+table {

			
 
				+    border-collapse: collapse;

			
 
				+    border-spacing: 0;

			
 
				+}

			
 
				+

			
 
				+td,

			
 
				+th {

			
 
				+    padding: 0;

			
 
				+}
			
--- a/static/sass/scaffolding.scss
+++ b/static/sass/scaffolding.scss
@@ -0,0 +1,95 @@
 
				+// variable

			
 
				+$theme-color: #70b94c !default;

			
 
				+

			
 
				+// type

			
 
				+body {

			
 
				+    line-height: 1.5em;

			
 
				+    font-family: "microsoft yahei";

			
 
				+    font-size: 14px;

			
 
				+    color: #202020;

			
 
				+}

			
 
				+

			
 
				+ul {

			
 
				+    margin: 0;

			
 
				+    padding: 0;

			
 
				+    list-style: none;

			
 
				+}

			
 
				+

			
 
				+em, i{

			
 
				+    font-style: normal;

			
 
				+}

			
 
				+

			
 
				+a {

			
 
				+    text-decoration: none;

			
 
				+}

			
 
				+

			
 
				+h1, h2, h3, h4, h5, h6, p {

			
 
				+    margin: 0;

			
 
				+    font-weight: normal;

			
 
				+}

			
 
				+

			
 
				+input[type=text],

			
 
				+input[type=password],

			
 
				+button{

			
 
				+    -webkit-appearance: none;

			
 
				+}

			
 
				+

			
 
				+button{

			
 
				+    border: 0;

			
 
				+}

			
 
				+

			
 
				+// Function

			
 
				+@for $i from 1 through 5 {

			
 
				+    $odd: 5 !default;

			
 
				+    $space: $i * 10px;

			
 
				+    .mt#{$i}0 {

			
 
				+        margin-top: $space;

			
 
				+    }

			
 
				+    .mt#{$i}5 {

			
 
				+        margin-top: $space + $odd;

			
 
				+    }

			
 
				+    .mr#{$i}0 {

			
 
				+        margin-right: $space;

			
 
				+    }

			
 
				+    .mr#{$i}5 {

			
 
				+        margin-right: $space + $odd;

			
 
				+    }

			
 
				+    .mb#{$i}0 {

			
 
				+        margin-bottom: $space;

			
 
				+    }

			
 
				+    .mb#{$i}5 {

			
 
				+        margin-bottom: $space + $odd;

			
 
				+    }

			
 
				+    .ml#{$i}0 {

			
 
				+        margin-left: $space;

			
 
				+    }

			
 
				+    .ml#{$i}5 {

			
 
				+        margin-left: $space + $odd;

			
 
				+    }

			
 
				+}

			
 
				+

			
 
				+// icon

			
 
				+[class^="icon-"],

			
 
				+[class*=" icon-"] {

			
 
				+    display: inline-block;

			
 
				+    background-repeat: no-repeat;

			
 
				+    background-size: 100%;

			
 
				+    overflow: hidden;

			
 
				+}

			
 
				+

			
 
				+// shortcut

			
 
				+.l {

			
 
				+    float: left;

			
 
				+}

			
 
				+

			
 
				+.r {

			
 
				+    float: right;

			
 
				+}

			
 
				+

			
 
				+.text-center {

			
 
				+    text-align: center;

			
 
				+}

			
 
				+

			
 
				+

			
 
				+

			
 
				+