@charset "utf-8";
/* CSS Document */
html, body {font-size: 12px;margin: 0px;padding: 0px;text-decoration: none;font-family:"微软雅黑";background: #f4f4f4;text-align: center;-webkit-text-size-adjust: none; text-align:left;}
a {	color: #666666;text-decoration: none;outline:none; star:expression(this.onFocus=this.blur());outline:none;}
a:hover, a:active { color: #00548e;}
* { margin: 0px;padding: 0px;list-style: none;}
table {	border-collapse: collapse;}
ul, li {list-style: none;border: 0 none;padding: 0px;outline:none;}
form {margin: 0px;}
img {border: 0px none;text-align-last: center;vertical-align: middle;_azimuth:expression(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "images/blank.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("', '').replace('")', ''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')", this.runtimeStyle.backgroundImage = "none")), this.pngSet=true);}
center {text-align: left;	color: #999;height: 50px;}
#dhtmltooltip {z-index: 100;visibility: hidden;	position: absolute;text-align: left;border: 1px solid #ccc;}
#clear, .clear {clear: both;float: none!important;background: none;width: 0 !important;	height: 0 !important;}
#noData, .noData {color: #ccc;font-size: 14px;text-align: left;padding: 50px 0px;}
.w100{ width:100% !important; max-width:none!important; min-width:none!important; max-height:none!important; min-height:none!important;}
.bg-color-white{ background:#fff;}
.box-shadow{box-shadow:0 10px 10px rgba(0,0,0,.04);}
.fl-left{float:left;}
.fl-right{float:right;}
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
#fp-nav ul li a span, .fp-slidesNav ul li a span {top: 2px;left: 2px;width: 12px;height: 12px; opacity:.4; border:1px solid rgba(255,255,255,1) !important; background:rgba(255,255,255,1) !important;}
#fp-nav .active span{opacity:1;}





/* END*/



/* banner TOP*/

#banner{ position:relative; margin:0 auto;padding:0; height:300px; background: url( "../image/banner-product-view-mob.jpg") no-repeat; background-size: cover }
#banner>.wrap{ position:absolute;z-index:9;left:50%; bottom:25%; margin-left:-40%; width:80%; height:100px; text-align:left;}
#banner.view>.wrap{ bottom:0;}
#banner .tit{ font-size:30px; color:#fff;}
#banner.view .tit{ font-size:24px;}
#banner .txt{ padding:15px 0; width:40%; line-height:30px; font-size:18px; color:#fff;}

#banner .path{padding:10px 0; text-align:left; color:#fff; font-size:14px;}
#banner .path>a{display:inline-block; color:#fff;}
#banner .path>a:hover{text-decoration:underline;}
#banner .path>strong{display:inline-block; font-weight:normal; padding-left:24px; background:url("../image/icon-path-white.png") no-repeat; background-size:18px auto; background-position:left center; box-sizing:border-box;}
#banner .path>a.A{opacity:.5 !important; text-decoration:none!important;}
#banner>.bg{ text-align:center;margin:0 auto;}
#banner>.bg>img{ width:100%;height:auto;}
#banner>.bg>img.mob{display:none;}

@media only screen and (max-width: 1080px){
  #banner>.bg>img.pc{display:none;}
  #banner>.bg>img.mob{display:block;}
}
@media only screen and (max-width: 780px){
  #banner>.wrap {bottom:0; height:auto;padding:20px 0;}
  #banner .tit{ font-size:16px; font-weight:bold;}
  #banner.view .tit{ font-size:16px;}
  #banner .txt{display:none;}
  #banner .path{display:none;}
  #banner .search{ display:none; width:100%; padding:10px 0 0 0; transition:all .35s;}

  #banner .search>form{ height:40px; border-radius:5px;}
  #banner .search>form input[type="text"]{padding:0;height:40px;line-height:40px; font-size:14px;}
  #banner .search>form button{height:40px;}


}

/* END*/


/* product TOP*/

#product{ position:relative; width:100%; margin:0 auto;}
#product .wrap{ width:85%; max-width:1480px; margin:0 auto; padding:60px 0;}
#product .container{margin:0 auto;}
#product .nav{margin:0 auto; text-align:left;}
#product .nav>ul{margin:0 auto;padding:30px 0;}
#product .nav>ul>li{ position:relative; display:block; float:left;padding:10px 20px; box-sizing:border-box;}
#product .nav>ul>li:after{ position:absolute;z-index:1;left:0;top:50%; margin-top:-7px; width:1px; height:14px; background:#ccc; content:'';}
#product .nav>ul>li:first-child{padding-left:0 !important;}
#product .nav>ul>li:first-child:after{opacity:0;}
#product .nav>ul>li>a{display:block; font-size:16px; color:#333; transition:all .35s;}
#product .nav>ul>li>a img{ display:inline-block; height:30px; width:auto; margin-right:5px; opacity:.4;-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);}
#product .nav>ul>li>a:hover{ color:#1c73c5;}
#product .nav>ul>li.active a {color: #1c73c5;}
#product .nav>ul>li.active a img{opacity:1;-webkit-filter: grayscale(0);-moz-filter: grayscale(0);-ms-filter: grayscale(0);-o-filter: grayscale(0);filter: grayscale(0);}
#product .list, #product .list>ul{margin:0 auto;padding:0;}
#product .list>ul>li{ position:relative; display:block; float:left; width:23.5%; margin-right:2%; margin-bottom:2%; box-sizing:border-box;background:#fff;overflow:hidden;}
#product .list>ul>li:nth-child(4n){ margin-right:0 !important;}
#product .list>ul>li>a{display:block; text-align:left;padding:10px; box-sizing:border-box; transition:all .35s;}
#product .list>ul>li .img{ position:relative; text-align:center;overflow:hidden;margin:0 auto;}
#product .list>ul>li .img>img{ width:70%; height:auto; max-height:250px; margin:0 auto; transition:all .35s;}
#product .list>ul>li .con{ box-sizing:border-box;padding:20px; text-align:center; transition:all .35s;}
#product .list>ul>li .con>.tit{ font-size:18px; font-weight:bold; color:#333;overflow: hidden;text-overflow:ellipsis; white-space: nowrap;}
#product .list>ul>li .con>.txt{ padding:5px 0; font-size:16px; color:#999;overflow: hidden;text-overflow:ellipsis; white-space: nowrap;}
#product .list>ul>li:hover{box-shadow:0 2px 10px rgba(0,0,0,.1);}
#product .list>ul>li:hover .img>img{transform:scale(1.1);}
#product .list>ul>li:hover .con>.tit{ color:#1c73c5;}

#product .solution{ width:100%; margin:0 auto; height:600px; background:url("../image/solution-bg.jpg") no-repeat; background-attachment:fixed; background-position:50% 50%; background-size:cover;}
#product .solution>.wrap{ position:relative; width:85%; max-width:1480px; margin:0 auto; padding:70px 0;}
#product .solution .box{ width:60%;}
#product .solution .box>a{ display:block; float:left; width:20%;padding:30px;box-sizing:border-box; text-align:center; transition:all .35s; }
#product .solution .box>a>.icon{ text-align:center;margin:0 auto;padding:20px; box-sizing:border-box;}
#product .solution .box>a>.icon>img{width:100%; height:auto;}
#product .solution .box>a>.tit{font-size:18px; color:#fff;}
#product .solution .box>a:hover{transform:scale(1.2);}
#product .solution .con{ position:relative; width:32%; box-sizing:border-box; padding:70px 30px; text-align:left;}
#product .solution .con>.tit{position:relative; z-index:99; padding:10px 0;  font-size:30px; color:#2db2ff; font-weight:bold;}
#product .solution .con>.tit:after{ position:absolute;z-index:3; left:0;bottom:0; width:60px; height:3px; background:#2db2ff; content:'';}
#product .solution .con>.tit:before{ position:absolute;z-index:1; left:0; bottom:-32px; font-size:60px; font-family:Arial; color:#fff; font-weight:bold;opacity:.06; width:100%; height:auto; content:'solution'; text-transform:uppercase;}
#product .solution .con>.txt{ padding:40px 0; box-sizing:border-box; font-size:14px; color:rgba(255,255,255,.8); line-height:24px;}
#product .solution .more{ position:absolute;z-index:34; top:-30px; right:0; text-align:center;}
#product .solution .more>a{display:block; padding:30px 46px; line-height:30px; font-size:16px;color:#fff;background:rgba(28,115,197,1); transition:all .35s;}
#product .solution .more>a:hover{ background:#007aff;}
#product .solution .more>a img{height:30px; width:auto; display:block; margin:0 auto;}

#product .view{margin:0 auto;padding:0;}
#product .view>.focus{ width:55%; background:#fff; box-sizing:border-box;padding:60px;}
#product .view>.focus .watermark{ position:absolute;z-index:999; left:0;top:0; width:100%;height:100%;  background-position:50% 50%; background-size:30% auto;opacity:.2; }
#product .view>.focus .swiper-slide img{ width:100%; height:auto;}
#product .view>.box{ width:45%; box-sizing:border-box;padding:8%; text-align:left;}
#product .view>.box>.model{ font-size:36px; color:#333;}
#product .view>.box>.name{ padding:20px 0 50px 0; font-size:20px; color:#888; border-bottom:1px solid #bdbdbd;}
#product .view>.box>.share{ text-align:left;margin:0 auto; padding:50px 0;}
#product .view>.box>.share .tit{ font-size:14px; color:#999; padding-bottom:10px;}
#product .view>.box>.share .bshare-custom a{ padding:0px;margin:0 12px 0 0!important; width:36px; height:36px; opacity:1; transition:all .35s;}
#product .view>.box>.share .bshare-custom .bshare-sinaminiblog{ background:url("../image/icon-weibo.png") no-repeat; background-size:100% auto;background-position:center center;}
#product .view>.box>.share .bshare-custom .bshare-weixin{ background:url("../image/icon-wechat.png") no-repeat; background-size:100% auto;background-position:center center;}
#product .view>.box>.share .bshare-more{background:url("../image/icon-share.png") no-repeat; padding:0 !important; margin:0 !important; background-size:100% auto;background-position:center center;}
#product .view>.box>.share .bshare-custom a:hover{ opacity:1; transform: translateY(-3px);}
#product .view>.box .order{padding-top:30px;}
#product .view>.box .order>.qq{ width:60%; text-align:left;}
#product .view>.box .order>.qq>a{display:inline-block; float:left; box-sizing:border-box; width:50%; padding:6px 0 6px 30px; background:url("../images/icon-qq-blue.png") no-repeat; background-position:0 50%; background-size:20px auto; font-size:14px; color:#2db2ff; transition:all .35s;}
#product .view>.box .order>.qq>a:hover{ color:#999; background:url("../image/icon-qq-gray.png") no-repeat; background-position:0 50%; background-size:20px auto}
#product .view>.box .order>.btn{ text-align:left;padding:50px 0;}
#product .view>.box .order>.btn>a{background:#1c73c5;display:inline-block; border-radius:3px; box-sizing:border-box; padding:15px 100px;text-align: center;color: #fff;font-size: 16px;position: relative; overflow: hidden;border: 1px solid transparent;}
#product .view>.box .order>.btn>a:after {position:absolute;z-index:0;background:#1c73c5;left: 0;top: 0;width: 100%; height: 100%;content: "";}
#product .view>.box .order>.btn>a:before {display: block;position: absolute;left: -148%;top: 0;z-index: 1; width: 124%;height: 100%; content: ""; background:#f4f4f4;transition: .3s ease-in-out; -webkit-transition: .3s ease-in-out;transform: skewX(45deg);-webkit-transform: skewX(45deg);-moz-transform: skewX(45deg); }
#product .view>.box .order>.btn>a span{position: relative;z-index: 2;transition: .3s ease-in-out; }
#product .view>.box .order>.btn>a:hover {border-color:#1c73c5;color: #1c73c5; }
#product .view>.box .order>.btn>a:hover:before {left: -13%;}
#product .view>.tag{ width:85%; max-width:1480px; margin:0 auto; padding:60px 0;}
#product .view>.tag>.nav{ text-align:center;padding:20px; box-sizing:border-box; border-top:1px solid #bdbdbd; border-bottom:1px solid #bdbdbd;}
#product .view>.tag>.nav>a{ position:relative; display:inline-block; font-size:16px; color:#333;padding:0 50px; transition:all .35s;}
#product .view>.tag>.nav>a:after{ position:absolute;z-index:1;left:0;top:50%; margin-top:-10px; width:1px; height:20px; background:#a2a2a2; content:'';}
#product .view>.tag>.nav>a:first-child:after{opacity:0;}
#product .view>.tag>.nav>a:hover{ color:#1c73c5;}
#product .view>.tag>.nav>a.A{color:#1c73c5; font-weight:bold;}
#product .view>.tag>.con{margin:0 auto;padding:50px;box-sizing:border-box; text-align:left; font-size:14px; line-height:24px; color:#666;}
#product .view>.tag>.con .hide{display:none;}
#product .view>.tag>.con .tit{display:none;}
#product .view>.tag>.con .txt>p{margin-bottom:20px;}
#product .view>.tag>.con .txt img{max-width:100%;height:auto;}
#product .view>.tag>.con .txt table{ border-top:1px solid #ddd; border-left:1px solid #ddd;margin:10px auto; box-sizing:border-box; width:100%;}
#product .view>.tag>.con .txt table td{ color:#666; font-size:14px; background:rgba(255,255,255,.5); padding:12px; text-align:left; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
#product .view>.tag>.con .txt .tableWap{ overflow:hidden; overflow-x:auto;}
#product .view>.tag>.con .pdf>a{ display:inline-block; float:left; width:33%; margin-bottom:10px; padding:12px 50px; box-sizing:border-box;background:url("../images/icon-pdf.png") no-repeat; background-size:40px auto; background-position:left center;}
#product .view>.tag>.con .pdf>a:hover{text-decoration:underline; color:#1c73c5;}
#product .view>.back{ text-align:center;padding:30px 0 90px 0;}
#product .view>.back>a{background:#1c73c5;display:inline-block; border-radius:3px; box-sizing:border-box; padding:15px 100px;text-align: center;color: #fff;font-size: 16px;position: relative; overflow: hidden;border: 1px solid transparent;}
#product .view>.back>a:after {position:absolute;z-index:0;background:#1c73c5;left: 0;top: 0;width: 100%; height: 100%;content: "";}
#product .view>.back>a:before {display: block;position: absolute;left: -148%;top: 0;z-index: 1; width: 124%;height: 100%; content: ""; background:#f4f4f4;transition: .3s ease-in-out; -webkit-transition: .3s ease-in-out;transform: skewX(45deg);-webkit-transform: skewX(45deg);-moz-transform: skewX(45deg); }
#product .view>.back>a span{position: relative;z-index: 2;transition: .3s ease-in-out; }
#product .view>.back>a:hover {border-color:#1c73c5;color: #1c73c5; }
#product .view>.back>a:hover:before {left: -13%;}

#product .related{ width:85%; margin:0 auto; padding-bottom:90px;}
#product .related>.tit{ padding:10px; text-align:center; font-size:20px; font-weight:bold; color:#1c73c5;}
#product .related>.tit>span{display:block; padding:5px 0; font-size:24px; font-weight:normal; color:#ddd; text-transform:uppercase;}
#product .related .swiper-container{padding:10px;}
#product .related .swiper-slide{ background:#fff; padding-bottom:20px; text-align:center; transition:all .35s;}
#product .related .swiper-pagination{ position:relative!important; padding:20px 0;}
#product .related .swiper-container-horizontal>.swiper-pagination-bullets, #product .related .swiper-pagination-custom, #product .related .swiper-pagination-fraction {bottom: 0px!important;}
#product .related .swiper-pagination-bullet-active {background:#007aff!important;}
#product .related .img{padding:50px; padding-bottom:0 !important; text-align:center;}
#product .related .img>img{ width:100%;height:auto;}
#product .related .model{ font-size:14px; color:#333; font-weight:bold;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
#product .related .name{padding:5px 0;font-size:14px; color:#999;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
#product .related .swiper-slide:hover{ box-shadow:0 0 10px rgba(0,0,0,.2);}
#product .related .swiper-slide:hover .model{ color:#1c73c5;}


@media only screen and (max-width: 1480px){
  #product .solution .box>a>.tit{font-size:16px;}
}
@media only screen and (max-width: 1360px){
  #product .list>ul>li{ width:32%;}
  #product .list>ul>li:nth-child(4n){ margin-right:2% !important;}
  #product .list>ul>li:nth-child(3n){ margin-right:0 !important;}
  #product .solution .box>a{ width:25%;padding:30px; }
  #product .solution .box>a:nth-child(9){display:none;}
  #product .view>.tag>.nav>a{padding:0 30px;}
  #product .view>.box .order>.qq{width:60%;}
}
@media only screen and (max-width: 1280px){
  #product .list>ul>li .con>.txt{ font-size:14px;}
  #product .view>.box>.order>.btn{padding:30px 0;}
  #product .view>.box>.order>.btn>a{padding:15px 80px;}
  #product .view>.box>.share{padding:20px 0;}
  #product .view>.tag>.con .pdf>a{ width:50%;}

}
@media only screen and (max-width: 1080px){
  #product .solution .box>a{width:20%;padding:0;}
  #product .view>.box .order>.qq{width:100%;}
  #product .view>.tag>.nav>a{padding:0 20px;}
}
@media only screen and (max-width: 960px){
  #product .solution>.wrap{ width:90%; padding:30px 0;}
  #product .solution .con{ float:none; width:100%; padding:20px;}
  #product .solution .con>.tit{font-size:24px;}
  #product .solution .box{float:none; width:100%;padding:0;}
  #product .solution .box>a{width:10%;}
  #product .solution .box>a:nth-child(9){display:block;}
  #product .view>.focus{ width:100%; float:none;padding:0 60px;}
  #product .view>.box{ width:100%; float:none;padding:2% 6%;}
  #product .view>.box>.model{padding-top:20px;}
  #product .view>.box>.name{ padding:20px 0;}
  #product .view>.box>.order{ width:50%; float:left;}
  #product .view>.box>.share{ width:50%;padding:35px 0; float:left;}
  #product .view>.tag{ width:100%; padding:0 6%; box-sizing:border-box;}
  #product .view>.tag>.nav{display:none;}
  #product .view>.tag>.con{padding:0;}
  #product .view>.tag>.con .hide{display:block;}
  #product .view>.tag>.con .tit{display:block; padding:10px 0; font-size:16px; font-weight:bold; color:#1c73c5; border-bottom:1px solid #ddd;}
  #product .view>.tag>.con .txt, #product .view>.tag>.con .pdf{padding:30px 0;}

}
@media only screen and (max-width: 780px){
  #product .wrap{ width:90%;padding:50px 0;}
  #product .nav>ul>li{padding:10px;}
  #product .nav>ul>li>a{font-size:14px;}
  #product .nav>ul>li>a img{ height:18px;}
  #product .list>ul>li{ width:49%; margin-right:0 !important;}
  #product .list>ul>li:nth-child(4n){ margin-right:0 !important;}
  #product .list>ul>li:nth-child(3n){ margin-right:0 !important;}
  #product .list>ul>li:nth-child(even){ float:right;}
  #product .solution .box>a{width:16%;}
  #product .view>.box>.order{ width:100%; float:none;}
  #product .view>.box>.order>.btn{padding:10px 0;}
  #product .view>.box>.share{ width:100%;padding:10px 0; float:none;}

}
@media only screen and (max-width: 540px){
  #product .wrap{ padding:30px 0;}
  #product .list>ul>li{ width:100%; float:none; margin-bottom:5%;}
  #product .list>ul>li:nth-child(even){ float:none;}
  #product .view>.tag>.con .tit{font-size:14px;}
  #product .view>.tag>.con .txt{font-size:14px; line-height:24px;}
  #product .solution .more>a{padding:12px 36px; line-height:42px;}
  #product .solution .con>.txt{ padding:0;}
  #product .solution .box>a{ width:20%;}
  #product .solution .box>a>.tit{font-size:14px;}
  #product .view>.tag>.con .pdf>a{ display:block; float:none; width:100%; padding:8px 40px; box-sizing:border-box;background:url("../images/icon-pdf.png") no-repeat; background-size:30px auto; background-position:left center;}

}


/*
#product .solution{ margin-top:80px; width:16%; background:#1c73c5; box-shadow:0 2px 10px rgba(0,0,0,.4);}
#product .solution>.tit{ position:relative; padding:20px 30px; text-align:left; font-size:20px; font-weight:bold; color:#fff;}
#product .solution>.tit:after{ position:absolute;z-index:1;left:0;bottom:-16px; width:100%;height:21px; content:''; background:url("../images/solution-title-line.png") no-repeat; background-position:0 0; content:'';}
#product .solution>.list{box-sizing:border-box; text-align:left; padding:20px 0;}
#product .solution>.list>a{ position:relative; display:block; font-size:16px; color:#fff;padding:10px 30px; box-sizing:border-box; transition:all .35s;}
#product .solution>.list>a img{height:40px;width:auto; margin-right:8px; display:inline-block;}
#product .solution>.list>a:after{ display:none; position:absolute;z-index:5;left:0;top:50%; margin-top:-3px; width:6px;height:6px; background:#ddd; border-radius:100%; content:''; transition:all .35s;}
#product .solution>.list>a:hover{ background:rgba(0,0,0,.1); color:#fff;}
#product .solution>.list>a.more{ font-size:30px;padding-left:40px;}
#product .solution>.list>a.more:hover{background:none;}

*/



/* honor TOP*/

#honor{ position:relative; width:100%; margin:0 auto;}
#honor>.wrap{ width:85%; max-width:1480px; margin:0 auto; padding:90px 0; justify-content: flex-end;}
#honor .img{width:36%; text-align:left;}
#honor .img>img{width:100%;height:auto;}
#honor .img>img.mob{display:none;}
#honor .container{width:56%; text-align:left;}
#honor .list, #honor .list>ul{position:relative;margin:0 auto;padding:0; }
#honor .list>ul>li{ position:relative; display:block; float:left;width:50%; box-sizing:border-box;padding:8px 16px; overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
#honor .list>ul>li:after{ position:absolute;z-index:4;left:0;top:50%; margin-top:-3px; width:6px;height:6px; background:#ddd;border-radius:100%; content:''; transition:all .35s;}
#honor .list>ul>li>a{display:block; font-size:16px; color:#666; transition:all .35s;}
#honor .list>ul>li>a:hover{ color:#1c73c5; text-decoration:underline;}
#honor .list>ul>li:hover:after{ background:#1c73c5;}

@media only screen and (max-width: 780px){
  #honor>.wrap{ width:90%; padding:50px 0;}
  #honor .img{width:100%; float:none;}
  #honor .img>img.pc{display:none;}
  #honor .img>img.mob{display:block;}
  #honor .container{width:100%; float:none; padding-top:20px;}

}
@media only screen and (max-width: 540px){
  #honor>.wrap{ padding:30px 0;}
  #honor .container{width:100%; text-align:left;}
  #honor .list>ul>li>a{font-size:14px;}
  #honor .list>ul>li{ float:none;width:100%;}

}

/* END*/








/* END*/





/* animate TOP*/

@keyframes moveAnimation{
  0% {
    opacity: 1;
    transform: translateX(-5px);
  }
  100% {
    opacity: 0;
    transform: translateX(0px);
  }
}
@-webkit-keyframes moveAnimation{
  0% {
    opacity: 1;
    -webkit-transform: translateX(-5px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(0px);
  }
}
@-moz-keyframes moveAnimation{
  0% {
    opacity: 1;
    -moz-transform: translateX(-5px);
  }
  100% {
    opacity: 0;
    -moz-transform: translateX(0px);
  }
}


@-webkit-keyframes spinAround {
  from {
    -webkit-transform:rotate(0deg)
  }
  to {
    -webkit-transform:rotate(360deg)
  }
}
@-moz-keyframes spinAround {
  from {
    -moz-transform:rotate(0deg)
  }
  to {
    -moz-transform:rotate(360deg)
  }
}
@keyframes spinAround {
  from {
    transform:rotate(0deg)
  }
  to {
    transform:rotate(360deg)
  }
}

@-webkit-keyframes downAnimation {
  0%, 30%, 60%, 90% {
    -webkit-transform: translateY(-5px);
  }
  20%, 50%, 80% {
    -webkit-transform: translateY(5px);
  }
}
@-moz-keyframes downAnimation {
  0%, 30%, 60%, 90% {
    -moz-transform: translateY(-5px);
  }
  20%, 50%, 80% {
    -moz-transform: translateY(5px);
  }
}
@keyframes downAnimation {
  0%, 30%, 60%, 90% {
    transform: translateY(-5px);
  }
  20%, 50%, 80% {
    transform: translateY(5px);
  }
}







/* END*/