@charset "utf-8";
/* CSS Document */
/*common*/
.mb10 { margin-bottom:10px;}
.ml10 { margin-left:10px;}
.bg { background:#FFF;}
em,i{ font-style:normal; }

body{min-width: 1200px; width: 100%;overflow-x: hidden;}

.banner{ height:654px;width:100%; position:relative; z-index:1;}
.banner .bd,.banner .bd li{width:100%; height:654px; overflow:hidden;}
.banner .bd li img{ position:absolute; top:0; left:50%; margin-left:-960px; height:654px;}
.banner .bantil{ width:160px; height:21px;position:absolute; bottom:40px;left:50%; margin-left:-60px; z-index:8;}
.banner .bantil li{ width:21px; height:21px; float:left; display:inline;background:#fff;opacity:1; border-radius:21px; margin:0 12px; box-sizing:border-box;}
.banner .bantil li.on{ background:#0050b3;}

.tit1{ font:46px "Microsoft YaHei"; text-align:center; color:#333;}
.tit1 a{ display:block; color:#333;}
.tit1 i{ color:#0050b3;}
.tit1 em{ display:block; font:20px "Microsoft YaHei"; color:#666; background:url(../images/h.gif) no-repeat center top; margin-top:8px; padding-top:30px; text-transform:uppercase;}

.bg01{ height:656px; overflow:hidden; background:url(../images/yinz_bg.jpg) no-repeat center top;}

.yinz{ height:485px; padding-top:80px; overflow:hidden;}
.yinz dl{ height:305px; overflow:hidden;}
.yinz dt{ width:537px; height:305px; float:left; overflow:hidden;}
.yinz dt img{ display:block;width:537px; height:305px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.yinz dt a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.yinz dd{ width:590px; float:right;overflow:hidden;}
.yinz dd h3{ font:46px "Microsoft YaHei";color:#000000; border-bottom:1px solid #c4c4c4;}
.yinz dd h3 em{ display:block; color:#0050b3; font-weight:normal; margin-bottom:22px;}
.yinz dd p{ font:14px "Microsoft YaHei"; line-height:28px; color:#666; margin:15px 0;}
.yinz dd span{ display:block; float:right;}
.yinz ul{ height:77px; margin-top:54px;}
.yinz li{ width:340px; float:left; position:relative; font:18px "Microsoft YaHei"; text-align:center; color:#555;}
.yinz li span{ display:block; font:36px "Microsoft YaHei"; color:#0050b3; text-transform:uppercase;}
.yinz li:nth-child(1){ width:150px; padding-right:85px;}
.yinz li:last-child{ width:175px; float:right;}
.yinz li:before{ content:""; position:absolute; top:0; right:0; width:1px; height:100%; background:#d2d2d2;}
.yinz li:last-child:before{ background:none;}
.yinz li:hover{ color:#1a7bf9; font-weight:bold;}
.yinz li:hover span{ color:#1a7bf9;}

.baoz{ height:800px; margin-top:80px; overflow:hidden; background:url(../images/baoz_bg.jpg) no-repeat center 264px;}
.baoz dl{ width:282px; height:494px; background:url(../images/baoz_bg1.jpg) no-repeat; margin:40px 24px 0 0; overflow:hidden; float:left;}
.baoz dd{ height:232px; overflow:hidden;}
.baoz dd h3{ font:30px "Microsoft YaHei"; color:#333; padding:40px 0 20px; position:relative; text-align:center;}
.baoz dd h3:before{ content:""; position:absolute; bottom:0; left:50%; width:36px; height:2px; background:#0050b3; margin-left:-18px;}
.baoz dd p{ width:190px; margin:18px auto 0; font:16px "Microsoft YaHei"; color:#666666; line-height:21px; text-align:center;}
.baoz dt span{ display:block; width:149px; height:149px; margin:0 auto 43px; position:relative;}
.baoz dt span em{position:absolute;width:100%;height:100%;top:0;left:0;-webkit-transition: all 0.4s linear;transition: all 0.4s linear;}
.baoz dt span i{position:absolute;width:100%;height:100%;top:0;left:0;opacity:0;visibility:hidden;
	-webkit-transform:translate3d(0,0,-65px) rotate3d(1,0,0,90deg);
	transform:translate3d(0,0,-65px) rotate3d(1,0,0,90deg);
	-webkit-transform-origin:50% 0%;
    transform-origin:50% 0%;
    -webkit-transition:all 0.4s linear;
    transition:all 0.4s linear;}
.baoz dt img{display:block; width:149px; height:149px;}
.baoz dt b{ display:block; width:170px; height:27px; margin:0 auto; border-bottom:1px solid rgba(0,0,0,0.1); text-align:center; font:12px "Microsoft YaHei"; color:#666; text-transform:uppercase;}
.baoz dl:last-child{ margin-right:0;}
.baoz dl:hover span em,.baoz .cur span em{ opacity:0;visibility:hidden;-webkit-transform:translate3d(0,65px,0) rotate3d(1,0,0,-90deg);transform:translate3d(0,65px,0) rotate3d(1,0,0,-90deg);}
.baoz dl:hover span i,.baoz .cur span i{opacity:1;visibility:visible;-webkit-transform:rotate3d(1,0,0,0deg);transform:rotate3d(1,0,0,0deg);}

.pro{ height:1200px;overflow:hidden;}
.pro .content{ position:relative;}
.pro01{ height:615px; margin-top:30px;background:url(../images/line.gif) repeat-x center 61px;}
.prot{ height:60px; overflow:hidden; border:1px solid #dddddd; border-bottom:0;}
.prot li{ width:199px; float:left; height:60px; font:18px "Microsoft YaHei"; line-height:60px; position:relative;}
.prot li:before{ content:""; position:absolute; top:0; right:0; width:1px; height:100%; background:#dddddd;}
.prot li:last-child:before{ background:none;}
.prot li:last-child{ width:203px;}
.prot li a{ display:block; color:#333;}
.prot li span{ position:relative; display:block; width:32px; height:32px; margin:13px 10px 0 40px; float:left; overflow:hidden;}
.prot li span em,.prot li span img{display:block; width:32px; height:32px;}
.prot li span i{display:block; width:32px; height:32px;}
.prot li a:hover,.prot .cur a{ background:#0050b3; font-weight:bold; color:#fff;}
.prot li a:hover em,.prot .cur em{ display:none;}
.prot li a:hover i,.prot .cur i{display:block;}
.pro1{ width:1200px; height:522px;}
.pro1 dl{ height:1186px; height:522px; overflow:hidden; padding-left:14px; position:relative;}
.pro1 dt img{ display:block;width:1186px; height:522px;}
.pro1 dd{ width:350px; position:absolute; top:75px; left:128px;}
.pro1 dd h3{font:54px "Microsoft YaHei"; font-weight:bold; letter-spacing:2px;  padding-bottom:18px; border-bottom:1px solid #dedede; position:relative; margin-bottom:28px;}
.pro1 dd h3 a{ display:block; color:#333;}
.pro1 dd h3 em{ display:block;letter-spacing:0; font:28px "Microsoft YaHei"; }
.pro1 dd h3:before{ content:""; position:absolute; bottom:0; left:0; width:54px; height:2px; background:#0050b3;}
.pro1 dd .prodd{ font:22px "Microsoft YaHei"; line-height:44px; color:#333; }
.pro1 dd .prodd p{padding-left:20px; background:url(../images/pro_arr1.png) no-repeat left center;}
.pro1 dd .prodd em{ font:12px "Microsoft YaHei"; padding-left:12px;}
.pro1 dd span{ display:block; width:148px; height:42px; margin-top:30px; background:url(../images/pro_btn.gif) no-repeat; font:18px "Microsoft YaHei"; line-height:42px;}
.pro1 dd span a{ display:block; color:#fff; text-align:left; padding-left:20px;}

.pro2{ height:395px; position:relative;}
.pro3{ overflow:hidden;}
.pro2 li{ width:275px;  float:left; margin:0 32px 0 0; position:relative;}
.pro2 li span{ display:block;width:275px; height:275px; overflow:hidden;}
.pro2 li img{ display:block; width:100%; height:100%;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.pro2 li em{ display:block; font:16px "Microsoft YaHei"; color:#444; background:url(../images/pro_arr.png) no-repeat right center; margin-top:5px; height:60px; border-bottom:1px solid #e5e5e5; line-height:60px;}
.pro2 li em i{ display:block; font:14px "Microsoft YaHei"; color:#8d8d8d; padding-top:5px;}
.pro2 li a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.pro2 li:hover em,.pro2 li:hover em i{ color:#0050b3;}
.pro2 li:hover{ border-bottom:1px solid #0050b3;}

.arr1{ position:absolute; top:105px; left:-80px;}
.arr2{ position:absolute; top:105px; right:-80px;}

.guan1{ background:url(../images/guan1.jpg) no-repeat center top; height:310px; overflow:hidden;}
.guan1 .content{ position:relative; height:310px;}
.guan1 ul{ height:85px; padding-top:175px;}
.guan1 li{ width:85px; height:65px; padding-top:20px; background:#fff; border-radius:85px; float:left; margin-right:138px; text-align:center; font:19px "Microsoft YaHei"; font-weight:bold; color:#333;}
.guan1 li em{ display:block;}
.guan1 li:last-child{ margin-right:0;}
.guan1 li:hover{ color:#fff; background:#0050b3;-webkit-transition:all 0.7s;
	transition:all 0.7s;transition-property:background;
-moz-transition-property: background; /* Firefox 4 */
-webkit-transition-property:background; /* Safari 和 Chrome */
-o-transition-property:background;}
.guan1 h5{ width:450px; height:75px; position:absolute; top:86px; right:0;}
.guan1 h5 em a{ display:block; width:100px; height:45px; background:#fff url(../images/guan_lx.png) no-repeat 20px center; padding-left:60px; font:18px "Microsoft YaHei"; font-weight:bold; line-height:45px; color:#0050b3; float:left; margin-top:5px;}
.guan1 h5 span{ display:block; width:255px; float:right; font:18px "Microsoft YaHei"; color:#fff;}
.guan1 h5 span i{ display:block; font:32px Arial;}
	
.ys{ margin:75px 0 60px;}
.ys1{ height:1263px; background:url(../images/ys12_bg.jpg) no-repeat center top; margin-top:60px;}
.ys1 .content{ position:relative;}
.ys1 dl{ width:535px;}
.ys1 dd h3{ height:135px; overflow:hidden; background:url(../images/ys_line.png) repeat-x center bottom; margin-bottom:28px;}
.ys1 dd h3 em{ display:block; width:95px; height:95px; float:left; text-align:center; font:40px Arial; color:#fff; line-height:95px; background:url(../images/ys_h.png) no-repeat;}
.ys1 dd h3 span{ display:block; width:425px; float:right; font:32px "Microsoft YaHei"; color:#333;}
.ys1 dd h3 span i{ display:block; font:38px "Microsoft YaHei"; font-weight:bold; color:#0050b3;}
.ys1 dd p{ font:16px "Microsoft YaHei"; line-height:24px; color:#666; background:url(../images/ys_arr.png) no-repeat left 6px; padding-left:24px; margin-top:10px;}
.ys1 dt img{ display:block; margin-top:38px;}
.ys1 .dl01{ position:absolute; top:7px; right:0;}
.ys1 .dl02{ position:absolute; top:597px; left:0;}
.ys3{ height:723px; overflow:hidden; background:url(../images/ys3_bg.jpg) no-repeat center top;}
.ys3 .content{ position:relative; height:723px;}
.ys3 dl{ height:200px; border:10px solid #0050b3; border-top:0; width:1180px; background:#fff; position:absolute; top:470px;}
.ys3 dt{ height:80px; background:#0050b3; font:38px "Microsoft YaHei"; line-height:80px; color:#fff; text-align:center; padding-left:100px; position:relative;}
.ys3 dt em{display:block; width:95px; height:95px; float:left; text-align:center; font:40px Arial; color:#0050b3; line-height:95px; background:url(../images/ys3_h.png) no-repeat; position:absolute; top:-35px; left:222px;}
.ys3 dd{ padding:20px 0 0 33px;}
.ys3 dd p{font:16px "Microsoft YaHei"; line-height:28px; color:#666; background:url(../images/ys_arr.png) no-repeat left 8px; padding-left:24px;}
.ys3 ul{ width:495px; height:100px; position:absolute; top:576px; right:0;}
.ys3 li{ width:156px; float:left; height:50px; position:relative;font:18px "Microsoft YaHei"; color:#222;}
.ys3 li span{ display:block; font:20px "Microsoft YaHei"; color:#0050b3;}
.ys3 li span em{ font-size:32px;}
.ys3 li:nth-child(2):before{ content:""; position:absolute; top:10px; left:-26px; width:1px; height:55px; background:#ccc;}
.ys3 li:nth-child(2):after{ content:""; position:absolute; top:10px; right:30px; width:1px; height:55px; background:#ccc;}
.ys3 li:hover{ font-weight:bold;}

.case{ height:960px;overflow:hidden;}
.case1{ height:339px; position:relative; margin-top:38px;}
.case1 dl{height:339px; overflow:hidden; background:#f4f4f4;}
.case1 dt{ width:599px; height:339px; overflow:hidden;float:left;}
.case1 dt img{ display:block;width:599px; height:339px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.case1 dd{ width:475px; float:right; padding:60px 60px 0 0;}
.case1 dd h3 a{ display:block; font:22px "Microsoft YaHei"; color:#333; height:30px; line-height:30px; overflow:hidden; margin-bottom:17px;}
.case1 dd .prodd{ font:14px "Microsoft YaHei"; line-height:24px; color:#666;}
.case1 dl:hover dt img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.case1 dd span a{ display:block; width:25px; height:25px; overflow:h; background:url(../images/case_btn.png) no-repeat; margin-top:20px;}
.case1 dl:hover dd a{ color:#0050b3;}
.arr3{ position:absolute; top:135px; left:-80px;}
.arr4{ position:absolute; top:135px; right:-80px;}

.case3{ height:368px; border:1px solid #dcdcdc; margin-top:20px;}
.case3 dl{ width:298px; float:left; height:368px; border-right:1px solid #dcdcdc;}
.case3 dt{ width:263px; height:149px; margin:0 auto; padding-top:17px; position:relative;}
.case3 dt img{ display:block;width:263px; height:149px;}
.case3 dt em{ display:block; width:85px; height:85px; position:absolute; top:118px; left:0;}
.case3 dt em img{display:block; width:85px; height:85px; box-shadow:0.01rem 0.01rem 0.4rem 0.01rem #999; border-radius:85px;}
.case3 dd{width:263px; margin:54px auto 0;}
.case3 dd h3 a{ display:block; font:18px "Microsoft YaHei"; line-height:30px; height:30px; overflow:hidden; color:#333;}
.case3 dd p{ font:14px "Microsoft YaHei"; line-height:24px; color:#7e7e7e; margin-top:5px;}
.case3 dl:last-child{ border:0;}
.case3 dl:hover{ border-bottom:4px solid #0050b3; box-sizing:border-box;}
.case3 dl:hover dd h3 a{ color:#0050b3; font-weight:bold;}

.lc{ height:710px; padding-top:67px; overflow:hidden; background:url(../images/lc_bg.jpg) no-repeat center top;}
.lc .tit1 em{ background:url(../images/lc_line.gif) no-repeat center top;}
.lc ul{ height:420px; margin-top:40px; overflow:hidden;}
.lc li{ width:124px; height:196px; float:left; margin-left:62px; display:inline; font:14px "Microsoft YaHei"; font-weight:bold; line-height:40px; color:#333333; overflow:hidden; text-align:center;}
.lc li em{ display:block; width:124px; height:124px; position:relative;}
.lc li em img{display:block; width:124px; height:124px;-webkit-transition: -webkit-transform 0.4s ease-out; 
    -moz-transition: -moz-transform 0.4s ease-out; 
    transition: transform 0.4s ease-out;}
.lc li:hover{ font-weight:bold; color:#0050b3;}
.lc h5{ width:500px; height:40px; margin:0 auto;}
.lc h5 span{ display:block; width:320px; height:40px; background:url(../images/lc_lx.png) no-repeat left center; padding-left:50px; font:14px "Microsoft YaHei"; line-height:40px; color:#22053b; float:left;}
.lc h5 span em{ font:28px Arial; color:#0050b3;}
.lc h5 b a{ display:block; float:right; width:125px; height:40px; background:#0050b3; font:14px "Microsoft YaHei"; text-align:center; line-height:40px; color:#fff; border-radius:2rem;}

/*关于*/
.about{height:890px;background: url(../images/aboutbg.jpg) no-repeat center 0; overflow: hidden;}
.about h2{ padding-top: 72px;height: 154px; text-align: center;font-weight: normal; font-family: "Microsoft YaHei"; line-height: 54px;}
.about h2 a{ font-size: 46px; color: #fff; }
.about h2 p{ font-size: 20px; color: #fff; line-height: 30px; padding-top: 24px; margin-top: 5px;}
.about p{width: 1200px;height: 482px; margin:24px auto 0; overflow:hidden;}
.about p img{ display:block;width: 1200px;height: 482px;}
.about h5{ width:1200px; margin:20px auto 0; font:14px "Microsoft YaHei"; text-align:center; line-height:30px; color:#333;}
.about h5 em{ color:#0050b3;}

.xc{height: 420px; width: 1200px;margin: 0 auto; font-family: "Microsoft YaHei";}
.xcnav{margin-left: 360px; height: 50px; overflow: hidden;}
.xcnav li{width: 160px; float: left; margin-right: 1px; overflow: hidden;}
.xcnav li a{display: inline-block;width: 160px; height: 50px; font-size: 18px; color: #333; background: #e5e5e5; text-align: center;line-height: 50px;}
.xcnav li:nth-child(1) a{ border-radius: 30px 0 0 30px; }
.xcnav li:nth-child(3) a{ border-radius: 0  30px 30px 0; }
.xcnav li.cur a{background: #0050b3; color: #fff;-webkit-transition:all 0.7s;
	transition:all 0.7s;transition-property:background;
-moz-transition-property: background; /* Firefox 4 */
-webkit-transition-property:background; /* Safari 和 Chrome */
-o-transition-property:background;}
.xc_con{position:  relative; margin-top: 30px}
.xcprev{position: absolute;top: 85px; left: -82px; width: 53px; height: 53px;}
.xcnext{position: absolute;top: 85px; right: -82px; width: 53px; height: 53px;}

.xcimg{ overflow:hidden;}
.xcimg li{width: 384px; float: left; overflow: hidden;margin-right: 24px; line-height: 0;}
.xcimg li:last-child{margin-right: 0}
.xcimg li img{ width: 384px; height: 216px;}
.xcimg li span{ display: block;height: 46px; font-size: 16px; color: #666; line-height: 46px; background: #eeeeee; text-align: center;}
.xcimg li a:hover span{ background:#0050b3; color:#fff;-webkit-transition:all 0.7s;
	transition:all 0.7s;transition-property:background;
-moz-transition-property: background; /* Firefox 4 */
-webkit-transition-property:background; /* Safari 和 Chrome */
-o-transition-property:background;}


/*新闻资讯*/
.news{background: url(../images/newsbg.jpg) no-repeat center 0;height: 755px; overflow: hidden; font-family: "Microsoft YaHei";}
.news h2{ padding-top: 72px;height: 148px; text-align: center;font-weight: normal; font-family: "Microsoft YaHei"; line-height: 50px;}
.news h2 a{ font-size: 46px; color: #333333; }
.news h2 span{ color: #0050b3; }
.news h2 p{background: url(../images/newsline.jpg) no-repeat center 0; font-size: 20px; color: #666666; line-height: 30px; padding-top: 20px; margin-top: 5px;}
.newsdt{background: #fff;width: 595px;height: 440px;  float: left; overflow: hidden; padding: 16px 45px 0 50px;}
.news h3{height: 84px; line-height: 84px; overflow: hidden;}
.news h3 a{ font-size: 24px; color: #333333; font-family: "Microsoft YaHei"; font-weight: normal;}
.news h3 span a{ font-size: 14px ; font-family: Arial;text-transform: uppercase;}
.newsdt  dl{height: 170px; overflow: hidden;}
.newsdt dt{width: 246px;height: 140px; float: left; overflow:  hidden;}
.newsdt dt img{width: 246px;height: 140px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.newsdt dd{ float: right;width: 310px; overflow: hidden; }
.newsdt dd h4{line-height: 35px; font-size: 18px; color: #333333;font-weight: normal;}
.newsdt dd h4 img{vertical-align: middle; margin-right: 10px;}
.newsdt dd h4 a{ color: #333333;}
.newsdt dd p{padding-top: 12px; height: 64px ; font-size: 14px; color: #666666; line-height: 24px}
.newsdt dd span a{display:block; width: 107px ;height: 23px;background: #fff; border:1px solid #0050b3;text-align: center; font-size: 14px; line-height: 23px ;font-size:14;}
.newsdt dl:hover dt img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.newsdt dl:hover dd h4 a{ font-weight:bold; color:#0050b3;}
.newsdt li{height: 36px; border-bottom: 1px dashed #cccccc; padding-left: 20px; position: relative; line-height: 36px;}
.newsdt li span{ font-size: 12px; font-family: Arial; color: #999; }
.newsdt li a{ font-size: 14px; color: #666666;}
.newsdt li::before{position: absolute; content: ""; width: 6px; height: 6px; top: 14px; left:0;background: #ccc; border-radius: 20px;}
.newsdt li a:hover{ font-weight:bold; color:#0050b3;}

.faq {width: 415px; height: 440px; float: right; background: #fff; overflow: hidden;padding: 16px 50px 0 35px;}
.faq li{border-bottom: 1px dashed #cccccc;height: 47px; margin-bottom: 20px; line-height:18px;}
.faq li span{display: block; font-size: 12px; line-height: 12px; color: #666;}
.faq li a{ font-size: 14px; }
.faq li a:hover,.faq li a:hover span{ color: #0050b3; font-weight:bold; }


@-webkit-keyframes spin{
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

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

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/*animation*/
@-webkit-keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
@keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}