/*配置颜色*/.Themebg, .Themebghover:hover, .ThemeBbg, .menu .navbar-nav > li > a:hover, .menu .nav > li ul li a:hover, .product .pro_list li a:hover, .title_x, .p_pro_d .title_d, #ProClass li.ac .Classtriangle, .pro_class_x .product-class li a:hover, .pro_class_x .product-class li a.Themebg, .p_info_d .title_d, .bannerEffect .tp-bullets.simplebullets.round .bullet:hover, .bannerEffect .tp-bullets.simplebullets.round .bullet.selected, .bannerEffect .tp-bullets.simplebullets.navbar .bullet:hover, .bannerEffect .tp-bullets.simplebullets.navbar .bullet.selected {
    background-color: rgb(0, 123, 111) !important
}
.Themefont, .Themetxthover:hover, #rightHistory a:hover, .articleLabel .news-item .case .case_more {
    color: rgb(0, 123, 111) !important
}
.ThemeFborder, .Themebdhover:hover, .form .header {
    border-color: rgb(0, 123, 111) !important
}
.NavBoxPublic .TriangleBtn:before, .inpro-nav .inproline, .articleLabel .news-item .case .case_more {
    border-color: rgb(0, 123, 111) !important
}
.ThemeFbg {
    background-color: rgb(195, 173, 135) !important
}
.ThemeFbgorder {
    border-color: rgb(195, 173, 135) !important
}
a:hover, .album .images-swiper .swiper-slide .imagesItem:hover .title, .news-center .newsBox .newsItem:hover .title {
    color: rgb(0, 123, 111)
}
.tc {
    text-align: center
}
.tl {
    text-align: left
}
.tr {
    text-align: right
}
.fl {
    float: left !important
}
.fr {
    float: right
}
.clear {
    clear: both
}
.clear_overflow {
    clear: both;
    overflow: hidden
}
.fb {
    font-weight: bold
}
.hidden {
    display: none
}
.w1220 {
    width: 1220px;
    margin: 0 auto;
    font-size: 14px
}
.min1220 {
    min-width: 1220px;
    font-size: 14px
}
.w100 {
    width: 100%;
    margin: 0 auto !important
}
.w95 {
    width: 95%;
    margin: 0 auto !important
}
.position_r {
    position: relative
}
.tpl_six, .tpl_seven, .tpl_elevn {
    background: #fff !important
}
.row {
    margin-left: 0;
    margin-right: 0
}/* 登录注册栏修改背景颜色和边框 */
.common_top {
    border: 0;
    background: #f5f5f5
}
body {
    max-width: 100%
}

@media screen and (max-width: 1220px) {
.w100 {
    width: 95%;
    margin: 0 auto !important
}
}  /* 新加 *//* #rightHistory .copy-end,.friendLink{background-color: #333}*/
.tpl_six, .tpl_seven, .tpl_elevn {
    background-color: #444
}
.content-box {
    margin: 0 auto !important
}
.menu .nav > li .Themebghover:hover, .menu .nav > li .ThemeBbg, .product-con ul li:hover h3, .product-con .font_box b, .album .swiper-slide ul li:hover p, .article .inartlist ul li:hover h3, .article .inartlist ul li:hover p, .article .inartlist ul li:hover b, .articleLabel .inarticlelabe ul li:hover h3, .infooternav .fnavlist ul li a:hover {
    color: rgb(0, 123, 111) !important
}
.menu .nav > li a:hover:before, .menu .nav > li .ThemeBbg:before, .about .item_img:before, .article .inartlist ul li:hover span, .contact .feedbackc {
    background-color: rgb(0, 123, 111) !important
}
.articleLabel .inarticlelabe ul li, .friendBox, .friendlinktitle {
    background-color: rgb(195, 173, 135) !important
}
.in_title {
    text-align: center;
    position: relative
}
.in_title:before {
    content: "";
    width: 90px;
    height: 1px;
    background-color: rgb(0, 123, 111);
    position: absolute;
    bottom: -10px;
    left: 50%;
    margin-left: -45px
}/* .in_title:after{content: "";width: 140px;height: 3px;position: absolute;bottom: -12px;left: 50%;margin-left: -70px;background-color:rgb(0, 123, 111)}*/
.in_title b {
    font-size: 32px;
    font-weight: normal
}
.in_title p {
    font-size: 18px;
    color: #999
}
.inmore {
    text-align: center;
    color: rgb(0, 123, 111);
    border: solid 2px rgb(0, 123, 111)
}
.inmore a {
    display: block;
    font-size: 14px;
    width: 100%;
    height: 40px;
    line-height: 40px;
    color: rgb(0, 123, 111);
    transition: background-color 0.5s;
    -moz-transition: background-color 0.5s;/* Firefox 4 */
    -webkit-transition: background-color 0.5s;/* Safari and Chrome */
    -o-transition: background-color 0.5s;/* Opera */
}
.inmore a:hover {
    color: #fff;
    background-color: rgb(0, 123, 111)
}
.tpl_one {
    max-height: 96px
}
#rightHistory .tpl_elevn {
    background: url(/Public/Images/Theme261/map.jpg) no-repeat left top
}
#rightHistory a {
    color: #333 !important
}
#rightHistory .ThemeBbg {
    color: #fff !important
}
#rightHistory a.overflow.Themebg:hover {
    color: #fff !important
}/* #rightHistory,#rightHistory h2,#rightHistory h3{color: #fff}*/
#rightHistory .iconguangbo, #rightHistory .iconguangbo:before {
    font-size: 12px
}
#rightHistory .iconguangbo {
    float: left
}
#rightHistory .noticeBox .navbar-form {
    margin-top: 3px
}
#rightHistory .noticeBox .form-control {
    border-radius: 0;
    box-shadow: none;
    font-size: 12px;
    height: 33px;
    line-height: 33px;
    padding: 0px 10px !important;
    background-color: #fff;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    width: 100%;
    border: none;
    border-left: 1px solid rgba(255, 255, 255, .1)
}
#rightHistory .noticeBox .btn-search {
    background: none !important;
    border: none !important;
    border-left: 1px solid rgba(255, 255, 255, .1) !important;
    line-height: 18px
}
#rightHistory .noticeBox {
    line-height: 40px;
    padding: 0 10px
}
#rightHistory .noticeBox .alertinfo ul {
    float: left;
    width: 80%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}
#rightHistory a {
    color: #fff
}
.bannerpp {
    color: #333
}
.bannerpp i {
    display: none !important
}
#rightHistory .column {
    border: none
}
#rightHistory {
    padding-bottom: 0 !important
}
.tpl_footers .footers .footersInformation p {
    text-align: center !important
}

@media screen and (max-width: 768px) {
.in_title:before {
    content: "";
    width: 50px;
    margin-left: -25px
}
.in_title b {
    font-size: 18px
}
.in_title p span {
    font-size: 14px
}
.inmore a {
    height: 36px;
    line-height: 36px
}/* .friendLink{background-color:rgb(195, 173, 135) !important}*/
}/*字体*/
@font-face {
    font-family: "iconfont";
    src: url('iconfont.eot?t=1574754001611');/* IE9 */
    src: url('iconfont.eot?t=1574754001611#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAlIAAsAAAAAD6AAAAj6AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCEHgqQWI0pATYCJAMsCxgABCAFhG0HgR4bDw3IDiWhwMAAAAAMYATQGm1W7vwdSWoNulgWb6Yp0PiEehKtUJol0mIlMDxtq3/DoCtgITHaGJ1oo4RRoA6IAR6isvoDtjDumjAiNpJdvSq3Ybj0Wq/b4e+XfBGBVc8+yRlW5jpoNB4NeEARbf9GkTrdAHBos1hbDnjRpNUrV/Uyriegt1QIaHdeMQdYyYQ9YNgVsUgArHIBuYURtO665ti8DD0JLLRxCLcPgGvh74d/ICpYAVGVgLjRvnO5LSCjgKNYWHmsBHVJBZSXi2G5EQmbAXnpul7rnQdwhD0L1vfFOwOYlheFKdBh+GH6Yc5h0RH5KPb4mAJKGmmH2XMhDKY5sKjoBwC1RpJFwSsFdLf449VAOEZgrjZ7CtCAmgIBGko4IFHSAJmSDoiUbDsXZw58KjiLAGj5RfbpQmcsJujBYI9ZBFgOxJsApNNAuA7xvkESVUwPe5e/+KQ3g4zH+9haWxMQG/sAf8jR3RFCIGaeOZerHdm2lrx0w2n0uo/9ssF54uaASTzAyLqVwlm9vD4TbK40Y7yrLwXcMqZoFunLFwuxDbO8Rhuse213MsDIec6YujuSnqu97KQdpRK67hkxrFuTFIycxauuX0C/4rvUmN6TYpvWlyoY/pi3YK4kjWjHNFSj0WnKxDWbPSYwnk43oSeRTCZP44e85Xd4ZnOlycQ1vuVDbTQaOehNyUNzJYZVvYJ5LZiZL5s8Z428y/eU90ceqh6IMKzSbOaaTBySblNTaoZ1dG59VRdUGJa39aGaiu8KqbAK3fjECu2+aUC4PhzQsjpJ0675ksC9+7EkeHyCRBoZc8SRrj30gEgrG4h+OgiKIOKUmz5EaOaFOOLl59wA8fk2BBNVOiKiR0T6ERqqpdGoGiI0YD98/fqmI35sa/eGL3nl5rM7kIVq22Cosx9ejx++QSK3aK7Sm3SLq2M0gfbGtWuICK9cHcAwjmZ0bAkxf+wDuFotaQTRT9AxjMe/VkC4IbXeeUw4cihfDV02+BmuUodDRh2pGqrOcOfO3gsvbNP1CLLifxNSTYeNbweN7wWtG4iXjc8ZGXOm0OdN5YH3TSU3TLmvmoM3zB6q7aD1Pdl1N82FzLX7GBt4+3VkJHzCZeJVXke7dOOG7+1dmsZxNeC6kTiMld7BKoIeYFkvYJDKHL4TvIJodzPHtrbGgIaq8Vn04WqRaw9ouOfq9At3sBj0pWlp3bjR1WfOwdbL6xuvDWwEI2tOOJtDlKs+A9gwx6jk7ppGzN8m1fIA+85epVGMHcYqOjXDdJ6O/GVpXK2S2nOFCkIX0UMBVWptmQrCTzdkwZLctKed1DWtalaZ/YffBTiUlZaWJWb4P13h5PiN/iyLdU49cv4TTnx1A7/y9VLa7MsA3ZtfWlZW4vU08N9ShB4Wf4jrmrghe31s7Gzd/5zb+ya5lW8pleTBlMKe7X0fPnd8anLCTnlsSR7z4L35luW7YHNpX6HYL97vU7wHjjkGt0LL/CcMaTmWMMHguavqd2iNgciHWa9BUmth8ITaYgYclHueBgKcY7mb9oRlvmvh69P/O/SxvYlTzM4pcPDOzRk47K595v/Et+A7FKdW41DCUxf/2ZZ58d/ucRhVq9GOJ4uKHZ207ckQ7+T4pIkf8r1KvEu9S6KA6lxZZNy6F8+PO1tSg9Q4CzTEOpv6c/J6SAe/+iqss/4X+ZYEqUfv/5sWwYuMrkaVNhgdwYLa26FyiOXf68tx0rfIv9ZFyWpZn8WHrHN/7p4E8Y+uRqYecA7M16nKy6f3zob8QiybPQXjc2kiai4ePjVbRvwlZLaXnp9XBT5r9KefymDdJzg8KVI6EO6zMk7R/fkAF+Ip0ZGp3/ofRKbEUOIgAQOw6wkRQZ6yI5xALAlgno/wnwSExYgjwe4p+mXEoc9BP90g2aYhfT/zFv2ra/O+xHGHL47nnnvimJ9hRxaBwoP2hRGbXtV2F16ICz1faqN3U/HK+60LnP8m4ezL93ex5TU8VhAZf8pcZV8YGc7sd/qaZM+4+LyLLrmmIbWTPpQ8kOl2QXhB+nUNOZHvc/poTJIQV87QT3/3p5hMbzr9W/5f8bF6hry4d+J8SAwv116WnxMRJfBziJTdLuIPKPr0/YLL7z8S4SnjRzWpcpjxZE5v5EVlAw1Y5Kqy9JyfPjvD4jNYL6kF//UlR8R79ZXgvmbSPmL+lpTl6uxW7V0uk9dyRNxaeYClT5W7k2v2QpfcPUN+YP+pwkuGh9hH/n0pPwTqLhyVRA04f02Cn6cPK+9slg09OiTpHAg6zoXXA9ep3OqIgFHNoTHxnJpRGSD7XVcV+zNFZ1d9xu8VhSgEpaXBIsW6f29FJapBaZoxPpwxdPjhw1FlSWqhUJ04hSt6761/G3KQzzwI2Q/+Nj///ZD3wf9/ArFl+gJdBeD/BPw53JBnHMIZa+vwAVwVCg/hcbhx469hLUwFgPwKJqKmsuDDKghN8FU4vfWhRQzsPmXazsvAmcVGu5RfrEgzq1U/cL/dZ2a3klYctJymQzMaVwCoTqzMwnCJRelB1WEA6k+pwRkaMPgKCLWIXi5jGpSZdXB510KycZLnWphKo8YSW6rDrLZlYDZLK4OtthqYbdLeJsyTB3NkYCETABudhTSYtiONJn22JWBu2zIw70sri3xjrUEJsLR3JFDOOVgbxMRsGSqQoy2MppMMcbNUIlRhOTEaXoGKejoEMmb2d+Ohsm6xVMKIDIs4tZmoBJVd4oDuXlGUXC5kCGXSTkaetw/a0SFldMmkbWizPKwVra6k8HDh+sCwZmknINpFBiUgt8otGJqchIo1k5IQrixHLP18BZRIjw4CspZ591AelEw38doZIoWJICCYDglp3kcZ262XSBQ5iwkxdE1GqjN25fEYqkM2pBi66rdqg2omF6bVodYlSThbSkh1hN3e1fl/m2dwC4jHGAIOgiE8ZAFZQicgK4gAESESZA3yJbFAgu8QS9pJv+Mh3a0CSXNrj0WLuL9VDMtQCb5V2olanZT2KCgxEbXDxhTivnJCEqpIYxIR3N/p0tMubrOJ9lYJCqKWHnEPPwAA') format('woff2'), url('iconfont.woff?t=1574754001611') format('woff'), url('iconfont.ttf?t=1574754001611') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('iconfont.svg?t=1574754001611#iconfont') format('svg');/* iOS 4.1- */
}
.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
.icon-jian:before {
    content: "\e643"
}
.icon-link:before {
    content: "\e63f"
}
.icon-iconshanchu:before {
    content: "\e62f"
}
.icon-dizhi:before {
    content: "\e63e"
}
.icon-ren:before {
    content: "\e644"
}
.icon-home:before {
    content: "\e600"
}
.icon-youxiang:before {
    content: "\e601"
}
.icon-lianxiwomen-xianxing:before {
    content: "\e64b"
}
.icon-jia:before {
    content: "\e711"
}
.icon-iconshiliangzhinengduixiang:before {
    content: "\e735"
}
.contact {
    background: url(/Public/Images/Theme261/map.jpg) no-repeat left top
}
.transitionall {
    transition: all 0.5s;
    -moz-transition: all 0.5s;/* Firefox 4 */
    -webkit-transition: all 0.5s;/* Safari and Chrome */
    -o-transition: all 0.5s;/* Opera */
}
.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}/* Animate.css动画库 */
.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.bounceIn, .animated.bounceOut, .animated.flipOutX, .animated.flipOutY {
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}
@-webkit-keyframes bounce {
0%, 20%, 53%, 80%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1);
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
40%, 43% {
-webkit-transform:translate3d(0, -30px, 0);
transform:translate3d(0, -30px, 0)
}
40%, 43%, 70% {
-webkit-animation-timing-function:cubic-bezier(.755, .05, .855, .06);
animation-timing-function:cubic-bezier(.755, .05, .855, .06)
}
70% {
-webkit-transform:translate3d(0, -15px, 0);
transform:translate3d(0, -15px, 0)
}
90% {
-webkit-transform:translate3d(0, -4px, 0);
transform:translate3d(0, -4px, 0)
}
}
@keyframes bounce {
0%, 20%, 53%, 80%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1);
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
40%, 43% {
-webkit-transform:translate3d(0, -30px, 0);
transform:translate3d(0, -30px, 0)
}
40%, 43%, 70% {
-webkit-animation-timing-function:cubic-bezier(.755, .05, .855, .06);
animation-timing-function:cubic-bezier(.755, .05, .855, .06)
}
70% {
-webkit-transform:translate3d(0, -15px, 0);
transform:translate3d(0, -15px, 0)
}
90% {
-webkit-transform:translate3d(0, -4px, 0);
transform:translate3d(0, -4px, 0)
}
}
.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}
@-webkit-keyframes flash {
0%, 50%, to {
opacity:1
}
25%, 75% {
opacity:0
}
}
@keyframes flash {
0%, 50%, to {
opacity:1
}
25%, 75% {
opacity:0
}
}
.flash {
    -webkit-animation-name: flash;
    animation-name: flash
}
@-webkit-keyframes pulse {
0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
50% {
-webkit-transform:scale3d(1.05, 1.05, 1.05);
transform:scale3d(1.05, 1.05, 1.05)
}
to {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
}
@keyframes pulse {
0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
50% {
-webkit-transform:scale3d(1.05, 1.05, 1.05);
transform:scale3d(1.05, 1.05, 1.05)
}
to {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
}
.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
}
@-webkit-keyframes rubberBand {
0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
30% {
-webkit-transform:scale3d(1.25, .75, 1);
transform:scale3d(1.25, .75, 1)
}
40% {
-webkit-transform:scale3d(.75, 1.25, 1);
transform:scale3d(.75, 1.25, 1)
}
50% {
-webkit-transform:scale3d(1.15, .85, 1);
transform:scale3d(1.15, .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:scaleX(1);
transform:scaleX(1)
}
}
@keyframes rubberBand {
0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
30% {
-webkit-transform:scale3d(1.25, .75, 1);
transform:scale3d(1.25, .75, 1)
}
40% {
-webkit-transform:scale3d(.75, 1.25, 1);
transform:scale3d(.75, 1.25, 1)
}
50% {
-webkit-transform:scale3d(1.15, .85, 1);
transform:scale3d(1.15, .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:scaleX(1);
transform:scaleX(1)
}
}
.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand
}
@-webkit-keyframes shake {
0%, to {
-webkit-transform:translateZ(0);
transform:translateZ(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 {
0%, to {
-webkit-transform:translateZ(0);
transform:translateZ(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:rotate(15deg);
transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg);
transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg);
transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg);
transform:rotate(-5deg)
}
to {
-webkit-transform:rotate(0deg);
transform:rotate(0deg)
}
}
@keyframes swing {
20% {
-webkit-transform:rotate(15deg);
transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg);
transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg);
transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg);
transform:rotate(-5deg)
}
to {
-webkit-transform:rotate(0deg);
transform:rotate(0deg)
}
}
.swing {
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
}
@-webkit-keyframes tada {
0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
10%, 20% {
-webkit-transform:scale3d(.9, .9, .9) rotate(-3deg);
transform:scale3d(.9, .9, .9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate(3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate(-3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate(-3deg)
}
to {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
}
@keyframes tada {
0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
10%, 20% {
-webkit-transform:scale3d(.9, .9, .9) rotate(-3deg);
transform:scale3d(.9, .9, .9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate(3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate(-3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate(-3deg)
}
to {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
}
.tada {
    -webkit-animation-name: tada;
    animation-name: tada
}
@-webkit-keyframes wobble {
0% {
-webkit-transform:none;
transform:none
}
15% {
-webkit-transform:translate3d(-25%, 0, 0) rotate(-5deg);
transform:translate3d(-25%, 0, 0) rotate(-5deg)
}
30% {
-webkit-transform:translate3d(20%, 0, 0) rotate(3deg);
transform:translate3d(20%, 0, 0) rotate(3deg)
}
45% {
-webkit-transform:translate3d(-15%, 0, 0) rotate(-3deg);
transform:translate3d(-15%, 0, 0) rotate(-3deg)
}
60% {
-webkit-transform:translate3d(10%, 0, 0) rotate(2deg);
transform:translate3d(10%, 0, 0) rotate(2deg)
}
75% {
-webkit-transform:translate3d(-5%, 0, 0) rotate(-1deg);
transform:translate3d(-5%, 0, 0) rotate(-1deg)
}
to {
-webkit-transform:none;
transform:none
}
}
@keyframes wobble {
0% {
-webkit-transform:none;
transform:none
}
15% {
-webkit-transform:translate3d(-25%, 0, 0) rotate(-5deg);
transform:translate3d(-25%, 0, 0) rotate(-5deg)
}
30% {
-webkit-transform:translate3d(20%, 0, 0) rotate(3deg);
transform:translate3d(20%, 0, 0) rotate(3deg)
}
45% {
-webkit-transform:translate3d(-15%, 0, 0) rotate(-3deg);
transform:translate3d(-15%, 0, 0) rotate(-3deg)
}
60% {
-webkit-transform:translate3d(10%, 0, 0) rotate(2deg);
transform:translate3d(10%, 0, 0) rotate(2deg)
}
75% {
-webkit-transform:translate3d(-5%, 0, 0) rotate(-1deg);
transform:translate3d(-5%, 0, 0) rotate(-1deg)
}
to {
-webkit-transform:none;
transform:none
}
}
.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble
}
@-webkit-keyframes jello {
0%, 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(-.78125deg) skewY(-.78125deg);
transform:skewX(-.78125deg) skewY(-.78125deg)
}
77.7% {
-webkit-transform:skewX(.390625deg) skewY(.390625deg);
transform:skewX(.390625deg) skewY(.390625deg)
}
88.8% {
-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);
transform:skewX(-.1953125deg) skewY(-.1953125deg)
}
}
@keyframes jello {
0%, 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(-.78125deg) skewY(-.78125deg);
transform:skewX(-.78125deg) skewY(-.78125deg)
}
77.7% {
-webkit-transform:skewX(.390625deg) skewY(.390625deg);
transform:skewX(.390625deg) skewY(.390625deg)
}
88.8% {
-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);
transform:skewX(-.1953125deg) skewY(-.1953125deg)
}
}
.jello {
    -webkit-animation-name: jello;
    animation-name: jello;
    -webkit-transform-origin: center;
    transform-origin: center
}
@-webkit-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
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:scaleX(1);
transform:scaleX(1)
}
}
@keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
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:scaleX(1);
transform:scaleX(1)
}
}
.bounceIn {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn
}
@-webkit-keyframes bounceInDown {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, -3000px, 0);
transform:translate3d(0, -3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, 25px, 0);
transform:translate3d(0, 25px, 0)
}
75% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
90% {
-webkit-transform:translate3d(0, 5px, 0);
transform:translate3d(0, 5px, 0)
}
to {
-webkit-transform:none;
transform:none
}
}
@keyframes bounceInDown {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, -3000px, 0);
transform:translate3d(0, -3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, 25px, 0);
transform:translate3d(0, 25px, 0)
}
75% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
90% {
-webkit-transform:translate3d(0, 5px, 0);
transform:translate3d(0, 5px, 0)
}
to {
-webkit-transform:none;
transform:none
}
}
.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
}
@-webkit-keyframes bounceInLeft {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(-3000px, 0, 0);
transform:translate3d(-3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(25px, 0, 0);
transform:translate3d(25px, 0, 0)
}
75% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
90% {
-webkit-transform:translate3d(5px, 0, 0);
transform:translate3d(5px, 0, 0)
}
to {
-webkit-transform:none;
transform:none
}
}
@keyframes bounceInLeft {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(-3000px, 0, 0);
transform:translate3d(-3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(25px, 0, 0);
transform:translate3d(25px, 0, 0)
}
75% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
90% {
-webkit-transform:translate3d(5px, 0, 0);
transform:translate3d(5px, 0, 0)
}
to {
-webkit-transform:none;
transform:none
}
}
.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
}
@-webkit-keyframes bounceInRight {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(3000px, 0, 0);
transform:translate3d(3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(-25px, 0, 0);
transform:translate3d(-25px, 0, 0)
}
75% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
90% {
-webkit-transform:translate3d(-5px, 0, 0);
transform:translate3d(-5px, 0, 0)
}
to {
-webkit-transform:none;
transform:none
}
}
@keyframes bounceInRight {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(3000px, 0, 0);
transform:translate3d(3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(-25px, 0, 0);
transform:translate3d(-25px, 0, 0)
}
75% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
90% {
-webkit-transform:translate3d(-5px, 0, 0);
transform:translate3d(-5px, 0, 0)
}
to {
-webkit-transform:none;
transform:none
}
}
.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight
}
@-webkit-keyframes bounceInUp {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
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:translateZ(0);
transform:translateZ(0)
}
}
@keyframes bounceInUp {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
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:translateZ(0);
transform:translateZ(0)
}
}
.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 {
0% {
opacity:0
}
to {
opacity:1
}
}
@keyframes fadeIn {
0% {
opacity:0
}
to {
opacity:1
}
}
.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
}
@-webkit-keyframes fadeInDown {
0% {
opacity:0;
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInDown {
0% {
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 {
0% {
opacity:0;
-webkit-transform:translate3d(0, -2000px, 0);
transform:translate3d(0, -2000px, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInDownBig {
0% {
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 {
0% {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInLeft {
0% {
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 {
0% {
opacity:0;
-webkit-transform:translate3d(-2000px, 0, 0);
transform:translate3d(-2000px, 0, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInLeftBig {
0% {
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 {
0% {
opacity:0;
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInRight {
0% {
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 {
0% {
opacity:0;
-webkit-transform:translate3d(2000px, 0, 0);
transform:translate3d(2000px, 0, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInRightBig {
0% {
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 {
0% {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInUp {
0% {
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 {
0% {
opacity:0;
-webkit-transform:translate3d(0, 2000px, 0);
transform:translate3d(0, 2000px, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInUpBig {
0% {
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 {
0% {
opacity:1
}
to {
opacity:0
}
}
@keyframes fadeOut {
0% {
opacity:1
}
to {
opacity:0
}
}
.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
}
@-webkit-keyframes fadeOutDown {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
}
@keyframes fadeOutDown {
0% {
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 {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(0, 2000px, 0);
transform:translate3d(0, 2000px, 0)
}
}
@keyframes fadeOutDownBig {
0% {
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 {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0)
}
}
@keyframes fadeOutLeft {
0% {
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 {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(-2000px, 0, 0);
transform:translate3d(-2000px, 0, 0)
}
}
@keyframes fadeOutLeftBig {
0% {
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 {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0)
}
}
@keyframes fadeOutRight {
0% {
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 {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(2000px, 0, 0);
transform:translate3d(2000px, 0, 0)
}
}
@keyframes fadeOutRightBig {
0% {
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 {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
}
@keyframes fadeOutUp {
0% {
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 {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(0, -2000px, 0);
transform:translate3d(0, -2000px, 0)
}
}
@keyframes fadeOutUpBig {
0% {
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 {
0% {
-webkit-transform:perspective(400px) rotateY(-1turn);
transform:perspective(400px) rotateY(-1turn)
}
0%, 40% {
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
40% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg);
transform:perspective(400px) translateZ(150px) rotateY(-190deg)
}
50% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg);
transform:perspective(400px) translateZ(150px) rotateY(-170deg)
}
50%, 80% {
-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)
}
to {
-webkit-transform:perspective(400px);
transform:perspective(400px);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
}
@keyframes flip {
0% {
-webkit-transform:perspective(400px) rotateY(-1turn);
transform:perspective(400px) rotateY(-1turn)
}
0%, 40% {
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
40% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg);
transform:perspective(400px) translateZ(150px) rotateY(-190deg)
}
50% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg);
transform:perspective(400px) translateZ(150px) rotateY(-170deg)
}
50%, 80% {
-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)
}
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 {
0% {
-webkit-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
0%, 40% {
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
40% {
-webkit-transform:perspective(400px) rotateX(-20deg);
transform:perspective(400px) rotateX(-20deg)
}
60% {
-webkit-transform:perspective(400px) rotateX(10deg);
transform:perspective(400px) rotateX(10deg);
opacity:1
}
80% {
-webkit-transform:perspective(400px) rotateX(-5deg);
transform:perspective(400px) rotateX(-5deg)
}
to {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
}
@keyframes flipInX {
0% {
-webkit-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
0%, 40% {
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
40% {
-webkit-transform:perspective(400px) rotateX(-20deg);
transform:perspective(400px) rotateX(-20deg)
}
60% {
-webkit-transform:perspective(400px) rotateX(10deg);
transform:perspective(400px) rotateX(10deg);
opacity:1
}
80% {
-webkit-transform:perspective(400px) rotateX(-5deg);
transform:perspective(400px) rotateX(-5deg)
}
to {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
}
.flipInX {
    -webkit-backface-visibility: visible!important;
    backface-visibility: visible!important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
0%, 40% {
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
40% {
-webkit-transform:perspective(400px) rotateY(-20deg);
transform:perspective(400px) rotateY(-20deg)
}
60% {
-webkit-transform:perspective(400px) rotateY(10deg);
transform:perspective(400px) rotateY(10deg);
opacity:1
}
80% {
-webkit-transform:perspective(400px) rotateY(-5deg);
transform:perspective(400px) rotateY(-5deg)
}
to {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
}
@keyframes flipInY {
0% {
-webkit-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
0%, 40% {
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
40% {
-webkit-transform:perspective(400px) rotateY(-20deg);
transform:perspective(400px) rotateY(-20deg)
}
60% {
-webkit-transform:perspective(400px) rotateY(10deg);
transform:perspective(400px) rotateY(10deg);
opacity:1
}
80% {
-webkit-transform:perspective(400px) rotateY(-5deg);
transform:perspective(400px) rotateY(-5deg)
}
to {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
}
.flipInY {
    -webkit-backface-visibility: visible!important;
    backface-visibility: visible!important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
30% {
-webkit-transform:perspective(400px) rotateX(-20deg);
transform:perspective(400px) rotateX(-20deg);
opacity:1
}
to {
-webkit-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
}
@keyframes flipOutX {
0% {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
30% {
-webkit-transform:perspective(400px) rotateX(-20deg);
transform:perspective(400px) rotateX(-20deg);
opacity:1
}
to {
-webkit-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
}
.flipOutX {
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-backface-visibility: visible!important;
    backface-visibility: visible!important
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
30% {
-webkit-transform:perspective(400px) rotateY(-15deg);
transform:perspective(400px) rotateY(-15deg);
opacity:1
}
to {
-webkit-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
}
@keyframes flipOutY {
0% {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
30% {
-webkit-transform:perspective(400px) rotateY(-15deg);
transform:perspective(400px) rotateY(-15deg);
opacity:1
}
to {
-webkit-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
}
.flipOutY {
    -webkit-backface-visibility: visible!important;
    backface-visibility: visible!important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY
}
@-webkit-keyframes lightSpeedIn {
0% {
-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)
}
60%, 80% {
opacity:1
}
80% {
-webkit-transform:skewX(-5deg);
transform:skewX(-5deg)
}
to {
-webkit-transform:none;
transform:none;
opacity:1
}
}
@keyframes lightSpeedIn {
0% {
-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)
}
60%, 80% {
opacity:1
}
80% {
-webkit-transform:skewX(-5deg);
transform:skewX(-5deg)
}
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 {
0% {
opacity:1
}
to {
-webkit-transform:translate3d(100%, 0, 0) skewX(30deg);
transform:translate3d(100%, 0, 0) skewX(30deg);
opacity:0
}
}
@keyframes lightSpeedOut {
0% {
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 {
0% {
transform-origin:center;
-webkit-transform:rotate(-200deg);
transform:rotate(-200deg);
opacity:0
}
0%, to {
-webkit-transform-origin:center
}
to {
transform-origin:center;
-webkit-transform:none;
transform:none;
opacity:1
}
}
@keyframes rotateIn {
0% {
transform-origin:center;
-webkit-transform:rotate(-200deg);
transform:rotate(-200deg);
opacity:0
}
0%, to {
-webkit-transform-origin:center
}
to {
transform-origin:center;
-webkit-transform:none;
transform:none;
opacity:1
}
}
.rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn
}
@-webkit-keyframes rotateInDownLeft {
0% {
transform-origin:left bottom;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
opacity:0
}
0%, to {
-webkit-transform-origin:left bottom
}
to {
transform-origin:left bottom;
-webkit-transform:none;
transform:none;
opacity:1
}
}
@keyframes rotateInDownLeft {
0% {
transform-origin:left bottom;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
opacity:0
}
0%, to {
-webkit-transform-origin:left bottom
}
to {
transform-origin:left bottom;
-webkit-transform:none;
transform:none;
opacity:1
}
}
.rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft
}
@-webkit-keyframes rotateInDownRight {
0% {
transform-origin:right bottom;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
opacity:0
}
0%, to {
-webkit-transform-origin:right bottom
}
to {
transform-origin:right bottom;
-webkit-transform:none;
transform:none;
opacity:1
}
}
@keyframes rotateInDownRight {
0% {
transform-origin:right bottom;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
opacity:0
}
0%, to {
-webkit-transform-origin:right bottom
}
to {
transform-origin:right bottom;
-webkit-transform:none;
transform:none;
opacity:1
}
}
.rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight
}
@-webkit-keyframes rotateInUpLeft {
0% {
transform-origin:left bottom;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
opacity:0
}
0%, to {
-webkit-transform-origin:left bottom
}
to {
transform-origin:left bottom;
-webkit-transform:none;
transform:none;
opacity:1
}
}
@keyframes rotateInUpLeft {
0% {
transform-origin:left bottom;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
opacity:0
}
0%, to {
-webkit-transform-origin:left bottom
}
to {
transform-origin:left bottom;
-webkit-transform:none;
transform:none;
opacity:1
}
}
.rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft
}
@-webkit-keyframes rotateInUpRight {
0% {
transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
0%, to {
-webkit-transform-origin:right bottom
}
to {
transform-origin:right bottom;
-webkit-transform:none;
transform:none;
opacity:1
}
}
@keyframes rotateInUpRight {
0% {
transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
0%, to {
-webkit-transform-origin:right bottom
}
to {
transform-origin:right bottom;
-webkit-transform:none;
transform:none;
opacity:1
}
}
.rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight
}
@-webkit-keyframes rotateOut {
0% {
transform-origin:center;
opacity:1
}
0%, to {
-webkit-transform-origin:center
}
to {
transform-origin:center;
-webkit-transform:rotate(200deg);
transform:rotate(200deg);
opacity:0
}
}
@keyframes rotateOut {
0% {
transform-origin:center;
opacity:1
}
0%, to {
-webkit-transform-origin:center
}
to {
transform-origin:center;
-webkit-transform:rotate(200deg);
transform:rotate(200deg);
opacity:0
}
}
.rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut
}
@-webkit-keyframes rotateOutDownLeft {
0% {
transform-origin:left bottom;
opacity:1
}
0%, to {
-webkit-transform-origin:left bottom
}
to {
transform-origin:left bottom;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
opacity:0
}
}
@keyframes rotateOutDownLeft {
0% {
transform-origin:left bottom;
opacity:1
}
0%, to {
-webkit-transform-origin:left bottom
}
to {
transform-origin:left bottom;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
opacity:0
}
}
.rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft
}
@-webkit-keyframes rotateOutDownRight {
0% {
transform-origin:right bottom;
opacity:1
}
0%, to {
-webkit-transform-origin:right bottom
}
to {
transform-origin:right bottom;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
opacity:0
}
}
@keyframes rotateOutDownRight {
0% {
transform-origin:right bottom;
opacity:1
}
0%, to {
-webkit-transform-origin:right bottom
}
to {
transform-origin:right bottom;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
opacity:0
}
}
.rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight
}
@-webkit-keyframes rotateOutUpLeft {
0% {
transform-origin:left bottom;
opacity:1
}
0%, to {
-webkit-transform-origin:left bottom
}
to {
transform-origin:left bottom;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
opacity:0
}
}
@keyframes rotateOutUpLeft {
0% {
transform-origin:left bottom;
opacity:1
}
0%, to {
-webkit-transform-origin:left bottom
}
to {
transform-origin:left bottom;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
opacity:0
}
}
.rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft
}
@-webkit-keyframes rotateOutUpRight {
0% {
transform-origin:right bottom;
opacity:1
}
0%, to {
-webkit-transform-origin:right bottom
}
to {
transform-origin:right bottom;
-webkit-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
}
@keyframes rotateOutUpRight {
0% {
transform-origin:right bottom;
opacity:1
}
0%, to {
-webkit-transform-origin:right bottom
}
to {
transform-origin:right bottom;
-webkit-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
}
.rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight
}
@-webkit-keyframes hinge {
0% {
transform-origin:top left
}
0%, 20%, 60% {
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out
}
20%, 60% {
-webkit-transform:rotate(80deg);
transform:rotate(80deg);
transform-origin:top left
}
40%, 80% {
-webkit-transform:rotate(60deg);
transform:rotate(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% {
transform-origin:top left
}
0%, 20%, 60% {
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out
}
20%, 60% {
-webkit-transform:rotate(80deg);
transform:rotate(80deg);
transform-origin:top left
}
40%, 80% {
-webkit-transform:rotate(60deg);
transform:rotate(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
}
@-webkit-keyframes rollIn {
0% {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0) rotate(-120deg);
transform:translate3d(-100%, 0, 0) rotate(-120deg)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes rollIn {
0% {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0) rotate(-120deg);
transform:translate3d(-100%, 0, 0) rotate(-120deg)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
.rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn
}
@-webkit-keyframes rollOut {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(100%, 0, 0) rotate(120deg);
transform:translate3d(100%, 0, 0) rotate(120deg)
}
}
@keyframes rollOut {
0% {
opacity:1
}
to {
opacity:0;
-webkit-transform:translate3d(100%, 0, 0) rotate(120deg);
transform:translate3d(100%, 0, 0) rotate(120deg)
}
}
.rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut
}
@-webkit-keyframes zoomIn {
0% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
50% {
opacity:1
}
}
@keyframes zoomIn {
0% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
50% {
opacity:1
}
}
.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}
@-webkit-keyframes zoomInDown {
0% {
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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
@keyframes zoomInDown {
0% {
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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown
}
@-webkit-keyframes zoomInLeft {
0% {
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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
@keyframes zoomInLeft {
0% {
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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft
}
@-webkit-keyframes zoomInRight {
0% {
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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
@keyframes zoomInRight {
0% {
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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight
}
@-webkit-keyframes zoomInUp {
0% {
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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
@keyframes zoomInUp {
0% {
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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp
}
@-webkit-keyframes zoomOut {
0% {
opacity:1
}
50% {
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
50%, to {
opacity:0
}
}
@keyframes zoomOut {
0% {
opacity:1
}
50% {
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
50%, 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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 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(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
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(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp
}
@-webkit-keyframes slideInDown {
0% {
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0);
visibility:visible
}
to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
}
@keyframes slideInDown {
0% {
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0);
visibility:visible
}
to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
}
.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown
}
@-webkit-keyframes slideInLeft {
0% {
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0);
visibility:visible
}
to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
}
@keyframes slideInLeft {
0% {
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0);
visibility:visible
}
to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
}
.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
}
@-webkit-keyframes slideInRight {
0% {
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0);
visibility:visible
}
to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
}
@keyframes slideInRight {
0% {
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0);
visibility:visible
}
to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
}
.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
}
@-webkit-keyframes slideInUp {
0% {
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0);
visibility:visible
}
to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
}
@keyframes slideInUp {
0% {
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0);
visibility:visible
}
to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
}
.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp
}
@-webkit-keyframes slideOutDown {
0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to {
visibility:hidden;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
}
@keyframes slideOutDown {
0% {
-webkit-transform:translateZ(0);
transform:translateZ(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 {
0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to {
visibility:hidden;
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0)
}
}
@keyframes slideOutLeft {
0% {
-webkit-transform:translateZ(0);
transform:translateZ(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 {
0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to {
visibility:hidden;
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0)
}
}
@keyframes slideOutRight {
0% {
-webkit-transform:translateZ(0);
transform:translateZ(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 {
0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to {
visibility:hidden;
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
}
@keyframes slideOutUp {
0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to {
visibility:hidden;
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
}
.slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp
}
body .news-nr-box .DownloadBtn {
    display: inline-block;
    width: auto;
    padding: 0 10px 0 0;
    background-position: 9px;
    height: 40px;
    line-height: 40px
}
.menu .header-box {
    position: relative;
    max-width: 1180px;
    margin: 0 auto
}
.menu .header-box .logo {
    float: none;
    position: relative;
    z-index: 2;
    padding: 0px;
    display: block;
    height: 96px
}
.menu .header-box .logo img {
    max-height: 96px !important;
    max-width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}
.logo_name span {
    text-indent: -99em;
    position: absolute;
    display: block
}
.tpl_two, .tpl_three, .tpl_four, .tpl_five, .tpl_six, .tpl_seven, .tpl_ten, .tpl_elevn, .tpl_footers {
    overflow: hidden
}
.menu .NavBoxPublic ul.navPublic li a {
    color: #333
}
.content-box {
    max-width: 1180px;
    margin: 30px auto
}
.overflow {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block
}
.cl {
    clear: both
}
.Animation {
    -webkit-transition: all .4s ease-in-out 0s;
    -moz-transition: all .4s ease-in-out 0s;
    -ms-transition: all .4s ease-in-out 0s;
    transition: all .4s ease-in-out 0s
}
.m-box01 {
    max-width: 1180px !important
}
.column {
    margin: 0px
}
.tpl_ten .title_name2 {
    color: #fff !important
}
.content-box .page .col-lg-9 {
    height: auto
}/*-------</END 头部 LOGO >------------*/
.headFixed {
    margin: 0px auto
}
.menu .nav-box {
    max-width: 1180px;
    margin: 0 auto
}
.menu .nav {
    padding: 0;
    float: none;
    margin: 0;
    width: 100%
}
.menu .nav li {
    float: left;
    text-align: center;
    width: 12.5%
}
.menu .nav li:last-child {
    background: none
}
.menu .nav > li:hover ul {
    display: block;
    padding: 0
}/*--下拉菜单倒三角--*/
.menu .nav > li .Triangle:after {
    content: '';
    display: inline-block;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid;
    position: absolute;
    right: 5px;
    top: 30px
}
.menu .nav > li ul {
    width: 100%;
    display: none;
    padding: 0;
    box-shadow: 1px 1px 4px 0 rgba(0,0,0,.4);
    position: absolute;
    left: 0px;
    top: 56px;
    width: 100%;
    z-index: 9
}
.menu .nav > li ul li {
    line-height: 40px;
    padding: 0px;
    background: none;
    float: none;
    text-align: center;
    width: 100%;
    border-top: 1px solid #fff
}
.menu .nav > li ul li a {
    font-size: 12px;
    color: #fff;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    padding: 0px 5px;
    margin: 0px
}
.menu .nav > li ul li a:hover {
    text-decoration: none;
    color: #fff
}
.menu .navbar-nav > li > a {
    display: block;
    position: relative;
    font-size: 16px;
    color: #333;
    height: auto;
    padding: 0px;
    line-height: 56px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}/* .menu .navbar-nav > li > a.active, .menu .navbar-nav > li > a:hover, .menu .navbar-nav > li > a:focus{background: none;color: #fff}.menu .navbar-nav > li > a.active{background-image:none;-webkit-box-shadow: none;box-shadow: none}*/
.NavBtn {
    display: none;
    text-align: center;
    overflow: hidden
}
.header-box .clearfix.none {
    display: none
}
.btn-navbar-t {
    display: none;
    float: right;
    padding: 3px 8px 7px;
    margin-right: 5px;
    margin-left: 5px;
    border: 1px solid #ccc
}
.btn-navbar-t:hover, .btn-navbar-t:focus, .btn-navbar-t:active, .btn-navbar-t.active, .btn-navbar-t.disabled, .btn-navbar-t[disabled], .btn-navbar-t .icon-bar:hover, .btn-navbar-t .icon-bar:focus, .btn-navbar-t .icon-bar:active {
    filter: Alpha(opacity=80);
    opacity: 0.8
}
.btn-navbar-t .icon-bar {
    background: #ccc;
    display: block;
    margin-top: 4px;
    width: 18px;
    height: 2px
}/*-------</END 导航>------------*//*-------</END 切换导航按钮>------------*//* 小屏幕 一*/

@media screen and (max-width:1180px) {
.menu .header-nav .nav-box {
    width: auto
}
.content-box {
    margin: 30px 15px
}
}/* 小屏幕 二*/

@media screen and (max-width:870px) {
.menu .header-box .logo {
    padding: 0px
}
.menu {
    height: auto
}
.header-box .clearfix.none {
    display: block
}
.menu .header-nav {
    position: static;
    width: 100%;
    height: auto;
    margin: 0
}
.menu .header-box {
    width: 100%;
    position: relative
}/*-----------</LOGO>---------------*/
.menu .nav li a:hover:after {
    display: none
}
.menu .btn-t {
    display: block;
    position: absolute;
    top: 18px;
    right: 14px;
    z-index: 99
}
.menu .header-nav .nav-box {
    background: none;
    height: auto;
    padding: 0;
    margin: 0
}
.menu .navbar-collapse {
    margin: 0;
    border-top-width: 2px;
    border-top-style: solid
}
.menu .navbar-collapse.collapse {
    display: none!important
}
.menu .navbar-collapse.in {
    overflow-y: hidden;
    display: block!important;
    height: auto
}
.menu .navbar-collapse.collapseing {
    padding: 0;
    margin: 0
}
.menu .nav {
    float: none;
    width: 100%
}
.menu .nav li {
    float: none;
    width: 100%;
    background: none;
    border-top-width: 1px;
    border-top-style: solid
}
.menu .nav li:last-child {
    border-bottom: none
}
.menu .nav li a {
    padding: 0 20px;
    text-align: left;
    display: block;
    font-size: 14px;
    margin: 0;
    line-height: 30px
}
.menu .nav li a:hover, .menu .nav li.active a, .menu .nav li.active {
    text-align: left;
    color: #fff
}
.menu .nav li a:hover, .menu .nav li.Theme {
    border-radius: 0;
    -webkit-transform: translatex(5px);
    -moz-transform: translatex(5px);
    transform: translatex(5px)
}
.menu .NavBox {
    width: 100%;
    visibility: hidden;
    height: 0;
    overflow: hidden
}
.menu .header-box.active .NavBox {
    visibility: visible
}/*-----------</菜单>---------------*/
}/* 新加 */
.menu .logo_name {
    float: left;
    width: 25%;
    overflow: hidden
}
.menu .header-nav {
    float: right;
    width: 74%
}
.menu .navbar-brand img {
    max-width: 100%;
    max-height: 100px !important
}
.menu .nav li {
    padding: 20px 0;
    position: relative
}
.menu .navbar-nav > li > a {
    position: relative;
    font-size: 16px
}
.menu .nav > li ul {
    top: 95px
}
.menu .nav > li .Triangle:after {
    top: 26px
}
.menu .nav > li .Themebghover:hover, .menu .nav > li .ThemeBbg {
    background: none !important
}/* .menu .nav > li a:hover:before,.menu .nav > li .ThemeBbg:before{content: "";width: 40px;height:2px;background-color: olive;position: absolute;bottom: 6px;left: 50%;margin-left: -20px}*/
.menu .header-box .logo {
}/* .menu .header-box .logo img{min-height: 60px !important;max-height: 60px !important;padding-top: 15px}*/

@media screen and (max-width: 870px) {
.header-nav #NavBoxPublic {
    width: 100%;
    height: 100%;
    background-color: #333;
    border: none
}
.menu .NavBoxPublic ul.navPublic li {
    border-bottom: 1px solid rgba(255,255,255,.1)
}
.menu .NavBoxPublic ul.navPublic li .Themefont {
    color: #fff !important
}
.NavBoxPublic .TriangleBtn:before, .inpro-nav .inproline {
    border-color: #fff !important
}
.menu .NavBoxPublic ul.navPublic li .Themebg {
    background-color: rgba(255,255,255,.1) !important
}
.menu .m-menutop {
    overflow: hidden
}
.menu .m-menutop-logo {
    float: left;
    width: 80%
}
.menu .m-menutop-logo img {
    max-height: 45px;
    max-width: 100%
}
.menu .m-menutop-cose {
    float: right;
    padding-top: 10px;
    width: 15%;
    text-align: right
}
.menu .m-menutop-cose i {
    font-size: 26px;
    margin-right: 10px;
    color: #fff
}
.menu .m-menutop-so {
    padding: 15px;
    border-bottom: 1px solid rgba(255,255,255,.1)
}
.menu .m-menutop-so .mnavformgroup {
    background-color: rgb(0, 123, 111);
    overflow: hidden;
    position: relative;
    padding: 10px 10px
}
.menu .m-menutop-so .input1 {
    width: 80%;
    border: none;
    background: none
}
.menu .m-menutop-so .button1 {
    display: inline-block;
    text-align: center;
    background: none;
    border: 0;
    outline: none;
    color: #fff;
    position: absolute;
    right: 0;
    top: 1px
}
.menu .m-menutop-so .iconshiliangzhinengduixiang:before {
    font-size: 18px
}
.menu .header-box .logo {
    height: auto;
    text-align: left
}
.menu .header-box .logo img {
    max-height: 96px !important;
    max-width: 100%;
    position: relative;
    top: 0;
    left: 10px;
    transform: translate(0)
}
}

@media screen and (max-width: 768px) {
.menu .header-box .logo img {
    min-height: 10px !important;
    max-height: 45px!important;
    padding-top: 0
}
.album video {
    display: none
}
.album .title_name2 {
    color: #444!important
}
}

@media screen and (max-width: 600px) {
.row .col-md-4, .row .col-md-5, .row .col-md-6, .row .col-md-7, .row .col-md-8, .row .col-md-9, .row .col-md-10, .row .col-md-11 {
    padding: 0px
}
}

@media screen and (max-width: 480px) {
}

@media screen and (max-width: 414px) {
}

@media screen and (max-width: 320px) {
#pp {
    margin-left: 0
}
}/* 增加导航栏背景颜色 */
.menu {
    background: #f5f5f5
}
.banner {
    width: 100%;
    overflow: hidden
}
.carousel {
    margin: 0
}
.bannerBox {
    margin: 0 auto;
    position: relative
}
.banner .carousel-control {
    background: none
}
.bannerEffect .tp-leftarrow.large, .bannerEffect .tp-rightarrow.large {
    display: none
}
.bannerEffect .tp-bullets.simplebullets.round .bullet {
    width: 18px !important;
    height: 10px !important;
    border-radius: 5px;
    opacity: 1;
    transition: all 0.3s
}
.bannerEffect .tp-bullets.simplebullets.round .bullet:hover, .bannerEffect .tp-bullets.simplebullets.round .bullet.selected, .bannerEffect .tp-bullets.simplebullets.navbar .bullet:hover, .bannerEffect .tp-bullets.simplebullets.navbar .bullet.selected {
    width: 36px !important;
    height: 10px !important;
    border-radius: 5px
}/*   */
#md_tpl_two .bannerEffect .tp-bullets {
    bottom: 130px!important
}
@media screen and (min-width: 769px) and (max-width: 1200px)  {
}
@media screen and (min-width: 769px) and (max-width: 890px)  {
}
@media screen and (max-width: 768px)  {
}
@media screen and (max-width: 425px)  {
.flex-control-nav {
bottom: 35px
}
}/*-----------<关于我们>---------------*/
.about-draggable {
    margin: 60px 0 22px
}
.about-content-box {
    width: 100%;
    max-width: 100%;
    background: #f6f6f6
}
.tpl_four {
    overflow: visible
}
.about-us {
    margin: 0 auto
}
.about-us .aboutUsBox {
    width: 100%;
    padding: 50px 0;
    position: relative
}
.about-us .aboutUsBox .cw1200 {
    max-width: 1180px;
    margin: 0 auto
}
.about-us .aboutUsBox .cw1200 .title {
    font: 400 18px/18px "微软雅黑";
    color: #333;
    margin: 0
}
.about-us .aboutUsBox .cw1200 .eng {
    margin: 16px 0 32px;
    font: 14px/14px "微软雅黑";
    color: #aaa
}
.about-us .aboutUsBox .cw1200 .content {
    height: 168px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
    max-width: 55%;
    font: 12px/28px "微软雅黑";
    color: #aaa
}
.about-us .aboutUsBox .cw1200 .more {
    display: block;
    width: 143px;
    height: 33px;
    margin-top: 30px;
    text-align: center;
    font: 14px/33px "微软雅黑";
    border-width: 1px;
    border-style: solid
}
.about-us .aboutUsBox .cw1200 .imgBox {
    position: absolute;
    top: -20px;
    right: 8%;
    width: 33%;
    height: 453px;
    border-width: 1px;
    border-style: solid
}
.about-us .aboutUsBox .cw1200 .imgBox img {
    display: block;
    width: 100%;
    height: 453px
}

@media screen and (min-width: 769px) and (max-width: 1600px) {
.about-us .aboutUsBox .cw1200 .imgBox {
    width: 40%
}
.about-us .aboutUsBox .cw1200 .content {
    width: 43%
}
}

@media screen and (min-width: 769px) and (max-width: 1200px) {
.about-us {
    max-width: 1024px;
    margin: 0 auto;
    padding-left: 8%
}
.about-us .aboutUsBox .cw1200 .imgBox {
    width: 45%
}
.about-us .aboutUsBox .cw1200 .content {
    width: 40%
}
}

@media screen and (min-width: 769px) and (max-width: 890px) {
.about-us {
    max-width: 768px;
    padding: 0 15px;
    box-sizing: border-box
}
.about-us .aboutUsBox {
    padding: 30px 0 35px
}
.about-us .aboutUsBox .cw1200 .eng {
    margin: 15px 0 30px
}
.about-us .aboutUsBox .cw1200 .content {
    height: 150px;
    max-width: 100%;
    margin-top: 20px;
    font: 12px/25px "微软雅黑"
}
.about-us .aboutUsBox .cw1200 .more {
    margin-top: 25px
}
.about-us .aboutUsBox .cw1200 .imgBox {
    position: relative;
    top: 0;
    right: 0;
    width: 100%;
    max-height: 576px
}
.about-us .aboutUsBox .cw1200 .imgBox img {
    max-height: 576px
}
}

@media screen and (max-width: 768px) {
.about-us {
    max-width: 768px;
    padding: 0 15px;
    box-sizing: border-box
}
.about-us .aboutUsBox {
    padding: 30px 0 35px
}
.about-us .aboutUsBox .cw1200 .eng {
    margin: 15px 0 30px
}
.about-us .aboutUsBox .cw1200 .content {
    height: 150px;
    max-width: 100%;
    margin-top: 20px;
    font: 12px/25px "微软雅黑"
}
.about-us .aboutUsBox .cw1200 .more {
    margin-top: 25px
}
.about-us .aboutUsBox .cw1200 .imgBox {
    position: relative;
    top: 0;
    right: 0;
    width: 100%;
    max-height: 576px
}
.about-us .aboutUsBox .cw1200 .imgBox img {
    max-height: 576px
}
}

@media screen and (max-width: 425px) {
.about-us {
    max-width: 425px;
    padding: 0 15px;
    box-sizing: border-box
}
.about-us .aboutUsBox {
    padding: 30px 0 35px
}
.about-us .aboutUsBox .cw1200 .eng {
    margin: 15px 0 30px
}
.about-us .aboutUsBox .cw1200 .content {
    height: 150px;
    max-width: 100%;
    margin-top: 20px;
    font: 12px/25px "微软雅黑"
}
.about-us .aboutUsBox .cw1200 .more {
    margin-top: 25px
}
.about-us .aboutUsBox .cw1200 .imgBox {
    position: relative;
    top: 0;
    right: 0;
    width: 100%;
    max-height: 273px
}
.about-us .aboutUsBox .cw1200 .imgBox img {
    max-height: 273px
}
}
/*-----------<联系我们>---------------*/.contact-box {
    max-width: 100%;
    margin-top: 75px !important
}
.contact {
    height: 500px;
    position: relative
}
.contact .lbs-box {
    display: none
}
.contact .map-box1 {
    min-height: 500px
}
.contact .inmap {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%
}
.contact .inmap img {
    width: 100%
}
.contact .incontact {
    position: relative;
    z-index: 2;
    width: 540px;
    background-color: rgba(255, 255, 255, .95);
    margin-bottom: 60px
}
.contact .incontact .incontact_box {
    padding: 30px
}
.contact .incontact h3 {
    font-size: 18px
}
.contact .itemlist {
    margin: 25px 0
}
.contact .itemlist ul li {
    line-height:29px;
    color: #333;
    font-size: 14px
}
.contact .itemlist ul li a {
    color: #333;
    font-size: 14px
}
.contact .feedbackc {
    line-height: 36px;
    padding: 10px 35px
}
.contact .feedbackc:hover {
    color: #fff
}
.concact-box-263 {
    position: relative;
    top: 98px
}
.BMap_mask {
    background: rgba(0, 0, 0, .25) !important
}/* 横向放置的手机和竖向放置的平板之间的分辨率 三*/

@media screen and (max-width: 1030px) {
}

@media screen and (max-width: 980px) {
}

@media screen and (max-width: 870px) {
.contact {
    height: 400px
}
.contact .map-box1 {
    min-height: 400px
}
.contact-box {
    margin-top: 35px !important
}
.contact .incontact {
    position: relative;
    z-index: 2;
    width: 90%;
    left: 5%;
    background-color: rgba(255, 255, 255, .85);
    margin-bottom: 0
}
.concact-box-263 {
    top: 60px
}
.contact .itemlist {
    margin: 20px 0
}
.contact .incontact .incontact_box {
    padding: 20px
}
.contact .feedbackc {
    display: block;
    width: 30%;
    line-height: 36px;
    padding: 0;
    border-radius: 0;
    text-align: center
}
}

@media screen and (max-width: 768px) {
}

@media screen and (max-width: 600px) {
}
.news-center .textBox {
    width: 100%;
    text-align: center;
    margin-top: 50px
}
.news-center .textBox .title {
    font-size: 18px;
    color: #333;
    z-index: 10;
    position: relative;
    background: #fff;
    margin: 0 auto;
    padding: 0 25px;
    display: table
}
.news-center .textBox .title-Enlish {
    margin-top: 5px;
    font-size: 14px;
    color: #aaa;
    position: relative
}
.news-center .textBox .title-Enlish::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 0;
    width: 100%;
    height: 2px;
    background: #e2e2e2
}
.news-center .newsBox {
    margin: 40px 0 0;
    padding-bottom: 10px
}
.news-center .newsBox .newsItem {
    float: left;
    width: 30.66%;
    display: block;
    background: #f5f5f5;
    padding-bottom: 35px
}
.news-center .newsBox .newsItem .imgBox {
    position: relative;
    width: 100%
}
.news-center .newsBox .newsItem .imgBox img {
    display: block;
    width: 100%;
    height: auto
}
.news-center .newsBox .newsItem .imgBox .date {
    position: absolute;
    left: 50%;
    bottom: -32px;
    width: 64px;
    height: 64px;
    color: #fff;
    font-size: 14px;
    text-align: center;
    border-radius: 50%;
    transform: translateX(-50%)
}
.news-center .newsBox .newsItem .imgBox .date div {
    line-height: 24px
}
.news-center .newsBox .newsItem .imgBox .date div:first-child {
    margin-top: 8px
}
.news-center .newsBox .newsItem .title {
    padding: 0 20px;
    margin: 57px 0 10px;
    text-align: center;
    font: 400 14px/22px "微软雅黑";
    height: 44px;
    color: #333;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}
.news-center .newsBox .newsItem .content {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    padding: 0 20px;
    font: 12px/20px "微软雅黑";
    color: #c1c1c1;
    width: 100%;
    height: 60px;
    box-sizing: border-box;
    text-align: justify
}
.news-center .newsBox .newsItem:hover {
    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.2)
}
.news-center .newsBox .newsItem:nth-child(2) {
    margin: 0 4%
}

@media screen and (max-width: 769px) {
.news-center .newsBox {
    margin: 30px 0 0;
    padding-bottom: 20px
}
.news-center .newsBox .newsItem {
    width: 48%;
    padding-bottom: 25px;
    margin-bottom: 30px
}
.news-center .newsBox .newsItem .title {
    padding: 0px 15px;
    margin: 50px 0 15px;
    text-align: left;
    font: 600 14px/20px "微软雅黑";
    white-space: normal;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    height: 40px
}
.news-center .newsBox .newsItem .content {
    padding: 0 15px;
    font: 12px/18px "微软雅黑";
    height: 54px
}
.news-center .newsBox .newsItem:nth-child(2n+1) {
    margin: 0 4% 25px 0
}
.news-center .newsBox .newsItem:nth-child(2) {
    margin: 0 0 25px
}
}

@media screen and (max-width: 1024px) {
.new-content-box {
    width: 90%
}
.news-center .newsBox {
    margin: 40px 0 0;
    padding-bottom: 50px
}
}

@media screen and (max-width: 425px) {
.new-content-box {
    width: 90%
}
.news-center .textBox {
    margin-top: 25px
}
.news-center .newsBox .newsItem .title {
    margin: 48px 0 6px
}
.news-center .newsBox {
    margin: 25px 0 0;
    padding-bottom: 20px
}
.news-center .newsBox a:last-child {
    display: none
}
}
/*产品列表*/
/*-----------</END 最新产品>---------------*/
.tpl_five {
    overflow: visible
}/* 产品分类 */
.product-container {
    position: relative
}
.product-container .productClass-swiper {
    width: 100%;
    position: absolute;
    padding-top: 15px;
    top: -110px;
    z-index: 3;
    padding: 0 2%;
    box-sizing: border-box;
    background-color: #fff
}
.product-container .productClass-swiper .swiper-wrapper {
    margin-top: 20px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem {
    width: 86%;
    display: block;
    padding: 32px 22px 32px 35px;
    float: left;
    margin-left: 7%;
    box-sizing: border-box;
    background-color: #f5f5f5
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox {
    float: left;
    padding-top: 40px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox h3 {
    max-width: 90px;
    margin-bottom: 8px;
    font: 400 18px/18px "微软雅黑";
    color: #323232
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox div {
    font-size: 14px;
    color: #aaa
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .imgBox {
    float: right;
    width: 169px;
    overflow: hidden
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .imgBox img {
    display: block;
    width: 100%;
    max-height: 127px;
    height: auto
}
.product-container .productClass-swiper .swiper-button-prev, .product-container .productClass-swiper .swiper-button-next {
    margin-top: -16px;
    background: none
}
.product-container .productClass-swiper .swiper-button-prev::before, .product-container .productClass-swiper .swiper-button-next::before, .product-container .productClass-swiper .swiper-button-prev::after, .product-container .productClass-swiper .swiper-button-next::after {
    position: absolute;
    top: 14px;
    left: 2px;
    content: '';
    display: block;
    width: 22px;
    height: 4px;
    border-radius: 2px;
    background: #e3e3e3;
    transform: rotate(-45deg)
}
.product-container .productClass-swiper .swiper-button-prev::after, .product-container .productClass-swiper .swiper-button-next::after {
    top: 27px;
    transform: rotate(45deg)
}
.product-container .productClass-swiper .swiper-button-next {
    transform: rotate(180deg)
}
.product-container .titleBox {
    padding-top: 170px
}
.product-container .titleBox .textBox {
    width: 100%;
    text-align: center
}
.product-container .titleBox .textBox .title {
    font-size: 18px;
    color: #333;
    position: relative;
    z-index: 10;
    background: #fff;
    margin: 0 auto;
    padding: 0 25px;
    display: table
}
.product-container .titleBox .textBox .title-Enlish {
    margin-top: 5px;
    font-size: 14px;
    color: #aaa;
    position: relative
}
.product-container .titleBox .textBox .title-Enlish::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 0;
    width: 100%;
    height: 2px;
    background: #e2e2e2
}
.product-container .proBox {
    padding-bottom: 90px
}
.product-container .proBox .proItem {
    position: relative;
    float: left;
    width: 22%;
    margin-right: 4%;
    margin-top: 35px
}
.product-container .proBox .proItem:nth-child(4n) {
    margin-right: 0
}
.product-container .proBox .proItem .imgBox {
    width: 100%
}
.product-container .proBox .proItem .imgBox:hover {
    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.2)
}
.product-container .proBox .proItem .imgBox img {
    display: block;
    width: 100%;
    height: auto
}
.product-container .proBox .proItem .title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    height: 45px;
    margin: 15px 0;
    font: 400 14px/22px "微软雅黑";
    color: #666
}
.product-container .proBox .proItem .price {
    font-size: 14px;
    color: #666
}
.product-container .proBox .proItem .more {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 27px;
    height: 27px;
    border-radius: 50%
}
.product-container .proBox .proItem .more::before, .product-container .proBox .proItem .more::after {
    position: absolute;
    top: 9px;
    left: 10px;
    content: '';
    display: block;
    width: 11px;
    height: 2px;
    border-radius: 1px;
    background: #fff;
    transform: rotate(45deg)
}
.product-container .proBox .proItem .more::after {
    top: 16px;
    transform: rotate(-45deg)
}

@media screen and (min-width: 769px) and (max-width: 1200px) {
.product-container .titleBox {
    padding-top: 205px
}
.product-container .productClass-swiper {
    padding: 0
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox {
    padding-top: 0
}
}

@media screen and (min-width: 769px) and (max-width: 890px) {
.product-container .titleBox {
    padding-top: 205px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox {
    padding-top: 0
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .imgBox {
    float: none
}
}

@media screen and (max-width: 768px) {
.product-container .productClass-swiper {
    padding: 0;
    top: 10px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem {
    padding: 20px 22px 20px 35px
}
.product-container .titleBox {
    padding-top: 235px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox {
    padding-top: 0
}
}

@media screen and (max-width: 425px) {
.product-container .productClass-swiper {
    padding: 0;
    top: 10px
}
.product-container .productClass-swiper .swiper-wrapper {
    margin-top: 15px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem {
    padding: 20px 10px;
    width: 90%;
    margin: 0 5%
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox {
    padding-top: 13px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox h3 {
    max-width: 58px;
    margin-bottom: 4px;
    font: 400 14px/14px "微软雅黑"
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox a {
    font-size: 12px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .imgBox {
    width: 78px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .imgBox img {
    max-height: 58px;
    height: auto
}
.product-container .productClass-swiper .swiper-button-prev,  .product-container .productClass-swiper .swiper-button-next {
    display: none
}
.product-container .titleBox {
    padding-top: 150px
}
.product-container .titleBox .textBox .title span {
    padding: 0 20px
}
.product-container .proBox {
    padding-bottom: 35px
}
.product-container .proBox .proItem {
    width: 48%;
    margin-right: 0%;
    margin-top: 25px
}
.product-container .proBox .proItem:nth-child(2n+1) {
    margin-right: 4%
}
}

@media screen and (max-width: 320px) {
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox div {
    font-size: 12px
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .infoBox h3 {
    font: 400 12px/12px "微软雅黑"
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .imgBox {
    width: 50%
}
.product-container .productClass-swiper .productClass-swiper-slider .proNavItem .imgBox img {
    max-height: 45px
}
}
/*---footer----*/.footers {
    width: 100%;
    background: #333
}
.footerBox {
    margin: 0 auto;
    max-width: 1180px
}
.footers .footers-box {
    padding: 15px 0;
    background: url(/Public/Images/Theme261/line3.jpg) repeat-x top
}
.footers .footers-box a {
    margin-right: 10px;
    color: #aaa !important;
    word-break: break-all;
    word-wrap: break-word;
    text-decoration: underline
}
.footers .footers-box p {
    padding: 0;
    font-size: 12px;
    line-height: 20px
}
.infooternav {
    overflow: hidden;
    color: #aaa;
    padding: 40px 0
}
.infooternav_left {
    float: left;
    width: 30%;
    background: url(/Public/Images/Theme261/line2.jpg) repeat-y right top
}
.infooternav_con {
    float: left;
    width: 30%;
    background: url(/Public/Images/Theme261/line2.jpg) repeat-y right top
}
.infooternav_right {
    float: left;
    width: 30%
}
.infooternav .frcon p {
    color: #aaa;
    line-height: 24px;
    font-size: 12px
}
.infooternav .frer ul li {
    display: inline-block;
    text-align: center
}
.infooternav .frer ul li:nth-child(1) {
    margin-right: 20px
}
.infooternav .frer ul li img {
    width: 100px;
    padding: 5px;
    background-color: rgba(255, 255, 255, .1)
}
.infooternav p {
    color: #aaa
}
.infootercon {
    background: url(/Public/Images/Theme261/line3.jpg) repeat-x right top;
    padding: 20px 0;
    text-align: center;
    color: #aaa
}
.infooternav .fpp20 {
    padding: 0 35px;
    height: 100% !important
}
.infooternav .frer img {
    margin: 20px 0 10px 0
}
.infooternav h3 {
    display: block;
    padding-bottom: 20px;
    position: relative;
    font-size: 18px
}
.infooternav h3:before {
    content: '';
    width: 20px;
    height: 2px;
    background-color: #666;
    position: absolute;
    bottom: 0
}
.infooternav .fnavlist ul {
    padding-top: 10px
}
.infooternav .fnavlist ul li {
    line-height: 30px;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}
.infooternav .fnavlist ul li a {
    color: #aaa
}
.infootercon p {
    color: #aaa;
    padding: 5px 0
}
.footerpc {
    display: block
}
.footerm {
    display: none
}/*-----------</END>---------------*/
.footersInformation {
    width: 100%;
    text-align: center
}
.tpl_footers .footers .footersInformation p {
    text-align: center;
    color: #aaa
}
.footers .qr {
    display: none
}

@media screen and (max-width: 870px) {
.footerpc {
    display: none
}
.footerm {
    display: block;
    width: 90%;
    text-align: center;
    margin: 0 auto;
    padding-bottom: 60px
}
.footerm p {
    color: #aaa;
    padding: 5px 0
}
.infootercon {
    background: none !important
}
}/*---footer----*/
.tpl_nine {
    background-color: #333
}
.footers {
    width: 100%
}
.footerBox {
    margin: 0 auto;
    max-width: 1180px
}
.footers .footers-box {
    padding: 15px 0
}
.footers .footers-box a {
    margin-right: 10px;
    color: #333;
    word-break: break-all;
    word-wrap: break-word;
    text-decoration: underline
}
.footers .footers-box p {
    padding: 0;
    font-size: 12px;
    line-height: 20px
}
.infooternav {
    overflow: hidden;
    color: #aaa;
    padding: 40px 0
}
.infooternav_left {
    float: left;
    width: 30%;
    background: url(/Public/Images/Theme261/line2.jpg) repeat-y right top
}
.infooternav_con {
    float: left;
    width: 30%;
    background: url(/Public/Images/Theme261/line2.jpg) repeat-y right top
}
.infooternav_right {
    float: left;
    width: 30%
}
.infooternav .frcon p {
    color: #aaa;
    line-height: 24px;
    font-size: 12px
}
.infooternav .frcon p a {
    color: #aaa
}
.infooternav .frer ul li {
    display: inline-block;
    text-align: center
}
.infooternav .frer ul li:nth-child(1) {
    margin-right: 20px
}
.infooternav .frer ul li img {
    width: 100px;
    padding: 5px;
    background-color: rgba(255, 255, 255, .1)
}
.infooternav p {
    color: #aaa
}
.infootercon {
    background: url(/Public/Images/Theme261/line3.jpg) repeat-x right top;
    padding: 20px 0;
    text-align: center;
    color: #aaa
}
.infooternav .fpp20 {
    padding: 0 35px;
    height: 300px
}
.infooternav .frer img {
    margin: 20px 0 10px 0
}
.infooternav h3 {
    display: block;
    padding-bottom: 20px;
    position: relative;
    font-size: 18px;
    color: #fff
}
.infooternav h3:before {
    content: '';
    width: 20px;
    height: 2px;
    background-color: #666;
    position: absolute;
    bottom: 0
}
.infooternav .fnavlist ul {
    padding-top: 10px
}
.infooternav .fnavlist ul li {
    line-height: 30px;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}
.infooternav .fnavlist ul li a {
    color: #aaa
}
.infootercon p {
    color: #aaa;
    padding: 5px 0
}
.footerpc {
    display: block
}
.footerm {
    display: none
}/*-----------</END>---------------*/
.footersInformation {
    width: 100%;
    text-align: center
}
.tpl_footers .footers .footersInformation p {
    text-align: center
}

@media screen and (max-width: 870px) {
.footerpc {
    display: none
}
.footerm {
    display: block;
    width: 90%;
    text-align: center;
    margin: 0 auto;
    padding-bottom: 60px
}
.footerm p {
    color: #aaa;
    padding: 5px 0
}
}
#rightHistory .fnavlist a, #rightHistory .frcon a, #rightHistory .footersInformation a {
    color: #aaa !important
}/*-----------<图库>---------------*/
/*-----------</END 最新产品>---------------*/
/* 横向放置的手机和竖向放置的平板之间的分辨率 四*/
.album .textBox {
    width: 100%;
    text-align: center;
    margin-top: 70px
}
.album .textBox .title {
    font-size: 18px;
    color: #333;
    position: relative;
    z-index: 10;
    background: #fff;
    margin: 0 auto;
    padding: 0 25px;
    display: table
}
.album .textBox .title-Enlish {
    margin-top: 5px;
    font-size: 14px;
    color: #aaa;
    position: relative
}
.album .textBox .title-Enlish::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 0;
    width: 100%;
    height: 2px;
    background: #e2e2e2
}
.album .images-swiper {
    width: 100%;
    height: 410px;
    margin-top: 45px
}
.album .images-swiper .swiper-slide .imagesItem {
    width: 100%;
    height: 315px;
    display: block;
    margin: 0 auto
}
.album .images-swiper .swiper-slide .imagesItem .imgBox {
    width: 100%;padding-top:70%;position:relative
}
.album .images-swiper .swiper-slide .imagesItem .imgBox img {
    position:absolute;top:0;left:0;
    width: 100%;
    height:100%
}
.album .images-swiper .swiper-slide .imagesItem .title {
    margin-top: 22px;
    font: 400 14px/14px "微软雅黑";
    color: #333
}
.album .images-swiper .swiper-slide .imagesItem:hover .imgBox {
    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.2)
}
.album .images-swiper .swiper-pagination {
    bottom: 45px
}
.album .images-swiper .swiper-pagination .swiper-pagination-bullet {
    width: 18px;
    height: 10px;
    background: #eaeaea;
    border-radius: 5px;
    opacity: 1;
    transition: all 0.3s
}
.album .images-swiper .swiper-pagination .swiper-pagination-bullet-active {
    width: 36px;
    height: 10px;
    background: #d8d8d8;
    border-radius: 5px
}

@media screen and (min-width: 769px) and (max-width: 1200px) {
.album-content-box {
    max-width: 90%
}
.album .images-swiper {
    height: 355px
}
}

@media screen and (min-width: 769px) and (max-width: 890px) {
.album-content-box {
    max-width: 90%
}
.album .images-swiper {
    height: 290px
}
}

@media screen and (max-width: 768px) {
.album-content-box {
    max-width: 90%
}
.album .textBox {
    margin-top: 40px
}
.album .images-swiper {
    height: 275px
}
.album .images-swiper .swiper-pagination {
    bottom: 35px
}
}

@media screen and (max-width: 425px) {
.album .images-swiper {
    height: 250px;
    margin-top: 35px
}
.album .images-swiper .swiper-pagination {
    bottom: 35px
}
.album .images-swiper .swiper-pagination .swiper-pagination-bullet {
    width: 13px;
    height: 7px;
    background: #eaeaea;
    border-radius: 5px;
    opacity: 1;
    transition: all 0.3s
}
.album .images-swiper .swiper-pagination .swiper-pagination-bullet-active {
    width: 26px;
    height: 7px;
    background: #d8d8d8;
    border-radius: 5px
}
}

@media screen and (max-width: 375px) {
.album .images-swiper {
    height: 230px;
    margin-top: 35px
}
}