@charset "UTF-8";@font-face{font-family:Montserrat;src:url(font/Montserrat-Light.ttf) format("truetype"),url(font/Montserrat-Light.woff2) format('truetype'),url(font/Montserrat-Light.woff) format('truetype')}
a,body,dd,div,dl,dt,em,form,h1,h2,h3,h4,h5,h6,html,i,img,input,label,li,ol,p,select,span,ul{margin:0;padding:0}
em,i{font-style:normal}
ol,ul{list-style-type:none}
li{list-style:none}
img{border:0;vertical-align:middle}
button{cursor:pointer}
a{color:#333;text-decoration:none}
a:hover{color:#85be01}
button,input{font-family:Montserrat,Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif}
body{-webkit-font-smoothing:antialiased;background-color:#ececec;font:12px/1.5 Montserrat,Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif;color:#333}
.hide,.none{display:none}
.cf:after{visibility:hidden;clear:both;display:block;content:".";height:0}
.fl{float:left}
.fr{float:right}
.mt10{margin-top:10px}
.playWrap{width:1900px;margin:0 auto}
.overhtml body{width:100%;height:100%;overflow:hidden}
.overhtml .frame-game{position:fixed;left:0;top:0;width:100%;height:100%;background:#000;z-index:999}
.overhtml .noFull{display:block}
.playCon{float:left;width:1210px;margin-left:15px}
.playCon .adArea{margin-top:10px}
.playCon .adArea .bd{height:90px}
.playCon .glist{width:initial;margin-left:0;margin-right:-15px}
.playCon .glist li{margin:10px 10px 0 0}
.gameInfoArea{background:#f3f3f3;border:1px solid #e4e4e4;padding:15px;overflow:hidden;border-radius:10px;margin-top:10px;color:#74777a}
.gameInfoArea .inner{padding-left:90px;position:relative}
.gameInfoArea .game-img{width:74px;height:74px;border:3px solid #f2f2f2;border-radius:10px;position:absolute;left:0;top:0}
.gameInfoArea .game-info .tit{font-size:16px;line-height:1.6;font-weight:700;color:#78ac01;text-transform:uppercase}
.gameInfoArea .game-info .desc{font-size:14px;line-height:1.6;margin-top:5px}
.gameInfoArea .game-deta .item{margin-top:10px;color:#858585}
.gameInfoArea .game-deta .itemhd{display:block;height:26px;line-height:26px;font-size:14px;font-weight:700;color:#89949b;position:relative;margin-top:10px;text-transform:uppercase}
.gameInfoArea .game-deta .itemhd img{width:26px;height:26px;position:absolute;left:-34px;top:0}
.gameInfoArea .game-deta .itemtxt{font-size:14px;line-height:1.6;padding:3px 0;color:#858585;text-transform:capitalize}
.gameInfoArea .game-deta .pdr160{padding-right:160px}
.gameInfoArea .game-deta .item .down{height:40px;margin-top:10px}
.gameInfoArea .game-deta .item .down a{float:left;margin-right:20px}
.gameInfoArea .game-deta .item .down img{display:block;height:40px}
.gameInfoArea .game-deta .tags{overflow:hidden}
.gameInfoArea .game-deta .tags li{float:left;margin-right:15px;margin-top:10px}
.gameInfoArea .game-deta .tags li a{display:block;height:26px;line-height:26px;font-size:14px;border:2px solid #bcbcbc;color:#bcbcbc;padding:0 15px;overflow:hidden;border-radius:4px;font-weight:700}
.gameInfoArea .game-deta .tags li a:hover{color:#78ac01;border-color:#78ac01}
.gameInfoArea .qrCode{float:right;width:134px;height:200px;padding-top:36px;background:url(../images/mbimg.png);margin-top:-10px}
.gameInfoArea .qrCode span{display:block;height:22px;line-height:22px;font-size:12px;text-align:center}
.gameInfoArea .qrCode .code{display:block;width:104px;height:104px;overflow:hidden;margin:5px auto}
.gameInfoArea .qrCode .code img{display:block;width:100%;height:100%}
.gameArea{margin-top:10px}
.gameArea .box-head{height:30px;overflow:hidden;background:#85be01;border-radius:4px 4px 0 0;padding:5px 10px}
.gameArea .box-body{background:url(../images/gamebg.png) #000;padding:8px 0;min-height:640px}
.box-head-left{float:left;width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:20px;line-height:20px;padding:5px 0;color:#fff;font-size:14px}
.box-head-left a{color:#fff}
.box-head-left i{color:#ff0;margin:0 5px}
.box-head-left img{float:left;height:20px;margin-right:10px}
.box-head-left h1{display:inline;font-size:16px;font-weight:700;text-transform:uppercase}
.box-head-right{float:right;height:20px;margin-left:15px}
.sharelist{overflow:hidden}
.sharelist a{float:left;width:30px;height:30px;overflow:hidden;margin-left:10px}
.sharelist a:hover img{opacity:.8}
.sharelist img{background:#fff;display:block;width:100%;height:100%;border-radius:5px}
.box-head-center{padding:5px 0;height:20px;text-align:center;line-height:20px;font-size:14px;color:#fff;overflow:hidden;float:right;margin-right:15px}
.box-head-center .line{font-size:12px;margin:0 4px}
.box-head-center .like{float:left;color:#fff;cursor:pointer}
.box-head-center .like i{display:inline-block;vertical-align:middle;width:20px;height:20px;background:url(../images/ico-like.png) no-repeat;margin:0 5px}
.box-head-center .like.cur i{background-position:0 100%}
.box-head-center .fullsize,.box-head-center .reload{cursor:pointer}
.box-head-center .fullsize img,.box-head-center .reload img{display:inline-block;vertical-align:middle;width:20px;height:20px;margin-right:10px}
.more-game{width:110px;height:625px;overflow:hidden;padding:0 35px}
.more-game li{width:110px;height:110px;overflow:hidden;margin-top:15px}
.more-game li img{display:block;width:110px;height:110px}
.more-game-left{float:left}
.more-game-right{float:right}
.frame-game{float:left;width:850px;height:640px;position:relative}
.frame-game .playBegin{outline:1px dashed #fff;outline-offset:-10px;display:table;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden;z-index:999;background-color:#000}
.frame-game .playBegin .wgBg{display:block;content:' ';top:0;left:0;width:100%;height:100%;overflow:hidden;position:absolute;-webkit-filter:blur(120px);-moz-filter:blur(120px);-o-filter:blur(120px);-ms-filter:blur(120px);filter:blur(120px);background-size:cover}
.frame-game .playBegin .wgCenter{width:100%;height:100%;text-align:center;display:table-cell;text-align:center;vertical-align:middle;position:relative;z-index:1005}
.frame-game .playBegin .wgCenter .wgPlay{display:block;width:200px;margin:0 auto}
.frame-game .playBegin .wgCenter .wgPlay:hover .wgThumb::before{-webkit-animation:thumbFlare 2s;animation:thumbFlare 2s;-webkit-animation-iteration-count:1;animation-iteration-count:1;-webkit-animation-delay:0s;animation-delay:0s}
.frame-game .playBegin .wgCenter .wgPlay .wgThumb{display:block;width:200px;height:200px;overflow:hidden;border:5px solid #fff;border-radius:50%;margin:0 auto;-webkit-box-shadow:inset 0 5px 10px rgba(0,0,0,.7),0 2px 4px rgba(0,0,0,.5);box-shadow:inset 0 5px 10px rgba(0,0,0,.7),0 2px 4px rgba(0,0,0,.5);cursor:pointer;position:relative}
.frame-game .playBegin .wgCenter .wgPlay .wgThumb::before{content:'';position:absolute;top:0;left:-150px;width:50%;height:100%;background:rgba(255,255,255,.3);-webkit-transform:skewX(-30deg);transform:skewX(-30deg);-webkit-transition:.5s;transition:.5s}
.frame-game .playBegin .wgCenter .wgPlay .wgThumb img{display:block;width:100%;height:100%}
.frame-game .playBegin .wgCenter .wgPlay .wgPlayBtn{display:block;width:154px;height:54px;overflow:hidden;text-align:center;line-height:54px;font-size:18px;color:#fff;font-weight:700;background:#a2e30a;border:2px solid #fff;margin:15px auto 0;border-radius:10px;cursor:pointer;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.5);box-shadow:0 2px 4px rgba(0,0,0,.5)}
.frame-game .playBegin .wgCenter .wgPlay .wgPlayBtn:hover{background:#fb5252}
.frame-game .playBegin .wgCenter .wgControls{background:url(../images/wg-control.png) no-repeat;width:600px;height:60px;overflow:hidden;margin:50px auto 0}
.frame-game .playBegin .wgCenter .wgControls div{display:table;height:60px;vertical-align:middle;padding:0 15px 0 180px}
.frame-game .playBegin .wgCenter .wgControls div p{display:table-cell;vertical-align:middle;overflow:hidden;text-align:left;line-height:1.4;font-size:14px;color:#fff}
.frame-game .playBegin .wgCenter .wgSiteLogo{display:block;width:165px;margin:40px auto 0}
.frame-game .playBegin .wgCenter .wgSiteLogo img{display:block;width:100%}
.frame-game .wgAdLoaded{display:none;left:0;top:0;position:absolute;width:100%;z-index:1000;height:100%;background:#000}
.frame-game .wgAdLoaded .time{position:absolute;right:0;top:0;z-index:5;height:24px;line-height:24px;font-size:14px;color:#fff}
.frame-game .wgAdLoaded .inner{width:100%;height:100%;position:absolute;right:0;top:0}
.frame-game .gameSwf{display:none;width:100%;height:100%;text-align:center}
.frame-game .gameSwf iframe{text-align:center;margin:0;padding:0}
.noFull{display:none;position:absolute;right:20px;top:20px;width:50px;height:50px;text-align:center;line-height:50px;background:rgba(255,255,0,.5);color:#fff;font-size:28px;z-index:1000;cursor:pointer}
.titleArea{height:22px;text-align:center;overflow:hidden;line-height:22px;font-size:14px;font-weight:700;color:#85be01;margin-top:20px}
.gameReco .list li{margin-top:10px}
.gameReco .list a{display:block;background:#fff;height:70px;padding:8px;border:1px solid #e4e4e4;overflow:hidden;border-radius:5px}
.gameReco .list a:hover{-webkit-box-shadow:0 2px 10px 0 #85be01;box-shadow:0 2px 10px 0 #85be01}
.gameReco .list a:hover .info span.click{background:url(../images/reco-click-on.png) no-repeat}
.gameReco .list a:hover .info span.like{background:url(../images/pc-heart-red.svg) no-repeat}
.gameReco .list a img{float:left;width:70px;height:70px;margin-right:15px}
.gameReco .list a em{display:block;height:36px;line-height:36px;font-size:14px;color:#868686;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gameReco .list a .info{height:20px;line-height:20px;color:#bcbcbc;overflow:hidden;margin-top:4px}
.gameReco .list a .info span{float:left;padding-left:30px;color:#bababa;margin-right:20px}
.gameReco .list a .info span.click{background:url(../images/reco-click.png) no-repeat}
.gameReco .list a .info span.like{background:url(../images/reco-like.png) no-repeat}
@-webkit-keyframes thumbFlare{0%{left:-150px}
20%{left:250px}
40%{left:-150px}
60%{left:-150px}
80%{left:250px}
100%{left:-150px}
}
@keyframes thumbFlare{0%{left:-150px}
20%{left:250px}
40%{left:-150px}
60%{left:-150px}
80%{left:250px}
100%{left:-150px}
}
@media only screen and (max-width:1900px) and (min-width:1772px){.playWrap{width:1752px}
.playWrap .playCon{width:1064px}
.playWrap .playCon .glist{width:initial;margin-left:0;margin-right:-15px}
.playWrap .playCon .glist li{margin:10px 8px 0 0}
.playWrap .more-game-right{display:none}
}
@media only screen and (max-width:1772px) and (min-width:1624px){.playWrap{width:1604px}
.playWrap .playCon{width:916px}
.playWrap .playCon .glist{width:initial;margin-left:0;margin-right:-15px}
.playWrap .playCon .glist li{margin:10px 6px 0 0}
.playWrap .frame-game{float:initial;margin:0 auto}
.playWrap .more-game-left,.playWrap .more-game-right{display:none}
}
@media only screen and (max-width:1624px) and (min-width:1252px){.playWrap{width:1240px}
.playWrap .playCon{width:916px}
.playWrap .playCon .glist{width:initial;margin-left:0;margin-right:-15px}
.playWrap .playCon .glist li{margin:10px 6px 0 0}
.playWrap .frame-game{float:initial;margin:0 auto}
.playWrap .conright,.playWrap .more-game-left,.playWrap .more-game-right{display:none}
}
@media only screen and (max-width:1252px){.playWrap{width:1240px}
.playWrap .playCon{width:916px}
.playWrap .frame-game{float:initial;margin:0 auto}
.playWrap .conright{display:none}
.playWrap .conright,.playWrap .more-game-left,.playWrap .more-game-right{display:none}
}
.wrap{width:1900px;margin:0 auto}
.conLeft{width:308px}
.conright{width:350px}
.gameSide{margin-top:10px;overflow:hidden}
.gameSide .hd{height:28px;overflow:hidden;line-height:28px;text-align:center;font-size:16px;font-style:italic;font-weight:700;color:#85be01;text-transform:uppercase}
.gameSide .hd img{display:inline-block;vertical-align:middle;height:22px;margin:-2px 10px 0 0}
.gameSide .list{width:358px}
.gameSide .list li{float:left;width:82px;height:82px;overflow:hidden;margin:10px 7px 0 0}
.gameSide .list li a{display:block;width:78px;height:78px;border:2px solid #fff;overflow:hidden}
.gameSide .list li a:hover{border-color:#85be01}
.gameSide .list li a img{display:block;width:100%;height:100%}
.topArea{background:#85be01;height:90px;border-radius:5px;margin-top:10px;position:relative}
.topArea .logo{float:left;width:190px;height:70px;margin:12px 0 0 10px}
.topArea .logo img{display:block;width:190px;height:40px}
.topArea .logo p{height:20px;line-height:20px;text-align:center;font-size:14px;color:#fff;margin-top:6px}
.topArea .imgflag{float:left;width:28px;height:22px;margin:34px 0 0 26px}
.topArea .imgflag img{display:block;width:100%;height:100%;border-radius:5px}
.topArea .classlink{float:right;width:30px;height:30px;margin:30px 10px 0 0}
.topArea .classlink img{display:block;width:100%;height:100%}
.breadcrumb{background:#fff;height:40px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:40px;color:#bfbfbf;font-size:14px;padding:14px;border:1px solid #e4e4e4;overflow:hidden;border-radius:10px;margin-top:10px}
.breadcrumb em{font-size:16px;color:#85be01;font-weight:700}
.breadcrumb i{padding:0 5px}
.breadcrumb .home{background:url(../images/ico-home.png) no-repeat left center;float:left;height:40px;line-height:40px;color:#bfbfbf;padding-left:28px}
.schArea{background:#fff;height:40px;padding:14px 0;border:1px solid #e4e4e4;overflow:hidden;border-radius:10px;margin-top:10px}
.schArea input{background:0 0;border:none;outline:0}
.schArea .schtxt{float:left;background:#f2f2f2;width:200px;height:40px;overflow:hidden;line-height:40px;font-size:16px;padding:0 20px;margin-left:14px;border-radius:5px}
.schArea .schbtn{background:url(../images/ico-sch.png) no-repeat center;float:right;width:52px;height:40px;overflow:hidden;line-height:99;cursor:pointer}
.classNav{margin-top:10px}
.classNav dt{height:22px;text-align:center;overflow:hidden;line-height:22px;font-size:14px;font-weight:700;color:#85be01;text-transform:uppercase}
.classNav dt img{display:inline-block;height:22px;vertical-align:top;margin-right:10px}
.classNav dd{margin-top:10px}
.classNav dd a{background:url(../images/class-arrow.png) #fff no-repeat 278px 24px;display:block;height:60px;line-height:60px;font-size:16px;font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px 34px 4px 14px;border:1px solid #e4e4e4;border-radius:10px}
.classNav dd a img{float:left;width:60px;height:60px;margin-right:10px}
.classMore{display:block;width:258px;height:48px;overflow:hidden;text-align:center;line-height:48px;font-size:16px;font-weight:700;background:#85be01;color:#fff;border-radius:4px;margin:10px auto 0}
.classMore:hover{color:#fff}
.glist{float:left;width:1224px;margin-left:8px}
.glist li{float:left;width:120px;height:168px;overflow:hidden;border-radius:4px;background:#fff;padding:3px;margin:10px 5px 0}
.glist li:hover{-webkit-box-shadow:0 2px 10px 0 #85be01;box-shadow:0 2px 10px 0 #85be01}
.glist li:hover .info .click{background:url(../images/reco-click-on.png) no-repeat}
.glist li:hover .info .like{background:url(../images/reco-like-on.png) no-repeat}
.glist li:hover .info .good{background:url(../images/pc-heart-red.svg) no-repeat 100% 0}
.glist li .img{display:block;position:relative}
.glist li .img span{position:absolute;z-index:5}
.glist li .img span.ico-new{background:url(../images/ico-new.png) no-repeat;left:-.9px;top:0;width:38px;height:24px}
.glist li .img span.ico-hot{background:url(../images/ico-hot.png) no-repeat;left:-.9px;top:0;width:39px;height:24px}
.glist li .img span.ico-good{background:url(../images/ico-good.png) no-repeat;left:-.9px;top:0;width:41px;height:24px}
.glist li .img span.ico-exclus{background:url(../images/ico-exclus.png) no-repeat;right:0;top:56px;width:58px;height:64px}
.glist li .img img{display:block;width:120px;height:120px;border-radius:4px}
.glist li .img p{height:20px;line-height:20px;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:5px}
.glist li .info{height:22px;overflow:hidden}
.glist li .info .item{float:left;width:22px;height:22px}
.glist li .info .item img{display:block;width:22px;height:22px;border-radius:50%}
.glist li .info .good{background:url(../images/pc-heart-whrite.svg) no-repeat 100% 0;float:right;height:22px;padding-right:24px;line-height:22px;font-size:12px;color:#a1a1a1;cursor:pointer}
.glist li .info .good.cur{background-position:100% 100%}
.glist li .info .click{background:url(../images/reco-click.png) no-repeat;float:left;height:22px;padding-left:24px;line-height:22px;font-size:12px;color:#a1a1a1}
.glist li .info .like{background:url(../images/reco-like.png) no-repeat;float:right;height:22px;padding-left:24px;line-height:22px;font-size:12px;color:#a1a1a1}
.glist .adArea{margin:10px 6px 0}
.moreGame{display:block;width:400px;height:60px;overflow:hidden;text-align:center;line-height:60px;font-size:18px;font-weight:700;background:#85be01;color:#fff;border-radius:10px;margin:25px auto 0}
.moreGame:hover{color:#fff}
.adArea{background:#d7d7d7;border-radius:4px;overflow:hidden}
.adArea .hd{background:#85be01;height:16px;line-height:16px;text-align:center;color:#fff;font-size:12px;font-weight:700}
.adArea .bd{text-align:center;line-height:0;font-size:0}
.adFoot{width:1200px;margin:20px auto 0}
.adFoot .bd{height:90px}
.ad350 .bd{height:284px;padding:4px}
.ad308 .bd{height:600px;padding:4px}
.pages{padding:20px 0;text-align:center;line-height:0;font-size:0;margin-top:20px}
.pages a,.pages b{background:#85be01;display:inline-block;height:46px;line-height:46px;padding:0 15px;overflow:hidden;color:#fff;font-size:14px;font-weight:700;border-bottom:4px solid #6d9a03;border-radius:4px;margin:0 6px}
.pages a:hover,.pages b:hover{background:#fff;border-bottom:4px solid #c9c9c9;color:#85be01}
.pages b{cursor:default;background:#fff;border-bottom:4px solid #c9c9c9;color:#85be01}
.aboutArea{background:#fff;padding:10px 30px;margin-top:25px}
.aboutArea .hd{height:32px;line-height:32px;font-size:14px;font-weight:700;color:#85be01}
.aboutArea .bd p{padding:8px 0;font-size:12px;line-height:16px;color:#1e1e1e}
.footArea{background:#85be01;text-align:center;padding:20px 0}
.footArea .copyright,.footArea .link{height:22px;overflow:hidden;line-height:22px;font-size:14px}
.footArea .copyright a,.footArea .link a{color:#fff;margin:0 5px}
.footArea .copyright a:hover,.footArea .link a:hover{color:#fff}
.footArea .ftlogo{padding:10px 0;text-align:center}
.footArea .ftlogo img{display:block;widows:188px;height:40px;margin:0 auto}
.tagArea{width:308px;height:210px;overflow:hidden;border-radius:10px;margin-top:10px;position:relative}
.tagArea .tagbg{display:block;content:' ';top:0;left:0;width:100%;height:100%;overflow:hidden;position:absolute;-webkit-filter:blur(30px);-moz-filter:blur(30px);-o-filter:blur(30px);-ms-filter:blur(30px);filter:blur(30px);background-size:cover}
.tagArea .tagbg::after{content:'';width:100%;height:100%;position:absolute;left:0;top:0;background:linear-gradient(135deg,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 100%)}
.tagArea .tagcon{position:absolute;left:0;top:0;width:100%;height:100%}
.tagArea .tagcon .inner{padding:10px;position:relative}
.tagArea .tagcon .inner .img{width:70px;height:70px;border-radius:50%;position:absolute;left:10px;top:10px}
.tagArea .tagcon .inner .crumb{height:20px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:26px;font-size:14px;color:#fff;padding-left:80px}
.tagArea .tagcon .inner .crumb a{color:#fff}
.tagArea .tagcon .inner .crumb a img{float:left;width:20px;height:20px;margin-right:6px}
.tagArea .tagcon .inner .crumb i{margin:0 2px}
.tagArea .tagcon .inner .desc{font-size:12px;color:#fff;line-height:18px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;margin-top:6px;text-indent:80px}
.tagArea .tagcon .inner .tit{height:26px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:26px;color:#fff;font-size:14px;margin-top:6px;padding-left:80px;text-transform:uppercase}
.tagArea .tagcon .inner .share{margin-top:20px;text-align:right}
.pageAbout{background:#78ac01}
.pageAbout .head{padding:35px 0;text-align:center}
.pageAbout .head img{display:block;width:230px;height:48px;margin:0 auto}
.pageAbout .foot{padding:30px 0;text-align:center;line-height:22px;font-size:14px;color:#fff}
.pageAbout .main{width:894px;background:#fff;padding:50px;margin:0 auto;overflow:hidden;border-radius:10px}
.pageAbout .main .siteText{font-size:14px;text-align:center;line-height:24px}
.pageAbout .main .siteImg{text-align:center;padding:10px 0}
.pageAbout .aboutList{width:946px}
.pageAbout .aboutList li{float:left;width:216px;margin-right:20px;overflow:hidden}
.pageAbout .aboutList .item{display:block;height:40px;text-align:center;line-height:40px;font-size:16px;font-weight:700}
.pageAbout .aboutList .img{display:block;width:128px;height:128px;margin:0 auto}
.pageAbout .aboutList .desc{font-size:14px;line-height:20px;margin-top:10px}
.pageAbout .aboutList .link{margin-top:15px;height:22px;overflow:hidden;line-height:22px;overflow:hidden}
.pageAbout .aboutList .link a{color:#6d9a03;text-decoration:underline}
.pageArtice .head{width:1200px;background:#85be01;padding:15px 0;text-align:center;margin:0 auto}
.pageArtice .head img{display:block;width:230px;height:48px;margin:0 auto}
.pageArtice .head p{text-align:center;font-size:14px;line-height:22px;color:#fff;margin-top:10px}
.pageArtice .content{background:#fff;width:1200px;margin:0 auto;padding:25px 0;color:#5e5e5e;margin:0 auto}
.pageArtice .content .tit{font-size:28px;text-align:center;line-height:40px;padding:0 120px}
.pageArtice .content .con{font-size:14px;line-height:1.4;margin-top:20px;padding:0 160px}
.pageArtice .content .con p{padding:4px 0}
.policy-validation{-webkit-box-shadow:0 3px 10px 0 rgba(0,0,0,.34);box-shadow:0 3px 10px 0 rgba(0,0,0,.34);background-color:#fff;border:1px solid #bbb;border-radius:5px;bottom:20px;display:table;left:50%;margin-left:-38%;padding:10px;position:fixed;vertical-align:middle;width:76%;z-index:100000}
.policy-validation .content{color:#000;display:table-cell;font-size:12px;line-height:15px;padding:0 5px;vertical-align:middle}
.policy-validation .content a{color:#78ac01;text-decoration:underline}
.policy-validation .actions{display:table-cell;padding:0 5px;-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 10px;text-align:center;vertical-align:middle;width:90px}
.policy-validation .actions a{background:#78ac01;border-radius:3px;color:#fff;cursor:pointer;display:block;font-weight:700;letter-spacing:.4px;padding:5px 8px;width:70px}
.classList{float:left;width:1224px;overflow:hidden;margin-left:14px}
.classList li{float:left;margin-top:10px;width:296px;height:70px;margin-right:10px}
.classList li a{background:url(../images/class-arrow.png) #fff no-repeat 266px 24px;display:block;height:60px;line-height:60px;font-size:16px;font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px 34px 4px 14px;border:1px solid #e4e4e4;border-radius:10px}
.classList li a img{float:left;width:60px;height:60px;margin-right:10px}
@media only screen and (max-width:1900px) and (min-width:1780px){.wrap{width:1760px}
.glist{width:1088px}
}
@media only screen and (max-width:1780px) and (min-width:1640px){.wrap{width:1624px}
.glist{width:952px;margin-left:8px}
}
@media only screen and (max-width:1640px) and (min-width:1508px){.wrap{width:1488px}
.glist{width:816px;margin-left:8px}
}
@media only screen and (max-width:1508px) and (min-width:1368px){.wrap{width:1352px}
.glist{width:680px;margin-left:8px}
}
@media only screen and (max-width:1368px) and (min-width:1232px){.wrap{width:1216px}
.glist{width:544px;margin-left:8px}
}
@media only screen and (max-width:1232px) and (min-width:1100px){.wrap{width:1080px}
.glist{width:408px;margin-left:8px}
.adFoot{width:1080px}
}
@media only screen and (max-width:1100px){.wrap{width:996px}
.adFoot{width:996px}
.glist{width:680px;margin-left:8px}
.conright{display:none}
}
@media only screen and (max-width:1900px) and (min-width:1662px){.classPage .wrap{width:1594px}
.classPage .classList{width:918px}
}
@media only screen and (max-width:1662px) and (min-width:1300px){.classPage .wrap{width:1288px}
.classPage .classList{width:612px}
}
@media only screen and (max-width:1300px){.classPage .wrap{width:1288px}
.classPage .classList{width:612px}
}
.topArea .hdLangCur{float:left;width:35px;height:26px;margin:29px 0 0 15px;padding:5px}
.topArea .hdLangCur.active,.topArea .hdLangCur:hover{background:#172d4d}
.topArea .hdLangCur img{display:block;width:100%;height:100%;border-radius:5px}
.topArea .hdlangList{display:none;position:absolute;z-index:10;left:70.5%;top:71%;background:rgba(0,0,0,.8);padding:.15rem}
.topArea .hdlangList li{width:28px;height:22px;padding:5px;overflow:hidden;border-radius:.05rem}
.topArea .hdlangList li img{display:block;width:100%;height:100%}
.topArea .hdlangList li.cur{background:#2f9e02}
.cpt-toast{position:fixed;left:50%;top:50%;text-align:center;animation-duration:.3s;max-width:300px;line-height:20px;display:inline-block;vertical-align:middle;-moz-transition:all .3s ease;-o-transition:all .3s ease;-webkit-transition:all .3s ease;transition:all .3s ease;transform:translate(-50%,-50%);transform:translate3d(-50%,-50%,0);font-family:微软雅黑,microsoft yahei;-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none;word-wrap:break-word}
/*!* animate.css -http://daneden.me/animate
* Version - 3.5.2
* Licensed under the MIT license - http://opensource.org/licenses/MIT
*
* Copyright (c) 2017 Daniel Eden*/.animated{animation-duration:.5s;animation-fill-mode:both}
.animated.infinite{animation-iteration-count:infinite}
.animated.hinge-hastrans{animation-duration:2s}
.animated.bounceIn-hastrans,.animated.bounceOut-hastrans,.animated.flipOutX-hastrans,.animated.flipOutY-hastrans{animation-duration:.75s}
@keyframes bounce-hastrans{20%,53%,80%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1);transform:translate(-50%,0);transform:translate3d(-50%,0,0)}
40%,43%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate(-50%,-67%);transform:translate3d(-50%,-67%,0)}
70%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate(-50%,-58%);transform:translate3d(-50%,-58%,0)}
90%{transform:translate(-50%,-52%);transform:translate3d(-50%,-52%,0)}
100%{transform:translate(-50%,-50%);transform:translate3d(-50%,-50%,0)}
}
.bounce-hastrans{animation-name:bounce-hastrans;transform-origin:center bottom}
@keyframes flash-hastrans{50%,from,to{opacity:1}
25%,75%{opacity:0}
}
.flash-hastrans{animation-name:flash-hastrans}
@keyframes pulse-hastrans{from{transform:scale3d(1,1,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
50%{transform:scale3d(1.05,1.05,1.05) translate(-50%,-50%) translate3d(-50%,-50%,0)}
to{transform:scale3d(1,1,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
}
.pulse-hastrans{animation-name:pulse-hastrans;transform-origin:0 0}
@keyframes rubberBand-hastrans{from{transform:scale3d(1,1,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
30%{transform:scale3d(1.25,.75,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
40%{transform:scale3d(.75,1.25,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
50%{transform:scale3d(1.15,.85,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
65%{transform:scale3d(.95,1.05,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
75%{transform:scale3d(1.05,.95,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
to{transform:scale3d(1,1,1) translate(-50%,-50%) translate3d(-50%,-50%,0)}
}
.rubberBand-hastrans{animation-name:rubberBand-hastrans;transform-origin:0 0}
@keyframes shake-hastrans{from,to{transform:translate3d(-50%,-50%,0)}
10%,30%,50%,70%,90%{transform:translate3d(-54px,-50%,0)}
20%,40%,60%,80%{transform:translate3d(-46%,-50%,0)}
100%{transform:translate3d(-50%,-50%,0)}
}
.shake-hastrans{animation-name:shake-hastrans}
@keyframes headShake-hastrans{0%{transform:translate3d(-50%,-50%,0)}
6.5%{transform:rotateY(-9deg) translate3d(-53%,-50%,0)}
18.5%{transform:rotateY(7deg) translate3d(-47.5%,-50%,0)}
31.5%{transform:rotateY(-5deg) translate3d(-51.5%,-50%,0)}
43.5%{transform:rotateY(3deg) translate3d(-49%,-50%,0)}
50%{transform:translate3d(-50%,-50%,0)}
}
.headShake-hastrans{animation-timing-function:ease-in-out;animation-name:headShake-hastrans}
@keyframes swing-hastrans{20%{transform:rotate3d(0,0,1,15deg) translate3d(-50%,-50%,0)}
40%{transform:rotate3d(0,0,1,-10deg) translate3d(-50%,-50%,0)}
60%{transform:rotate3d(0,0,1,5deg) translate3d(-50%,-50%,0)}
80%{transform:rotate3d(0,0,1,-5deg) translate3d(-50%,-50%,0)}
to{transform:rotate3d(0,0,1,0deg) translate3d(-50%,-50%,0)}
}
.swing-hastrans{transform-origin:top center;animation-name:swing-hastrans;transform-origin:0 0}
@keyframes tada-hastrans{from{transform:scale3d(1,1,1) translate3d(-50%,-50%,0)}
10%,20%{transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg) translate3d(-50%,-50%,0)}
30%,50%,70%,90%{transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg) translate3d(-50%,-50%,0)}
40%,60%,80%{transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg) translate3d(-50%,-50%,0)}
to{transform:scale3d(1,1,1) translate3d(-50%,-50%,0)}
}
.tada-hastrans{animation-name:tada-hastrans;transform-origin:0 0}
@keyframes wobble-hastrans{from{transform:none}
15%{transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg) translate3d(-50%,-50%,0)}
30%{transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg) translate3d(-50%,-50%,0)}
45%{transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg) translate3d(-50%,-50%,0)}
60%{transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg) translate3d(-50%,-50%,0)}
75%{transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg) translate3d(-50%,-50%,0)}
to{transform:none;transform:translate3d(-50%,-50%,0)}
}
.wobble-hastrans{animation-name:wobble-hastrans}
@keyframes jello-hastrans{11.1%,from,to{transform:none;transform:translate3d(-50%,-50%,0)}
22.2%{transform:skewX(-12.5deg) skewY(-12.5deg) translate3d(-50%,-50%,0)}
33.3%{transform:skewX(6.25deg) skewY(6.25deg) translate3d(-50%,-50%,0)}
44.4%{transform:skewX(-3.125deg) skewY(-3.125deg) translate3d(-50%,-50%,0)}
55.5%{transform:skewX(1.5625deg) skewY(1.5625deg) translate3d(-50%,-50%,0)}
66.6%{transform:skewX(-.78125deg) skewY(-.78125deg) translate3d(-50%,-50%,0)}
77.7%{transform:skewX(.390625deg) skewY(.390625deg) translate3d(-50%,-50%,0)}
88.8%{transform:skewX(-.1953125deg) skewY(-.1953125deg) translate3d(-50%,-50%,0)}
}
.jello-hastrans{animation-name:jello-hastrans;transform-origin:center}
@keyframes bounceIn-hastrans{20%,40%,60%,80%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
0%{opacity:0;transform:scale3d(.3,.3,.3) translate3d(-50%,-50%,0)}
20%{transform:scale3d(1.1,1.1,1.1) translate3d(-50%,-50%,0)}
40%{transform:scale3d(.9,.9,.9) translate3d(-50%,-50%,0)}
60%{opacity:1;transform:scale3d(1.03,1.03,1.03) translate3d(-50%,-50%,0)}
80%{transform:scale3d(.97,.97,.97) translate3d(-50%,-50%,0)}
to{opacity:1;transform:scale3d(1,1,1) translate3d(-50%,-50%,0)}
}
.bounceIn-hastrans{animation-name:bounceIn-hastrans;transform-origin:0 0}
@keyframes bounceInDown-hastrans{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
0%{opacity:0;transform:translate3d(-50%,-3000px,0)}
60%{opacity:1;transform:translate3d(-50%,-30%,0)}
75%{transform:translate3d(-50%,-70%,0)}
90%{transform:translate3d(-50%,-54%,0)}
to{transform:none;transform:translate3d(-50%,-50%,0)}
}
.bounceInDown-hastrans{animation-name:bounceInDown-hastrans}
@keyframes bounceInLeft-hastrans{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
0%{opacity:0;transform:translate3d(-3000px,-50%,0)}
60%{opacity:1;transform:translate3d(-30%,-50%,0)}
75%{transform:translate3d(-70%,-50%,0)}
90%{transform:translate3d(-54%,-50%,0)}
to{transform:none;transform:translate3d(-50%,-50%,0)}
}
.bounceInLeft-hastrans{animation-name:bounceInLeft-hastrans}
@keyframes bounceInRight-hastrans{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
from{opacity:0;transform:translate3d(3000px,-50%,0)}
60%{opacity:1;transform:translate3d(-70%,-50%,0)}
75%{transform:translate3d(-30%,-50%,0)}
90%{transform:translate3d(-46%,-50%,0)}
to{transform:none;transform:translate3d(-50%,-50%,0)}
}
.bounceInRight-hastrans{animation-name:bounceInRight-hastrans}
@keyframes bounceInUp-hastrans{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
from{opacity:0;transform:translate3d(-50%,3000px,0)}
60%{opacity:1;transform:translate3d(-50%,-70px,0)}
75%{transform:translate3d(-50%,-30px,0)}
90%{transform:translate3d(-50%,-46px,0)}
to{transform:translate3d(-50%,-50%,0)}
}
.bounceInUp-hastrans{animation-name:bounceInUp-hastrans}
@keyframes bounceOut-hastrans{20%{transform:scale3d(.9,.9,.9) translate3d(-50%,-50%,0)}
50%,55%{opacity:1;transform:scale3d(1.1,1.1,1.1) translate3d(-50%,-50%,0)}
to{opacity:0;transform:scale3d(.3,.3,.3) translate3d(-50%,-50%,0)}
}
.bounceOut-hastrans{animation-name:bounceOut-hastrans;transform-origin:0 0}
@keyframes bounceOutDown-hastrans{20%{transform:translate3d(-50%,-40%,0)}
40%,45%{opacity:1;transform:translate3d(-50%,-60%,0)}
to{opacity:0;transform:translate3d(-50%,3000px,0)}
}
.bounceOutDown-hastrans{animation-name:bounceOutDown-hastrans}
@keyframes bounceOutLeft-hastrans{20%{opacity:1;transform:translate3d(-40%,-50%,0)}
to{opacity:0;transform:translate3d(-2000px,-50%,0)}
}
.bounceOutLeft-hastrans{animation-name:bounceOutLeft-hastrans}
@keyframes bounceOutRight-hastrans{20%{opacity:1;transform:translate3d(-60%,-50%,0)}
to{opacity:0;transform:translate3d(2000px,-50%,0)}
}
.bounceOutRight-hastrans{animation-name:bounceOutRight-hastrans}
@keyframes bounceOutUp-hastrans{20%{transform:translate3d(-50%,-60%,0)}
40%,45%{opacity:1;transform:translate3d(-50%,-40%,0)}
to{opacity:0;transform:translate3d(-50%,-2000px,0)}
}
.bounceOutUp-hastrans{animation-name:bounceOutUp-hastrans}
@keyframes fadeIn-hastrans{from{opacity:0;transform:translate(-50%,-50%);transform:translate3d(-50%,-50%,0)}
to{opacity:1;transform:translate(-50%,-50%);transform:translate3d(-50%,-50%,0)}
}
.fadeIn-hastrans{animation-name:fadeIn-hastrans}
@keyframes fadeInDown-hastrans{from{opacity:0;transform:translate3d(-50%,100%,0)}
to{opacity:1;transform:none;transform:translate3d(-50%,-50%,0)}
}
.fadeInDown-hastrans{animation-name:fadeInDown-hastrans}
@keyframes fadeInDownBig-hastrans{from{opacity:0;transform:translate3d(-50%,-2000px,0)}
to{opacity:1;transform:none;transform:translate3d(-50%,-50%,0)}
}
.fadeInDownBig-hastrans{animation-name:fadeInDownBig-hastrans}
@keyframes fadeInLeft-hastrans{from{opacity:0;transform:translate3d(-100%,-50%,0)}
to{opacity:1;transform:none;transform:translate3d(-50%,-50%,0)}
}
.fadeInLeft-hastrans{animation-name:fadeInLeft-hastrans}
@keyframes fadeInLeftBig-hastrans{from{opacity:0;transform:translate3d(-2000px,-50%,0)}
to{opacity:1;transform:none;transform:translate3d(-50%,-50%,0)}
}
.fadeInLeftBig-hastrans{animation-name:fadeInLeftBig-hastrans}
@keyframes fadeInRight-hastrans{from{opacity:0;transform:translate3d(100%,-50%,0)}
to{opacity:1;transform:none;transform:translate3d(-50%,-50%,0)}
}
.fadeInRight-hastrans{animation-name:fadeInRight-hastrans}
@keyframes fadeInRightBig-hastrans{from{opacity:0;transform:translate3d(2000px,-50%,0)}
to{opacity:1;transform:none;transform:translate3d(-50%,-50%,0)}
}
.fadeInRightBig-hastrans{animation-name:fadeInRightBig-hastrans}
@keyframes fadeInUp-hastrans{from{opacity:0;transform:translate3d(-50%,100%,0)}
to{opacity:1;transform:none;transform:translate3d(-50%,-50%,0)}
}
.fadeInUp-hastrans{animation-name:fadeInUp-hastrans}
@keyframes fadeInUpBig-hastrans{from{opacity:0;transform:translate3d(-50%,2000px,0)}
to{opacity:1;transform:none;transform:translate3d(-50%,-50%,0)}
}
.fadeInUpBig-hastrans{animation-name:fadeInUpBig-hastrans}
@keyframes fadeOut-hastrans{from{opacity:1;transform:translate(-50%,-50%);transform:translate3d(-50%,-50%,0)}
to{opacity:0;transform:translate(-50%,-50%);transform:translate3d(-50%,-50%,0)}
}
.fadeOut-hastrans{animation-name:fadeOut-hastrans}
@keyframes fadeOutDown-hastrans{from{opacity:1;transform:translate3d(-50%,-50%,0)}
to{opacity:0;transform:translate3d(-50%,100%,0)}
}
.fadeOutDown-hastrans{animation-name:fadeOutDown-hastrans}
@keyframes fadeOutDownBig-hastrans{from{opacity:1;transform:translate3d(-50%,-50%,0)}
to{opacity:0;transform:translate3d(-50%,2000px,0)}
}
.fadeOutDownBig-hastrans{animation-name:fadeOutDownBig-hastrans}
@keyframes fadeOutLeft-hastrans{from{opacity:1}
to{opacity:0;transform:translate3d(-100%,-50%,0)}
}
.fadeOutLeft-hastrans{animation-name:fadeOutLeft-hastrans}
@keyframes fadeOutLeftBig-hastrans{from{opacity:1}
to{opacity:0;transform:translate3d(-2000px,-50%,0)}
}
.fadeOutLeftBig-hastrans{animation-name:fadeOutLeftBig-hastrans}
@keyframes fadeOutRight-hastrans{from{opacity:1}
to{opacity:0;transform:translate3d(100%,-50%,0)}
}
.fadeOutRight-hastrans{animation-name:fadeOutRight-hastrans}
@keyframes fadeOutRightBig-hastrans{from{opacity:1}
to{opacity:0;transform:translate3d(2000px,-50%,0)}
}
.fadeOutRightBig-hastrans{animation-name:fadeOutRightBig-hastrans}
@keyframes fadeOutUp-hastrans{from{opacity:1}
to{opacity:0;transform:translate3d(-50%,-100%,0)}
}
.fadeOutUp-hastrans{animation-name:fadeOutUp-hastrans}
@keyframes fadeOutUpBig-hastrans{from{opacity:1}
to{opacity:0;transform:translate3d(-50%,-2000px,0)}
}
.fadeOutUpBig-hastrans{animation-name:fadeOutUpBig-hastrans}
@keyframes flip-hastrans{from{transform:perspective(400px) rotate3d(0,1,0,-360deg) translate3d(-50%,-50%,0);animation-timing-function:ease-out}
40%{transform:perspective(400px) translate3d(-50%,-50%,150px) rotate3d(0,1,0,-190deg);animation-timing-function:ease-out}
50%{transform:perspective(400px) translate3d(-50%,-50%,150px) rotate3d(0,1,0,-170deg);animation-timing-function:ease-in}
80%{transform:perspective(400px) scale3d(.95,.95,.95) translate3d(-50%,-50%,0);animation-timing-function:ease-in}
to{transform:perspective(400px) translate3d(-50%,-50%,0);animation-timing-function:ease-in}
}
.animated.flip-hastrans{-webkit-backface-visibility:visible;backface-visibility:visible;animation-name:flip-hastrans}
@keyframes flipInX-hastrans{from{transform:perspective(400px) rotate3d(1,0,0,90deg) translate(-50%,-50%) translate3d(-50%,-50%,0);animation-timing-function:ease-in;opacity:0}
40%{transform:perspective(400px) rotate3d(1,0,0,-20deg) translate(-50%,-50%) translate3d(-50%,-50%,0);animation-timing-function:ease-in}
60%{transform:perspective(400px) rotate3d(1,0,0,10deg) translate(-50%,-50%) translate3d(-50%,-50%,0);opacity:1}
80%{transform:perspective(400px) rotate3d(1,0,0,-5deg) translate(-50%,-50%) translate3d(-50%,-50%,0)}
to{transform:perspective(400px) translate(-50%,-50%) translate3d(-50%,-50%,0)}
}
.flipInX-hastrans{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipInX-hastrans}
@keyframes flipInY-hastrans{from{transform:perspective(400px) rotate3d(0,1,0,90deg) translate3d(-50%,-50%,0);animation-timing-function:ease-in;opacity:0}
40%{transform:perspective(400px) rotate3d(0,1,0,-20deg) translate3d(-50%,-50%,0);animation-timing-function:ease-in}
60%{transform:perspective(400px) rotate3d(0,1,0,10deg) translate3d(-50%,-50%,0);opacity:1}
80%{transform:perspective(400px) rotate3d(0,1,0,-5deg) translate3d(-50%,-50%,0)}
to{transform:perspective(400px) translate3d(-50%,-50%,0)}
}
.flipInY-hastrans{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipInY-hastrans}
@keyframes flipOutX-hastrans{from{transform:perspective(400px) translate3d(-50%,-50%,0)}
30%{transform:perspective(400px) rotate3d(1,0,0,-20deg) translate3d(-50%,-50%,0);opacity:1}
to{transform:perspective(400px) rotate3d(1,0,0,90deg) translate3d(-50%,-50%,0);opacity:0}
}
.flipOutX-hastrans{animation-name:flipOutX-hastrans;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}
@keyframes flipOutY-hastrans{from{transform:perspective(400px) translate3d(-50%,-50%,0)}
30%{transform:perspective(400px) rotate3d(0,1,0,-15deg) translate3d(-50%,-50%,0);opacity:1}
to{transform:perspective(400px) rotate3d(0,1,0,90deg) translate3d(-50%,-50%,0);opacity:0}
}
.flipOutY-hastrans{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipOutY-hastrans}
@keyframes lightSpeedIn-hastrans{from{transform:translate3d(100%,-50%,0) skewX(-30deg);opacity:0}
60%{transform:skewX(20deg) translate3d(10%,-50%,0);opacity:1}
80%{transform:skewX(-5deg) translate3d(-30%,-50%,0);opacity:1}
to{transform:none;transform:translate3d(-50%,-50%,0);opacity:1}
}
.lightSpeedIn-hastrans{animation-name:lightSpeedIn-hastrans;animation-timing-function:ease-out}
@keyframes lightSpeedOut-hastrans{from{transform:translate3d(-50%,-50%,0);opacity:1}
to{transform:translate3d(100%,-50%,0) skewX(30deg);opacity:0}
}
.lightSpeedOut-hastrans{animation-name:lightSpeedOut-hastrans;animation-timing-function:ease-in}
@keyframes rotateIn-hastrans{from{transform-origin:50% 0;transform:rotate3d(0,0,1,-200deg) translate3d(-50%,-50%,0);opacity:0}
to{transform-origin:50% 0;transform:none;transform:translate3d(-50%,-50%,0);opacity:1}
}
.rotateIn-hastrans{animation-name:rotateIn-hastrans}
@keyframes rotateInDownLeft-hastrans{from{transform-origin:left bottom;transform:rotate3d(0,0,1,-45deg) translate3d(-50%,-50%,0);opacity:0}
to{transform-origin:left bottom;transform:none;transform:translate3d(-50%,-50%,0);opacity:1}
}
.rotateInDownLeft-hastrans{animation-name:rotateInDownLeft-hastrans}
@keyframes rotateInDownRight-hastrans{from{transform-origin:right bottom;transform:rotate3d(0,0,1,45deg) translate3d(-50%,-50%,0);opacity:0}
to{transform-origin:right bottom;transform:none;transform:translate3d(-50%,-50%,0);opacity:1}
}
.rotateInDownRight-hastrans{animation-name:rotateInDownRight-hastrans}
@keyframes rotateInUpLeft-hastrans{from{transform-origin:left bottom;transform:rotate3d(0,0,1,45deg) translate3d(-50%,-50%,0);opacity:0}
to{transform-origin:left bottom;transform:none;transform:translate3d(-50%,-50%,0);opacity:1}
}
.rotateInUpLeft-hastrans{animation-name:rotateInUpLeft-hastrans}
@keyframes rotateInUpRight-hastrans{from{transform-origin:right bottom;transform:rotate3d(0,0,1,-90deg) translate3d(-50%,-50%,0);opacity:0}
to{transform-origin:right bottom;transform:none;transform:translate3d(-50%,-50%,0);opacity:1}
}
.rotateInUpRight-hastrans{animation-name:rotateInUpRight-hastrans}
@keyframes rotateOut-hastrans{from{transform-origin:center;opacity:1}
to{transform-origin:center;transform:rotate3d(0,0,1,200deg);opacity:0}
}
.rotateOut-hastrans{animation-name:rotateOut-hastrans}
@keyframes rotateOutDownLeft-hastrans{from{transform-origin:left bottom;opacity:1}
to{transform-origin:left bottom;transform:rotate3d(0,0,1,45deg);opacity:0}
}
.rotateOutDownLeft-hastrans{animation-name:rotateOutDownLeft-hastrans}
@keyframes rotateOutDownRight-hastrans{from{transform-origin:right bottom;opacity:1}
to{transform-origin:right bottom;transform:rotate3d(0,0,1,-45deg);opacity:0}
}
.rotateOutDownRight-hastrans{animation-name:rotateOutDownRight-hastrans}
@keyframes rotateOutUpLeft-hastrans{from{transform-origin:left bottom;opacity:1}
to{transform-origin:left bottom;transform:rotate3d(0,0,1,-45deg);opacity:0}
}
.rotateOutUpLeft-hastrans{animation-name:rotateOutUpLeft-hastrans}
@keyframes rotateOutUpRight-hastrans{from{transform-origin:right bottom;opacity:1}
to{transform-origin:right bottom;transform:rotate3d(0,0,1,90deg);opacity:0}
}
.rotateOutUpRight-hastrans{animation-name:rotateOutUpRight-hastrans}
@keyframes hinge-hastrans{0%{transform-origin:top left;animation-timing-function:ease-in-out}
20%,60%{transform:rotate3d(0,0,1,80deg);transform-origin:top left;animation-timing-function:ease-in-out}
40%,80%{transform:rotate3d(0,0,1,60deg);transform-origin:top left;animation-timing-function:ease-in-out;opacity:1}
to{transform:translate3d(0,700px,0);opacity:0}
}
.hinge-hastrans{animation-name:hinge-hastrans}
@keyframes jackInTheBox-hastrans{from{opacity:0;transform:scale(.1) rotate(30deg) translate3d(-50%,-50%,0);transform-origin:center bottom}
50%{transform:rotate(-10deg) translate3d(-50%,-50%,0)}
70%{transform:rotate(3deg) translate3d(-50%,-50%,0)}
to{opacity:1;transform:scale(1) translate3d(-50%,-50%,0)}
}
.jackInTheBox-hastrans{animation-name:jackInTheBox-hastrans;transform-origin:0 0}
@keyframes rollIn-hastrans{from{opacity:0;transform:translate3d(-150%,-50%,0) rotate3d(0,0,1,-120deg)}
to{opacity:1;transform:none translate3d(-50%,-50%,0)}
}
.rollIn-hastrans{animation-name:rollIn-hastrans}
@keyframes rollOut-hastrans{from{opacity:1}
to{opacity:0;transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}
}
.rollOut-hastrans{animation-name:rollOut-hastrans}
@keyframes zoomIn-hastrans{from{opacity:0}
50%{opacity:1;transform:scale3d(.3,.3,.3)}
to{opacity:1}
}
.zoomIn-hastrans{animation-name:zoomIn-hastrans;transform-origin:-25% -25%}
@keyframes zoomInDown-hastrans{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomInDown-hastrans{animation-name:zoomInDown-hastrans;transform:translate3d(-50%,-50%,0)}
@keyframes zoomInLeft-hastrans{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(10px,0,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomInLeft-hastrans{animation-name:zoomInLeft-hastrans}
@keyframes zoomInRight-hastrans{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomInRight-hastrans{animation-name:zoomInRight-hastrans}
@keyframes zoomInUp-hastrans{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomInUp-hastrans{animation-name:zoomInUp-hastrans}
@keyframes zoomOut-hastrans{from{opacity:1;transform:translate3d(-50%,-50%,0)}
50%{opacity:0;transform:scale3d(.3,.3,.3) translate3d(-50%,-50%,0)}
to{opacity:0;transform:translate3d(-50%,-50%,0)}
}
.zoomOut-hastrans{animation-name:zoomOut-hastrans;transform-origin:0 0}
@keyframes zoomOutDown-hastrans{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-50%,-60px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
to{opacity:0;transform:scale3d(.1,.1,.1) translate3d(-50%,2000px,0);transform-origin:center bottom;animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomOutDown-hastrans{animation-name:zoomOutDown-hastrans;transform-origin:0 0}
@keyframes zoomOutLeft-hastrans{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-50%,-50%,0)}
to{opacity:0;transform:scale(.1) translate3d(-2000px,-50%,0);transform-origin:left center}
}
.zoomOutLeft-hastrans{animation-name:zoomOutLeft-hastrans}
@keyframes zoomOutRight-hastrans{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-50%,-50%,0)}
to{opacity:0;transform:scale(.1) translate3d(2000px,-50%,0);transform-origin:right center}
}
.zoomOutRight-hastrans{animation-name:zoomOutRight-hastrans}
@keyframes zoomOutUp-hastrans{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-50%,-50%,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
to{opacity:0;transform:scale3d(.1,.1,.1) translate3d(-50%,-2000px,0);transform-origin:center bottom;animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomOutUp-hastrans{animation-name:zoomOutUp-hastrans}
@keyframes slideInDown-hastrans{from{transform:translate3d(-50%,-100%,0);visibility:visible}
to{transform:translate3d(-50%,-50%,0)}
}
.slideInDown-hastrans{animation-name:slideInDown-hastrans}
@keyframes slideInLeft-hastrans{from{transform:translate3d(-100%,-50%,0);visibility:visible}
to{transform:translate3d(-50%,-50%,0)}
}
.slideInLeft-hastrans{animation-name:slideInLeft-hastrans}
@keyframes slideInRight-hastrans{from{transform:translate3d(100%,-50%,0);visibility:visible}
to{transform:translate3d(-50%,-50%,0)}
}
.slideInRight-hastrans{animation-name:slideInRight-hastrans}
@keyframes slideInUp-hastrans{from{transform:translate3d(-50%,100%,0);visibility:visible}
to{transform:translate3d(-50%,-50%,0)}
}
.slideInUp-hastrans{animation-name:slideInUp-hastrans}
@keyframes slideOutDown-hastrans{from{transform:translate3d(-50%,-50%,0)}
to{visibility:hidden;transform:translate3d(-50%,100%,0)}
}
.slideOutDown-hastrans{animation-name:slideOutDown-hastrans}
@keyframes slideOutLeft-hastrans{from{transform:translate3d(-50%,-50%,0)}
to{visibility:hidden;transform:translate3d(-100%,-50%,0)}
}
.slideOutLeft-hastrans{animation-name:slideOutLeft-hastrans}
@keyframes slideOutRight-hastrans{from{transform:translate3d(-50%,-50%,0)}
to{visibility:hidden;transform:translate3d(100%,-50%,0)}
}
.slideOutRight-hastrans{animation-name:slideOutRight-hastrans}
@keyframes slideOutUp-hastrans{from{transform:translate3d(-50%,-50%,0)}
to{visibility:hidden;transform:translate3d(-50%,-100%,0)}
}
.slideOutUp-hastrans{animation-name:slideOutUp-hastrans}
/*!* animate.css -http://daneden.me/animate
* Version - 3.5.2
* Licensed under the MIT license - http://opensource.org/licenses/MIT
*
* Copyright (c) 2017 Daniel Eden*/.animated{animation-duration:1s;animation-fill-mode:both}
.animated.infinite{animation-iteration-count:infinite}
.animated.hinge{animation-duration:2s}
.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{animation-duration:.75s}
@keyframes bounce{20%,53%,80%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1);transform:translate3d(0,0,0)}
40%,43%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-30px,0)}
70%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-15px,0)}
90%{transform:translate3d(0,-4px,0)}
}
.bounce{animation-name:bounce;transform-origin:center bottom}
@keyframes flash{50%,from,to{opacity:1}
25%,75%{opacity:0}
}
.flash{animation-name:flash}
@keyframes pulse{from{transform:scale3d(1,1,1)}
50%{transform:scale3d(1.05,1.05,1.05)}
to{transform:scale3d(1,1,1)}
}
.pulse{animation-name:pulse}
@keyframes rubberBand{from{transform:scale3d(1,1,1)}
30%{transform:scale3d(1.25,.75,1)}
40%{transform:scale3d(.75,1.25,1)}
50%{transform:scale3d(1.15,.85,1)}
65%{transform:scale3d(.95,1.05,1)}
75%{transform:scale3d(1.05,.95,1)}
to{transform:scale3d(1,1,1)}
}
.rubberBand{animation-name:rubberBand}
@keyframes shake{from,to{transform:translate3d(0,0,0)}
10%,30%,50%,70%,90%{transform:translate3d(-10px,0,0)}
20%,40%,60%,80%{transform:translate3d(10px,0,0)}
}
.shake{animation-name:shake}
@keyframes headShake{0%{transform:translateX(0)}
6.5%{transform:translateX(-6px) rotateY(-9deg)}
18.5%{transform:translateX(5px) rotateY(7deg)}
31.5%{transform:translateX(-3px) rotateY(-5deg)}
43.5%{transform:translateX(2px) rotateY(3deg)}
50%{transform:translateX(0)}
}
.headShake{animation-timing-function:ease-in-out;animation-name:headShake}
@keyframes swing{20%{transform:rotate3d(0,0,1,15deg)}
40%{transform:rotate3d(0,0,1,-10deg)}
60%{transform:rotate3d(0,0,1,5deg)}
80%{transform:rotate3d(0,0,1,-5deg)}
to{transform:rotate3d(0,0,1,0deg)}
}
.swing{transform-origin:top center;animation-name:swing}
@keyframes tada{from{transform:scale3d(1,1,1)}
10%,20%{transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}
30%,50%,70%,90%{transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}
40%,60%,80%{transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}
to{transform:scale3d(1,1,1)}
}
.tada{animation-name:tada}
@keyframes wobble{from{transform:none}
15%{transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}
30%{transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}
45%{transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}
60%{transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}
75%{transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}
to{transform:none}
}
.wobble{animation-name:wobble}
@keyframes jello{11.1%,from,to{transform:none}
22.2%{transform:skewX(-12.5deg) skewY(-12.5deg)}
33.3%{transform:skewX(6.25deg) skewY(6.25deg)}
44.4%{transform:skewX(-3.125deg) skewY(-3.125deg)}
55.5%{transform:skewX(1.5625deg) skewY(1.5625deg)}
66.6%{transform:skewX(-.78125deg) skewY(-.78125deg)}
77.7%{transform:skewX(.390625deg) skewY(.390625deg)}
88.8%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}
}
.jello{animation-name:jello;transform-origin:center}
@keyframes bounceIn{20%,40%,60%,80%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
0%{opacity:0;transform:scale3d(.3,.3,.3)}
20%{transform:scale3d(1.1,1.1,1.1)}
40%{transform:scale3d(.9,.9,.9)}
60%{opacity:1;transform:scale3d(1.03,1.03,1.03)}
80%{transform:scale3d(.97,.97,.97)}
to{opacity:1;transform:scale3d(1,1,1)}
}
.bounceIn{animation-name:bounceIn}
@keyframes bounceInDown{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
0%{opacity:0;transform:translate3d(0,-3000px,0)}
60%{opacity:1;transform:translate3d(0,25px,0)}
75%{transform:translate3d(0,-10px,0)}
90%{transform:translate3d(0,5px,0)}
to{transform:none}
}
.bounceInDown{animation-name:bounceInDown}
@keyframes bounceInLeft{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
0%{opacity:0;transform:translate3d(-3000px,0,0)}
60%{opacity:1;transform:translate3d(25px,0,0)}
75%{transform:translate3d(-10px,0,0)}
90%{transform:translate3d(5px,0,0)}
to{transform:none}
}
.bounceInLeft{animation-name:bounceInLeft}
@keyframes bounceInRight{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
from{opacity:0;transform:translate3d(3000px,0,0)}
60%{opacity:1;transform:translate3d(-25px,0,0)}
75%{transform:translate3d(10px,0,0)}
90%{transform:translate3d(-5px,0,0)}
to{transform:none}
}
.bounceInRight{animation-name:bounceInRight}
@keyframes bounceInUp{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}
from{opacity:0;transform:translate3d(0,3000px,0)}
60%{opacity:1;transform:translate3d(0,-20px,0)}
75%{transform:translate3d(0,10px,0)}
90%{transform:translate3d(0,-5px,0)}
to{transform:translate3d(0,0,0)}
}
.bounceInUp{animation-name:bounceInUp}
@keyframes bounceOut{20%{transform:scale3d(.9,.9,.9)}
50%,55%{opacity:1;transform:scale3d(1.1,1.1,1.1)}
to{opacity:0;transform:scale3d(.3,.3,.3)}
}
.bounceOut{animation-name:bounceOut}
@keyframes bounceOutDown{20%{transform:translate3d(0,10px,0)}
40%,45%{opacity:1;transform:translate3d(0,-20px,0)}
to{opacity:0;transform:translate3d(0,2000px,0)}
}
.bounceOutDown{animation-name:bounceOutDown}
@keyframes bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}
to{opacity:0;transform:translate3d(-2000px,0,0)}
}
.bounceOutLeft{animation-name:bounceOutLeft}
@keyframes bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}
to{opacity:0;transform:translate3d(2000px,0,0)}
}
.bounceOutRight{animation-name:bounceOutRight}
@keyframes bounceOutUp{20%{transform:translate3d(0,-10px,0)}
40%,45%{opacity:1;transform:translate3d(0,20px,0)}
to{opacity:0;transform:translate3d(0,-2000px,0)}
}
.bounceOutUp{animation-name:bounceOutUp}
@keyframes fadeIn{from{opacity:0}
to{opacity:1}
}
.fadeIn{animation-name:fadeIn}
@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}
to{opacity:1;transform:none}
}
.fadeInDown{animation-name:fadeInDown}
@keyframes fadeInDownBig{from{opacity:0;transform:translate3d(0,-2000px,0)}
to{opacity:1;transform:none}
}
.fadeInDownBig{animation-name:fadeInDownBig}
@keyframes fadeInLeft{from{opacity:0;transform:translate3d(-100%,0,0)}
to{opacity:1;transform:none}
}
.fadeInLeft{animation-name:fadeInLeft}
@keyframes fadeInLeftBig{from{opacity:0;transform:translate3d(-2000px,0,0)}
to{opacity:1;transform:none}
}
.fadeInLeftBig{animation-name:fadeInLeftBig}
@keyframes fadeInRight{from{opacity:0;transform:translate3d(100%,0,0)}
to{opacity:1;transform:none}
}
.fadeInRight{animation-name:fadeInRight}
@keyframes fadeInRightBig{from{opacity:0;transform:translate3d(2000px,0,0)}
to{opacity:1;transform:none}
}
.fadeInRightBig{animation-name:fadeInRightBig}
@keyframes fadeInUp{from{opacity:0;transform:translate3d(0,100%,0)}
to{opacity:1;transform:none}
}
.fadeInUp{animation-name:fadeInUp}
@keyframes fadeInUpBig{from{opacity:0;transform:translate3d(0,2000px,0)}
to{opacity:1;transform:none}
}
.fadeInUpBig{animation-name:fadeInUpBig}
@keyframes fadeOut{from{opacity:1}
to{opacity:0}
}
.fadeOut{animation-name:fadeOut}
@keyframes fadeOutDown{from{opacity:1}
to{opacity:0;transform:translate3d(0,100%,0)}
}
.fadeOutDown{animation-name:fadeOutDown}
@keyframes fadeOutDownBig{from{opacity:1}
to{opacity:0;transform:translate3d(0,2000px,0)}
}
.fadeOutDownBig{animation-name:fadeOutDownBig}
@keyframes fadeOutLeft{from{opacity:1}
to{opacity:0;transform:translate3d(-100%,0,0)}
}
.fadeOutLeft{animation-name:fadeOutLeft}
@keyframes fadeOutLeftBig{from{opacity:1}
to{opacity:0;transform:translate3d(-2000px,0,0)}
}
.fadeOutLeftBig{animation-name:fadeOutLeftBig}
@keyframes fadeOutRight{from{opacity:1}
to{opacity:0;transform:translate3d(100%,0,0)}
}
.fadeOutRight{animation-name:fadeOutRight}
@keyframes fadeOutRightBig{from{opacity:1}
to{opacity:0;transform:translate3d(2000px,0,0)}
}
.fadeOutRightBig{animation-name:fadeOutRightBig}
@keyframes fadeOutUp{from{opacity:1}
to{opacity:0;transform:translate3d(0,-100%,0)}
}
.fadeOutUp{animation-name:fadeOutUp}
@keyframes fadeOutUpBig{from{opacity:1}
to{opacity:0;transform:translate3d(0,-2000px,0)}
}
.fadeOutUpBig{animation-name:fadeOutUpBig}
@keyframes flip{from{transform:perspective(400px) rotate3d(0,1,0,-360deg);animation-timing-function:ease-out}
40%{transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);animation-timing-function:ease-out}
50%{transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);animation-timing-function:ease-in}
80%{transform:perspective(400px) scale3d(.95,.95,.95);animation-timing-function:ease-in}
to{transform:perspective(400px);animation-timing-function:ease-in}
}
.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;animation-name:flip}
@keyframes flipInX{from{transform:perspective(400px) rotate3d(1,0,0,90deg);animation-timing-function:ease-in;opacity:0}
40%{transform:perspective(400px) rotate3d(1,0,0,-20deg);animation-timing-function:ease-in}
60%{transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}
80%{transform:perspective(400px) rotate3d(1,0,0,-5deg)}
to{transform:perspective(400px)}
}
.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipInX}
@keyframes flipInY{from{transform:perspective(400px) rotate3d(0,1,0,90deg);animation-timing-function:ease-in;opacity:0}
40%{transform:perspective(400px) rotate3d(0,1,0,-20deg);animation-timing-function:ease-in}
60%{transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}
80%{transform:perspective(400px) rotate3d(0,1,0,-5deg)}
to{transform:perspective(400px)}
}
.flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipInY}
@keyframes flipOutX{from{transform:perspective(400px)}
30%{transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}
to{transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}
}
.flipOutX{animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}
@keyframes flipOutY{from{transform:perspective(400px)}
30%{transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}
to{transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}
}
.flipOutY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipOutY}
@keyframes lightSpeedIn{from{transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}
60%{transform:skewX(20deg);opacity:1}
80%{transform:skewX(-5deg);opacity:1}
to{transform:none;opacity:1}
}
.lightSpeedIn{animation-name:lightSpeedIn;animation-timing-function:ease-out}
@keyframes lightSpeedOut{from{opacity:1}
to{transform:translate3d(100%,0,0) skewX(30deg);opacity:0}
}
.lightSpeedOut{animation-name:lightSpeedOut;animation-timing-function:ease-in}
@keyframes rotateIn{from{transform-origin:center;transform:rotate3d(0,0,1,-200deg);opacity:0}
to{transform-origin:center;transform:none;opacity:1}
}
.rotateIn{animation-name:rotateIn}
@keyframes rotateInDownLeft{from{transform-origin:left bottom;transform:rotate3d(0,0,1,-45deg);opacity:0}
to{transform-origin:left bottom;transform:none;opacity:1}
}
.rotateInDownLeft{animation-name:rotateInDownLeft}
@keyframes rotateInDownRight{from{transform-origin:right bottom;transform:rotate3d(0,0,1,45deg);opacity:0}
to{transform-origin:right bottom;transform:none;opacity:1}
}
.rotateInDownRight{animation-name:rotateInDownRight}
@keyframes rotateInUpLeft{from{transform-origin:left bottom;transform:rotate3d(0,0,1,45deg);opacity:0}
to{transform-origin:left bottom;transform:none;opacity:1}
}
.rotateInUpLeft{animation-name:rotateInUpLeft}
@keyframes rotateInUpRight{from{transform-origin:right bottom;transform:rotate3d(0,0,1,-90deg);opacity:0}
to{transform-origin:right bottom;transform:none;opacity:1}
}
.rotateInUpRight{animation-name:rotateInUpRight}
@keyframes rotateOut{from{transform-origin:center;opacity:1}
to{transform-origin:center;transform:rotate3d(0,0,1,200deg);opacity:0}
}
.rotateOut{animation-name:rotateOut}
@keyframes rotateOutDownLeft{from{transform-origin:left bottom;opacity:1}
to{transform-origin:left bottom;transform:rotate3d(0,0,1,45deg);opacity:0}
}
.rotateOutDownLeft{animation-name:rotateOutDownLeft}
@keyframes rotateOutDownRight{from{transform-origin:right bottom;opacity:1}
to{transform-origin:right bottom;transform:rotate3d(0,0,1,-45deg);opacity:0}
}
.rotateOutDownRight{animation-name:rotateOutDownRight}
@keyframes rotateOutUpLeft{from{transform-origin:left bottom;opacity:1}
to{transform-origin:left bottom;transform:rotate3d(0,0,1,-45deg);opacity:0}
}
.rotateOutUpLeft{animation-name:rotateOutUpLeft}
@keyframes rotateOutUpRight{from{transform-origin:right bottom;opacity:1}
to{transform-origin:right bottom;transform:rotate3d(0,0,1,90deg);opacity:0}
}
.rotateOutUpRight{animation-name:rotateOutUpRight}
@keyframes hinge{0%{transform-origin:top left;animation-timing-function:ease-in-out}
20%,60%{transform:rotate3d(0,0,1,80deg);transform-origin:top left;animation-timing-function:ease-in-out}
40%,80%{transform:rotate3d(0,0,1,60deg);transform-origin:top left;animation-timing-function:ease-in-out;opacity:1}
to{transform:translate3d(0,700px,0);opacity:0}
}
.hinge{animation-name:hinge}
@keyframes jackInTheBox{from{opacity:0;transform:scale(.1) rotate(30deg);transform-origin:center bottom}
50%{transform:rotate(-10deg)}
70%{transform:rotate(3deg)}
to{opacity:1;transform:scale(1)}
}
.jackInTheBox{animation-name:jackInTheBox}
@keyframes rollIn{from{opacity:0;transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}
to{opacity:1;transform:none}
}
.rollIn{animation-name:rollIn}
@keyframes rollOut{from{opacity:1}
to{opacity:0;transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}
}
.rollOut{animation-name:rollOut}
@keyframes zoomIn{from{opacity:0;transform:scale3d(.3,.3,.3)}
50%{opacity:1}
}
.zoomIn{animation-name:zoomIn}
@keyframes zoomInDown{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomInDown{animation-name:zoomInDown}
@keyframes zoomInLeft{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(10px,0,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomInLeft{animation-name:zoomInLeft}
@keyframes zoomInRight{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomInRight{animation-name:zoomInRight}
@keyframes zoomInUp{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomInUp{animation-name:zoomInUp}
@keyframes zoomOut{from{opacity:1}
50%{opacity:0;transform:scale3d(.3,.3,.3)}
to{opacity:0}
}
.zoomOut{animation-name:zoomOut}
@keyframes zoomOutDown{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
to{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform-origin:center bottom;animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomOutDown{animation-name:zoomOutDown}
@keyframes zoomOutLeft{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}
to{opacity:0;transform:scale(.1) translate3d(-2000px,0,0);transform-origin:left center}
}
.zoomOutLeft{animation-name:zoomOutLeft}
@keyframes zoomOutRight{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}
to{opacity:0;transform:scale(.1) translate3d(2000px,0,0);transform-origin:right center}
}
.zoomOutRight{animation-name:zoomOutRight}
@keyframes zoomOutUp{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
to{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform-origin:center bottom;animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.zoomOutUp{animation-name:zoomOutUp}
@keyframes slideInDown{from{transform:translate3d(0,-100%,0);visibility:visible}
to{transform:translate3d(0,0,0)}
}
.slideInDown{animation-name:slideInDown}
@keyframes slideInLeft{from{transform:translate3d(-100%,0,0);visibility:visible}
to{transform:translate3d(0,0,0)}
}
.slideInLeft{animation-name:slideInLeft}
@keyframes slideInRight{from{transform:translate3d(100%,0,0);visibility:visible}
to{transform:translate3d(0,0,0)}
}
.slideInRight{animation-name:slideInRight}
@keyframes slideInUp{from{transform:translate3d(0,100%,0);visibility:visible}
to{transform:translate3d(0,0,0)}
}
.slideInUp{animation-name:slideInUp}
@keyframes slideOutDown{from{transform:translate3d(0,0,0)}
to{visibility:hidden;transform:translate3d(0,100%,0)}
}
.slideOutDown{animation-name:slideOutDown}
@keyframes slideOutLeft{from{transform:translate3d(0,0,0)}
to{visibility:hidden;transform:translate3d(-100%,0,0)}
}
.slideOutLeft{animation-name:slideOutLeft}
@keyframes slideOutRight{from{transform:translate3d(0,0,0)}
to{visibility:hidden;transform:translate3d(100%,0,0)}
}
.slideOutRight{animation-name:slideOutRight}
@keyframes slideOutUp{from{transform:translate3d(0,0,0)}
to{visibility:hidden;transform:translate3d(0,-100%,0)}
}
.slideOutUp{animation-name:slideOutUp}