/**/
body{min-width: 1200px;max-width: 1920px;margin: 0 auto;overflow-x: hidden; width: 100%;}
.content{ width:1200px; margin:0 auto;}

/**/
.about{background:url(../images/d1_yinzbg.jpg) no-repeat center 0;height: 750px;overflow: hidden;padding: 92px 0 0;}
.d1_abt{font-size: 50px;color: #333;height: 66px;line-height: 66px;text-align: center;font-weight: normal;}
.ab_desc{font-size: 16px;color: #333;line-height: 30px;padding: 15px 0 0;width: 1000px;margin: 0 auto;text-align: center;}
.ab_l{margin: 35px 35px 0 100px;width: 158px;height: 435px;background:url(../images/d1_yinzk.png) no-repeat;padding: 19px 0 0;}
.ab_l ul li{width: 122px;height: 100px;margin: 0 auto 26px;border-radius: 50%;background: #fff;text-align: center;font-size: 20px;color: #0d0d0d;line-height: 30px;padding: 22px 0 0;}
.ab_l ul li em{display: block;line-height: 0;width: 50px;height: 50px;overflow: hidden;margin: 0 auto;}
.ab_l ul li em img{width: 50px;height: 100px;-webkit-transition:all .5s;transition:all .5s;}
.ab_l ul li:hover,.ab_l ul li.cur{background: #0055b2;color: #fff;}
.ab_l ul li:hover em img,.ab_l ul li.cur em img{margin-top: -50px;}
.ab_r{padding: 25px 0 0;line-height: 0;}

/*七大黑洞*/
.seven{background:#fff;overflow: hidden;padding: 90px 0 110px;}
.seven_t{font-size: 40px;color: #333;text-align: center;line-height: 45px;font-weight: normal;height: 90px;overflow: hidden;}
.seven_t a{color: #333;}
.seven_t span{display: block;font-size: 22px;color: #666;}
.seven_t a:hover,.seven_t:hover{color: #0055b2;}

.seven_pic{width: 643px;height: 632px;display: block;line-height: 0;padding: 50px 0 0;margin-left: -30px;}
.seven_pic img{width: 643px;height: 632px;}
.seven p{position: absolute;right: 0;}
.seven p b{display: block;float: left;width: 58px;height: 58px;background: #eee;border-radius: 50%;font-size: 32px;color: #0055b2;text-align: center;line-height: 58px;}
.seven p span{display: block;float: left;font-size: 16px;color: #666;line-height: 30px;overflow: hidden;padding: 0 0 0 15px;}
.seven p i{font-weight: bold;font-size: 22px;color: #333;display: block;}
.seven p em{display: block;}
.seven p:hover b{background: #0055b2;color: #fff;}
.seven p:hover i{color: #0055b2;}
.seven p.seven_p01{top: 100px;width: 780px;}
.seven p.seven_p01 span{width: 620px;}
.seven p.seven_p02{top: 180px;width: 700px;}
.seven p.seven_p02 span{width: 530px;}
.seven p.seven_p03{top: 260px;width: 640px;}
.seven p.seven_p03 span{width: 480px;}
.seven p.seven_p04{top: 355px;width: 620px;}
.seven p.seven_p04 span{width: 530px;}
.seven p.seven_p05{top: 450px;width: 620px;}
.seven p.seven_p05 span{width: 530px;}
.seven p.seven_p06{top: 545px;width: 650px;}
.seven p.seven_p06 span{width: 570px;}
.seven p.seven_p07{top: 625px;width: 715px;}
.seven p.seven_p07 span{width: 600px;}
.seven p.seven_p08{top: 700px;width: 810px;}
.seven p.seven_p08 span{width: 700px;}

/**/
.ban01{background:url(../images/d1_ban01.jpg) no-repeat center 0;height: 270px;overflow: hidden;padding: 82px 0 0;}
.ban01_t{font-size: 28px;color: #fff;text-align: center;line-height: 40px;height: 140px;overflow: hidden;}
.ban01_t span{display: block;font-size: 44px;letter-spacing: 5px;line-height: 50px;padding: 20px 0 0;}
.ban01_bot ul{width: 770px;float: left;}
.ban01_bot ul li{font-size: 24px;color: #fff;float: left;background:url(../images/d1_banico.png) no-repeat 0 center;padding-left: 40px;height: 40px;line-height: 40px;overflow: hidden;margin-left: 30px;}
.ban01_bot p{float: left;width: 400px;}
.ban01_bot em{display: block;float: left;width: 125px;padding: 3px 30px 0 0;}
.ban01_bot em a,.ban02_tel em a{display: block;font-size: 18px;color: #0055b2;width: 125px;text-align: center;height: 35px;line-height: 35px;background: #fff;overflow: hidden;border-radius: 5px;}
.ban01_bot em a:hover,.case .case_btn a:hover,.ban02_tel em a:hover{animation:shake 1.5s linear;-webkit-animation:shake 1.5s linear;}
.ban01_bot b,.ban02_tel b{display: block;float: left;font-size: 30px;color: #fff;background:url(../images/d1_bantel.png) no-repeat 0 center;line-height: 40px;padding-left: 50px;}

/*  */
.six{padding: 90px 0 10px;}
.six_l,.six_r{width: 400px;padding: 50px 0 0;}
.six_l{margin-left: -80px;}
.six_r{margin-right: -70px;}
.six dl{width: 400px;height: 230px;}
.six dl dt{width: 400px;height: 90px;background:url(../images/d1_sixline.gif) no-repeat 0 bottom;}
.six dl dt em{display: block;line-height: 0;width: 62px;height: 62px;overflow: hidden;float: left;}
.six dl dt em img{width: 62px;height: 124px;-webkit-transition:all .5s;transition:all .5s;}
.six dl:hover dt em img,.six dl.cur dt em img{margin-top: -62px;}
.six dl dt span{width: 318px;display: block;float: left;font-size: 34px;color: #333;padding: 0 0 0 20px;line-height: 38px;}
.six dl dt i{display: block;font-size: 20px;}
.six dl dd{font-size: 16px;color: #666;line-height: 24px;padding: 10px 0 0;}
.six dl:hover dt span,.six dl.cur dt span{color: #0055b2;}
.six_c{width: 482px;height: 555px;line-height: 0;padding: 80px 0 0 35px;}
.six_c img{width: 482px;height: 555px;}

/**/
.ban02{background:url(../images/d1_ban02.jpg) no-repeat center 0;height: 294px;overflow: hidden;padding: 58px 0 0;}
.ban02_t{font-size: 28px;color: #fff;text-align: center;line-height: 40px;height: 120px;overflow: hidden;font-weight: bold;}
.ban02_t span{display: block;font-size: 48px;letter-spacing: 5px;line-height: 50px;padding: 10px 0 0;font-weight: normal;}
.ban02_m{font-size: 24px;color: #0d0d0d;width: 742px;height: 62px;text-align: center;line-height: 62px;overflow: hidden;border-radius: 10px;background: #fff;margin: 0 auto;}
.ban02_m b{font-size: 30px;color: #0055b2;padding: 0 0 0 20px;}
.ban02_tel{width: 450px;margin: 0 auto;padding: 25px 0 0;}
.ban02_tel em{display: block;float: right;width: 125px;}

/*  */
.five{padding: 90px 0 100px;}
.five_m{width: 1200px;height: 611px;margin-top: 40px;}
.five_con dl{width: 1200px;height: 611px;position: relative;overflow: hidden;}
.five_con dl dt{width: 1200px;height: 611px;line-height: 0;}
.five_con dl dt img{width: 1200px;height: 611px;}
.five_con dl dd{color: #fff;position: absolute;top: 160px;left: 50px;width: 470px;}
.five_con dl dd h3{font-size: 30px;height: 80px;line-height: 80px;position: relative;}
.five_con dl dd h3:before{content: "";width: 62px;height: 2px;background: #fff;position: absolute;bottom: 0;left: 0;}
.five_con dl dd p{font-size: 18px;line-height: 30px;padding: 15px 0 0;}
.five_bot{width: 1200px;height: 160px;position: absolute;bottom: 0;left: 0;background: rgba(0,0,0,0.1);overflow: hidden;}
.five_bot ul li{width: 240px;height: 160px;float: left;position: relative;color: #fff;text-align: center;overflow: hidden;}
.five_bot ul li:before{content: "";width: 1px;height: 100%;background: rgba(255,255,255,0.1);position: absolute;bottom: 0;left: 0;}
.five_bot ul li b{display: block;font-size: 26px;width: 240px;height: 160px;line-height: 160px;font-weight: normal;position: absolute;top: 0;left: 0;-webkit-transition:all .5s;transition:all .5s;}
.five_bot ul li span{display: block;font-size: 14px;line-height: 22px;width: 210px;position: absolute;bottom: -100px;left: 15px;-webkit-transition:all .5s;transition:all .5s;}
.five_bot ul li.on{background: #0055b2;}
.five_bot ul li.on b{height: 40px;line-height: 40px;top: 30px;font-weight: bold;}
.five_bot ul li.on span{bottom: 0;height: 85px;}

/*可视化节能*/
.ke{background:url(../images/d1_kebg.jpg) no-repeat center 0;height: 854px;overflow: hidden;padding: 77px 0 0;}
.ke01{padding: 50px 0 0;height: 220px;}
.ke01 ul li{font-size: 16px;color: #000;height: 40px;line-height: 40px;background: #fff url(../images/d1_keico01.png) no-repeat 30px center;border-radius: 20px;float: left;padding-left: 50px;margin-bottom: 20px;font-weight: bold;}
.ke01 ul li i{color: #0055b2;}
.ke01 ul li:nth-child(1){width: 630px;}
.ke01 ul li:nth-child(2){width: 450px;margin-left: 20px;}
.ke01 ul li:nth-child(3){width: 490px;margin-left: 70px;margin-right: 20px;}
.ke01 ul li:nth-child(4){width: 450px;}
.ke01 ul li:nth-child(5){width: 290px;}
.ke01 ul li:nth-child(6){width: 360px;margin-left: 20px;margin-right: 20px;}
.ke01 ul li:nth-child(7){width: 360px;}
.ke01 ul li:hover,.ke01 ul li.cur{background: #0055b2 url(../images/d1_keico02.png) no-repeat 30px center;color: #fff;}
.ke01 ul li:hover i,.ke01 ul li.cur i{color: #fff;}
.ke02{line-height: 0;}
.ke02 img{width: 1200px;height: 450px;}

/*低成本使用*/
.fuw{padding: 70px 0;position: relative;}
.fuw:before{content: "";width: 4px;height: 520px;position: absolute;top: 200px;right: 0;background:url(../images/d1_fourline.gif) no-repeat;}
.fuw dl{width: 300px;float: left;height: 520px;position: relative;background:url(../images/d1_fourline.gif) no-repeat;overflow: hidden;margin-top: 60px;}
.fuw dl dt{width: 300px;text-align: center;padding: 100px 0 0;}
.fuw dl dt i{display: block;font-size: 26px;color: #333;height: 40px;line-height: 40px;overflow: hidden;}
.fuw dl dt em,.fuw dl dd em{width: 74px;height: 74px;display: block;line-height: 0;overflow: hidden;margin: 65px auto 20px;}
.fuw dl dt em img,.fuw dl dd em img{width: 74px;height: 74px;}
.fuw dl dt p{font-size: 26px;color: #333;line-height: 36px;}
.fuw dl dt span{display: block;font-size: 12px;color: rgba(0,85,178,0.3);text-transform: uppercase;font-family:Arial, Helvetica, sans-serif;}
.fuw dl dd{width: 300px;height: 0;position: absolute;top: 0;left: 0;text-align: center;overflow: hidden;}
.fuw dl dd img{width: 300px;height: 520px;}
.fuw dl dd .fuw_desc{position: absolute;top: 0;left: 0;width: 300px;height: 520px;z-index: 10;}
.fuw dl dd em{margin: 100px auto 20px;}
.fuw dl dd span{display: block;font-size: 26px;color: #fff;font-weight: bold;height: 40px;line-height: 40px;overflow: hidden;}
.fuw dl dd p{font-size: 14px;color: rgba(255,255,255,0.8);line-height: 30px;width: 240px;margin: 0 auto;max-height: 210px;padding: 10px 0 0;}
.fuw dl dd {
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-property: color;
  transition-property: color;
  transition: all 0.3s;
}
.fuw dl dd:before {
  content: "";
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,85,178,0.7);
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.fuw dl:hover dd:before,.fuw dl.cur dd:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}
.fuw dl:hover dd,.fuw dl.cur dd{height: 520px;}

/*成功案例*/
.case{background:url(../images/d1_casebg.jpg) no-repeat center bottom;height: 835px;overflow: hidden;}
.case_l{width: 605px;padding: 97px 0 0;height: 513px;}
.case_l h5{font-size: 28px;color: #0d0d0d;font-weight: normal;line-height: 45px;position: relative;height: 90px;}
.case_l h5:before{content: "";width: 420px;height: 13px;background: rgba(0,85,178,0.2);position: absolute;bottom: 0;left: -10px;}
.case_l h5 span{display: block;font-size: 40px;}
.case_l h5 b{color: #0055b2;}
.case_l ul{padding: 40px 0 0;width: 605px;}
.case_l ul li{font-size: 12px;color: #333;float: left;width: 140px;height: 65px;border-radius: 10px;background: #d6dde3;text-align: center;line-height: 24px;padding: 15px 0 0;margin-left: 12px;}
.case_l ul li b{display: block;font-family: "DINOT";font-size: 20px;color: #0055b2;}
.case_l ul li:first-child{margin-left: 0;}
.case_l p{width: 605px;height: 220px;line-height: 0;padding: 25px 0 0;}
.case_l p img{width: 605px;height: 220px;}

.case_bot{height: 158px;}
.case_bot dl{width: 300px;height: 158px;float: left;position: relative;}
.case_bot dl:before{content: "";width: 1px;height: 104px;background: rgba(255,255,255,0.2);position: absolute;left: 0;top: calc(50% - 52px);}
.case_bot dl dt{font-size: 28px;color: #fff;font-weight: bold;line-height: 30px;text-align: center;}
.case_bot dl dt i{display: block; font-family: "DINOT";font-size: 60px;color: rgba(255,255,255,0.2);height: 60px;line-height: 60px;padding-bottom: 10px;}
.case_bot dl dt em{width: 40px;height: 22px;display: block;line-height: 0;overflow: hidden;margin: 10px auto 0;}
.case_bot dl dt em img{width: 40px;height: 22px;}
.case_bot dl dd{position: absolute;top: 0;left: 0;width: 265px;height: 0;background: #0055b2;color: #fff;-webkit-transition:all .5s;transition:all .5s;overflow: hidden;
padding:0 10px 0 25px;}
.case_bot dl dd h5{font-size: 28px;height: 30px;line-height: 30px;overflow: hidden;padding-top: 25px;margin-bottom: 10px;}
.case_bot dl dd p{font-size: 14px;line-height: 26px;}
.case_bot dl:hover dd,.case_bot dl.cur dd{height: 158px;}

/*  */
.hany_m{ overflow: hidden;padding: 40px 0 50px 0;}
.hany_m h3{ overflow: hidden; height: 62px;background:url(../images/cas_lin.jpg) no-repeat 215px 10px;}
.hany_m h3 span{ display: inline-block; float: right;}
.hany_m h3 a{ display:block;line-height: 100%; font-size: 22px; color: #333333;font-weight: normal; letter-spacing:2px;}
.hany_m ul{ overflow: hidden;}
.hany_m ul li{ float: left; width: 290px; margin: 0 13px 21px 0;}
.hany_m ul li:nth-of-type(4n){margin-right: 0;}
.hany_m ul li b{ display: block; overflow: hidden; height: 218px;}
.hany_m ul li i{ display: block; height: 43px; line-height: 43px; border-bottom: 1px solid #e9e9e9; font-size: 16px; color: #333333;background:url(../images/cas_mor.jpg) no-repeat 
right center;}
.hany_m ul li img{width: 290px;height: 218px;
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.hany_m ul li img:hover
{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}

/*服务流程*/
.liuc{background: #f3f3f3;padding: 60px 0;}
.liuc_t{padding: 20px 0 0;}
.liuc_t ul{background:url(../images/d1_liucline.png) no-repeat 190px 50px;display: block;width: 1200px;height: 212px;}
.liuc_t ul li{width: 200px;height: 168px;padding-top: 30px;float: left;text-align: center;font-size: 18px;color: #333;border-bottom: #e5e5e5 4px solid;position: relative;z-index: 1;}
.liuc_t ul li:before{content: "";width: 182px;height: 0;background: #0055b2;position: absolute;left: 9px;top: 0;z-index: -1;-webkit-transition:all .5s;transition:all .5s;}
.liuc_t ul li em{display: block;width: 50px;height: 50px;line-height: 0;overflow: hidden;margin: 0 auto;}
.liuc_t ul li em img{width: 50px;height: 100px;-webkit-transition:all .5s;transition:all .5s;}
.liuc_t ul li span{display: block;line-height: 28px;padding: 25px 0 0;}
.liuc_t ul li i{display: block;font-size: 14px;color: #666;text-transform: uppercase;}
.liuc_t ul li:hover,.liuc_t ul li:hover i,.liuc_t ul li.on,.liuc_t ul li.on i{color: #fff;}
.liuc_t ul li:hover:before,.liuc_t ul li.on:before{height: 198px;}
.liuc_t ul li:hover em img,.liuc_t ul li.on em img{margin-top: -50px;}
.liuc_t ul li.on:after{content: "";width: 0;height: 0;position: absolute;left: calc(50% - 5px);bottom: -14px;
border-top:10px solid #0055b2; 
border-left:10px solid transparent;
border-right:10px solid transparent;
}
.liuc_m{margin: 20px 0 0;}
.liuc_m p{font-size: 18px;color: #333;line-height: 24px;text-align: center;}

/* 经验保障 */
.baoz{padding-top: 105px; height: 832px;background:url(../images/baoz.jpg) no-repeat center bottom; overflow: hidden;}
.baoz h2{ text-align: center;font-weight: normal; font-size: 48px; color: #333333; line-height: 100%; height: 199px;}
.baoz h2 span{ font-size: 50px;display: inline-block;line-height: 100%;font-size: 50px;}
.baoz ul{margin-left: -39px;white-space: nowrap;text-overflow: ellipsis;}
.baoz ul li{float: left; line-height: 100%; font-size: 16px; color: rgba(255,255,255,0.8); font-size: 16px;height: 345px;}
.baoz ul li  em{ display: block;padding-top: 8px; height: 72px;position: relative;}
.baoz ul li  em span{ display: inline-block; font-size: 32px; color: #fff;font-weight: bold; padding-left: 5px;line-height: 100%;z-index: 5;position: relative;letter-spacing: 2px;}
.baoz ul li  em:before{ position: absolute;left: 0;top: 35px; height:9px; background: #0055b2; width:215px; content: "";}
.baoz ul li i{ display: block;}
.baoz ul li i span{ display: block; padding-bottom: 14px;} 
.baoz ul li:first-child{ width: 492px;}
.baoz ul li:nth-of-type(2){ width: 460px;}
.baoz ul li:nth-of-type(4){ width: 955px;}
.baoz ul li:nth-of-type(3){ margin-right: -230px;}
.baoz ul li:nth-of-type(5){ margin-right: -230px;}
.baoz ul li:hover img{-webkit-animation:hvr-buzz-out 0.75s linear;animation:hvr-buzz-out 0.75s linear;}

/* 客户名录 */
.brands{padding: 110px 0 0;overflow: hidden;margin-bottom: 110px;}
.brands .content{ box-shadow: 0 0 15px rgba(0,0,0,0.07);overflow: hidden;}
.bra_l,.bra_r{ width: 402px;}
.bra_l ul li{ float: left; border-right: 1px solid #f2f2f2;border-bottom: 1px solid #f2f2f2;    height: 114px;}
.bra_r ul li{ float: left; border-left: 1px solid #f2f2f2;border-bottom: 1px solid #f2f2f2;    height: 114px;}
.bra_c{ float: left; width: 402px; height: 576px;position: relative;}
.bra_c ul li{float: left; margin-bottom: 233px;border-bottom: 1px solid #f2f2f2;height: 170px;}
.bra_c ul li:nth-of-type(2n){border-left: 1px solid #f2f2f2;}
.bra_c h3{ position: absolute; left: -3px; top: 171px;background:url(../images/bra25.jpg) no-repeat;background-size: 100%; width: 406px; height: 233px; color: #fff;font-weight: normal;line-height: 100%; text-align: center;}
.bra_r{width: 396px;}
.bra_c h3 em{ display: block; padding-top: 28px; font-size: 24px;line-height: 30px;}
.bra_c h3 em span{ display: block; padding-top: 10px; font-size: 40px; line-height: 100%; letter-spacing: 6px; padding-bottom: 45px;}
.bra_c h3 i{ display: block; font-size: 18px; line-height: 100%;}
.bra_c h3 i span{ display: block; padding-top: 8px;}
.brands ul li{-webkit-transition:transform .3s;transition:transform .3s;}
.brands ul li:hover{-webkit-transform:translate(0,-2px);transform:translate(0,-2px);box-shadow: 0 3px 5px 3px rgba(0,0,0,0.1);}

/**/
@-webkit-keyframes shake{
  from,to{-webkit-transform:translate3d(0, 0, 0);}
  20%,60%{-webkit-transform:translate3d(-10px, 0, 0);}
  40%,80%{-webkit-transform:translate3d(10px, 0, 0);}
}

@keyframes shake {
  from,to{transform:translate3d(0, 0, 0);}
  20%,60%{transform:translate3d(-10px, 0, 0);}
  40%,80%{transform:translate3d(10px, 0, 0);}
}

/*图标抖动*/
@-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);
  }
}