.hal { 
    position:fixed;
   right:10px;
   bottom:30px;
   width:90px;
   z-index:9999;}
.halitem {
    position: relative;
   visibility: visible;
   background-color: transparent;
   width: 90px;
   height: 60px;
    cursor: pointer;
    z-index: 9999;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transition: visibility .5s;
    left: 10px;
    bottom: 10px;
    display: block;}
.halbg {
    width: 60px;
    height: 60px;
    top: 25px;
    left: 25px;
    position: absolute;
    box-shadow: 0 0 0 0 #dd3333;
    border-radius: 50%;
    border: 2px solid transparent;
    -webkit-animation: zigzag 2.3s infinite ease-in-out;
    animation: zigzag 2.3s infinite ease-in-out;
    transition: all .5s;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animuiion: zoom 1.3s infinite;
    animation: zoom 1.3s infinite;}
.halimg {
    width: 40px;
    height: 40px;
    line-height: 40px;
    top: 35px;
    left: 35px;
    position: absolute;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    -webkit-animation: zigzag 2s infinite ease-in-out;
    animation: zigzag 2s infinite ease-in-out;}
.halimg a {display:block;}
.halcontent {
    color: #fff;
    padding: 10px 15px;
    border-radius:99px;
    position:absolute;
    z-index:0;
    top:22px;
    transition-duration:2s;
    display:none;
    margin-left:-120px;
    font-size:100%;
    width:180px;
    transition-duration:2s;}
.halitem:hover 
.halcontent {display:block;}
.halmobile {
    position:fixed!important;
    right:0px;
    bottom:0px;
    width:100%;
    z-index:99999!important;}
.mobileicon {
    float:left;
    text-align:center;
    padding: 5px 0;position:relative;
    z-index:99999!important;
    border-right:1px solid #fff;}
.mobileicon img {width: 30px;}
.mobileicon p {
    margin-bottom:0;}
.mobileicon a {color: #fff;}
.mobileicon img {
    justify-content: center;
    -webkit-animation: zigzag 2s infinite ease-in-out;
    animation: zigzag 2s infinite ease-in-out;}
@-webkit-keyframes zigzag {
    0% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
    10% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);}
    20% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);}
    30% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);}
    40% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);}
    50% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
    100% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
    }
@keyframes zigzag {
    0% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
    10% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);}
    20% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);}
    30% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);}
    40% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);}
    50% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
    100% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
    }
@-webkit-keyframes zoom{
    0%{transform:scale(.9)}
    70%{transform:scale(1);
    box-shadow:0 0 0 15px transparent}
    100%{transform:scale(.9);
    box-shadow:0 0 0 0 transparent}
    }
@keyframes zoom{
    0%{transform:scale(.9)}
    70%{transform:scale(1);
    box-shadow:0 0 0 15px transparent}
    100%{transform:scale(.9);
    box-shadow:0 0 0 0 transparent}
    }