@charset "utf-8";
html{color:#000;background:#FFF; }
body { color:#666;font:12px/1.231 "Microsoft Yahei";} /*网站字体颜色*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;} 
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit; }
input,button,textarea,select{*font-size:100%;}
input,select{vertical-align:middle;}
i,em{ font-style:normal;}
select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}
table{font-size:inherit;font:100%; border-collapse:collapse;}
pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}
/*title*/
h1 { font-size:32px;}
h2 { font-size:26px;}
h3 { font-size:20px;}
h4 { font-size:14px;}
h5 { font-size:12px;}
h6 { font-size:10px;}

.mt10{ margin-top:10px;}

a { color:#666; text-decoration:none;}  /*for ie f6n.net*/
a:focus{outline:0;} /*for ff f6n.net*/
.vam { vertical-align:middle;}
.clear{ clear:both; height:0; line-height:0; font-size:0;}
.clearfix:after{ content:""; clear:both; height:0; visibility:hidden; display:block;}
.clearfix{*zoom:1}
p{ word-spacing:-1.5px;}
.tr { text-align:right;}
.tl { text-align:left;}
.center { text-align:center;}
.fl { float:left;}
.fr { float:right;}
.pa{ position:absolute;}
.pr{ position:relative}
/* -- 购物车外部框架 -- */
.cart_header , .cart_content , .cart_footer { width:760px; margin:0 auto;}

/* -- 页面整体布局 -- */
.header , .content , .footer { width:1200px; margin:0 auto;  }
.h_nav li a:-webkit-any-link{ display:block;}






/* -- 以上部分以前resetcommon -- */



/* -- 首页样式开始 -- */
.clearfix{*zoom:1}
i,em{ font-style:normal;}

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

.bantest {position: relative;width: 100%;overflow: hidden;}  
.banner{ width:100%; position:relative;}
.banner .slick-dotted.slick-slider{ margin:0;}
.banner img{ display:block; width:100%;}
.banner .slick-arrow {position: absolute;font-size: 0;top: 50%;z-index: 9; width:73px; height: 73px; margin-top: -73px;border: 0; outline: none;overflow:hidden;}
.banner .slick-prev {left: 10%; display: none; background:url(../images/ban_prev.png) no-repeat;}
.banner .slick-next {right: 10%; display: none;background:url(../images/ban_next.png) no-repeat;}   
.slick-dots { position: absolute;left: 50%; font-size:0; bottom: 8%;width: 300px;text-align: center;margin-left: -175px;z-index: 11;}
.slick-dots li {display: inline-block;margin: 0 8px; }
.slick-dots li button {display: block;background:url(../images/ban_dot1.png) no-repeat;width: 17px;height: 17px;border-radius: 17px;border:0; box-shadow:0; -webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
.slick-dots .slick-active button {background:url(../images/ban_dot2.png) no-repeat;border:0;} 

.tit{ font:52px "Microsoft YaHei UI"; text-align:center; color:#000; height:140px; font-weight:bold;}
.tit a{ color:#000;}
.tit em{ display:block; font-size:18px; padding:15px 0 0; margin-top:6px;font-weight:normal; background:url(../images/line.png) no-repeat center top;}

.guide{ height:630px; overflow:hidden; background:url(../images/guide_bg.jpg) no-repeat center top; padding-top:70px;}
.guide dl{ width:1107px; margin:0 auto;}
.guide dt{ width:1107px; height:351px;overflow:hidden; position:relative;}
.guide dt em{ display:block;width:1107px; height:351px; background:rgba(0,0,0,0.4) url(../images/guide_v.png) no-repeat center 110px; position:absolute; top:0;}
.guide dt img{ display:block;width:1107px; height:351px;}
.guide dd h3{ font:48px "Microsoft YaHei UI"; font-weight:bold; color:#000; text-align:center;}
.guide dd h3 em{ display:block; font:18px "Microsoft YaHei UI"; color:#bebfbe; text-transform:uppercase;}
.guide dd p{ width:1100px; padding:20px 0 33px;font:14px "Microsoft YaHei UI"; line-height:30px; color:#585858; text-align:center;}

.pro{padding-top:70px; height:1000px; overflow:hidden; background:url(../images/pro_bg.jpg) no-repeat; padding-bottom:50px;}
.prot{ height:138px; overflow:hidden; position:relative;}
.prot dl{ width:200px; height:54px; background:#00497c; float:left;}
.prot dt{ font:18px "Microsoft YaHei UI"; text-align:center;color:#fff; line-height:54px;}
.prot dt a:before{ content:""; position:absolute; top:19px; right:0; width:1px; height:14px; background:rgba(255,255,255,0.2);}
.prot dt a{ display:block; color:#fff; position:relative;}
.prot dd{ width:1198px; height:58px; background:#fff; display:none; position:absolute; top:54px; left:0; border:1px solid #dcdcdc; border-top:0;}
.prot dd a{ display:block; float:left; font:14px "Microsoft YaHei UI"; line-height:58px; color:#666; padding:0 20px;text-align:left;}
.prot dd a:last-child{ padding-right:0;}
.prot dd a:hover{ font-weight:bold; color:#c51c20;}
.prot dd a:hover:before{ background:#016abc;}
.prot .cur dt{ background:#c51c20;-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;}
.prot .cur dt a:after{ content:""; position:absolute; top:54px; left:50%; margin-left:-15px;width: 0;
height: 0;
border-style: solid;
border-width: 10.0px 15px 0 15px; z-index:5;
border-color: #c51c20 transparent transparent transparent;}
.prot .cur dd{ display:block;}

.pro1 h3{ width:600px; height:600px; float:left; overflow:hidden; position:relative;}
.pro1 h3 img{ display:block;width:600px; height:600px;}
.pro1 h3 em{ display:block; font:24px "Microsoft YaHei UI"; color:#fff; position:absolute; bottom:150px; text-align:center; width:100%;}
.pro1 h3 span a{ display:block; width:128px; height:30px; border:1px solid #fff; font:14px "Microsoft YaHei UI"; text-align:center; line-height:30px; color:#fff; position:absolute; bottom:95px; left:50%; margin-left:-65px;}
.pro1 ul{ width:600px; float:right; overflow:hidden;}
.pro1 li{ width:285px; height:293px; float:left; overflow:hidden; position:relative; margin:0 0 15px 15px; border:1px solid #eee; box-sizing:border-box;}
.pro1 li img{ display:block; width:285px; height:285px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.pro1 li span{ display:block; height:50px; width:225px; background:#e8e8e8; font:14px "Microsoft YaHei UI"; line-height:50px; color:#000; overflow:hidden; padding:0 30px; position:absolute; bottom:0; left:0;}
.pro1 li span em{ display:block; float:right; width:24px; height:24px; border-radius:24px; background:#2e2e2e; font-size:16px; text-align:center; line-height:24px; color:#fff; margin-top:13px;}
.pro1 li:hover span{ color:#c51c20;}
.pro1 li:hover span em{ background:#c51c20;}
.pro1 li:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
	
	
	
	/*产品展示*/
.tab3{width: 1500px; margin-top:20px; margin-bottom:50px;}
.tab3 .tit{text-align: center;}
.tab3 .tit h2 {height: 85px;line-height: 85px;font-size:38px;color: #333; font-weight:bold;}
.tab3 .tit h2 a{color: #333;}
.tab3 .tit p{height: 59px;line-height: 59px;font-size:16px;color: #333333}
.tab3 .tit p a{color: #fff;margin-right: 24px;padding:8px 30px; background:#00497c;}
.tab3 .tit p a:hover{color: #fff;margin-right: 24px; padding:8px 30px; background:#ce1c2c;}
.sec2_ul{width: 1500px; margin: 0 auto;overflow: hidden;}
.sec2_ul ul{width:1500px;}
.sec2_ul li{float: left; width: 280px; border:1px solid #ccc; display: block; margin-right: 25px; text-align: left; overflow: hidden; margin:5px;}
.sec2_ul li a{width: 280px; height: 300px; background: #eee; position: relative;}
.sec2_ul li a img{width: 280px; height:275px; transition: .9s;  line-height: 1em; overflow: hidden;}
.sec2_ul li .p{padding:0 15px;position: relative;width: 280px;overflow:hidden;background-color: #fff;z-index: 666; height:44px; line-height:44px; border-top:0px solid #ccc;}
.sec2_ul li .p a:hover{padding:0 15px;position: relative;width: 203px;overflow:hidden;background-color: #fff;z-index: 666; height:44px; line-height:44px; border-top:1px solid #ccc; color:FF9B09;}
.sec2_ul li img{width: 280px; height: 225px; overflow: hidden;display:block;}
.sec2_ul li a:hover img{transform: scale(1.2);  z-index: 1;}
.sec2_ul li a:hover{background: #0042ae; width: 280px; height: 300px; overflow: hidden;}
.sec2_ul ul .sec2_ul_r{width: 280px; border:1px solid #ccc; display: block;text-align: left; overflow: hidden;}
.p{font-size: 16px;color: #333333; line-height: 34px; height: 32px; margin-top:5px; text-align:center;}
.w1500 { width:1500px; margin:0 auto; font-family:"Microsoft Yahei";}
/*产品展示*/
	
	

.super{ background:url(../images/case_bg.jpg) no-repeat center bottom; height:1095px;}
.super2{ height:836px;}
.super1{ position:relative;}
.supert{ width:1200px; position:absolute; top:470px; left:50%; margin-left:-600px; height:230px;}
.supert h3{ width:292px; float:left; margin-right:10px; height:90px; padding-top:30px; font:24px "Microsoft Yahei"; font-weight:bold; color:#fff; text-align:center; margin-top:110px; background:rgba(0,0,0,0.6);}
.supert h3:last-child{ margin-right:0;}
.supert h3 span i{ display:none;}
.supert h3 span img{ vertical-align:middle; padding-right:8px;}
.supert h3 span em{ display:block; font:12px "Microsoft Yahei"; text-transform:uppercase; margin-top:5px;}
.supert h3 b{ display:none; width:272px; height:110px; margin:26px auto 0;}
.supert h3 b img{display:block; width:272px; height:110px;}
.supert .cur{ background:#c51c20; height:200px; margin-top:0;-webkit-transition:all 0.7s;
	transition:all 0.7s;}
.supert .cur span i{ display:inline-block;}
.supert .cur b{ display:block;}

.super2 dt{ height:700px; background:url(../images/ys1.jpg) no-repeat center top;}
.super2 dl:nth-child(2) dt{height:700px; background:url(../images/ys2.jpg) no-repeat center top;}
.super2 dl:nth-child(3) dt{height:700px; background:url(../images/ys3.jpg) no-repeat center top;}
.super2 dl:nth-child(4) dt{height:700px; background:url(../images/ys4.jpg) no-repeat center top;}
.super2 dd{ width:1200px; margin:35px auto 0; height:93px;}
.super2 dd h3{ width:270px; height:75px; position:relative; font:36px "Microsoft Yahei"; font-weight:bold; color:#212121; float:left;}
.super2 dd h3 span{ display:block; font:24px "Microsoft Yahei";}
.super2 dd h3 em{ color:#c51c20;}
.super2 dd h3:before{ content:""; position:absolute; top:0; right:0; width:1px; height:100%; background:#e5e5e5;}
.super2 dd h3:after{ content:""; position:absolute; top:23px; right:-1px; width:2px; height:30px; background:#00497c;}
.super2 dd p{ width:866px; float:right; font:14px "Microsoft Yahei"; line-height:30px; color:#4c4c4c; background:url(../images/ys_arr.png) no-repeat left 8px; padding-left:15px;}
.super2 dd p:nth-child(2){ margin-top:12px;}
.super2 dl:nth-child(1) p:nth-child(2){margin-top:-10px;}
.super2 dd p b{ color:#c51c20;}
.super h5 a{ display:block; width:340px; height:38px; background:#00497c; margin:0 auto; font:18px "Microsoft Yahei"; font-weight:bold; color:#fff; line-height:34px; text-align:center;}

.case{ background:url(../images/case_bg.gif); height:250px; padding-top:45px; overflow:hidden;}
.caset{ height:55px; background:#fff; margin-bottom:25px;}
.caset h3:before{ content:""; position:absolute; top:22px; right:0; width:1px; height:10px; background:rgba(0,0,0,0.2);}
.caset h3,.caset h5{ width:14.285%; float:left; font:16px "Microsoft YaHei UI"; line-height:55px; text-align:center; position:relative;}
.caset h3 a,.caset h5 a{ display:block; color:#1e1e1e;}
.caset .cur a,.caset li:hover a{ color:#fff; background:#ce1c2c;-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;}
.case1 li{ width:396px; height:297px; float:left; margin-right:6px; position:relative; overflow:hidden;}
.case1 li img{ display:block;width:396px; height:297px;}
.case1 li span{ display:block; height:50px; background:rgba(0,0,0,0.6); width:336px; position:absolute; bottom:0; padding:0 30px; font:16px "Microsoft YaHei UI"; line-height:50px; color:#fff;}
.case1 li span em{ display:block; width:22px; height:22px; border-radius:22px; border:1px solid #fff; text-align:center; line-height:22px; color:#fff; float:right; margin-top:12px;}
.case1 li:last-child{ margin-right:0;}
.case1 li:hover span em{ background:#c51c20; border:1px solid #c51c20;}

.case1 li:before,.pro1 h3:before{content: '';
            cursor: pointer;
            position: absolute;
            left: -100%;
            top: 0;
            width: 100%;
            height: 100%;
            background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            transform: skewx(-25deg);}
.case1 li:hover:before,.pro1 h3:hover:before{
            left: 100%;
            -moz-transition: 1s;
            -o-transition: 1s;
            -webkit-transition: 1s;
            transition: 1s;
        }


.par{ height:440px; background:url(../images/case_bg.gif); overflow:hidden;}
.par .content{ position:relative; width:1400px; }
.par1{ width:1350px; margin:0 auto; overflow:hidden;}
.par li{ width:425px; float:left; margin-right:30px;}
.par li img{ display:block; width:425px; height:285px; border:1px solid #ccc;}
.par li:hover img{ border:1px solid #c51c20;}
.par_l{ position:absolute; top:106px; left:-15px;}
.par_r{ position:absolute; top:106px; right:-15px;}

.guan1{ width:1200px; margin:-80px auto 0; height:160px; background:url(../images/guan1.jpg) no-repeat; z-index:1; margin-bottom:60px;}
.guan1 h3{ width:330px; float:left; padding:42px 0 0 415px; font:16px "Microsoft YaHei UI"; color:#fff; float:left;}
.guan1 h3 em{ display:block; font-weight:bold; font-size:36px; margin-top:6px;}
.guan1 h5{ float:right; padding:42px 147px 0 0; font:18px "Microsoft YaHei UI"; font-weight:bold; color:#fff;}
.guan1 h5 a{ display:block; height:40px; background:#c51c20; line-height:40px; text-align:center; color:#fff; margin-top:6px;}


.news{ height:740px; padding-top:80px; overflow:hidden;}
.newst{ height:40px;}
.newst h3{  float:left; margin-right:50px; font:16px "Microsoft YaHei UI"; height:22px;}
.newst h3 a{ display:block; color:#2e2e2e;}
.newst h3 a:hover,.newst .cur a{ font-weight:bold; color:#c51c20; border-bottom:2px solid #c51c20;}
.news1{ height:480px;}
.news1 .dl1{ width:587px; float:left; overflow:hidden;}
.news1 .dl1 dt{ width:587px; height:294px; overflow:hidden;}
.news1 .dl1 dt img{ display:block;width:587px; height:294px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.news1 .dl1 dd h3 a{ display:block; font:18px "Microsoft YaHei UI"; color:#000; margin:24px 0 8px;}
.news1 .dl1 dd:last-child{ border-top:1px solid #ccc; margin-top:20px;}
.news1 .dl1 dd p{ font:14px "Microsoft YaHei UI"; line-height:30px; color:#666;}
.news1 .dl1 dd a{ color:#c51c20;}
.news1 .dl1:hover dt img,.news1 .dl2:hover dt img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.news1 .dl1 dd:hover h3 a,.news1 .dl2:hover dd h3 a,.news1 li:hover a{ font-weight:bold; color:#c51c20;}
.news1 .dl1 dt:hover,.news1 .dl2 dt:hover{ border:2px solid #c51c20; box-sizing:border-box;}
.news1 .dl2{ width:540px; height:130px; margin-bottom:32px; overflow:hidden; float:right;}
.news1 .dl2 dt{ width:232px; height:130px; float:left; overflow:hidden;}
.news1 .dl2 dt img{ display:block;width:232px; height:130px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.news1 .dl2 dd{ width:285px; float:right; overflow:hidden;}
.news1 .dl2 dd h3 a{ display:block; font:18px "Microsoft YaHei UI"; height:56px; line-height:56px; color:#000; overflow:hidden;}
.news1 .dl2 dd p{ font:14px "Microsoft YaHei UI"; line-height:24px; color:#666;}
.news1 ul{ width:540px; float:right; border-top:1px solid #ccc; padding-top:20px;}
.news1 li{ font:14px "Microsoft YaHei UI"; line-height:36px; height:36px; overflow:hidden;}
.news1 li a{ display:block; color:#666;}
.news1 li em{ float:right; font-family: Arial, Helvetica, sans-serif;}

.about{ position:relative;}
.about .tit{ width:100%; height:190px; position:absolute; top:55px;}
.about .tit span a{ display:block; width:160px; height:40px; margin:10px auto 0; font:18px "Microsoft YaHei UI"; font-weight:bold; color:#fff; background:#c51c20; line-height:40px;}
.about dd{ width:1000px; margin:-170px auto 0; background:#fff; box-shadow:0 0 1rem #ccc; height:200px; z-index:2; position:relative; border-radius:8px; padding:35px 50px 0 50px; font:14px "Microsoft YaHei UI"; text-align:center; line-height:30px; color:#333;}
.about dd a{ color:#c51c20;}

.pic{ height:320px;overflow:hidden;}
.pict{ width:240px; height:212px; padding-top:36px; margin-top:32px; background:#f7f7f7; overflow:hidden; float:left;}
.pict h3{ font:16px "Microsoft YaHei UI"; height:42px; width:175px; margin:0 auto 20px; border:1px solid #c6c6c6; border-radius:5px; text-align:center; line-height:42px;}
.pict h3 a{ display:block; color:#000;}
.pict h3 a:hover,.pict .cur a{ font-weight:bold; color:#fff; background:#c51c20;}
.pict h3:hover,.pict .cur{ border:1px solid #c51c20;}
.pic1{ width:905px; float:right; overflow:hidden; margin-top:32px;}
.pic2{ height:250px; position:relative;}
.pic3{ overflow:hidden;}
.pic1 li{ width:280px; float:left; margin-right:32px; overflow:hidden; position:relative;}
.pic1 li img{ display:block; width:280px; border:1px solid #eee; box-sizing:border-box; border-radius:6px; height:auto;}
.pic1 li em{display:block;font: 16px "Microsoft YaHei UI"; line-height:50px;color: #000; text-align:center; height:50px; overflow:hidden;}
.pic1 li:hover em{ font-weight:bold; color:#c51c20;}

.link{width:1200px; margin: 0 auto; position: relative; z-index:12;}
.link .content{position: absolute; top: -70px;right: 0; width:536px; height:70px;font:14px "Microsoft YaHei";color:rgba(255,255,255,0.5); line-height:70px; text-align:right;}
.link a{ display: inline-block;padding:0 17px; font:14px "Microsoft YaHei"; color:rgba(255,255,255,0.5);line-height:70px; height:70px; position:relative;}
.link a:hover{font-weight:bold; text-decoration:underline; color:#c51c20;}
.link a:last-child{ padding-right:0;}

@media (min-width: 1200px) and (max-width: 1680px) {
}


@keyframes living {
    0%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 6px;
    }
    50%{
        transform: scale(1);
        /* opacity: 0.7; */margin-top:0px;
    }
    100%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 6px;
    }
}
@keyframes living1 {
    0%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 0;
    }
    50%{
        transform: scale(1);
        /* opacity: 0.7; */margin-top: 0;
    }
    100%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 0;
    }
}
@-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);
  }
}