body{ font-family:"Microsoft YaHei";background:#fff;-webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none; 
  user-select:none;
  -webkit-font-smoothing: antialiased;
}
a:hover{text-decoration: none}
.cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } 
.cl { zoom: 1; }
.fl{float:left}
.fr{float:right}
.pnr{position: relative}
.pna{position: absolute}
.mt4{margin: 40px auto}
img{ border:none; vertical-align:top; margin:0 auto;}
.tac{ text-align:center}
.bge{background: #eee;overflow: hidden;padding: 25px 0 35px}
.wp{width: 1200px;margin: 0 auto}
.ban{overflow: hidden;min-width: 1200px}
.bann{overflow: hidden;min-width: 1400px}
.ban .pnr>img{margin-left: -360px;zoom: 1}
.bann .pnr>img{margin-left: -360px;zoom: 1}
.PIE {behavior: url(PIE/PIE.php); position: relative; }
.wangp{width:1200px;text-align: center;top: 30px;left: -3px}
.wangp li{position: relative;display:inline-block;width: 266px;padding: 8px 11px;background: #e4eff5;border: 1px solid #7ecef4;margin: 0 1px;vertical-align: top}
.wangp li p{position: relative;background: #072138;color: #fed30b;font-size: 18px;line-height: 1.6;overflow: hidden}
.wangp li p b{color: #fff;font-size: 24px}
.wangp li span{position: absolute;top: 8px;left:11px ;color: #fff;font-size: 24px;background: #fb2e99;font-weight: bold;line-height: 42px;padding: 0 5px}
.wangp li p a{float: right;background: #fc074f;color: #fff;font-size: 24px;padding: 10px 25px 10px 18px;line-height: 1.2}
.wangp li p:hover a{color: #fff;background: #fb2e99;}
.wangp li p i,.djyh p i{width: 22px;line-height: 22px;display: inline-block;background: #fff;border-radius: 50%;font-stretch: normal;color: #645302;letter-spacing: 8px;}
.wangp li p:after,.djyh a:after{content: ">";position: absolute;top:50%;right: 8px;height: auto;z-index: 2;color: #fff;font-size: 30px;margin-top: -24px;font-family: SimSun; font-weight: bold;}
.wangp li p:hover:after{color: #fff}
.djyh{top: 36px;left: 0}
.djyh li{width: 560px;text-align: center;margin-bottom: 20px}
.djyh em{color: #000;font-size: 35px;display: block;font-style: normal;letter-spacing:3px}
.djyh span{color: #fff;display: inline-block;background: #253356;width: 234px;height: 116px;font-size: 24px;line-height: 1.5;padding-top: 10px;margin:2px auto 12px}
.djyh span.zx{display: inline-block;width: auto;height: auto;padding: 0;background: none;margin-bottom: 0;margin-top: 10px}
.djyh span u{text-decoration: none;font-weight: bold;color: #ffd200}
.djyh p{color: #fed30b;font-size: 18px;line-height: 1.5;padding-top: 5px}
.djyh .hei p{color: #000;}
.djyh li.big{width: 100%;background: #f0eeed;position: relative}
.djyh li.big em{letter-spacing: 0}
.djyh li.big span{width: auto;height: auto;padding: 0 12px;line-height: 2;font-size: 18px}
.djyh li.big .zx{float: right;margin-left: -100px; margin-right: 80px;}
.djyh li.big p{width: 1110px}

.bjt1{  min-width:1920px; height:593px;margin:0px auto; background: url("images/bjt1.png")  no-repeat center top;background-size:100%;}
.ban1 {
    overflow: hidden;
    min-width: 1200px;
    background: #ffd3d9;
}
.ME_box {width: 1200px;margin: 0 auto;display: block;}
.ME_Main {width: 100%;margin: 0 auto;max-width: 1920px;display: table;}
.ME_box1 {margin: 0 auto;display: block;}
.ME_box2 {width: 1216px;margin: 0 auto;display: block;}
.b1{background:#fff;overflow:hidden;padding:60px 0;}
.b2{height:789px;background: url(img/huanjing.jpg) no-repeat center top;position: relative;}
.b3{background:#fff;overflow:hidden;margin:50px auto;}
.b4{height:1089px;background: url(images/bjt3.png) no-repeat center top;position: relative;}
.b5{height:967px;background: url(images/bjt4.png) no-repeat center top;position: relative;}
.b6{height:818px;background: url(images/ys.png) no-repeat center top;position: relative;}
.b8{height:1072px;background: url(img/bjt6.png) no-repeat center top;position: relative;}
.b9{height:964px;background: url(img/bjt7.png) no-repeat center top;position: relative;}

/* indexbanner */
.hm-box {width: 100%;margin: 0 auto;clear: both;}
.indexbanner{height: 650px; overflow: hidden;}
.indexbanner .swiper-container .swiper-slider{width: 100%; height: 650px; overflow: hidden; position: relative; }
.indexbanner .swiper-container a{width: 100%; height: 650px; overflow: hidden; display: block; position: relative;}
.indexbanner .swiper-container a img{opacity: 0; position: absolute; left: 50%; top: 0; transform: translateX(-50%) scale(1.05); -webkit-transform: translateX(-50%) scale(1.05); transition: 1s all; -webkit-transition: 1s all;}
.indexbanner .swiper-slide-active a img{opacity: 1; -webkit-transition:-webkit-transform 4s linear 0s;transition:transform 4s 
linear 0s; transform: translateX(-50%) scale(1); -webkit-transform: translateX(-50%) scale(1);}
.indexbanner .swiper-pagination-bullet{ width: 12px; height: 12px; opacity: 1; background:#cccccc;}
.indexbanner .swiper-pagination-bullet-active{background: #83723c}
.indexbanner .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 5px;}

.indexbanner .pagt{ width: 1200px; height: 44px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); z-index: 9;}
.indexbanner .swiper-button-next,.indexbanner .swiper-button-prev{width: 44px; height: 44px; opacity: 0;}
.indexbanner .swiper-button-prev,.indexbanner .swiper-container-rtl .swiper-button-next{  background: url('img/icon.png') -201px -286px; left: -10%}
.indexbanner .swiper-button-prev:hover,.indexbanner .swiper-container-rtl .swiper-button-next:hover{ background: url('img/icon.png') -201px -338px;}
.indexbanner .swiper-button-next,.indexbanner .swiper-container-rtl .swiper-button-prev{  background: url('img/icon.png') -264px -286px; right: -10%}
.indexbanner .swiper-button-next:hover,.indexbanner .swiper-container-rtl .swiper-button-prev:hover{ background: url('img/icon.png') -264px -338px; }



.taocan {height:582px;background:url(img/taocan.jpg) no-repeat center top;}
.taocan .main {width:1200px;margin:0 auto;padding:0;position:relative;}
.taocan .anniu{width:348px;height:76px;background: url("img/anniu1.png")  no-repeat center top;background-size:100%;position:absolute;left:50%;margin-left:-174px;top:470px;}

.b1 .main{width:1200px;margin:0 auto;padding:0;position:relative;}
.b1 .title{text-align:center;overflow:hidden;padding:0 0 40px 0;}
.b1 .title p.tit{font-size:48px;color:#000000;line-height:70px;}
.b1 .title p.titx{font-size:24px;color:#000000;line-height:30px;}
.b1 .doctor{width:1030px;margin:0 auto;overflow:hidden;}
.b1 .doctor img{width:250px;height:350px;overflow:hidden;float:left;}
.b1 .doctor .docanniu{position:absolute;left:-50px;top:100px;}
.b1 .pro{width:50px;height:100px;background: url("img/shang.jpg")  no-repeat center top;background-size:100%;position:absolute;left:10px;top:280px;cursor: pointer;outline:none;}
.b1 .next{width:50px;height:100px;background: url("img/xia.jpg")  no-repeat center top;background-size:100%;position:absolute;right:10px;top:280px;cursor: pointer;outline:none;}
.b1 .pro:hover{background: url("img/shangon.jpg")  no-repeat center top;}
.b1 .next:hover{background: url("img/xiaon.jpg")  no-repeat center top;}
.b1 .doctor .swiper-pagination-bullet{ width: 12px; height: 12px; opacity: 1; background:#cccccc;}
.b1 .doctor .swiper-pagination-bullet-active{background: #83723c}
.b1 .doctor .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 5px;}
.b1 .doctor .docpostion{margin-top:30px;} 

.b2 .main{width:1200px;margin:0 auto;padding: 0;text-align:center;}
.b2 .jieshao{width:700px;height:330px;background: url("img/tm.png")  no-repeat center top;background-size:100%;float:right;margin-right:40px;margin-top:95px;text-align:center;padding:10px 40px;}
.b2 .jieshao p.name{font-size:30px;color:#fff;line-height:70px;}
.b2 .jieshao p.jie{font-size:16px;color:#fff;line-height:25px;text-align:left;}
.b2 .jieshao ul{overflow:hidden;text-align:center;margin-top:20px;}
.b2 .jieshao ul li{width:260px;height:45px;line-height:45px;display:inline-block;background:#b79960;font-size:24px;color:#fff;margin:8px 19px;cursor: pointer;}
.b2 .jieshao ul li a{color:#fff;}
.b2 .jieshao ul li:hover{background:#fff;color:#000;}
.b2 .jieshao ul li:hover a{color:#000;}

.b3 .main{width:1200px;margin:0 auto;padding:0;position:relative;}
.b3 .title{text-align:center;overflow:hidden;padding:0;}
.b3 .title p.tit{font-size:48px;color:#000000;line-height:70px;}
.b3 .title p.titx{font-size:24px;color:#000000;line-height:30px;}

.b4{height:628px;background: url(img/bjt2.jpg) no-repeat center top;position: relative;margin-top:-1px;}
.b4 .main{width:1225px;margin:0 auto;padding:0;position:relative;}
.b4 .title{text-align:center;overflow:hidden;padding:30px 0;}
.b4 .title p.tit{font-size:48px;color:#000000;line-height:70px;}
.b4 .title p.titx{font-size:24px;color:#000000;line-height:30px;}
.b4 ul{overflow:hidden;text-align:center;}
.b4 ul li{width:240px;height:400px;display:inline-block;position:relative;overflow:hidden;margin:0;padding:0;}
.b4 ul li img.face{width:240px;height:400px;overflow:hidden;}
.b4 ul li .wen{width:140px;height:240px;background: url("img/i.png")  no-repeat center top;background-size:100%;position:absolute;bottom:0;right:0;}
.b4 ul li .wen h3{overflow:hidden;text-align:center;}
.b4 ul li .wen h3 img{width:120px;height:54px;margin-top:90px;margin-bottom:30px;}
.b4 ul li .wen p.j{font-size:16px;line-height:20px;color:#fff;}
.b4 ul li .anse{width:240px;height:400px;background: url("img/an.png")  no-repeat center top;background-size:100%;position:absolute;text-align:center;bottom:-400px;}
.b4 ul li .anse h3{overflow:hidden;}
.b4 ul li .anse h3 img{width:168px;height:24px;display:inline-block;margin-top:200px;margin-bottom:30px;}
.b4 ul li .anse p.p{font-size:16px;line-height:20px;color:#fff;}
.b4 ul li .anse p.anniu{width:150px;height:40px;line-height:40px;border-radius:40px;background:#f4eac1;display:inline-block;font-size:20px;color:#000;margin-top:30px;}
.b4 ul li .anse{webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
.b4 ul li:hover .anse{transform: translateY(-400px);-webkit-transform: translateY(-400px);-moz-transform: translateY(-400px);}
.b4 ul li .wen{webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
.b4 ul li:hover .wen{transform: translateX(240px)}


.qiumeizhe {height:628px;background:url(img/bjt1.jpg) no-repeat center top;}
.qiumeizhe .main {width:1200px;margin:0 auto;padding:0;position:relative;}
.qiumeizhe .anniu{width:250px;height:200px;position:absolute;left:50%;margin-left:-149px;top:212px;display:none;cursor: pointer;}
.qiumeizhe:hover .anniu{display:block;}

.power a{color: #bfbfbf!important;}

.cedaohang{border-radius:5px;overflow: hidden;position:fixed;top:40%;right:50px;background:#fadd8d;padding:10px;}
.cedaohang .tit{text-align:center;font-weight:bold;font-size:20px;color:#fff;}
.cedaohang ul{overflow:hidden}
.cedaohang ul li{background:#fff;width:120px;height:40px;text-align:center;line-height:40px;font-size:16px;margin:10px 0;border-radius:10px;color:red;position:relative;}
.cedaohang ul li a{color:#000;}
.cedaohang ul li:hover {background:#ffeeca;}
.cedaohang ul li:hover a{color:#fa2328;}
.cedaohang ul li span.hot{position: absolute;top:10px;
    width: 9px;
    height: 11px;
    background: url(img/hm.png) no-repeat;
    webkit-animation: shake1 3s linear normal both infinite;
    -o-animation: shake1 3s linear normal both infinite;
    animation: shake1 3s linear normal both infinite;}

.budong{position: fixed;
    top: 0;
    z-index: 9999999;
	background:rgba(12, 12, 12, 0.5);
    -webkit-transform: translateZ(0);
}
.budong li {
    background: url(img/li3.png) no-repeat center top!important;cursor:pointer!important;
}
.budong li a{width: 280px;height: 80px;display: block;cursor:pointer!important;}
.budong li label,.budong li span{color:#000!important;cursor:pointer!important;}
.budong li:hover{background: #7b440b!important}
.budong li:hover  span,.budong li:hover label{color:#fff!important}
.yu1{ position: absolute;bottom:0; left:20%;transform: rotate(298deg); -webkit-transform: rotate(298deg);
  -o-transform: rotate(298deg);}
.yu2{ position: absolute; top:-30px; left:0;
	transform: rotate(426deg) scale(0.7); -webkit-transform: rotate(426deg) scale(0.7);-o-transform: rotate(380deg) scale(0.7);
}
.yu3{ position: absolute; top:500px; left:-120px;
	transform: rotate(315deg) scale(0.7); -webkit-transform: rotate(315deg) scale(0.7);-o-transform: rotate(315deg) scale(0.7);
}
.yu4{ position: absolute; top:600px; right:-120px;
	transform: rotate(222deg) scale(0.6); -webkit-transform: rotate(222deg) scale(0.6);-o-transform: rotate(222deg) scale(0.6);
}
.yu5{ position: absolute;top:-30px;right:20%;transform: rotate(298deg); -webkit-transform: rotate(298deg);
  -o-transform: rotate(298deg);} 
.sharkbox {
    opacity: 0;
    animation: youdong 20s linear infinite;
    -webkit-animation: youdong 20s linear infinite;
}
 .shark {
    width:287px;
    height: 110px;
    background: url(img/yu1.png) no-repeat;
    animation: active1 1s steps(2) infinite;
    -webkit-animation: active1 1s steps(2) infinite;
}
@keyframes active1 {0%{}100%{background-position: left -880px;}}
@keyframes youdong{0%{transform:translateX(-50px);}10%{ opacity:1;}100%{transform:translateX(2000px); opacity:1;}}

@keyframes rotate {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(8px);
  }
  50% {
    transform: translateY(15px) scale(1.05, 0.95);
  }
  75% {
    transform: translateY(8px);
  }
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes rotate {
  0% {
    -webkit-transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(8px);
  }
  50% {
    -webkit-transform: translateY(15px) scale(1.05, 0.95);
  }
  75% {
    -webkit-transform: translateY(8px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}


.tiao {
	animation: tiao 2s infinite;
	-webkit-animation: tiao 2s infinite
}
@keyframes tiao {
	0%,20%,53%,80%,to {
	animation-timing-function:cubic-bezier(.215,.61,.355,1);
	transform:translateZ(0)
}
40%,43% {
	animation-timing-function:cubic-bezier(.755,.05,.855,.06);
	transform:translate3d(0,-3px,0)
}
70% {
	animation-timing-function:cubic-bezier(.755,.05,.855,.06);
	transform:translate3d(0,-7px,0)
}
90% {
	transform:translate3d(0,-2px,0)
}
}
.dong{animation-duration: 10s;animation-iteration-count: infinite;animation-name: verical-slow;animation-timing-function: ease-in-out;}
@keyframes verical-slow {
    2% {
        transform: translate(0, 1.5px) rotate(1.5deg); }
    4% {
        transform: translate(0, -1.5px) rotate(-0.5deg); }
    6% {
        transform: translate(0, 1.5px) rotate(-1.5deg); }
    8% {
        transform: translate(0, -1.5px) rotate(-1.5deg); }
    10% {
        transform: translate(0, 2.5px) rotate(1.5deg); }
    12% {
        transform: translate(0, -0.5px) rotate(1.5deg); }
    14% {
        transform: translate(0, -1.5px) rotate(1.5deg); }
    16% {
        transform: translate(0, -0.5px) rotate(-1.5deg); }
    18% {
        transform: translate(0, 0.5px) rotate(-1.5deg); }
    20% {
        transform: translate(0, -1.5px) rotate(2.5deg); }
    22% {
        transform: translate(0, 0.5px) rotate(-1.5deg); }
    24% {
        transform: translate(0, 1.5px) rotate(1.5deg); }
    26% {
        transform: translate(0, 0.5px) rotate(0.5deg); }
    28% {
        transform: translate(0, 0.5px) rotate(1.5deg); }
    30% {
        transform: translate(0, -0.5px) rotate(2.5deg); }
    32% {
        transform: translate(0, 1.5px) rotate(-0.5deg); }
    34% {
        transform: translate(0, 1.5px) rotate(-0.5deg); }
    36% {
        transform: translate(0, -1.5px) rotate(2.5deg); }
    38% {
        transform: translate(0, 1.5px) rotate(-1.5deg); }
    40% {
        transform: translate(0, -0.5px) rotate(2.5deg); }
    42% {
        transform: translate(0, 2.5px) rotate(-1.5deg); }
    44% {
        transform: translate(0, 1.5px) rotate(0.5deg); }
    46% {
        transform: translate(0, -1.5px) rotate(2.5deg); }
    48% {
        transform: translate(0, -0.5px) rotate(0.5deg); }
    50% {
        transform: translate(0, 0.5px) rotate(0.5deg); }
    52% {
        transform: translate(0, 2.5px) rotate(2.5deg); }
    54% {
        transform: translate(0, -1.5px) rotate(1.5deg); }
    56% {
        transform: translate(0, 2.5px) rotate(2.5deg); }
    58% {
        transform: translate(0, 0.5px) rotate(2.5deg); }
    60% {
        transform: translate(0, 2.5px) rotate(2.5deg); }
    62% {
        transform: translate(0, -0.5px) rotate(2.5deg); }
    64% {
        transform: translate(0, -0.5px) rotate(1.5deg); }
    66% {
        transform: translate(0, 1.5px) rotate(-0.5deg); }
    68% {
        transform: translate(0, -1.5px) rotate(-0.5deg); }
    70% {
        transform: translate(0, 1.5px) rotate(0.5deg); }
    72% {
        transform: translate(0, 2.5px) rotate(1.5deg); }
    74% {
        transform: translate(0, -0.5px) rotate(0.5deg); }
    76% {
        transform: translate(0, -0.5px) rotate(2.5deg); }
    78% {
        transform: translate(0, -0.5px) rotate(1.5deg); }
    80% {
        transform: translate(0, 1.5px) rotate(1.5deg); }
    82% {
        transform: translate(0, -0.5px) rotate(0.5deg); }
    84% {
        transform: translate(0, 1.5px) rotate(2.5deg); }
    86% {
        transform: translate(0, -1.5px) rotate(-1.5deg); }
    88% {
        transform: translate(0, -0.5px) rotate(2.5deg); }
    90% {
        transform: translate(0, 2.5px) rotate(-0.5deg); }
    92% {
        transform: translate(0, 0.5px) rotate(-0.5deg); }
    94% {
        transform: translate(0, 2.5px) rotate(0.5deg); }
    96% {
        transform: translate(0, -0.5px) rotate(1.5deg); }
    98% {
        transform: translate(0, -1.5px) rotate(-0.5deg); }
    0%, 100% {
        transform: translate(0, 0) rotate(0); } 
}
.shan {
    color: #000;
    animation: shan 1.5s linear infinite;
    -webkit-animation: shan 1.5s linear infinite;
    -moz-animation: shan 1.5s linear infinite;
    -ms-animation: shan 1.5s linear infinite;
    -o-animation: shan 1.5s linear infinite;
}
.@keyframes shan{0%{opacity: 1;}100%{opacity: 0;} }@-webkit-keyframes shan {0% { opacity: 1; }100% { opacity: 0; }}@-moz-keyframes shan {0% { opacity: 1; }100% { opacity: 0; }}@-ms-keyframes shan {0% {opacity: 1; } 100% { opacity: 0;}}@-o-keyframes shan {0% { opacity: 1; }100% { opacity: 0; }}.shan{color: #000;animation: shan 1.5s linear infinite;  -webkit-animation: shan 1.5s linear infinite;-moz-animation: shan 1.5s linear infinite;-ms-animation: shan 1.5s linear infinite;-o-animation: shan 1.5s linear infinite;}
.bianda {
  -webkit-animation: bianda 1s linear infinite;
  animation: bianda 1s linear infinite;
}
@keyframes bianda {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.95);
  }
  100% {
    transform: scale(1);
  }
}
@-webkit-keyframes bianda {
  0% {
    -webkit-transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.95);
  }
  100% {
    -webkit-transform: scale(1);
  }
}
.xuandong {
  -webkit-animation: xuandong 2s linear normal both infinite;
  -o-animation: xuandong 2s linear normal both infinite;
  animation: xuandong 2s linear normal both infinite;
}
@keyframes xuandong {
    from {
        -webkit-transform: rotate3d(0, 0, 1, 0);
        transform: rotate3d(0, 0, 1, 0);
    }

    10%, 20% {
        -webkit-transform: rotate3d(0, 0, 1, -3deg);
        transform:  rotate3d(0, 0, 1, -3deg);
    }

    30%, 50%, 70%, 90% {
        -webkit-transform:  rotate3d(0, 0, 1, 3deg);
        transform:  rotate3d(0, 0, 1, 3deg);
    }

    40%, 60%, 80% {
        -webkit-transform:  rotate3d(0, 0, 1, -3deg);
        transform: rotate3d(0, 0, 1, -3deg);
    }

    to {
        -webkit-transform: rotate3d(0, 0, 1, 0);
        transform: rotate3d(0, 0, 1, 0);
    }
}
/*缩放*/
.scale{
  -webkit-animation: scale 2s linear normal both infinite;
  -o-animation: scale 2s linear normal both infinite;
  animation: scale 2s linear normal both infinite;
}
@keyframes scale {
  0%{transform: scale(0.9);-webkit-transform: scale(0.9);}
  50%{transform: scale(1);-webkit-transform: scale(1);}
  100%{transform: scale(0.9);-webkit-transform: scale(0.9);}
}
@-webkit-keyframes scale {
  0%{transform: scale(0.9);-webkit-transform: scale(0.9);}
  50%{transform: scale(1);-webkit-transform: scale(1);}
  100%{transform: scale(0.9);-webkit-transform: scale(0.9);}
}
@-webkit-keyframes txt_1 {
  0% {
    opacity: 0;
    top: 0;
  }
  25% {
    opacity: 0.9;
    top: 80px;
  }
  35% {
    opacity: 1;
    top: 80px;
  }
  90% {
    opacity: 1;
    top: 80px;
  }
  100% {
    opacity: 0;
    top: 0;
  }
}
@keyframes txt_2 {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 0.9;
    top: 512px;
  }
  35% {
    opacity: 1;
    top: 512px;
  }
  50%,
  70% {
    opacity: 1;
    top: 512px;
    transform: scale(1);
  }
  60% {
    opacity: 1;
    top: 512px;
    transform: scale(1.05);
  }
  90% {
    opacity: 1;
    top: 512px;
  }
  100% {
    opacity: 0;
  }
}
.dong{
    -webkit-animation: dong 2s linear normal both infinite;
      -o-animation: dong 2s linear normal both infinite;
      animation: dong 2s linear normal both infinite;
}
@keyframes dong { 
    0% { transform: translate(0px, 0px); } 
    50% { transform: translate(0px, -5px); } 
    100% { transform: translate(0px, 0px); } 
}
@-webkit-keyframes shake1{
0%{
-webkit-transform:translateY(0px);
}
25% {
-webkit-transform:translateY(-2px);
}
50%{
-webkit-transform:translateY(0px);
}
75% {
-webkit-transform:translateY(-2px);
}
100% {
-webkit-transform:translateY(0px);
}
}
@keyframes shake1{
0%{
transform:translateY(0px);
}
25% {
transform:translateY(-2px);
}
50%{
transform:translateY(0px);
}
75% {
transform:translateY(-2px);
}
100% {
transform:translateY(0px);
}
}
@keyframes movement {
    0% {  -webkit-transform: translate(0px,-3px);  transform: translate(0px,-3px);  }
    25% {  -webkit-transform: translate(3px,6px);  transform: translate(3px,6px);  }
    50% {  -webkit-transform: translate(6px,10px);  transform: translate(6px,10px);  }
    75% { -webkit-transform: translate(8px,0px);  transform: translate(8px,0px);  }
    100% {  -webkit-transform: translate(0px,-3px);  transform: translate(0px,-3px);  }
}
@-webkit-keyframes movement {
    0% {  -webkit-transform: translate(0px,-3px);  transform: translate(0px,-3px);  }
    25% {  -webkit-transform: translate(3px,6px);  transform: translate(3px,6px);  }
    50% {  -webkit-transform: translate(6px,10px);  transform: translate(6px,10px);  }
    75% {  -webkit-transform: translate(8px,0px);  transform: translate(8px,0px);  }
    100% {  -webkit-transform: translate(0px,-3px);  transform: translate(0px,-3px);  }
}
*, *::before, *::after {
  box-sizing: border-box;
}

@-webkit-keyframes rotate {
  100% {
    -webkit-transform: rotate(1turn);
            transform: rotate(1turn);
  }
}

@keyframes rotate {
  100% {
    -webkit-transform: rotate(1turn);
            transform: rotate(1turn);
  }
}

.rainbow::before {
  content: '';
    position: absolute;
    z-index: -2;
    left: -50%;
    top: -50%;
    width: 200%;
    height: 200%;
    background-color: #fadd8d;
    background-repeat: no-repeat;
    background-size: 50% 50%, 50% 50%;
    background-position: 0 0, 100% 0, 100% 100%, 0 100%;
    background-image: linear-gradient(#fff, #fff);
    -webkit-animation: rotate 4s linear infinite;
    animation: rotate 4s linear infinite;
}
.rainbow::after {
  content: '';
  position: absolute;
  z-index: -1;
  left: 2px;
  top: 2px;
  right:2px;
  bottom:2px;
  background: #8c4700;
  border-radius: 5px;
}