body{margin:0;}
ul,li{margin:0;padding:0;}
li{list-style:none;}
a,a:hover{text-decoration: none;}
html, a {-webkit-tap-highlight-color: transparent;}
.cle{clear:both;}
input{line-height:normal;}
.mz-main-form{max-width:100%;}
.mz-main-content-box{padding-top:10px;}
.mz-main-content-title{padding-bottom:7px;margin-bottom: 10px; }
.form-horizontal .form-group{margin:0;width: 100%;}
label{font-weight:normal;}
::before, ::after {
    -webkit-box-sizing:unset;
    -moz-box-sizing:unset;
    box-sizing:unset;
}
.fl{float:left;}

/*****************/

.form-group {margin-top: 5px;vertical-align: middle;position: relative;padding:0 10px;width:100%;/*calc(100% - 20px)*/}
.form-group .input-groups, .form-group .select-group {
    border-bottom: 1px solid #eee;
    padding: 24px 0px 8px;
    position: relative;
    box-sizing: border-box;
    font-size: 14px;
}
.group-mobile-title {
    position: absolute;
    top: 23px;
    text-indent: 0px;
    display: block;
    font-size: 16px;
    left: 0;
    width: auto;
    height: auto;
    color: rgba(16,16,16,0.4);
    cursor: text;
    z-index: 1;
}
.group-mobile-title.ck {
    top: 0;
    transition-duration: 0.3s;
    font-size: 12px;
}
.form-group .input-groups .form-controls, .form-group .select-group .form-controls,.upload-group .form-controls {
    width: 100%;
    border: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 16px;
    color: #575D60;
    height: 19px;
    outline:none;
}
.embed_div {
    font-size: 14px;
    position: absolute;
    right: 10px;
    top: 24px;
}
.embed_div a {color: #198DED;}
.form-group .select-group {padding: 17px 0px;}
.form-group .select-group::before {
    position: absolute;
    content: '';
    top: 24px;
    right: 5px;
    -webkit-transform: translateY(calc(-50% + 3px));
    -ms-transform: translateY(calc(-50% + 3px));
    transform: translateY(calc(-50% + 3px));
    height: 0;
    width: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 6px;
    border-left-color: #575d60;
}
.form-group .select-group::after {
    position: absolute;
    content: '';
    top: 24px;
    right: 5px;
    -webkit-transform: translateY(calc(-50% + 3px));
    -ms-transform: translateY(calc(-50% + 3px));
    transform: translateY(calc(-50% + 3px));
    height: 0;
    width: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 6px;
    border-left-color: #fff;
    margin-right: 2px;
}
.form-group .select-group .down-selector-wrapper {
    height: 20px;
    overflow: hidden;
    text-align: right;
    margin-right: 30px;
}
.select-group .group-mobile-title {
    top: 18px;
    color: #101010;
    font-size: 16px;
    background: #fff;
}
.select-group .group-mobile-title.has-desc{top:6px;}
.group-mobile-desc{
    position: absolute;
    top: 29px;
    font-size: 12px;
    left: 0;
    color: rgba(16,16,16,0.4);
    cursor: text;
    z-index: 1;
}
.down-selector-wrapper .selector-title{
    line-height: 18px;
    max-width: 60%;
    height: 55px;
    position: absolute;
    right: 30px;
    top: 0;
    overflow: hidden;
}

.down-selector-wrapper .selector-title span {
    color: rgba(16,16,16,0.4);
    display: table-cell;
    vertical-align: middle;
    word-break: break-all;
    height: 55px;
}
.form-group .desc-group{margin:20px 0;}
.title-group{height:30px;line-height:30px;background:#F2F2F2;padding:0 10px;color:#666;font-size:12px;width: 100%;}
.form-group.title-group{margin-top:0;}
.upload-group{
    border-bottom: 1px solid #eee;
    padding: 17px 0px;
    position: relative;
    box-sizing: border-box;
    font-size: 14px;
    overflow: hidden;
} 
.upload-group .upload{
    height:20px;overflow: hidden;
    text-align: right;
    margin-right:20px;
}
.upload-group .upload.uploaded .upload-file{
    width: 50px;
    height: 50px;
    position: absolute;
    background: #f2f2f2;
    right: 0px;
    top: 0px;
}
.upload-group .upload.attach.uploaded .upload-file{

    background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAApCAYAAACoYAD2AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHxSURBVFhH7Zcxa8JAGIb7Y+oSJ/0DOrWTk07tpJNObpnaSX+E4OBmQBoQGii4hYBkUygGhEw6mS1CQHB4GzW2l5jUS+6GWk44XHLfPTzv3XfJHW7gd3cDjBCQvFISJv+cyZ3nwNkGw9vx4jvW4Ra3pt0j1w+G9i4gMxsQJjOri0wUJoVJTgb+Z590Vm9QPy+HPCKa+UiOfUZdOZncpjfpmZAVAuh8y1z7V2SYXibGjNdiWlAGQLa7mxaUEZAN8jD7GigHQHbI30A5AVJDupsJcVpNrKP7P2o0FnANk+gKk41LfYqoTrdllH7eFfsV9LYx9c+gSQa3PVSIDlA2FnwhsawTkBJadkJ9z4ad1GbsJvIEZGNJzUjZgiIWcuMh6MM6wLgYjsnempBGAjdV3ICDgUouIqGxpMd0rXrIYk4d+BXpf5SQfkG7HV6oX0J3Q7HQpoNy6DaS0E7aLmwmT5FpmkTszYPZAp7ni4ToXVjzJxQj12Xe/0ijz+BETW/y+PgC3dh7W8Kj2kTrIxjqQ8R6sFWUDiwK+dFHUkL60/ezBNArLx0+4GyfgTC9yfMiDnSjehHl93d3KOICaoae6qCwmyQr7G3o0xfUlEIkXglFpYrXqQ47oz1ymfRxZ0uMaZaAZNJHTBYmhUleBnjVuYk9+QVLEJUbyjDiTgAAAABJRU5ErkJggg==) no-repeat;
    background-size: 20px 20px;
    background-position: 100% 15px;
    width: 85%;
    line-height: 46px;
    padding-right: 20px;
}

.upload-group .upload.attach.uploaded.uploaded1 .upload-file{
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACgSURBVEhLY/g/QIBhgOz9P2ox3UJ+NKj/f3/05X/C0g//vXHghJM/qRIdaEH943/PStyWwhxDDcvRLP7+vxaPb3GFAnbxj/97Hv3BGTo0tBgYcis//z+Dw2raWrz08/+joxZDQ2A0qKmYnUDlwWjiQuStEZ+4iKskiC6ziS8y/xOsFom2dClJlQRVqlqiDBlt+hAVTNRQNBrU1AhFoswAABgVuVo8eOc7AAAAAElFTkSuQmCC) no-repeat;
    background-size: 20px 20px;
    background-position: 100% 15px;
    width: 85%;
    line-height: 46px;
    padding-right: 20px;
}

.upload-group input{position:absolute;left:100%;opacity: 0;}
.upload-group .group-mobile-title {
    top: 18px;
    color: #101010;
    font-size: 16px;
    background: #fff;
}
.upload-group .group-mobile-title.has-desc{top:6px;}
.upload-group .upload:after{
    position:absolute;content:" ";width:30px;height:30px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAD6SURBVEhL7ZY9EoIwEIW5nx0n4CLcgBPQW1A40llQ03kDuhR2zIiA0RmZZ8yIBmSChJ9QJDMUGYpv9+3m7VrQdCxNXBjwYsqvU2pKCjjBGZvt0C+DRx5S9SQZ3+ApQd9BBjmOErQETOEOzlRUJke8cnCdYR3pYhkbsJG620Ts6Ip9lHWYzN/Pqb+5XpCDCAlLEP5W7/DDdmBTgXdFE8KcKaaCQ1AWeMPpJgFf4KfVl3JimYv3+k9awvm43WhwBjeRG77ojDTJYXO4MnixIdFuLoCPRaVBMWgs/oLnXEeEsagNPLKmPc3UVq+xCKjXtL+LpeA5a2rA2vbqJ4vKxuWzWrVaAAAAAElFTkSuQmCC) no-repeat;
    right:5px;top:10px;
}
.upload-group .upload.attach:after{
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACgSURBVEhLY/g/QIBhgOz9P2ox3UJ+NKj/f3/05X/C0g//vXHghJM/qRIdaEH943/PStyWwhxDDcvRLP7+vxaPb3GFAnbxj/97Hv3BGTo0tBgYcis//z+Dw2raWrz08/+joxZDQ2A0qKmYnUDlwWjiQuStEZ+4iKskiC6ziS8y/xOsFom2dClJlQRVqlqiDBlt+hAVTNRQNBrU1AhFoswAABgVuVo8eOc7AAAAAElFTkSuQmCC) no-repeat;
}
.upload-group .upload.uploaded:after{display:none;}

.form-group .option{text-align:center;position:absolute;top:calc(50% - 19px);left:0;width:100%;z-index: 1;opacity:0.5;}
.form-group .option span{
    animation:ttt 0.2s 1 forwards;
    display:none;cursor:pointer;
    width:38px;height:38px;border-radius:38px;margin:0 15px;
    background: url(data:image/png;base64,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) no-repeat;
}
.form-group .option span.ck{display:inline-block;}
@keyframes ttt {
    0%{
        opacity:0;
    }
    99%{
        opacity:0;
    }
    100%{
        opacity:0.8;
    }
}
.form-group:hover .option{opacity:1;transition-duration:0.3s;}
.form-group:hover .option span{display:inline-block;opacity:0.8;}

.form-group .option .del{background-position: -1px -4px;}
.form-group .option .edit{background-position: -68px -4px;}
.form-group .option .moveup{background-position: -134px -4px;}
.form-group .option .movedown{background-position: -200px -4px;}

.submit-btn{position:fixed;z-index:1;bottom:0;width:100%;background:#fff;padding:10px 0;text-align:center;border-top:1px solid #E7E7E7;}
.submit-btn input{-webkit-appearance:none;font-size:14px;border:none;border-radius:50px;width:240px;height:38px;background:#29B6F6;color:#fff;outline:none;}

/******************/

.template-box{height:640px;width:950px;border:1px solid #DDDDDD;margin-bottom:10px;float:left;}
.template-box .preview{height:100%;overflow-y:auto;width:360px;float:left;border-right:1px solid #DDDDDD;}
.template-box .widget{position: relative;}
.template-box .edit-box{height:100%;width:calc(100% - 361px);float:left;}
.template-box .edit-box .tool{height:50px;border-bottom:1px solid #ddd;position:relative;}
.template-box .edit-box .tool ul{padding-left:50px;}
.template-box .edit-box .tool i{background:#ddd;position:absolute;width:21px;height:21px;left:15px;top:15px;border-radius:24px;}
.template-box .edit-box .tool i:before{content:" ";position:absolute;height:15px;width:3px;left:9px;top:3px;background:#fff;border-radius:10px;}
.template-box .edit-box .tool i:after{content:" ";position:absolute;height:3px;width:15px;left:3px;top:9px;background:#fff;border-radius:10px;}
.template-box .edit-box .tool ul li{float:left;font-size:14px;color:#198DED;margin-right:25px;line-height:48px;cursor:pointer;}
.preview .form-title{height:50px;border-bottom:1px solid #ddd;position:relative;line-height:50px;text-align:center;}
.preview .form-title span{font-size:20px;}
.preview .form-title input{border:none;font-size:20px;width:90%;text-align:center;}
.workplace{padding:10px;}
.workplace .type-name{font-size:16px;float: left;}
.workplace .widget-list{float:right;}
.workplace .widget-list select{border:1px solid #ddd;border-radius:4px;padding: 0 10px;}
.workplace ul li{padding:10px 0;}
.workplace ul li .t{margin-bottom: 10px;color:rgba(16,16,16,0.6);font-size:14px;}
.workplace ul li .c input,.workplace ul li .c select{width:368px;height:36px;border:1px solid #ddd;border-radius:4px;padding: 0 10px;}
.workplace ul li .c textarea{margin:10px 0;width:550px;height:300px;border:1px solid #ddd;border-radius:4px;padding:10px;}
.workplace ul li .c select{}
.workplace ul li .save,.workplace ul li .cancel{margin-right:15px;display:inline-block;height:32px;width:100px;color:#fff;border-radius:6px;line-height:32px;text-align:center;}
.workplace ul li .save{background:#198DED;}
.workplace ul li .cancel{background:rgba(0,0,0,0.15);}
.workplace ul li .form-sub,.workplace ul li .form-close{margin-right:50px;display:inline-block;height:32px;width:100px;color:#fff;border-radius:6px;line-height:32px;text-align:center;}
.workplace ul li .form-sub{background:#198DED;margin:0;}
.workplace ul li .form-close{background:#FF9800;}
.template-box .detail-box{float:right;width: calc(100% - 380px);}
.template-box .send-box{float:left;width:750px;margin-right:100px;height: 100%;}
.template-box .send-box .send-form li{float:left;padding: 0;margin-right: 75px;}
.template-box .send-box .send-form li:last-child{margin:0;}
.workplace.send-form ul li .t{float:left;color:#101010;line-height:36px;margin-right: 10px;}
.workplace.send-form ul li .c input{width:190px;}
.template-box .box-title{background:#ddd;color:#101010;line-height:40px;font-size:12px;padding:0 10px;}
.template-box .detail-box .order-box{border:1px solid #ddd;}
.template-box .detail-box .order-box ul li{color:rgba(16,16,16,0.6);font-size:12px;float:left;width:33.33%;}
.template-box .detail-box .order-box ul li .info{padding:5px 10px;margin:10px 0;border-right:1px solid rgba(16,16,16,0.2);}
.template-box .detail-box .deal-log{margin-top:20px;border:1px solid #ddd;}
.template-box .detail-box .deal-log ul{padding:20px;color:rgba(0,0,0,0.6);font-size:12px;overflow-y:auto;min-height: 160px;max-height:375px;}
.deal-log li{margin-bottom:10px;}
.deal-log li .m{float:left;padding:3px 15px;}
.deal-log li .time{background:#f2f2f2;border-radius:14px;}
.deal-log li .name{width:85px;text-align:center;}
.deal-log li .remark .t{float:left;}
.deal-log li .remark .c{float:left;white-space: pre-wrap;word-wrap: break-word;word-break: break-all;}
.deal_form{margin-top:10px;}

.category-box{border:2px solid #ddd;height: calc(100% - 60px);}
#template-list{padding:10px;height: calc(100% - 40px);overflow-y: auto;}
#template-list .list-box .title{font-size:16px;}
#template-list .list-box{padding-bottom:20px;border-bottom:1px solid #ddd;margin-bottom: 10px;}
#template-list .list-box:last-child{border:none;padding:0;margin:0;}
#template-list .list-box li{padding:10px 0;width:25%;float:left;line-height:22px;}
#template-list .list-box li span{
    display:inline-block;width:80%;margin:auto;border:1px solid #198DED;
    border-radius:12px;text-align:center;color:#198DED;
    cursor:pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 5%;
}
#template-list .list-box li span.ck{background:#198DED;color:#fff;}

.workplace label.radios{}
.workplace label.radios{
    font-size:12px;padding-right:20px;
    position: relative;
    padding-left:30px;
    transition-duration: 0.3s;
}
.workplace label.radios:after{
    content:" ";
    position:absolute;
    width: 16px;
    height: 16px;
    border: 2px solid #ddd;
    border-radius: 20px;
    transition-duration: 0.3s;top:-1px;left:0;
}
.workplace label.radios.ck:after{border: 2px solid #198DED;}
.workplace label.radios.ck:before{
    content:" ";
    position:absolute;
    width: 10px;
    height: 10px;
    border-radius: 20px;
    top:4px;left:5px;
    background:#198DED;
}

.workplace label.checkboxs{position: relative;padding-left:30px;}
.workplace label.checkboxs.empty{padding:0;}
.workplace label.checkboxs:after{
    content:" ";
    position:absolute;
    width: 14px;
    height: 14px;
    border: 2px solid #ddd;
    transition-duration: 0.3s;top:-9px;left:5px;
}
.workplace label.checkboxs.ck:after{border: 2px solid #198DED;}
.workplace label.checkboxs.ck:before{
    content:"√";
    color:#fff;
    position:absolute;
    width: 14px;
    height: 14px;
    top:-8px;left:5px;
    border: 2px solid #198DED;
    background:#198DED;
    line-height: 13px;
    text-align: center;
}

/*弹窗*/
.my-popup .bg{background:rgba(0,0,0,0.2);position:fixed;top:0;left:0;right:0;bottom:0;width:100%;z-index: 1;}
.my-popup .main{width:400px;position:fixed;z-index:1;top:20%;background:#fff;border-radius:8px;left: calc(50% - 200px);display: block;}
.my-popup .main .form{padding:16px;}
.my-popup .main .title{color:rgba(16,16,16,0.4);font-size:14px;}

/*选择器样式*/
.ios-select-widget-box header.iosselect-header a{color:#198DED;}
.ios-select-widget-box #iosSelectTitle{color:#000;}
.ios-select-widget-box header.iosselect-header{background:#fcfcfc;}
.ios-select-widget-box ul li{opacity:0.1;}
.ios-select-widget-box ul li.side1{opacity:0.3;}
.ios-select-widget-box ul li.at{font-size:20px;}
.ios-select-widget-box.olay > div{background:#fff;}
.ios-select-widget-box header.iosselect-header.bar_header{height:35px;line-height:35px;font-size:15px;position:absolute;}
.iosselect-header.bar_header .t{float:left;}
/**/

/*我的设备*/
.device_list{position:fixed;z-index:9999;top:0;left:0;width:100%;background:rgba(0,0,0,0.2);}
.device_list .box-title{background:#fff;color:rgba(16,16,16,0.6);line-height:40px;padding:0 10px;border-radius:3px 3px 0 0;}
.device_list .box-title span{float:right;cursor:pointer;}
.device_list .box-content ul li{padding:5px 10px;line-height:20px;}
.device_list .box-content ul li:hover{background:#FAFAFA;cursor:pointer;}
.device_list .box-content .d-img{float:left;width:80px;}
.device_list .box-content .d-img img{height:60px;}
.device_list .box-content .d-con{float:left;margin-left:10px;text-align:left;}
.device_list .box-content .d-name{color:rgba(16,16,16);}
.device_list .box-content .d-sn{font-size:12px;color:rgba(16,16,16,0.4);}
.device_list .box-content .d-ver{font-size:12px;color:rgba(16,16,16,0.4);}
.device_list .box .box-content ul{max-height:350px;overflow-y:scroll;}
.device_list .box{background:#fff;width:90%;position:fixed;top:30%;left:5%;border-radius:5px;}
.device_list .box .box-content{line-height:40px;font-size:14px;text-align:center;}
/**/

/*加载*/
.mask{display:none;width:100%;background:#fff;position:fixed;z-index:99;left:0;top:0;right:0;bottom:0;}
.mask .msg{position:fixed;top:50%;left:50%;margin-top:-12px;margin-left:-100px;width:200px;height:25px;line-height:25px;text-align:center;}
.main{display:none;}

.Toast{position:fixed;z-index:1;bottom:70px;width:100%;text-align:center;}
.Toast .content{background:rgba(51,51,51,0.8);border-radius:4px;padding:3px 10px;color:#fff;}

.tipsToast{display:none;line-height:25px;border-radius:4px;position:absolute;top:53px;left:10px;z-index:2;padding:0 5px;background:rgba(51,51,51,0.8);color:#fff;}
.tipsToast:after{content:" ";position:absolute;left:7px;top:-6px;width:0;height:0;border-right:6px solid transparent;border-bottom:6px solid rgba(51,51,51,0.8);border-left:6px solid transparent;}

.result{display:none;}
.result .success,.result .fail{width:98%;margin:150px auto 0;text-align:center;}
.result .success .icon{width:80px;height:80px;background:#259B24;border-radius:80px;margin:auto;position:relative;}
.result .success .icon:before{content:" ";background:#fff;position:absolute;top:19px;left:40px;width:14px;height:45px;border-radius:5px;-webkit-transform:rotate(45deg);}
.result .success .icon:after{content:" ";background:#fff;position:absolute;top:32px;left:23px;width:14px;height:30px;border-radius:5px;-webkit-transform:rotate(-45deg);}

.result .fail .icon{width:80px;height:80px;background:#FF0000;border-radius:80px;margin:auto;position:relative;}
.result .fail .icon:before{content:" ";background:#fff;position:absolute;top:16px;left:34px;width:14px;height:50px;border-radius:5px;-webkit-transform:rotate(45deg);}
.result .fail .icon:after{content:" ";background:#fff;position:absolute;top:16px;left:34px;width:14px;height:50px;border-radius:5px;-webkit-transform:rotate(-45deg);}

.result .msg{font-size:16px;font-weight:bold;margin:7px auto;}
.result .tips{color:#8C8C8C;font-size:12px;}

/*loading*/
.loading-main{display:none;}
.loading {
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    visibility: hidden;
    position: fixed;
    z-index:99999999;
    background: hsla(0,0%,7%,.7);
    text-align: center;
    border-radius: 5px;
    color: #fff;
    left: 50%;
}
.loading-main .bg{position:fixed;z-index:99999998;top: 0;right: 0;left: 0;bottom: 0;}
.loading.visible {opacity:1;visibility: visible;}
.loading i{margin:30px 0 16px;height:40px;display: block;}
.loading .msg{font-size:16px;}
.loading.load{
    width:120px;
    min-height:120px;
    top:45%;
}
.loading.load i{
    -webkit-animation: e 1s steps(12) infinite;
    animation: e 1s steps(12) infinite;
    background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=) 50% 50% no-repeat;
    background-size:40px 40px;
}
@-webkit-keyframes e{
    0%{
        -webkit-transform:rotate(0deg);
        transform:rotate(0deg)
    }
    to{
        -webkit-transform:rotate(1turn);
        transform:rotate(1turn)
    }
}
@keyframes e{
    0%{
        -webkit-transform:rotate(0deg);
        transform:rotate(0deg)
    }
    to{
        -webkit-transform:rotate(1turn);
        transform:rotate(1turn)
    }
}