﻿.sm-pop{position:absolute;background:#fff;border:1px solid #cfe2f6;z-index:10000}
    .sm-pop-inner{position:absolute;width:100%}
    .sm-pop-close{position:absolute;top:0;right:0;width:15px;height:15px;line-height:15px;text-align:center;background:url(//img.alicdn.com/tfs/TB1z6LQmf6H8KJjy0FjXXaXepXa-14-14.png);cursor:pointer}
    #sc{margin-left:100px;margin-top:200px}
    .sm-btn-wrapper{position:relative}
    .sm-txt{margin-left:20px;font-size:14px;vertical-align:middle;color:#3c3c3c}
    .sm-btn{line-height:42px;border:1px solid #ddd;cursor:pointer;overflow:hidden}
    #rectMask{top:0;left:0}
    #rectMask,#sm-btn-bg{overflow:hidden;position:absolute}
    #sm-btn-bg{background-image:linear-gradient(0deg,#ededed,#fff);cursor:pointer;z-index:-1;top:1px;left:1px}
    .sm-btn-default .sm-ico:hover{box-shadow:0 0 10px #00de76;background:rgba(0,222,118,.3)}
    .sm-btn-default:hover,.sm-btn-loading:hover,.sm-btn-success:hover{box-shadow:0 0 8px #65f4b5}
    .sm-btn-fail:hover{box-shadow:0 0 8px #f55742}
    .sm-btn-default .sm-ico,.sm-btn-fail .sm-ico,.sm-btn-loading .sm-ico,.sm-btn-success .sm-ico{position:relative;background:none;display:inline-block;margin-top:-3px;margin-left:12px;width:36px;height:36px;border-radius:50%;line-height:36px;text-align:center;vertical-align:middle}
    .sm-btn-default .sm-ico-wave{animation:defaultWave 1.5s ease infinite}
    .sm-btn-default .sm-ico-wave,.sm-btn-fail .sm-ico-wave,.sm-btn-loading .sm-ico-wave,.sm-btn-success .sm-ico-wave{width:26px;height:26px;border-radius:50%;position:relative;z-index:800;left:5px;top:5px}
    .sm-btn-default .sm-ico-wave,.sm-btn-loading .sm-ico-wave,.sm-btn-success .sm-ico-wave{background-image:linear-gradient(0deg,#3a9afa,#00de76)}
    .sm-btn-default .shield,.sm-btn-fail .shield,.sm-btn-loading .shield,.sm-btn-success .shield{width:12px;height:14px;line-height:38px;left:12px;position:absolute;z-index:1000;top:-1px}
    .sm-btn-default .shield{animation:shieldanimation 1.5s infinite}
    .sm-btn-default .out-silder-circle{background:#c3efe8}
    .sm-btn-default .out-silder-circle,.sm-btn-loading .out-silder-circle{position:absolute;width:36px;height:36px;line-height:36px;border-radius:50%;text-align:center;vertical-align:middle;top:0}
    .sm-btn-loading .out-silder-circle{background:linear-gradient(rgba(0,222,118,.8),rgba(0,222,118,.4),rgba(0,222,118,.3),rgba(0,222,118,.2))}
    .sm-btn-default .out-silder-circle{animation:defaultOutsideWave 1.5s ease infinite}
    .sm-btn-loading .out-silder-circle{animation:loadingWave 1s infinite}
    .sm-btn-default .right-tick,.sm-btn-default .wrong-cross,.sm-btn-loading .right-tick,.sm-btn-loading .wrong-cross,.sm-btn-success .wrong-cross{display:none}
    .sm-btn-fail .out-silder-circle,.sm-btn-success .out-silder-circle{position:absolute;width:36px;height:36px;line-height:36px;border-radius:50%;text-align:center;vertical-align:middle;top:0}
    .sm-btn-success .out-silder-circle{animation:successWave 1s infinite;animation-iteration-count:1;background:#c3efe8}
    .sm-btn-success .sm-txt{color:#01bf8f;animation:successTxt 1s;animation-iteration-count:1}
    .sm-btn-fail .rect-top:before,.sm-btn-success .rect-top:before{content:"";display:block;height:200%;position:absolute;top:0;left:0}
    .sm-btn-success .rect-top:before{border-left:1px solid #00de76;animation:successRectLeft .5s;animation-iteration-count:1}
    .sm-btn-fail .rect-top,.sm-btn-success .rect-top{position:absolute;top:0;left:0}
    .sm-btn-success .rect-top{animation:successRectTop 1s;animation-delay:.5s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .rect-top:after,.sm-btn-success .rect-top:after{content:"";display:block;height:100%;position:absolute;top:-1px;right:0}
    .sm-btn-success .rect-top:after{animation:successRectRight .5s;animation-delay:1.5s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .rect-bottom,.sm-btn-success .rect-bottom{position:absolute;left:0}
    .sm-btn-success .rect-bottom{animation:successRectBottom 1s;animation-delay:.5s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .rect-bottom:after,.sm-btn-success .rect-bottom:after{content:"";display:block;height:100%;position:absolute;top:1px;right:0}
    .sm-btn-success .rect-bottom:after{animation:successRectBottomRight .5s;animation-delay:1.5s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-success .right-tick{position:absolute;width:8px;height:6px;display:block;top:18px;left:16px;z-index:2000}
    .sm-btn-success .right-tick .right-tick-left,.sm-btn-success .right-tick .right-tick-right{position:absolute;height:1px;background:#00de76}
    .sm-btn-success .right-tick .right-tick-left{transform:rotate(45deg);transform-origin:left top;top:-1px;left:-1px;animation:rightTickLeft .3s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-success .right-tick .right-tick-right{transform:rotate(315deg);transform-origin:left bottom;top:1px;left:1px;animation:rightTickRight .3s;animation-delay:.29s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .sm-ico-wave{background-image:linear-gradient(0deg,#fc3bab,#f26216)}
    .sm-btn-fail .out-silder-circle{background:rgba(244,88,58,.25);animation:failWave 1s infinite;animation-iteration-count:1}
    .sm-btn-fail .sm-txt{color:#f55742;animation:failTxt 1s;animation-iteration-count:1}
    .sm-btn-fail .rect-top:before{border-left:1px solid #f55742;animation:failRectLeft .5s;animation-iteration-count:1}
    .sm-btn-fail .rect-top{animation:failRectTop 1s;animation-delay:.5s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .rect-top:after{animation:failRectRight .5s;animation-delay:1.5s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .rect-bottom{animation:failRectBottom 1s;animation-delay:.5s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .rect-bottom:after{animation:failRectBottomRight .5s;animation-delay:1.5s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .right-tick{display:none}
    .sm-btn-fail .wrong-cross{position:absolute;width:8px;height:6px;display:block;top:19px;left:16px;z-index:2000}
    .sm-btn-fail .wrong-cross .wrong-cross-left,.sm-btn-fail .wrong-cross .wrong-cross-right{position:absolute;height:1px;background:#f55742}
    .sm-btn-fail .wrong-cross .wrong-cross-left{transform:rotate(135deg);transform-origin:left bottom;top:-6px;left:4px;animation:wrongCrossLeft .3s;animation-iteration-count:1;animation-fill-mode:forwards}
    .sm-btn-fail .wrong-cross .wrong-cross-right{transform:rotate(45deg);transform-origin:left top;top:-5px;left:0;animation:wrongCrossRight .3s;animation-delay:.29s;animation-iteration-count:1;animation-fill-mode:forwards}@keyframes shieldanimation{0%{transform:scale(1)}20%{transform:scale(1.15)}40%{transform:scale(1)}to{transform:scale(1)}}@keyframes defaultWave{0%{transform:scale(1)}20%{transform:scale(1.23)}40%{transform:scale(1)}to{transform:scale(1)}}@keyframes defaultOutsideWave{0%{transform:scale(1)}20%{transform:scale(.8125)}40%{transform:scale(1)}to{transform:scale(1)}}@keyframes loadingWave{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes successWave{0%{background:none}to{background:#c3efe8}}@keyframes successTxt{0%{color:#333}to{color:#01bf8f}}@keyframes successRectTop{0%{width:0;border-top:1px solid #00de76}to{width:100%;border-top:1px solid #00de76}}@keyframes successRectLeft{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes successRectRight{0%{height:0;border-right:1px solid #00de76}to{height:104%;border-right:1px solid #00de76}}@keyframes successRectBottom{0%{width:0;border-bottom:1px solid #00de76}to{width:100%;border-bottom:1px solid #00de76}}@keyframes successRectBottomRight{0%{top:100%;border-right:1px solid #00de76}to{top:0;border-right:1px solid #00de76}}@keyframes failWave{0%{background:none}to{background:rgba(244,88,58,.25)}}@keyframes failTxt{0%{color:#333}to{color:#f55742}}@keyframes failRectTop{0%{width:0;border-top:1px solid #f55742}to{width:100%;border-top:1px solid #f55742}}@keyframes failRectLeft{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes failRectRight{0%{height:0;border-right:1px solid #f55742}to{height:110%;border-right:1px solid #f55742}}@keyframes failRectBottom{0%{width:0;border-bottom:1px solid #f55742}to{width:100%;border-bottom:1px solid #f55742}}@keyframes failRectBottomRight{0%{top:100%;border-right:1px solid #f55742}to{top:1px;border-right:1px solid #f55742}}@keyframes wrongCrossLeft{0%{width:0}to{width:7px}}@keyframes wrongCrossRight{0%{width:0}to{width:7px}}@keyframes rightTickLeft{0%{width:0}to{width:3px}}@keyframes rightTickRight{0%{width:0}to{width:6px}}
