.overflowS { overflow: scroll; -webkit-overflow-scrolling: touch; } .overflowDot { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .marginC { margin: 0 auto; } @-webkit-keyframes wiggle { 10% { -webkit-transform: rotate(3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(3deg) scale(1.1); } 20% { -webkit-transform: rotate(-3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(-3deg) scale(1.1); } 30% { -webkit-transform: rotate(3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(3deg) scale(1.1); } 40% { -webkit-transform: rotate(-3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(-3deg) scale(1.1); } 50% { -webkit-transform: rotate(3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(3deg) scale(1.1); } 60% { -webkit-transform: rotate(-3deg) scale(1.1); transform: rotate(-3deg) scale(1.1); } 70% { -webkit-transform: rotate(0deg) scale3d(1.1, 1.1, 1.1); transform: rotate(0deg) scale(1); } to { -webkit-transform: rotate(0deg) scale3d(1.1, 1.1, 1.1); transform: rotate(0deg) scale(1); } } @keyframes wiggle { 10% { -webkit-transform: rotate(3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(3deg) scale(1.1); } 20% { -webkit-transform: rotate(-3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(-3deg) scale(1.1); } 30% { -webkit-transform: rotate(3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(3deg) scale(1.1); } 40% { -webkit-transform: rotate(-3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(-3deg) scale(1.1); } 50% { -webkit-transform: rotate(3deg) scale3d(1.1, 1.1, 1.1); transform: rotate(3deg) scale(1.1); } 60% { -webkit-transform: rotate(-3deg) scale(1.1); transform: rotate(-3deg) scale(1.1); } 70% { -webkit-transform: rotate(0deg) scale3d(1.1, 1.1, 1.1); transform: rotate(0deg) scale(1); } to { -webkit-transform: rotate(0deg) scale3d(1.1, 1.1, 1.1); transform: rotate(0deg) scale(1); } } .rule-btn { width: 1.15rem; position: fixed; right: 0.15rem; top: 5.5rem; z-index: 50; animation-name: wiggle; -webkit-animation-name: wiggle; animation-duration: 2s; -webkit-animation-duration: 2s; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; } @keyframes line { 0% { height: 0.2rem; } 50% { height: 0.05rem; } 100% { height: 0.2rem; } } @-webkit-keyframes line { 0% { height: 0.2rem; } 50% { height: 0.05rem; } 100% { height: 0.2rem; } } .lines { display: inline-block; width: 1px; height: 0.2rem; background: #fff; position: absolute; left: 0.12rem; bottom: 0.08rem; animation-name: line; -webkit-animation-name: line; animation-duration: 0.5s; -webkit-animation-duration: 0.5s; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; z-index: 1; border: 0; box-shadow: 0 0.03rem 0.03rem #a3320a; } .lines1 { left: 0.2rem; animation-delay: 0.1s; } .lines2 { left: 0.28rem; animation-delay: 0.2s; } .alert { min-width: 2rem; max-width: 8rem; min-height: 1rem; line-height: 1rem; text-align: center; background: rgba(0, 0, 0, 0.8); color: #fff; position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-size: 0.4rem; padding: 0rem 0.3rem; z-index: 99999; border-radius: 0.1rem; white-space: nowrap; }