.btn-w3r {
    background: #0094ff; /* Old browsers */
    background: -moz - linear - gradient(top, #cb60b3 0%, #ad1283 50%, #de47ac 100%); /* FF3.6+ */
    background: -webkit - gradient(linear, left top, left bottom, color - stop(0 %,#cb60b3), color - stop(50 %,#ad1283), color - stop(100 %,#de47ac));
    background: -webkit - linear - gradient(top, #cb60b3 0%,#ad1283 50%,#de47ac 100%); /* Chrome10+,Safari5.1+ */
    background: -o - linear - gradient(top, #cb60b3 0%,#ad1283 50%,#de47ac 100%); /* Opera 11.10+ */
    background: -ms - linear - gradient(top, #cb60b3 0%,#ad1283 50%,#de47ac 100%); /* IE10+ */
    background: linear - gradient(to bottom, #cb60b3 0%,#ad1283 50%,#de47ac 100%); /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr = '#cb60b3', endColorstr = '#de47ac', GradientType = 0); /* IE6-9 */
    width: 200px;
    height: 200px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    border: none;
    box-shadow: 5px 14px 25px #3f3fd8;
}
.mybutton{}
button {
    outline:none;
    outline-color: transparent;
}

@-webkit-keyframes hover-zoom{
    50%{
        -webkit-transform:scale(0.8);
        transform:scale(0.8);
        -webkit-filter:brightness(60%)
    }
    100%{
        -webkit-transform:scale(1);
        transform:scale(1);
        /*css3滤镜亮度百分比*/
        -webkit-filter:brightness(100%)
    }
}
.hover-zoom:hover{
    -webkit-animation-name:hover-zoom;
    animation-name:hover-zoom;
    -webkit-animation-duration:.5s;
    animation-duration:.5s;
    -webkit-animation-timing-function:ease-in;
    animation-timing-function:ease-in;
    -webkit-animation-iteration-count:1;
    animation-iteration-count:1
}