/* Minification failed. Returning unminified contents.
(910,13): run-time error CSS1026: Expected open brace, found 'to'
(944,13): run-time error CSS1026: Expected open brace, found 'to'
(4271,205): run-time error CSS1036: Expected expression, found '}'
 */
body { color:#666; font-size:12px; font-family: Arial, "Microsoft YaHei"; position: relative; min-width:1300px;}
form,div,body,img,p,img,dl,dt,dd,h2,h1,h3,h4,h5,h6{ margin:0px; padding:0px; border:0; }
a:link{ color:#666; text-decoration:none;}
a:visited{ color:#666; text-decoration:none;}
a:hover{ color:#666; text-decoration:none;}
a:focus { -moz-outline-style: none; }
a:active{ outline:none; text-decoration:none;}
em,i{ font-style:normal; }
ul,li{ list-style:none; margin:0; padding:0;}
input,textarea,select{ color:#666; margin:0; padding:0; font-size:12px; font-family:Arial; vertical-align:middle; -webkit-appearance:none; appearance:none; -moz-appearance:none; resize:none; -ms-appearance:none;}
select::-ms-expand { display: none; }   
input:focus,textarea:focus{ outline:none;}
select:focus {outline:none;}
input[type="submit"], input[type="button"] {border:0; cursor:pointer; font-family:"Microsoft YaHei";}
/*删除火狐下按钮默认样式*/
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner{
	border:none; padding:0;
}
/*浮动*/
.clearboth:after{ display:block; clear:both; content:""; overflow:hidden; height:0; }
.clearboth{ *zoom:1;}
.FL{ float:left;}
.FR{ float:right;}

@font-face {
  font-family: 'brush-tip-terrence';
  src: url('../font/brush-tip-terrence/BTTTRIAL.ttf') format('truetype'),
       url('../font/brush-tip-terrence/BTTTRIAL.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Helvetica Bold';
  src: url('../font/Helvetica Bold/Helvetica Bold.ttf') format('truetype'),
       url('../font/Helvetica Bold/Helvetica Bold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

/*百度分享*/
.sr-bdimgshare {display:none !important;}

/*header*/
.header {width:100%; height:60px; line-height:60px; padding:10px 0; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s; z-index:9999; background:#23272b;}
.header.cur {position:fixed; top:0; left:0; background:transparent;}
.header .headerBox {width:1300px; margin:auto; position:relative;}
.header .headerBox .logo {display:block; position:absolute; left:0; top:0;}
.header .headerBox ul {float:right; margin-right:70px;}
.header .headerBox ul li {float:left;}
.header .headerBox ul li a {display:block; position:relative; color:#fff; font-size:14px; padding:0 26px; perspective:800px; -webkit-perspective:800px; transform-style:preserve-3d;}
.header .headerBox ul li a i {display:block; position:absolute; width:0; height:3px; background:#03c9f9; left:50%; bottom:-10px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.header .headerBox ul li a span {display:block; transition:all .6s; -webkit-transition:all .6s; -moz-transition:all .6s; transform-origin:center -50px;}
.header .headerBox ul li a span:nth-child(2) {transform:rotateX(180deg); -webkit-transform:rotateX(180deg); -moz-transform:rotateX(180deg); position:absolute; left:0; top:0; width:100%; height:100%; text-align:center; color:#03c9f9; opacity:0;}
.header .headerBox ul li.cur > a, .header .headerBox ul li.cur a.cur {color:#03c9f9;}
.header .headerBox ul li.cur > a i {width:100%; left:0;}
.header .headerBox ul li:hover a span:first-child {transform:translateY(100%); -webkit-transform:translateY(100%); -moz-transform:translateY(100%); opacity:0;}
.header .headerBox ul li:hover a span:nth-child(2) {transform:rotateX(0); -webkit-transform:rotateX(0); -moz-transform:rotateX(0); opacity:1;}
.header .headerBox ul li:hover a i {background:#03c9f9;}
.header .headerBox .wechat {display:block; width:36px; height:36px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; border:1px solid #fff; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; background:url(../images/icon_wechat.png) no-repeat center; position:absolute; right:0; top:50%; margin-top:-18px; opacity:.44; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.header .headerBox .wechat:hover {opacity:1;}
.header .headerBox .wechat span {display:block; position:absolute; top:100%; left:50%; margin-left:-74px; opacity:0; visibility:hidden; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s; width:148px; z-index:999;}
.header .headerBox .wechat span img {display:block; width:100%; padding-top:24px;}
.header .headerBox .wechat:hover span {opacity:1; visibility:visible;}
.header .headerBox ul li > div {position:fixed; width:100%; left:0; top:80px; background:#3c4349; text-align:center; height:64px; line-height:64px; opacity:0; visibility:hidden; transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s; z-index:999;}
.header .headerBox ul li:hover > div {visibility:visible; opacity:1;}
.header .headerBox ul li > div a {display:inline-block; transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;}
.header .headerBox ul li > div a:hover {color:#03c9f9;}

/*footer*/
.footer {width:100%; background:#222; padding:40px 0 16px;}
.footer.fixed {position:absolute; width:100%; left:0; bottom:0;}
.footer.cur {position:fixed; width:100%; left:0; bottom:0;}
.footer .footerBox {width:1300px; margin:auto; position:relative;}
.footer .footerBox .logo {position:absolute; top:-5px; left:0;}
.footer .footerBox .footer1 {width:750px; padding-left:204px; float:left;}
.footer .footerBox .footer1 > div {padding:15px 0 22px;}
.footer .footerBox .footer1 > div img {display:block; float:left; margin-top:-8px;}
.footer .footerBox .footer1 > div span, .footer .footerBox .footer1 > div a {font-size:14px; color:#777; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s; float:left; display:block;}
.footer .footerBox .footer1 > div a {padding:0 15px 0 38px;}
.footer .footerBox .footer1 > div a:hover {color:#fff;}
.footer .footerBox .footer1 ul li {float:left; margin-left:50px;}
.footer .footerBox .footer1 ul li:first-child {margin-left:5px;}
.footer .footerBox .footer1 ul li a {font-size:14px; color:#999; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.footer .footerBox .footer1 ul li.cur a, .footer .footerBox .footer1 ul li a:hover {color:#03c9f9;}
.footer .footerBox .footer1 > span {display:block; font-family:SimSun; color:#585858; padding-top:25px;}
.footer .footerBox .footer1 > span span {padding-left:20px;}
.footer .footerBox .footer2 {float:right; width:346px; box-sizing:border-box; -webkit-box-sizing:border-box; border-left:1px solid #2e2e2e; position:relative; height:110px; display:table;}
.footer .footerBox .footer2 img {display:block; position:absolute; top:4px; right:0;}
.footer .footerBox .footer2 div {text-align:right; display:table-cell; vertical-align:middle; padding-right:150px;}
.footer .footerBox .footer2 div span {padding-right:20px; display:block;}
.footer .footerBox .footer2 div span:nth-child(2) {background:url(../images/icon_arrow.png) no-repeat right center; margin-top:10px;}

/*右侧悬浮*/
.online {display:block; position:fixed; right:0; top:50%; width:40px; height:168px; margin-top:-84px; z-index:9999;}
.online .onlineBtn {display:block; position:absolute; right:0; top:0; background:#202325 url(../images/icon_online.png) no-repeat center; width:40px; height:40px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s; cursor:pointer;}
.online .onlineBox {position:absolute; right:-170px; width:170px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.online .onlineBox .online_title {height:42px; background:#202325; padding:0 14px; line-height:42px; font-size:14px; color:#a4a4a4; position:relative;}
.online .onlineBox ul li {height:42px; line-height:42px; padding:0 14px; border-top:1px solid rgba(255,255,255,.1); background:#303437;}
.online .onlineBox ul li a {display:block; font-size:14px; color:#a4a4a4; padding-left:30px; background:url(../images/icon_tel.png) no-repeat left center; transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;}
.online .onlineBox ul li:nth-child(2) a {background:url(../images/icon_qq.png) no-repeat left center;}
.online .onlineBox ul li:nth-child(3) a {background:url(../images/icon_message.png) no-repeat left center; padding-left:34px; font-size:12px;}
.online .onlineBox ul li a:hover {color:#03c9f9; background:url(../images/icon_tel1.png) no-repeat left center;}
.online .onlineBox ul li:nth-child(2) a:hover {background:url(../images/icon_qq1.png) no-repeat left center;}
.online .onlineBox ul li:nth-child(3) a:hover {background:url(../images/icon_message1.png) no-repeat left center; padding-left:34px; font-size:12px;}
.online .onlineBox .close {display:block; position:absolute; cursor:pointer; right:14px; top:50%; margin-top:-5.5px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.online .onlineBox .close:hover {transform:rotate(180deg);}
.online.cur .onlineBox {right:0;}
.online.cur .onlineBtn {right:-100%;}

/*留言弹框*/
.jumpBox {position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,.7); z-index:9999; display:none;}
.jumpBox .box {background:#fff; position:absolute; top:50%; left:50%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.jumpBox .box .close {cursor:pointer; display:block; position:absolute; right:14px; top:11px; width:19px; height:19px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.jumpBox .box .close:before, .jumpBox .box .close:after {content:""; position:absolute; display:block; width:100%; height:1px; background:#adadad; top:50%; right:0; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.jumpBox .box .close:after {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg);}
.jumpBox .box .close:hover:before, .jumpBox .box .close:hover:after {background:#03c9f9;}
.jumpBox .box .close:hover {transform:rotate(180deg);}
.jumpBox.message .box {width:772px; height:428px; margin-top:-214px; margin-left:-386px; padding:34px 65px 0;}
.jumpBox.message .box > em {display:block; text-align:center; font-size:16px; color:#333; font-weight:bold;}
.jumpBox.message .box > em span {display:inline-block; background:url(../images/icon_message1.png) no-repeat left center; line-height:19px; padding-left:32px;}
.jumpBox.message .box ul li {width:100%; position:relative; margin-top:20px; line-height:40px;}
.jumpBox.message .box ul li > div {position:relative; float:left; width:300px;}
.jumpBox.message .box ul li > div:nth-child(2) {float:right;}
.jumpBox.message .box ul li em {display:block; position:absolute; left:-10px; top:0; line-height:40px; color:red; font-size:14px;}
.jumpBox.message .box ul li input, .jumpBox.message .box ul li textarea {display:block; width:100%; line-height:14px; color:#727578; font-size:14px; padding:0 14px; border:1px solid rgba(105,107,110,.4); border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; font-family:"Microsoft YaHei"; height:40px;}
.jumpBox.message .box ul li textarea {height:120px; line-height:20px; padding:10px 14px;}
.jumpBox.message .box ul li .tip {display:block; position:absolute; color:red; font-size:12px; top:40px; left:0; line-height:20px; padding-left:10px; display:none;}
.jumpBox .box .submit {display:block; margin:30px auto 0; background:#23272b; color:#fff; font-size:16px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; text-align:center; width:154px; height:42px; line-height:42px;}
.jumpBox.message .box ul li i {display:block; position:absolute; left:0; top:0; width:0; height:100%; background:rgba(3,201,249,.1); transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.jumpBox.message .box ul li input:focus, .jumpBox.message .box ul li textarea:focus {border:1px solid #03c9f9;}
.jumpBox.message .box ul li i.focus {width:100%;}
.jumpBox.message .box ul li input.cur:focus, .jumpBox.message .box ul li textarea.cur:focus {border:1px solid red;}
.jumpBox.message .box ul li i.focus.cur {background:none;}

/*公共弹框*/
.jumpBox.alertBox .box {width:400px; height:180px; margin-left:-200px; margin-top:-90px;}
.jumpBox.alertBox .box .submit {position:absolute; bottom:20px; left:50%; margin-left:-77px;}
.jumpBox.alertBox .box .word {display:table; height:100px; text-align:center; font-size:18px; color:#333; padding:20px 20px 0; width:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.jumpBox.alertBox .box .word span {display:table-cell; vertical-align:middle;}



@media screen and (max-width: 1620px){
	
}
@media screen and (max-width: 1460px){
	
}
@media screen and (max-width: 1380px){
	
}
@charset "UTF-8";

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */


@keyframes opacity {
  0% {opacity: 0;}
  50% {opacity: 1; width:100%; height:100%;}
  100% {opacity: 0; width:120%; height:120%;}
}
@-webkit-keyframes opacity {
  0% {opacity: 0;}
  50% {opacity: 1; width:100%; height:100%;}
  100% {opacity: 0; width:120%; height:120%;}
}

@keyframes rotate {
  0% {
    opacity: 1;
  }
  to {
    transform: rotate(360deg);    
    opacity: 1;
  }
}
@-webkit-keyframes rotate {
  0% {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate(360deg);
    opacity: 1;    
  }
}

@keyframes rotateInY {
  to {
    transform: rotateY(360deg);
    opacity: 1;
  }
}
@-webkit-keyframes rotateInY {
  to {
    -webkit-transform: rotateY(360deg);
    opacity: 1;
  }
}

@keyframes rotateInX {
  to {
    transform: rotateX(360deg);
    opacity: 1;
  }
}
@-webkit-keyframes rotateInX {
  to {
    -webkit-transform: rotateX(360deg);
    opacity: 1;
  }
}

@keyframes clipLine {
  0% {
    clip: rect(429px, 5px, 429px, 0);
  }
  93% {
    opacity: 1;
    clip: rect(0, 5px, 429px, 0);
  }
  100% {
    opacity: 1;
    clip: rect(0, 210px, 429px, 0);
  }
}
@-webkit-keyframes clipLine {
  0% {
    clip: rect(429px, 5px, 429px, 0);
  }
  93% {
    opacity: 1;
    clip: rect(0, 5px, 429px, 0);
  }
  100% {
    opacity: 1;
    clip: rect(0, 210px, 429px, 0);
  }
}

@keyframes clipImg {
  0% {
    clip: rect(0, 0, 108px, 0);
  }
  50% {    
    clip: rect(0, 112px, 108px, 0);
  }
  100% {    
    clip: rect(0, 112px, 108px, 112px);
  }
}
@-webkit-keyframes clipImg {
  0% {
    clip: rect(0, 0, 108px, 0);
  }
  50% {    
    clip: rect(0, 112px, 108px, 0);
  }
  100% {    
    clip: rect(0, 112px, 108px, 112px);
  }
}


 
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}

@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -16px, 0);
    transform: translate3d(0, -16px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -8px, 0);
    transform: translate3d(0, -8px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-2.13px,0);
    transform: translate3d(0,-2.13px,0);
  }
}

@keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -16px, 0);
    transform: translate3d(0, -16px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -8px, 0);
    transform: translate3d(0, -8px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-2.13px,0);
    transform: translate3d(0,-2.13px,0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

@keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes bounceOnce {
  from, 25% to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {    
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  25% {
    -webkit-transform: scale3d(1.2, 1.2, 1.2);
    transform: scale3d(1.2, 1.2, 1.2);
  }

  /*50% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  75% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }*/

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceOnce {
  from, 25% to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {    
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  25% {
    -webkit-transform: scale3d(1.2, 1.2, 1.2);
    transform: scale3d(1.2, 1.2, 1.2);
  }

  /*50% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  75% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }*/

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@-webkit-keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }

}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
    transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
    transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1 !important;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1 !important;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInYOnce {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}
@keyframes flipInYOnce {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}

@-webkit-keyframes flipInYLeft {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}
@keyframes flipInYLeft {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1 !important;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1 !important;
  }
}

@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}


@-webkit-keyframes rotateInCircle {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -60deg);
    transform: rotate3d(0, 0, 1, -60deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@keyframes rotateInCircle {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -60deg);
    transform: rotate3d(0, 0, 1, -60deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50%, 100% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50%, 100% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
  to {
    opacity: 1;
  }
}

@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
  to {
    opacity: 1;
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }

  to {
    opacity: 1;
  }
}

@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }

  to {
    opacity: 1;
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }

  to {
    opacity: 1;
  }
}

@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }

  to {
    opacity: 1;
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
  100% {
    opacity: 1;
  }
}

@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
  100% {
    opacity: 1;
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
    transform: scale(.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
    transform: scale(.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
    transform: scale(.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
    transform: scale(.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

/*首页*/
.section.first {position:relative; display:block; overflow:hidden;}
.section.first video {min-width:100%; min-height:100%; display:block; z-index:-1; position:fixed; left:0; top:0; width:auto; height:auto; transition:all .6s; -webkit-transition:all .6s; -moz-transition:all .6s;}
.section.first .banner {position:absolute; width:100%; height:100%; top:0; left:0; background:url(../images/index/banner.png) no-repeat center; background-size:32.7%;}
.section.first.cur video {transform:translateY(-100%); -webkit-transform:translateY(-100%); -moz-transform:translateY(-100%);}
.second {display:block; padding-top:70px;}
.second .tableCell {display:block;}
.second .practice {width:1300px; margin:66px auto 350px; position:relative;}
.second .title em {display:block; font-size:27px; color:#7f8993; font-family: 'brush-tip-terrence'; line-height:30px;}
.second .title span {display:block; color:#7f8993; font-size:14px; font-family:"PingFang SC";}
.second .practice .title {padding-top:32px; float:left;}
.second .black {float:right; width:840px; height:352px; background:#23272b; position:relative; overflow:hidden; /*opacity:0;*/}
.second .black > img {display:block; position:absolute; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.second .practice .black .block1 {top:66px; left:-30px; transform-origin:left top;}
.second .practice .black .block2 {top:-60px; right:-98px;}
.second .practice .black:hover .block1 {top:-30px; left:-60px; transform:rotate(10deg); -webkit-transform:rotate(10deg); -moz-transform:rotate(10deg);}
.second .practice .black:hover .block2 {top:-30px; right:-70px; transform:rotate(10deg); -webkit-transform:rotate(10deg); -moz-transform:rotate(10deg);}
.second .practice .black .num {position:absolute; top:40px; left:40px;}
.second .num > i, .second .num > span {display:block; background:#79838e; height:3px; width:100%; padding-right:15px;}
.second .num > i {width:10px; padding-right:0;}
.second .num > em {display:block; font-size:41px; color:#79838d; font-family:"Adobe Heiti Std"; line-height:50px;}
.second .practice .intro {position:absolute; top:50px; left:436px;}
.second .intro > em {display:block; font-size:23px; color:#5a6269; font-family: 'brush-tip-terrence'; line-height:30px;}
.second .intro > i {display:block; width:34px; height:4px; background:#4a5157; margin:8px 0 14px;}
.second .intro > span {display:block; font-size:26px; line-height:35px; color:#fff; font-family:"PingFang SC";}
.second .moreBtn {display:block; width:92px; height:28px; line-height:28px; border:1px solid #fff; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; color:#fff; opacity:.6; text-align:center; font-size:14px; font-family:"Microsoft YaHei"; margin-top:44px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.second .practice .black .moreBtn:hover {border:1px solid #03c9f9; background:#03c9f9; opacity:1;}
.second .practice .slider {width:868px; height:318px; position:absolute; top:132px; right:545px;}
.bx-wrapper {margin:auto;}
.second .bx-wrapper .bx-viewport {left:0; border:0; box-shadow:none;}
.second .bx-wrapper .bx-controls-direction a {width:30px; height:30px; margin-top:0; top:0; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.second .bx-wrapper .bx-controls-direction a.bx-prev {top:220px; left:auto; right:-30px; background:#444b53 url(../images/index/icon_prev.png) no-repeat center; display:none;}
.second .bx-wrapper .bx-controls-direction a.bx-next {top:190px; right:-30px; background:#23272b url(../images/index/icon_next.png) no-repeat center; display:none;}
.second .bx-wrapper .bx-controls-direction a.bx-prev:hover {background:#03c9f9 url(../images/index/icon_prev.png) no-repeat center;}
.second .bx-wrapper .bx-controls-direction a.bx-next:hover {background:#03c9f9 url(../images/index/icon_next.png) no-repeat center;}
.second .learning {width:1300px; margin:0 auto -35px; position:relative; z-index:99;}
.second .learning .intro {float:left; width:388px;}
.second .learning .intro > em {color:#7f8993;}
.second .learning .intro > i {background:#7f8993;}
.second .learning .intro > span {color:#23272b;}
.second .learning .intro .moreBtn {border:1px solid #7d8385; color:#333; opacity:.6;}
.second .learning .intro .moreBtn:hover {border:1px solid #03c9f9; background:#03c9f9; opacity:1; color:#fff;}
.second .learning .black {width:710px; height:286px; float:left;}
.second .learning .black .block3 {top:-242px; left:-242px;}
.second .learning .black:hover .block3 {top:-304px; left:-270px;}
.second .learning .black .num {position:absolute; left:40px; bottom:56px;}
.second .learning .black .title {position:absolute; left:134px; bottom:56px; opacity:.29; z-index:999;}
.second .learning .black .title em, .second .learning .black .title span {color:#8195ab;}
.second .learning .slider {position:absolute; top:-124px; right:0; width:742px; height:352px;}
.second .learning .bx-wrapper .bx-controls-direction a.bx-prev {top:124px; right:auto; left:-30px; background:#444b53 url(../images/index/icon_prev.png) no-repeat center; display:none;}
.second .learning .bx-wrapper .bx-controls-direction a.bx-next {top:94px; right:auto; left:-30px; background:#23272b url(../images/index/icon_next.png) no-repeat center; display:none;}
.second .learning .bx-wrapper .bx-controls-direction a.bx-prev:hover {background:#03c9f9 url(../images/index/icon_prev.png) no-repeat center;}
.second .learning .bx-wrapper .bx-controls-direction a.bx-next:hover {background:#03c9f9 url(../images/index/icon_next.png) no-repeat center;}
.second .story {width:100%; background:#ebfbff; padding:144px 0 150px; position:relative;}
.second .story > i {display:block; background:#ebfbff; width:50%; height:225px; position:absolute; top:-225px; right:0; z-index:-1;}
.second .story .storyBox {width:1300px; margin:auto;}
.second .story .storyBox .img {float:left; width:742px; height:352px; position:relative; padding:26px 0 0 22px;}
.second .story .storyBox .img i {display:block; position:absolute; top:0; left:0; width:310px; height:190px; background:#03c9f9;}
.second .story .storyBox .img img {display:block; width:100%; height:100%; position:relative; z-index:99;}
.second .story .storyBox .brand {float:right; width:464px; padding-top:90px;}
.second .story .storyBox .brand > em {display:block; font-size:16px; color:#2d2d2d;}
.second .story .storyBox .brand > img {display:block; padding:12px 0 24px;}
.second .story .storyBox .brand > span {display:block; font-size:14px; line-height:26px;}
.second .story .storyBox .brand .moreBtn {border:1px solid #7d8385; color:#333;}
.second .story .storyBox .brand .moreBtn:hover {border:1px solid #03c9f9; background:#03c9f9; opacity:1; color:#fff;}

/*内页二级导航*/
.nav {text-align:center; width:100%; background:#23272b; height:60px; line-height:60px;}
.nav ul {display:inline-block;}
.nav ul li {float:left;}
.nav ul li a {display:block; color:#fff; font-size:14px; padding:0 35px; position:relative; transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;}
.nav ul li a i {display:block; width:0; height:4px; background:#03c9f9; position:absolute; left:50%; top:0; transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;}
.nav ul li.cur a {color:#23272b; background:#ebfbff;}
.nav ul li.cur a i {left:0; width:100%;}
.nav ul li a:hover {color:#03c9f9;}
.nav ul li.cur a:hover {color:#23272b;}
.nav.cur {position:fixed; width:100%; top:0; left:0; z-index:1000;}

/*AEL简介*/
.banner {width:100%; height:280px; position:relative; overflow:hidden;}
.banner .bannerImg {display:block; width:1920px; height:100%; position:absolute; left:50%; top:0; margin-left:-960px;}
.banner .bannerTitle {display:table; text-align:center; height:100%; margin:auto; position:relative; z-index:99; overflow:hidden;}
.banner .bannerTitle > div {display:table-cell; vertical-align:middle;}
.banner .bannerTitle > div em {display:block; color:#fff; font-size:62px; font-family: 'brush-tip-terrence'; padding-bottom:4px; opacity:0;}
.banner .bannerTitle > div img {opacity:0;}
.banner i {display:block; position:absolute; width:100%; height:100%; background:rgba(4,24,77,.1); top:0; left:0;}
.banner.cur .bannerTitle > div em {animation:fadeInLeft .4s ease-in .2s forwards; -webkit-animation:fadeInLeft .4s ease-in .2s forwards;}
.banner.cur .bannerTitle > div img {animation:fadeInRight .4s ease-in .2s forwards; -webkit-animation:fadeInRight .4s ease-in .2s forwards;}
.sub_title {padding-top:56px; text-align:center;}
.sub_title em {display:block; font-size:26px; color:#333; font-family:"PingFang SC", "Microsoft YaHei";}
.sub_title i {display:block; width:40px; height:2px; background:#333; margin:12px auto 0;}
.introduction {width:884px; margin:auto;}
.tab {padding:26px 0 46px; text-align:center;}
.tab a {display:inline-block; margin-left:16px; border-radius:30px; -webkit-border-radius:30px; -moz-border-radius:30px; border:1px solid rgba(102,102,102,.1); width:200px; height:44px; line-height:44px; font-size:16px; color:#333; text-align:center; position:relative; transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;}
.tab a:first-child {margin-left:0;}
.tab a.cur {border:1px solid #03c9f9; background:#03c9f9; color:#fff;}
.tab_cont > div {display:none;}
.tab_cont > div:first-child {display:block;}
.tab_cont > div {padding-bottom:120px;}
.tab_cont > div > span {display:block; text-align:center; font-size:14px; line-height:25px;}
.tab_cont > div .learn {position:relative; width:540px; height:540px; border:1px solid rgba(66,215,250,.5); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; margin:105px auto 0; opacity:0;}
.tab_cont > div .learn > img {display:block; position:absolute; top:50%; left:50%; margin-top:-135px; margin-left:-138.5px;}
.tab_cont > div .learn .learn_item {opacity:0; position:absolute; left:0; top:0; width:100%; height:100%;}
.tab_cont > div .learn .learn_item > div {position:absolute;}
.tab_cont > div .learn .learn_item > div div {position:absolute; left:82px; top:12px; opacity:0;}
.tab_cont > div .learn .learn_item > div div.right {left:auto; right:82px; text-align:right;}
.tab_cont > div .learn .learn_item > div div em {display:block; font-size:14px; font-weight:bold;}
.tab_cont > div .learn .learn_item > div div span {display:block; font-size:14px; width:136px; color:rgba(102,102,102,.78); padding-top:2px;}
.tab_cont > div .learn .learn_item > div:first-child div {top:5px;}
.tab_cont > div .learn .learn_item > div:first-child {top:-36px; left:245px;}
.tab_cont > div .learn .learn_item > div:nth-child(2) {top:82px; left:456px;}
.tab_cont > div .learn .learn_item > div:nth-child(3) {top:307px; left:498px;}
.tab_cont > div .learn .learn_item > div:nth-child(4) {top:490px; left:326px;}
.tab_cont > div .learn .learn_item > div:nth-child(5) {top:455px; left:77px;}
.tab_cont > div .learn .learn_item > div:nth-child(6) {top:276px; left:-28px;}
.tab_cont > div .learn .learn_item > div:nth-child(7) {top:64px; left:27px;}
.tab_cont > div .learn.cur {animation:zoomIn .4s linear .3s forwards; -webkit-animation:zoomIn .4s linear .3s forwards;}
.tab_cont > div .learn.cur .learn_item {animation:rotateInCircle .4s linear .6s forwards; -webkit-animation:rotateInCircle .4s linear .6s forwards;}
.tab_cont > div .learn.cur .learn_item > div div {animation:fadeInDown .4s linear 1s forwards; -webkit-animation:fadeInDown .4s linear 1s forwards;}
.tab_cont > div.develop img {display:block; margin:20px auto 0;}
.tab_cont > div.train > span {width:745px; margin:auto; padding-bottom:18px;}
.tab_cont > div.train > img {display:block; position:relative; left:-18%; width:136%;}

/*AEL价值观*/
span.sub {display:block; text-align:center; font-size:14px; padding-top:15px;}
.value .valueBox {width:100%;}
.value .valueBox .value_title {background:#ebfbff;}
.value .valueBox .value_title .sub {padding-bottom:44px;}
.value .valueBox .valueCont > div {width:50%; float:left; background:#ebfbff;}
.value .valueBox .valueCont .valImg {background:#ebfbff; padding-top:110px;}
.value .valueBox .valueCont .valImg span {display:block; overflow:hidden; width:550px; height:346px; float:right; z-index:999; position:relative;}
.value .valueBox .valueCont .valImg img {display:block; width:100%; height:100%; transition:all .6s; -webkit-transition:all .6s; -moz-transition:all .6s;}
.value .valueBox .valueCont .valImg img:hover {transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2);}
.value .valueBox .valueCont .val {width:550px; height:328px; background:url(../images/about/value_bg1.jpg) no-repeat; background-size:100% 100%; margin-left:-50px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:64px 52px 0 98px; color:#fff;}
.value .val_title {padding-left:62px; margin-bottom:24px;}
.value .val_title em {display:block; font-size:18px; font-weight:bold; padding-bottom:5px;}
.value .val_title span {display:block; font-size:16px;}
.value .valueBox .valueCont .val .val_title {background:url(../images/about/icon_value1.png) no-repeat left center;}
.value .val p {line-height:24px; color:rgba(255,255,255,.8); font-size:14px;}
.value .valBox {width:1100px; margin:auto}
.value .valBox > div {float:left; width:50%;}
.value .valBox > .val > div {width:502px; height:374px; background:url(../images/about/value_bg2.jpg) no-repeat; background-size:100% 100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:88px 58px 0 44px; float:right;}
.value .valBox > .val > div .val_title {background:url(../images/about/icon_value2.png) no-repeat left center; color:#fff; background-size:auto 100%;}
.value .valBox .change .changeImg {overflow:hidden; width:550px; height:374px;}
.value .valBox .change .changeImg img {display:block; width:100%; height:100%; transition:all .6s; -webkit-transition:all .6s; -moz-transition:all .6s;}
.value .valBox .change .changeImg img:hover {transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2);}
.value .valBox .change .val {width:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:35px 60px 60px 50px; background:#f5fdff;}
.value .valBox .change .val .val_title {color:#4c4c4c; background:url(../images/about/icon_value3.png) no-repeat left center; background-size:auto 100%;}
.value .valBox .change .val p {color:#4c4c4c;}
.about_cont .brand {display:block; width:100%;}

/*关于AEL-业务领域-培训课程*/
.course .course_title {background:#ebfbff url(../images/about/border.png) repeat-x left bottom;}
.course .course_title .step {width:1200px; margin:auto;}
.course .course_title .step li {float:left; width:20%;}
.course .course_title .step li > div {padding-left:100px;}
.course .course_title .step li > div em {display:block; font-family: 'Helvetica Bold'; font-size:48px; line-height:48px;}
.course .course_title .step li > div span {display:block; font-size:16px; font-weight:bold; padding:8px 0 5px; white-space:nowrap;}
.course .course_title .step li > div p {color:rgba(102,102,102,.5); line-height:18px; height:36px; white-space:nowrap;}
.course .course_title .step li > span {display:block; width:1px; height:32px; background:#03c9f9; margin:10px auto 0; position:relative;}
.course .course_title .step li > span i {display:block; width:0; height:0; background:#03c9f9; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; left:50%; bottom:0; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.course .course_title .step li.cur > span i {width:9px; height:9px; bottom:-4.5px; margin-left:-4.5px;}
.course .arrow {width:1200px; margin:auto;}
.course .arrow span {display:block; width:20%; float:left; padding:30px 0 20px; position:relative;}
.course .arrow span a {display:block; margin:auto; width:38px; height:38px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; border:1px solid #d6d7d8; background:url(../images/about/icon_arrow.png) no-repeat 0 -40px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.course .arrow span.cur a {background-position:0 0; border:1px solid #0acaf9;}
.course .arrow span i {display:block; width:26px; height:9px; background:url(../images/about/icon_arrow1.png) no-repeat; background-size:100% 100%; position:absolute; bottom:-1px; left:50%; margin-left:-13px; opacity:0; visibility:hidden; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.course .arrow span.cur i {opacity:1; visibility:visible;}
.course .course_sort {padding-bottom:70px;}
.course .course_sort > div {width:1100px; margin:auto; background:#fafafa; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; border:1px solid #ededed; padding:85px 30px 72px 45px; display:none;}
.course .course_sort > div:first-child {display:block;}
.course .course_sort > div .course_left {float:left; width:320px;}
.course .course_sort > div .course_left .tit em {display:block; font-size:18px; color:#3f3f3f;}
.course .course_sort > div .course_left .tit em span {font-weight:bold;}
.course .course_sort > div .course_left .tit i {display:block; width:40px; height:3px; background:#03c9f9; margin:22px 0;}
.course .course_sort > div .course_left p {color:rgba(102,102,102,.7); line-height:25px; font-size:14px;}
.course .course_sort > div > img {display:block; float:right;}
.course .course_sort > div > img.pic {margin-right:100px;}

/*关于AEL-业务领域-学习与发展项目微咨询*/
.course.consult .course_title {padding-bottom:130px; background:#ebfbff;}
.course .course_title .step.step1 {width:100%; border-bottom:1px solid #03c9f9;}
.course .course_title .step.step1 ul {width:1204px; margin:auto;}
.course .course_title .step.step1 ul li {width:14.2857%; text-align:center; height:110px; padding-bottom:24px; position:relative;}
.course .course_title .step.step1 li > div {padding-left:0; display:inline-block; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; height:74px; padding-top:36px; position:relative; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s; cursor:pointer;}
.course .course_title .step.step1 li > div span {padding:4px 0 0 0;}
.course .course_title .step.step1 li > div i {display:block; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #03c9f9; position:absolute; left:50%; margin-left:-10px; bottom:-10px; opacity:0; visibility:hidden; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.course .course_title .step.step1 li > span {height:0; position:absolute; left:50%; bottom:0;}
.course .course_title .step.step1 li.cur > div {background:#03c9f9; color:#fff; padding:16px 5px 0; height:110px; box-shadow:0 10px 30px 0 rgba(163,237,255,.8); -webkit-box-shadow:0 10px 30px 0 rgba(163,237,255,.8); -moz-box-shadow:0 10px 30px 0 rgba(163,237,255,.8);}
.course .course_title .step.step1 li.cur > div i {opacity:1; visibility:visible;}
.course .course_title .step.step1 li.cur > span {}
.color_half {width:100%;}
.color_half > div {width:50%; float:left;}
.color_half > div.blue {background:#ebfbff;}
.color_half > div .word {width:550px;}
.color_half > div .picture {width:550px; height:351px; overflow:hidden;}
.color_half > div .picture img {display:block; width:100%; height:100%; transition:all .6s; -webkit-transition:all .6s; -moz-transition:all .6s;}
.color_half > div .picture img:hover {transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2);}
.course .color_half > div {height:351px;}
.course .color_half > div .word {float:right; height:320px; margin:-72px -34px 0 0; background:#03c9f9; color:#fff; z-index:99; position:relative; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:66px 40px 0 22px;}
.course .color_half > div .word em {display:block; font-size:18px; font-weight:bold; padding-bottom:16px;}
.course .color_half > div .word p {line-height:24px;}
.course .step_cont > div {display:none; padding-bottom:50px;}
.course .step_cont > div:first-child {display:block;}
.course .action_learn {width:1100px; margin:auto; position:relative;}
.course .action_learn > div {float:left; width:50%;}
.course .action_learn > div.al_img {overflow:hidden; height:352px;}
.course .action_learn > div.al_img img {display:block; width:100%; height:100%; transition:all .6s; -webkit-transition:all .6s; -moz-transition:all .6s;}
.course .action_learn > div.al_img img:hover {transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2);}
.course .al_list {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.course .al_list > em {display:block; font-size:18px; color:#333; font-weight:bold; padding-bottom:14px;}
.course .al_list ul li {float:left; margin-top:5px;}
.course .al_list ul li > span {display:block; font-size:14px; line-height:24px; padding-left:15px; position:relative; margin-left:30px;}
.course .al_list ul li > span i {display:block; width:10px; height:2px; background:#666; position:absolute; left:0; top:11px;}
.course .al_list ul li > em {display:block; line-height:34px; height:34px; margin-bottom:4px; position:relative; padding-left:40px; font-size:14px;}
.course .al_list ul li > em span {display:block; width:34px; height:34px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; border:4px solid #81e4fc; background:#03c9f9; color:#fff; font-size:14px; font-weight:bold; text-align:center; position:absolute; left:0; top:0; line-height:26px;}
.course .action_learn > div.al_list {padding:24px 0 0 45px; position:absolute; top:0; left:50%; width:50%;}
.course .action_learn > div.al_list ul li {width:220px;}
.course .action_learn > div.al_list ul li:first-child, .course .action_learn > div.al_list ul li:nth-child(2) {margin-top:0;}
.course .action_learn > div.al_list ul li:nth-child(2n) {float:right;}
.course .action_learn > div.al_list ul li:first-child > span:last-child {height:48px;}
.course .process {width:1100px; margin:50px auto 0;}
.course h3 {font-size:18px; color:#333; margin-bottom:14px;}
.course .process > div {border:1px solid #ccc; height:40px; line-height:40px; text-align:center; font-size:14px;}
.course .process > div img {padding-left:6px;}
.course .blend .action_learn > div.al_list ul li {width:288px; margin-top:30px;}
.course .blend .action_learn > div.al_list ul li:nth-child(2n) {width:245px;}
.course .blend .action_learn > div.al_list ul li:first-child, .course .blend .action_learn > div.al_list ul li:nth-child(2) {margin-top:0;}
.course .blend .action_learn > div.al_list {width:600px;}
.course .step_cont > div > .al_list {width:1100px; margin:70px auto 0;}
.course .al_list.four li {width:25%;}
.course .blend .al_list.four li:last-child {float:right; width:190px;}
.course .blend .al_list.four li:nth-child(2) {width:29%;}
.course .micro .color_half > div .word {padding:42px 40px 0 22px;}
.course .color_half > div .word div {padding-top:20px;}
.course .color_half > div .word div span {display:block; line-height:24px;}
.course .color_half > div .word div span em {display:inline-block; padding-right:4px; font-size:14px; font-family: 'Helvetica Bold'; padding-bottom:0;}
.course .step_cont > div.micro {padding-bottom:116px;}
.course .micro .action_learn > div.al_list {width:590px;}
.course .micro .action_learn > div.al_list ul li {width:232px; height:158px;}
.course .micro .action_learn > div.al_list ul li:nth-child(3), .course .micro .action_learn > div.al_list ul li:nth-child(4) {height:182px;}
.course .team .action_learn > div.al_list, .course .case .action_learn > div.al_list {padding:112px 0 0 45px;}
.course .team .action_learn > div.al_list ul li, .course .case .action_learn > div.al_list ul li, .course .game .action_learn > div.al_list ul li {width:100%;}
.course .team .action_learn > div.al_list ul li > span, .course .case .action_learn > div.al_list ul li > span, course .game .action_learn > div.al_list ul li > span {margin-left:0;}
.course .team .action_learn > div.al_list .border {border:1px dashed #e5e5e5; font-size:14px; color:#03c9f9; height:20px; line-height:20px; padding:0 10px; margin-top:10px;}
.course .team .action_learn > div.al_list ul li:first-child > span:last-child {height:auto;}
.course .step_cont > div.team > .al_list {margin:30px auto 0;}
.course .team > .al_list li {height:134px; margin-bottom:24px;}
.course .step_cont > div.team, .course .step_cont > div.case {padding-bottom:40px;}
.course .case .action_learn > div.al_list ul {border-bottom:1px dashed #e5e5e5; padding-bottom:68px;}
.course .case .al_list.four li {margin-bottom:26px;}
.course .case .al_list.four li:nth-child(4n) {float:right; width:15%;}
.course .case .al_list.four li:nth-child(4n+1) {width:26%;}
.course .case .al_list.four li:nth-child(4n+2) {width:30%;}
.course .case .al_list.four li:first-child, .course .case .al_list.four li:nth-child(2), .course .case .al_list.four li:nth-child(3), .course .case .al_list.four li:nth-child(4) {height:182px;}
.course .experience .action_learn > div.al_list {position:static;}
.course .experience .action_learn > div.al_list ul.act li {margin-bottom:36px;}
.course .experience .action_learn > div.al_list ul.act li:nth-child(2n+1) {width:250px;}
.course .experience .action_learn > div.al_list ul.act li:nth-child(3), .course .experience .action_learn > div.al_list ul.act li:nth-child(4) {height:134px;}
.course .experience .action_learn > div.al_list .two {padding-top:48px;}
.course .game .al_list ul li > p {padding-bottom:12px; color:#999; font-size:14px; margin-left:40px;}
.course .step_cont > div.game > .al_list {margin:48px auto 0;}
.course .game > .al_list li {width:42.7%;}
.course .game > .al_list li:first-child {margin-right:123px;}

 /*AEL洞察-汽车行业*/
a.moreBtn {display:block; width:92px; height:28px; line-height:28px; border:1px solid #fff; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; color:#fff; opacity:.6; text-align:center; font-size:14px; font-family:"Microsoft YaHei"; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}    
a.moreBtn.blue {border:1px solid #03c9f9; background:#03c9f9; opacity:1;}
a.moreBtn.grey {border:1px solid rgba(0,0,0,.1); color:#4c4c4c; opacity:1;}
a.moreBtn:hover, a.moreBtn.grey:hover {border:1px solid #03c9f9; background:#03c9f9; opacity:1; color:#fff;}
.automobile_cont {padding-bottom:70px;}
.automobile_cont .automobile .top {background:#ebfbff;}
.automobile_cont .automobile .top .top_news {width:1100px; margin:128px auto 0; height:264px;}
.automobile_cont .automobile .top .top_news .topImg {float:left; position:relative; background:#03c9f9; width:460px; height:100%;}
.automobile_cont .automobile .top .top_news .topImg span {display:block; overflow:hidden; width:551px; height:334px; position:absolute; top:-86px; left:50px;}
.automobile_cont .automobile .top .top_news .topImg span img {display:block; width:100%; height:100%; transition:all .6s; -webkit-transition:all .6s; -moz-transition:all .6s;}
.automobile_cont .automobile .top .top_news .topImg span img:hover {transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2);}
.automobile_cont .automobile .top .top_news .topNews {float:right; width:640px; background:url(/assets/cn/images/explore/bg1.jpg) no-repeat; background-size:100% 100%; padding:0 84px 0 186px; height:100%;}
.topNews {display:table; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.topNews > div {display:table-cell; vertical-align:middle;}
.topNews > div .news_title {display:block; font-size:16px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.topNews > div .news_title:hover, .automobile_cont .color_half > div.blue .topNews .news_title:hover {color:#03c9f9;}
.topNews > div .time {display:block; padding:14px 0 14px 24px; background:url(/assets/cn/images/explore/icon_clock.png) no-repeat left center; line-height:16px; border-bottom:1px dashed rgba(255,255,255,.1);}
.topNews > div p {line-height:24px; margin:10px 0 22px; color:rgba(255,255,255,.5); height:48px; overflow:hidden;}
.topNews > div .moreBtn {font-size:12px;}
.automobile_cont .color_half > div.blue .topNews {width:600px; float:right; margin-right:-50px; height:244px; padding:0 104px 0 50px; background:#ebfbff;}
.automobile_cont .color_half > div.blue .topNews .news_title {color:#333;}
.automobile_cont .color_half > div.blue .topNews p {color:#666; margin:8px 0 14px;}
.automobile_cont .color_half > div.blue .topNews .time {border-bottom:1px dashed rgba(7,0,2,.1);}    
.automobile_cont .color_half > div .picture {width:401px; height:244px; margin-left:50px;}
.automobile_cont .color_half.auto > div .picture {width:301px; height:182px; float:right; margin-right:-50px;}
.automobile_cont .color_half.auto > div.blue {background:none;}
.automobile_cont .color_half.auto > div.blue .topNews {width:401px; height:182px; float:none; margin-right:0; background:none; padding:0 0 0 48px; margin-left:50px;}
.automobile_cont .color_half.auto > div.blue .topNews .news_title {padding-top:10px;}

/*新闻列表*/
.newsList {padding-top:46px; width:950px; margin:auto;}
.newsList li {margin-bottom:40px; height:152px; overflow:hidden;}
.newsList li .time {float:left; width:150px; height:100%;}
.newsList li .time em {display:block; font-size:31px; color:#b7b7b7; line-height:31px; padding-top:28px;}
.newsList li .time span {display:block; font-size:15px; color:#b7b7b7; padding:8px 0 22px;}
.newsList li .time div {height:13px; width:25px; background:url(/assets/cn/images/explore/icon_arrow1.png) no-repeat right center; background-size:auto 100%; position:relative; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.newsList li .time div i {display:block; width:100%; height:1px; background:#ccc; position:absolute; left:0; top:50%; margin-top:-1px;}
.newsList li:hover .time div {background:url(/assets/cn/images/explore/icon_arrow2.png) no-repeat right center; background-size:auto 100%; width:42px;}
.newsList li:hover .time div i {background:#03c9f9;}
.newsList li .brief {float:left; width:492px; height:100%; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.newsList li .brief > a {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:16px; color:#333; padding:28px 0 22px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.newsList li .brief p {line-height:24px; height:48px; overflow:hidden;}
.newsList li:hover .brief > a {color:#03c9f9;}
.newsList li:hover .brief {margin-left:25px;}
.newsList li .pic {float:right; width:251px; height:100%; overflow:hidden; display:block;}
.newsList li .pic img {display:block; width:100%; height:100%; transition:all .6s; -webkit-transition:all .6s; -moz-transition:all .6s;}
.newsList li:hover .pic img {transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2);}

/*分页*/
.page {text-align:center;}
.page .pageBox {display:inline-block;}
.page .pageBox a {display:block; float:left; width:36px; height:36px; text-align:center; line-height:36px; border:1px solid #eaeaea; color:#999; margin:0 4px;}
.page .pageBox a.prev, .page .pageBox a.next {width:66px;}
.page .pageBox span {display:block; float:left; line-height:36px; height:36px; width:36px;}
.page .pageBox a.cur {color:#fff; border:1px solid #03c9f9; background:#03c9f9;}
.page .pageBox span.tips {display:block; width:100%; text-align:center; color:#333; font-size:14px;}

/*AEL动态-近期案例*/
.case_cont {padding-bottom:70px;}
.case_cont .case .top {background:#ebfbff url(/assets/cn/images/dynamic/case1.jpg) no-repeat right top; height:562px; background-size:auto 100%;}
.case_cont .case .top .eng_title {position:relative; width:100%; margin:98px 0 10px;}
.case_cont .case .top .eng_title em {display:block; margin-right:39%; text-align:right; font-family:"brush-tip-terrence"; color:rgba(35,39,43,.6); font-size:50px;}
.case_cont .case .top .eng_title i {display:block; width:33.6%; height:1px; background:rgba(0,5,12,.1); position:absolute; right:0; top:50%;}
.case_cont .case .top .recent_case {width:538px; height:88px; display:table; background:url(/assets/cn/images/dynamic/border.png) no-repeat; background-size:100% 100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:0 40px 0 46px; margin-left:24%;}
.case_cont .case .top .recent_case > div {display:table-cell; vertical-align:middle;}
.case_cont .case .top .recent_case > div p {font-size:14px; color:#848484; line-height:25px;}
.case_cont .color_half > div .picture {float:right; width:550px; height:334px; margin:-95px -70px 0 0; position:relative;}
.case_cont .color_half > div .picture img {opacity:0; visibility:hidden; transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s; position:absolute; top:0; left:0;}
.case_cont .color_half > div .picture img.cur {opacity:1; visibility:visible;}
.case_cont .color_half > div.slider {width:441px; height:270px; padding:0 35px 0 24px; background:#03c9f9; margin:-160px 0 0 9px; position:relative; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.case_cont .color_half > div.slider > img {display:block; position:absolute; top:0; left:-9px;}
.case_cont .color_half > div.slider .bxslider, .case_cont .color_half > div.slider .bxslider .topNews, .case_cont .color_half > div.slider .bx-wrapper {height:100%;}
.case_cont .color_half > div.slider .bx-wrapper .bx-viewport {height:100%; left:0; border:0; box-shadow:none; background:none;}
.case_cont .color_half > div.slider .bxslider {padding-top:10px;}
.case_cont .color_half > div.slider .bxslider .topNews > div .news_title:hover {color:#fff;}
.case_cont .color_half > div.slider .bxslider .topNews > div .time {background:url(/assets/cn/images/dynamic/icon_clock.png) no-repeat left center; color:#fff; border-bottom:1px dashed rgba(255,255,255,.3);}
.case_cont .color_half > div.slider .bxslider .topNews > div p {color:rgba(255,255,255,.8);}
.case_cont .color_half > div.slider .bxslider .topNews > div .moreBtn {opacity:1; border:1px solid rgba(255,255,255,.23);}
.case_cont .color_half > div.slider .bxslider .topNews > div .moreBtn:hover {border:1px solid #fff; background:#fff; color:#03c9f9;}
.case_cont .bx-wrapper .bx-controls-direction a {width:26px; height:26px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; border:1px solid #fff; margin-top:0; top:20px; transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;}
.case_cont .bx-wrapper .bx-controls-direction a.bx-prev {background:url(/assets/cn/images/index/icon_prev.png) no-repeat center; right:21px; left:auto;}
.case_cont .bx-wrapper .bx-controls-direction a.bx-next {background:url(/assets/cn/images/index/icon_next.png) no-repeat center; right:-15px;}
.case_cont .bx-wrapper .bx-controls-direction a.cur {opacity:.3;}

/*知识库*/
.case_cont .knowledge .top {background:#ebfbff;}
.case_cont .knowledge .top .book {width:1100px; height:134px; margin:68px auto 0;}
.case_cont .knowledge .top .book > div {display:table; text-align:center; width:200px; height:100%; background:url(/assets/cn/images/knowledge/book.jpg) no-repeat; background-size:100% 100%; z-index:999; position:relative;}
.case_cont .knowledge .top .book > div > div {display:table-cell; vertical-align:middle;}
.case_cont .knowledge .top .book > div em {display:block; font-family: 'brush-tip-terrence'; font-size:17px; color:rgba(255,255,255,.5); padding:6px 0 3px;}
.case_cont .knowledge .top .book > div span {display:block; color:#fff; font-size:14px; font-family:"PingFang SC", "Microsoft YaHei";}
.case_cont .knowledge .color_half > div .picture {margin:-108px -150px 0 0; width:601px; height:364px;}
.case_cont .knowledge .color_half > div.slider {width:50%; margin:0; padding:0; background:none;}
.case_cont .knowledge .color_half > div.slider .sliderBox {margin:-60px 0 0 100px; padding:0 35px 0 24px; background:#03c9f9; position:relative; width:441px; height:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.case_cont .knowledge .color_half > div.slider .sliderBox > img {position:absolute; left:-9px; top:0;}
.case_cont .knowledge .color_half > div.slider > i {display:block; position:absolute; left:0; top:0; background:#ebfbff; z-index:-1; width:100%; height:210px;}
.case_cont .knowledge .color_half > div:first-child {position:relative;}
.case_cont .knowledge .color_half .tag {display:block; position:absolute; right:0; bottom:0; width:550px; height:100%; z-index:-1;}
.case_cont .knowledge .color_half .tag img {display:block; position:absolute; bottom:0; left:0;}
.quote {width:750px; height:88px; margin:92px auto 70px; background:url(/assets/cn/images/knowledge/border.png) no-repeat; background-size:100% 100%; display:table; text-align:center;}
.quote > div {display:table-cell; vertical-align:middle;}
.quote > div p {padding:0 50px; font-size:14px; line-height:25px; color:#848484;}
.case_cont .knowledge .newsList {width:1100px;}
.case_cont .knowledge .newsList li {float:left; width:346px; margin-left:31px; height:auto;}
.case_cont .knowledge .newsList li:nth-child(3n+1) {margin-left:0;}
.case_cont .knowledge .newsList li .pic {float:none; width:100%; height:209px; margin-bottom:15px;}
.case_cont .knowledge .newsList li .time {width:92px; height:auto;}
.case_cont .knowledge .newsList li .time em {padding-top:0; font-size:26px; color:#b7b7b7;}
.case_cont .knowledge .newsList li .time span {padding:5px 0 18px;}
.case_cont .knowledge .newsList li .brief {float:right; width:254px;}
.case_cont .knowledge .newsList li .brief > a {padding:0 0 20px;}
.case_cont .knowledge .newsList li:hover .brief {margin-left:0;}

/*下载中心*/
.download_cont {padding-bottom:70px;}
.download_cont .download {width:1100px; margin:36px auto 48px;}
.download_cont .download li {float:left; width:530px; height:52px; border:1px solid #eaeaea; line-height:52px; margin-top:20px;}
.download_cont .download li:nth-child(2n) {float:right;}
.download_cont .download li:first-child, .download_cont .download li:nth-child(2) {margin-top:0;}
.download_cont .download li div {display:block; float:left; height:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; border-right:1px solid #eaeaea; padding:0 12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:14px; width:425px;}
.download_cont .download li a {display:block; width:105px; height:100%; float:right; text-align:center; font-size:14px;}
.download_cont .download li a span {display:inline-block; padding-right:30px; background:url(/assets/cn/images/knowledge/icon_download1.png) no-repeat right center;}
.download_cont .download li a:hover {color:#03c9f9;}
.download_cont .download li a:hover span {background:url(/assets/cn/images/knowledge/icon_download2.png) no-repeat right center;}

/*招聘岗位*/
.recruit_cont .recruit {width:1100px; margin:0 auto 60px;}
.recruit_cont .recruit .recruitList {margin-top:40px;}
.recruit_cont .recruit .recruitList li {float:left; width:462px; margin-bottom:52px;}
.recruit_cont .recruit .recruitList li:nth-child(2n) {float:right;}
.recruit_cont .recruit .recruitList li .title {padding-bottom:10px;}
.recruit_cont .recruit .recruitList li .title em {display:block; font-size:16px; font-weight:bold; padding-bottom:3px;}
.recruit_cont .recruit .recruitList li .title span {display:block; font-size:16px; color:#999; font-family:"Microsoft YaHei";}
.recruit_cont .recruit .recruitList li .position em {display:block; font-weight:bold; font-size:14px; padding-bottom:4px;}
.recruit_cont .recruit .recruitList li .position span {display:block; font-size:14px; line-height:24px;}
.recruit_cont .recruit .method {border:1px solid #e5e5e5; height:46px; line-height:46px; font-size:14px;}
.recruit_cont .recruit .method > em {display:block; float:left; text-align:center; font-weight:bold; background:#f3fdff; border-right:1px solid #eaeaea; width:130px;}
.recruit_cont .recruit .method div {float:right; width:966px; text-align:center;}
.recruit_cont .recruit .method div span {display:inline-block; padding:0 50px; border-left:1px solid #eaeaea; line-height:14px;}
.recruit_cont .recruit .method div span:first-child {border-left:0;}

/*AEL工作方法*/
.method_cont {padding-bottom:130px;}
.method_cont .method .method_sub {text-align:center; padding:60px 0 45px;}
.method_cont .method .method_sub > em {display:block; font-size:15px; font-weight:bold; color:#333;}
.method_cont .method .method_sub > em span {font-size:24px;}
.method_cont .method .method_sub > span {display:block; font-size:14px; padding:8px 0 2px;}
.method_cont .method .method_sub p {color:rgba(102,102,102,.5);}
.method_cont .method .method_box {background:url(../images/about/method.png) no-repeat left bottom; background-size:100%; overflow:hidden;}
.method_cont .method .method_box ul {text-align:center; width:91%; margin:auto;}
.method_cont .method .method_box ul li {float:left; width:14.28%; opacity:0; visibility:hidden;}
.method_cont .method .method_box ul li img {display:block; margin:auto;}
.method_cont .method .method_box ul li i {border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; color:#fff; text-align:center; background:#23272b; line-height:38px; width:38px; height:38px; margin:auto; display:block; font-size:18px; font-weight:bold;}
.method_cont .method .method_box ul li span {display:block; width:52%; margin:15px auto 0; font-size:14px; color:#23272b; line-height:23px;}
.method_cont .method .method_box ul li:first-child {margin-top:22px;}
.method_cont .method .method_box ul li:nth-child(2) {margin-top:82px;}
.method_cont .method .method_box ul li:nth-child(3) {margin-top:108px;}
.method_cont .method .method_box ul li:nth-child(4) {margin-top:44px;}
.method_cont .method .method_box ul li:nth-child(6) {margin-top:56px;}
.method_cont .method .method_box ul li:nth-child(7) {margin-top:10px;}
.method_cont .method .method_box ul li.cur {visibility:visible; animation:fadeInDown .4s ease-in-out .4s forwards; -webkit-animation:fadeInDown .4s ease-in-out .4s forwards;}
.method_cont .method .method_box ul li.cur:nth-child(2) {animation-delay:.6s;}
.method_cont .method .method_box ul li.cur:nth-child(3) {animation-delay:.8s;}
.method_cont .method .method_box ul li.cur:nth-child(4) {animation-delay:1s;}
.method_cont .method .method_box ul li.cur:nth-child(5) {animation-delay:1.2s;}
.method_cont .method .method_box ul li.cur:nth-child(6) {animation-delay:1.4s;}
.method_cont .method .method_box ul li.cur:nth-child(7) {animation-delay:1.6s;}

/*联系我们*/
.contact_cont .contact {position:relative;}
.contact_cont .contact .shanghai {position:relative;}
.contact_cont .contact .shanghai .year {width:160px; height:154px; border:1px solid #c9c9c9; text-align:center; margin:30px auto 0; color:#797979;}
.contact_cont .contact .shanghai .year em {display:block; font-size:57px; font-family: 'Helvetica Bold';}
.contact_cont .contact .shanghai .year span {display:block; font-size:14px; letter-spacing:6px; font-family: 'Helvetica Bold';}
.contact_cont .contact .shanghai p {background:#fff; text-align:center; position:absolute; left:0; width:100%; top:92px; line-height:23px; font-size:14px;}
.contact_cont .contact .shanghai .dot {width:1px; height:94px; border-left:1px dashed #21acec; margin:24px auto 0; position:relative;}
.contact_cont .contact .shanghai .dot i {display:block; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; width:22px; height:22px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; border:5px solid #cdf4fe; background:#03c9f9; position:absolute; top:-15px; left:50%; margin-left:-12px;}
.contact_cont .contact .company {text-align:center; background:#03c9f9; padding:35px 0 40px; color:#fff;}
.contact_cont .contact .company em {display:block; font-size:22px;}
.contact_cont .contact .company > span {display:block; font-size:14px; color:rgba(255,255,255,.7); padding-top:4px;}
.contact_cont .contact .company i {display:block; width:82px; height:1px; background:rgba(255,255,255,.45); margin:10px auto 14px;}
.contact_cont .contact .company div span {display:block; line-height:24px; color:rgba(255,255,255,.8); font-size:14px;}
.contact_cont .contact .company div span a {color:rgba(255,255,255,.8); transition:all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;}
.contact_cont .contact .company div span a:hover {color:#fff;}
.contact_cont .contact iframe {display:block; width:100%; height:436px; /*position:absolute; bottom:182px; left:0;*/}

/*近期课程*/
.dynamic_cont {padding-bottom:70px;}
.dynamic_cont .course .course_title {padding-bottom:0; position:relative; z-index:100;}
.dynamic_cont .course .course_title .step.step1 {border-bottom:1px solid #d4e1e5;}
.dynamic_cont .course .course_title .step.step1 ul {width:1066px;}
.dynamic_cont .course .course_title .step.step1 ul li {width:8.33%; height:60px; padding-bottom:16px;}
.dynamic_cont .course .course_title .step.step1 li > div {height:60px; padding:0 8px; line-height:60px; position:relative;}
.dynamic_cont .course .course_title .step.step1 li > div i {border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #03c9f9; bottom:-5px; margin-left:-5px; position:}
.dynamic_cont .course .course_title .step.step1 li > div span {position:absolute; top:0; left:0; width:100%; padding:0; opacity:0; visibility:hidden; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s; color:#fff;}
.dynamic_cont .course .course_title .step.step1 li > div em {font-size:24px; color:#7e7e7e; padding-top:30px; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.dynamic_cont .course .course_title .step.step1 li.cur > div em {padding-top:0; color:#fff; opacity:0; visibility:hidden;}
.dynamic_cont .course .course_title .step.step1 li.cur > div span {opacity:1; visibility:visible;}
.dynamic_cont .tab {text-align:center; padding:26px 0 40px;}
.dynamic_cont .tab > span {display:inline-block;}
.dynamic_cont .tab a {border:0; font-family: 'Helvetica Bold'; font-size:30px; color:#666; width:auto; margin-left:28px; float:left;}
.dynamic_cont .tab a:first-child {margin-left:0;}
.dynamic_cont .tab a.cur {border:0; background:none; color:#03c9f9; font-size:40px; line-height:40px;}
.dynamic_cont .recent_course .main {width:47.4%; float:left; background:#ebfbff; position:relative; margin-bottom:410px;}
.dynamic_cont .recent_course .main .newsList {width:100%; padding-top:34px; position:relative;}
.dynamic_cont .recent_course .main .newsList li {height:auto; margin-bottom:0; float:right; width:500px; z-index:99;}
.dynamic_cont .recent_course .main .newsList li .pic {width:500px; height:303px; float:none; z-index:99; position:relative;}
.dynamic_cont .recent_course .main .newsList li .time {width:118px;}
.dynamic_cont .recent_course .main .newsList li .time em {font-size:48px; color:#03c9f9; font-family: 'Helvetica Bold'; padding:0 0 8px 0; line-height:38px;}
.dynamic_cont .recent_course .main .newsList li .time span {font-size:24px; color:#656f79; font-family: 'Helvetica Bold'; padding:0;}
.dynamic_cont .recent_course .main .newsList li > div {padding:38px 0 56px; z-index:99; position:relative;}
.dynamic_cont .recent_course .main .newsList li .brief {width:350px; float:right; margin-right:20px;}
.dynamic_cont .recent_course .main .newsList li:hover .brief {margin-left:0;}
.dynamic_cont .recent_course .main .newsList li .brief .title {color:#fff; padding:0 0 12px; border-bottom:1px dashed rgba(255,255,255,.1);}
.dynamic_cont .recent_course .main .newsList li:hover .brief .title {color:#03c9f9;}
.dynamic_cont .recent_course .main .newsList li .brief p {color:rgba(255,255,255,.5); margin:10px 0 15px;}
.dynamic_cont .recent_course .main > i {display:block; position:absolute; right:0; bottom:0; width:100%; height:276px; background:url(../images/dynamic/bg.jpg) no-repeat; background-size:100% 100%;}
.dynamic_cont .recent_course .main .newsList li .brief .moreBtn {padding:0; color:#fff; font-size:12px; color:#ccc; border:1px solid rgba(255,255,255,.1); opacity:1;}
.dynamic_cont .recent_course .main > img {display:block; position:absolute; right:385px; bottom:-275px;}
.dynamic_cont .recent_course .recentList {float:left; width:52.6%;}
.dynamic_cont .recent_course .recentList .newsList {padding-top:34px; margin-left:52px;}
.dynamic_cont .recent_course .recentList .newsList li {width:542px; height:auto;}
.dynamic_cont .recent_course .recentList .newsList li .time {width:110px;}
.dynamic_cont .recent_course .recentList .newsList li .brief {width:430px; float:right; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.dynamic_cont .recent_course .recentList .newsList li:hover .brief {margin-left:0; padding-left:14px;}
.dynamic_cont .recent_course .recentList .page {text-align:left; margin-left:50px;}
.dynamic_cont .recent_course .recentList .page span {text-align:center;}

/*近期活动*/
.activity_cont {padding-bottom:70px;}
.activity_cont .activity .top {background:#ebfbff;}
.activity_cont .activity .top .tag {display:block; padding:48px 0 30px; margin:auto;}
.activity_cont .activity > img {display:block; margin:64px auto 24px;}
.activity_cont .activity .quote {margin-top:0;}
.activity_cont .activity .newsList {padding-top:0;}
.activity_cont .activity .activity_slider {width:100%; position:relative; height:340px;}
.activity_cont .activity .activity_slider > i {display:block; position:absolute; width:100%; height:242px; background:#ebfbff; left:0; top:0;}
.activity_cont .activity .activity_slider .slider {width:1100px; margin:auto; position:relative;}
.activity_cont .activity .activity_slider .swiper-slide .pic {width:400px; height:242px; margin-left:-25px; opacity:0; visibility:hidden; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s;}
.activity_cont .activity .activity_slider .swiper-slide .pic img {display:block; width:100%; height:100%;}
.activity_cont .activity .activity_slider .swiper-slide .time {text-align:center; width:260px; margin:auto; position:relative; margin-top:-242px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; transition:all .6s ease-in-out; -webkit-transition:all .6s ease-in-out; -moz-transition:all .6s ease-in-out;}
.activity_cont .activity .activity_slider .swiper-slide .time em {display:block; font-size:26px; color:#b7b7b7; transition:all .6s ease-in-out; -webkit-transition:all .6s ease-in-out; -moz-transition:all .6s ease-in-out;}
.activity_cont .activity .activity_slider .swiper-slide .time span {display:block; padding:5px 0 20px; font-size:15px; color:#b7b7b7; transition:all .6s ease-in-out; -webkit-transition:all .6s ease-in-out; -moz-transition:all .6s ease-in-out;}
.activity_cont .activity .activity_slider .swiper-slide .time p {font-size:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#333; transition:all .6s ease-in-out; -webkit-transition:all .6s ease-in-out; -moz-transition:all .6s ease-in-out;}
.activity_cont .activity .activity_slider .swiper-slide .time i {display:block; width:100%; height:9px; background:url(../images/dynamic/border_top.png) no-repeat; background-size:100% 100%; position:absolute; left:0; top:-9px; opacity:0; visibility:hidden;}
.activity_cont .activity .activity_slider .swiper-slide .brief {padding-top:20px; width:260px; margin:auto;}
.activity_cont .activity .activity_slider .swiper-slide .brief p {line-height:22px; text-align:center; height:44px; overflow:hidden;}
.activity_cont .activity .activity_slider .swiper-button-next, .activity_cont .activity .activity_slider .swiper-button-prev {width:25px; height:26px; background:#03c9f9 url(../images/index/icon_prev.png) no-repeat center; margin-top:0; top:108px;}
.activity_cont .activity .activity_slider .swiper-button-prev {left:-25px;}
.activity_cont .activity .activity_slider .swiper-button-next {background:#03c9f9 url(../images/index/icon_next.png) no-repeat center; right:-25px;}

.activity_cont .activity .activity_slider .swiper-slide.swiper-slide-active .pic {opacity:1; visibility:visible;}
.activity_cont .activity .activity_slider .swiper-slide.swiper-slide-active .time {color:#fff; width:332px; background:#03c9f9; margin-top:-60px; padding:10px 28px 10px;}
.activity_cont .activity .activity_slider .swiper-slide.swiper-slide-active .time em, .activity_cont .activity .activity_slider .swiper-slide.swiper-slide-active .time span, .activity_cont .activity .activity_slider .swiper-slide.swiper-slide-active .time p {color:#fff;}
.activity_cont .activity .activity_slider .swiper-slide.swiper-slide-active .time i {opacity:1; visibility:visible;}
.activity_cont .activity .activity_slider .swiper-slide.swiper-slide-active .brief {width:364px; margin:0 auto -7px; padding-top:6px;}
.activity_cont .activity .activity_slider .swiper-slide.swiper-slide-active .brief p {color:rgba(36,36,36,.5);}

/*新闻详情页*/
.detail_cont {padding-bottom:44px;}
.detail_cont .detail {width:1100px; margin:auto; position:relative;}
.detail_cont .detail h1 {text-align:center; font-size:20px; color:#333; padding-top:44px;}
.detail_cont .detail .sub {padding:10px 0 0; border-bottom:1px dashed #e5e5e5; text-align:center; font-family:SimSun; color:#999; line-height:24px; position:relative; z-index:99;}
.detail_cont .detail .sub > div {display:inline-block;}
.detail_cont .detail .sub > div > span {padding-right:26px; display:block; float:left;}
.detail_cont .detail .sub > div .share {display:inline-block;}
.detail_cont .detail .sub > div .share > span {float:left; display:block;}
.detail_cont .detail .sub > div .share > div {float:left;}
.detail_cont .detail .sub > div .share .bdshare-button-style0-16 a {width:32px; height:24px; padding-left:0; background-image:none; margin:0;}
.detail_cont .detail .sub > div .share .bdshare-button-style0-16 .bds_tsina {background:url(../images/dynamic/icon_weibo.jpg) no-repeat center; border-right:1px solid #e1e4ec; background-size:auto 100%;}
.detail_cont .detail .sub > div .share .bdshare-button-style0-16 .bds_tqq {background:url(../images/dynamic/icon_qq.jpg) no-repeat center; background-size:auto 100%;}
.detail_cont .detail .text {position:relative; z-index:99;}
.detail_cont .detail .text p {padding-top:15px; font-size:14px; line-height:26px;}
.detail_cont .detail .text img {display:block; margin:auto; padding-top:15px; max-width:100%;}
.detail_cont .detail .btns {position:absolute; left:0; top:140px; width:1100px;}
.detail_cont .detail .btns a {display:block; width:40px; height:40px;; position:absolute; right:-108px; top:0;}
.detail_cont .detail .btns a.prev {background:#3a4047 url(../images/dynamic/icon_prev.png) no-repeat center;}
.detail_cont .detail .btns a.back {background:#23272b url(../images/dynamic/icon_list.png) no-repeat center; top:42px;}
.detail_cont .detail .btns a.next {background:#3a4047 url(../images/dynamic/icon_next.png) no-repeat center; top:84px;}
.detail_cont .detail .btns.cur {position:fixed; top:100px; left:50%; margin-left:-550px;}