html {
    height: 100%;
    font-family: PingFangSC-Light,'helvetica neue','hiragino sans gb',arial,'microsoft yahei ui','microsoft yahei',simsun,sans-serif;
    font-size: 14px;
}

body.signin {
    background: #18c8f6;
    height: auto;
    background: url("../images/login_bg.png") no-repeat center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: rgba(255,255,255,.95);
}

.logopanel h1 {
    font-size: 40px;
}

.signin-info h3 {
    font-size: 24px;
}

.signinpanel {
    width: 100%;
    margin: 10% auto 0 auto;
}

.btn-login {
    border: 1px solid #00a3ff;
    background-color: #00A3FF;
    color: #fff;
    border-radius: 2px;
}

.btn-login:hover {
    color: #fff;
    background-color: #0097ee;
    border: 1px solid #0097ee;
}

.signinpanel .logopanel {
    float: none;
    width: auto;
    padding: 0;
    background: none;
}

.signinpanel .signin-info ul {
    list-style: none;
    padding: 0;
    margin: 20px 0;
    font-size: 20px;
}

.signinpanel .form-control {
    display: block;
    margin-top: 15px;
}

.signinpanel .uname {
    background: #fff url(../images/icons/user.png) no-repeat 5% center;
    padding-left: 50px;
    color: #333;
}

.signinpanel .pword {
    background: #fff url(../images/icons/lock.png) no-repeat 5% center;
    padding-left: 50px;
    color: #333;
}

.signinpanel .vcode {
    background: #fff url(../images/vcode.png) no-repeat 12% center;
    padding-left: 50px;
    color: #333;
}

.signinpanel .btn {
    margin-top: 15px;
}

.signinpanel form {
    /*background: #fff;
    border: 1px solid rgba(255,255,255,.3);*/
    -moz-box-shadow: 0 3px 0 rgba(12, 12, 12, 0.03);
    -webkit-box-shadow: 0 3px 0 rgba(12, 12, 12, 0.03);
    box-shadow: 0 3px 0 rgba(12, 12, 12, 0.03);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 30px;
    color: #666;
}

.signinpanel form > h3 {
    color: #333333;
    font-size: 24px;
    font-family: "microsoft yahei";
    font-weight: 400;
}

.signup-footer {
    display: block;
    height: 48px;
    /*background: url(../images/bottombar.png) repeat-x center;*/
    background-color: rgba(255,255,255, 0.1);
    text-align: center;
    color: rgba(255,255,255,.95);
    line-height: 48px;
    position: fixed;
    bottom: 0;
    width: 100%;
    font-size: 12px;
}



@media screen and (max-width: 768px) {
    .signinpanel,
    .signuppanel {
        margin: 0 auto;
        width: 413px !important;
        padding: 20px;
    }

    .signinpanel form {
        margin-top: 20px;
    }

    .signup-footer {
        margin-bottom: 10px;
    }

    .signuppanel .form-control {
        margin-bottom: 10px;
    }

    .signup-footer .pull-left,
    .signup-footer .pull-right {
        float: none !important;
        text-align: center;
    }

    .signinpanel .signin-info ul {
        display: none;
    }
}

@media screen and (max-width: 320px) {
    .signinpanel,
    .signuppanel {
        margin: 0 20px;
        width: auto;
    }
}


.toolbar-item, .toolbar-layer {
    background: url(../images/toolbar.png) no-repeat;
}

.toolbar {
    position: fixed;
    right: 0px;
    bottom: 50px;
}
/*假设网页宽度为1200px，导航条在右侧悬浮*/
.toolbar-item {
    display: block;
    width: 52px;
    height: 52px;
    margin-top: 1px;
    position: relative;
    -moz-transition: background-position 1s;
    -ms-transition: background-position 1s;
    -o-moz-transition: background-position 1s;
    -webkit-moz-transition: background-position 1s;
    transition: background-position 1s;
}

.toolbar-item:hover .toolbar-layer {
    opacity: 1;
    filter: alpha(opacity=100);
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
}

.toolbar-item-weixin {
    background-position: 0 -798px;
}

.toolbar-item-weixin:hover {
    background-position: 0 -860px;
}

.toolbar-item-weixin .toolbar-layer {
    height: 212px;
    background-position: 0 0;
}

.toolbar-item-feedback {
    background-position: 0 -426px;
}

.toolbar-item-feedback:hover {
    background-position: 0 -488px;
}

.toolbar-item-app {
    background-position: 0 -550px;
}

.toolbar-item-app:hover {
    background-position: 0 -612px;
}

.toolbar-item-app .toolbar-layer {
    height: 194px;
    background-position: 0 -222px;
}

.toolbar-item-top {
    background-position: 0 -674px;
}

.toolbar-item-top:hover {
    background-position: 0 -736px;
}

.toolbar-layer {
    position: absolute;
    right: 46px;
    bottom: -10px;
    width: 172px;
    opacity: 0;
    filter: alpha(opacity=0);
    transform-origin: 95% 95%;
    -moz-transform-origin: 95% 95%;
    -ms-transform-origin: 95% 95%;
    -o-transform-origin: 95% 95%;
    -webkit-transform-origin: 95% 95%;
    transform: scale(0.01);
    -moz-transform: scale(0.01);
    -ms-transform: scale(0.01);
    -o-transform: scale(0.01);
    -webkit-transform: scale(0.01);
    transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    -webkit-transition: all 1s;
}

.AnimationImg {
    height: 580px;
    width: 860px;
    background: url(../images/login/bg.png) no-repeat;
}

.histogram, .Img1, .Img2, .Img3, .Img4, .ImgBox1, .ImgBox2, .ImgCircle, .ImgCircle2, .ImgCircle3, .ImgCircle4, .ImgUp {
    position: absolute
}

.histogram {
    width: 100px;
    height: 80px;
    top: 276px;
    left: 317px
}

.histogram div {
    float: left
}

.orange {
    width: 18px;
    height: 31px;
    margin: 6px 0 0 42px;
    -webkit-animation: DataUp 4s infinite;
    animation: DataUp 4s infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}

@-webkit-keyframes DataUp {
    0% {
        top: 300px;
        left: 342px;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAfCAYAAAGdV60fAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAzVJREFUeNpi+P//P8PvPXIKIJrpZ4BaA/NF1fsMUZL/mRiA4NlSaYbfP3kYwBwQ+PZJggEggBhBakGA8Uehw2s2CRYelu8X/4swPXwAUQdSAxBAYDV/12n9Z/gHFPvLDMRMiiwg879/lmL4+kGeQVp9F0jxfRYGJADSCgYg7SD8xCju/2tbdwEQGyCA4PbCAMvfDZoOQIP3gy0AWsT4xUv/P5eLMIRz9grEPW/W8II5YC0wvSBfESfAxL31AiOQPvj7JzcD/+7DjAABhOKOP3sULjD8Z9Rn+AdU858xkMXj7gZw2PzK1JzBbM6dDpWAYCQ247PPn1n+Pfvz4teq3wy/fwiAsYgTw3fGZ9c5Gb5/glnAy8SABp5t4+f89+UHw7+/bHDMwoAF/PrBgxpe2BTBvAkDTOwbbjUAaUN0RVC8kXfHSUZ4/MDwM9NwPXQxgADCUARMZwLoYvDA/LNX3gAYPueh4fOQxf2eAsx6SGpar/UAKCGPJUAXMkdeSGD8M9HoNSMfswh6SMP4TMcfHGX5vferyJ+/ggzcLpwoUcL45MUPhldvOEAuAYfT/9//Gd6tZ2Ngk+T+wav88zfD/bO8QGEOrIH59T4LBy/TMQ70wMUIcVBcEVT09w+1FFHPOiwmXWDi2HgDlDMuIpuEhAWBuaUAnHx5d54wgKWpf39ZQXii0P69jED8ASW/wzAszyNjgADDyP/IAJh8QKm2AMptYHF+OAGXWtQMvF1FAJgAGhj+M+QDkwHQKQyQhMEApcFKwfRBkDrmwGsH4Ab9WakL0rwAKOnPgKaZEVUzLkMZGF98n8zyZ9mPgv//mfwZpXm+s+qyAx3CyIGuGavrvv18yXjnuTjDtx8gET14vP15+Ifz110WYDRwMDDxcTBw6zG9Y+L4L4SsmfHL5zcMT+6JMPz9CxIRJ1xWvGNgeLeHTejvH3agfnYGSaXdMCkRXIHNwkAA/PsNLE7+MRNSRtggcArEkuDJMujfH7aR7iJQ/hEA4nwyXPQRiBME9h7YgJFpPzg7NAATZf0/YMIEpSNQAuXgeYahWfjg7g04My06eGEeXgA0qIWd++UbkGaRQzsO4FILAEoB09rRjJ1iAAAAAElFTkSuQmCC);
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    30% {
        top: 300px;
        left: 342px;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAfCAYAAAGdV60fAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAzVJREFUeNpi+P//P8PvPXIKIJrpZ4BaA/NF1fsMUZL/mRiA4NlSaYbfP3kYwBwQ+PZJggEggBhBakGA8Uehw2s2CRYelu8X/4swPXwAUQdSAxBAYDV/12n9Z/gHFPvLDMRMiiwg879/lmL4+kGeQVp9F0jxfRYGJADSCgYg7SD8xCju/2tbdwEQGyCA4PbCAMvfDZoOQIP3gy0AWsT4xUv/P5eLMIRz9grEPW/W8II5YC0wvSBfESfAxL31AiOQPvj7JzcD/+7DjAABhOKOP3sULjD8Z9Rn+AdU858xkMXj7gZw2PzK1JzBbM6dDpWAYCQ247PPn1n+Pfvz4teq3wy/fwiAsYgTw3fGZ9c5Gb5/glnAy8SABp5t4+f89+UHw7+/bHDMwoAF/PrBgxpe2BTBvAkDTOwbbjUAaUN0RVC8kXfHSUZ4/MDwM9NwPXQxgADCUARMZwLoYvDA/LNX3gAYPueh4fOQxf2eAsx6SGpar/UAKCGPJUAXMkdeSGD8M9HoNSMfswh6SMP4TMcfHGX5vferyJ+/ggzcLpwoUcL45MUPhldvOEAuAYfT/9//Gd6tZ2Ngk+T+wav88zfD/bO8QGEOrIH59T4LBy/TMQ70wMUIcVBcEVT09w+1FFHPOiwmXWDi2HgDlDMuIpuEhAWBuaUAnHx5d54wgKWpf39ZQXii0P69jED8ASW/wzAszyNjgADDyP/IAJh8QKm2AMptYHF+OAGXWtQMvF1FAJgAGhj+M+QDkwHQKQyQhMEApcFKwfRBkDrmwGsH4Ab9WakL0rwAKOnPgKaZEVUzLkMZGF98n8zyZ9mPgv//mfwZpXm+s+qyAx3CyIGuGavrvv18yXjnuTjDtx8gET14vP15+Ifz110WYDRwMDDxcTBw6zG9Y+L4L4SsmfHL5zcMT+6JMPz9CxIRJ1xWvGNgeLeHTejvH3agfnYGSaXdMCkRXIHNwkAA/PsNLE7+MRNSRtggcArEkuDJMujfH7aR7iJQ/hEA4nwyXPQRiBME9h7YgJFpPzg7NAATZf0/YMIEpSNQAuXgeYahWfjg7g04My06eGEeXgA0qIWd++UbkGaRQzsO4FILAEoB09rRjJ1iAAAAAElFTkSuQmCC);
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    to {
        top: 300px;
        left: 342px;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAfCAYAAAGdV60fAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAzVJREFUeNpi+P//P8PvPXIKIJrpZ4BaA/NF1fsMUZL/mRiA4NlSaYbfP3kYwBwQ+PZJggEggBhBakGA8Uehw2s2CRYelu8X/4swPXwAUQdSAxBAYDV/12n9Z/gHFPvLDMRMiiwg879/lmL4+kGeQVp9F0jxfRYGJADSCgYg7SD8xCju/2tbdwEQGyCA4PbCAMvfDZoOQIP3gy0AWsT4xUv/P5eLMIRz9grEPW/W8II5YC0wvSBfESfAxL31AiOQPvj7JzcD/+7DjAABhOKOP3sULjD8Z9Rn+AdU858xkMXj7gZw2PzK1JzBbM6dDpWAYCQ247PPn1n+Pfvz4teq3wy/fwiAsYgTw3fGZ9c5Gb5/glnAy8SABp5t4+f89+UHw7+/bHDMwoAF/PrBgxpe2BTBvAkDTOwbbjUAaUN0RVC8kXfHSUZ4/MDwM9NwPXQxgADCUARMZwLoYvDA/LNX3gAYPueh4fOQxf2eAsx6SGpar/UAKCGPJUAXMkdeSGD8M9HoNSMfswh6SMP4TMcfHGX5vferyJ+/ggzcLpwoUcL45MUPhldvOEAuAYfT/9//Gd6tZ2Ngk+T+wav88zfD/bO8QGEOrIH59T4LBy/TMQ70wMUIcVBcEVT09w+1FFHPOiwmXWDi2HgDlDMuIpuEhAWBuaUAnHx5d54wgKWpf39ZQXii0P69jED8ASW/wzAszyNjgADDyP/IAJh8QKm2AMptYHF+OAGXWtQMvF1FAJgAGhj+M+QDkwHQKQyQhMEApcFKwfRBkDrmwGsH4Ab9WakL0rwAKOnPgKaZEVUzLkMZGF98n8zyZ9mPgv//mfwZpXm+s+qyAx3CyIGuGavrvv18yXjnuTjDtx8gET14vP15+Ifz110WYDRwMDDxcTBw6zG9Y+L4L4SsmfHL5zcMT+6JMPz9CxIRJ1xWvGNgeLeHTejvH3agfnYGSaXdMCkRXIHNwkAA/PsNLE7+MRNSRtggcArEkuDJMujfH7aR7iJQ/hEA4nwyXPQRiBME9h7YgJFpPzg7NAATZf0/YMIEpSNQAuXgeYahWfjg7g04My06eGEeXgA0qIWd++UbkGaRQzsO4FILAEoB09rRjJ1iAAAAAElFTkSuQmCC);
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }
}

@keyframes DataUp {
    0% {
        top: 300px;
        left: 342px;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAfCAYAAAGdV60fAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAzVJREFUeNpi+P//P8PvPXIKIJrpZ4BaA/NF1fsMUZL/mRiA4NlSaYbfP3kYwBwQ+PZJggEggBhBakGA8Uehw2s2CRYelu8X/4swPXwAUQdSAxBAYDV/12n9Z/gHFPvLDMRMiiwg879/lmL4+kGeQVp9F0jxfRYGJADSCgYg7SD8xCju/2tbdwEQGyCA4PbCAMvfDZoOQIP3gy0AWsT4xUv/P5eLMIRz9grEPW/W8II5YC0wvSBfESfAxL31AiOQPvj7JzcD/+7DjAABhOKOP3sULjD8Z9Rn+AdU858xkMXj7gZw2PzK1JzBbM6dDpWAYCQ247PPn1n+Pfvz4teq3wy/fwiAsYgTw3fGZ9c5Gb5/glnAy8SABp5t4+f89+UHw7+/bHDMwoAF/PrBgxpe2BTBvAkDTOwbbjUAaUN0RVC8kXfHSUZ4/MDwM9NwPXQxgADCUARMZwLoYvDA/LNX3gAYPueh4fOQxf2eAsx6SGpar/UAKCGPJUAXMkdeSGD8M9HoNSMfswh6SMP4TMcfHGX5vferyJ+/ggzcLpwoUcL45MUPhldvOEAuAYfT/9//Gd6tZ2Ngk+T+wav88zfD/bO8QGEOrIH59T4LBy/TMQ70wMUIcVBcEVT09w+1FFHPOiwmXWDi2HgDlDMuIpuEhAWBuaUAnHx5d54wgKWpf39ZQXii0P69jED8ASW/wzAszyNjgADDyP/IAJh8QKm2AMptYHF+OAGXWtQMvF1FAJgAGhj+M+QDkwHQKQyQhMEApcFKwfRBkDrmwGsH4Ab9WakL0rwAKOnPgKaZEVUzLkMZGF98n8zyZ9mPgv//mfwZpXm+s+qyAx3CyIGuGavrvv18yXjnuTjDtx8gET14vP15+Ifz110WYDRwMDDxcTBw6zG9Y+L4L4SsmfHL5zcMT+6JMPz9CxIRJ1xWvGNgeLeHTejvH3agfnYGSaXdMCkRXIHNwkAA/PsNLE7+MRNSRtggcArEkuDJMujfH7aR7iJQ/hEA4nwyXPQRiBME9h7YgJFpPzg7NAATZf0/YMIEpSNQAuXgeYahWfjg7g04My06eGEeXgA0qIWd++UbkGaRQzsO4FILAEoB09rRjJ1iAAAAAElFTkSuQmCC);
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    30% {
        top: 300px;
        left: 342px;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAfCAYAAAGdV60fAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAzVJREFUeNpi+P//P8PvPXIKIJrpZ4BaA/NF1fsMUZL/mRiA4NlSaYbfP3kYwBwQ+PZJggEggBhBakGA8Uehw2s2CRYelu8X/4swPXwAUQdSAxBAYDV/12n9Z/gHFPvLDMRMiiwg879/lmL4+kGeQVp9F0jxfRYGJADSCgYg7SD8xCju/2tbdwEQGyCA4PbCAMvfDZoOQIP3gy0AWsT4xUv/P5eLMIRz9grEPW/W8II5YC0wvSBfESfAxL31AiOQPvj7JzcD/+7DjAABhOKOP3sULjD8Z9Rn+AdU858xkMXj7gZw2PzK1JzBbM6dDpWAYCQ247PPn1n+Pfvz4teq3wy/fwiAsYgTw3fGZ9c5Gb5/glnAy8SABp5t4+f89+UHw7+/bHDMwoAF/PrBgxpe2BTBvAkDTOwbbjUAaUN0RVC8kXfHSUZ4/MDwM9NwPXQxgADCUARMZwLoYvDA/LNX3gAYPueh4fOQxf2eAsx6SGpar/UAKCGPJUAXMkdeSGD8M9HoNSMfswh6SMP4TMcfHGX5vferyJ+/ggzcLpwoUcL45MUPhldvOEAuAYfT/9//Gd6tZ2Ngk+T+wav88zfD/bO8QGEOrIH59T4LBy/TMQ70wMUIcVBcEVT09w+1FFHPOiwmXWDi2HgDlDMuIpuEhAWBuaUAnHx5d54wgKWpf39ZQXii0P69jED8ASW/wzAszyNjgADDyP/IAJh8QKm2AMptYHF+OAGXWtQMvF1FAJgAGhj+M+QDkwHQKQyQhMEApcFKwfRBkDrmwGsH4Ab9WakL0rwAKOnPgKaZEVUzLkMZGF98n8zyZ9mPgv//mfwZpXm+s+qyAx3CyIGuGavrvv18yXjnuTjDtx8gET14vP15+Ifz110WYDRwMDDxcTBw6zG9Y+L4L4SsmfHL5zcMT+6JMPz9CxIRJ1xWvGNgeLeHTejvH3agfnYGSaXdMCkRXIHNwkAA/PsNLE7+MRNSRtggcArEkuDJMujfH7aR7iJQ/hEA4nwyXPQRiBME9h7YgJFpPzg7NAATZf0/YMIEpSNQAuXgeYahWfjg7g04My06eGEeXgA0qIWd++UbkGaRQzsO4FILAEoB09rRjJ1iAAAAAElFTkSuQmCC);
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    to {
        top: 300px;
        left: 342px;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAfCAYAAAGdV60fAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAzVJREFUeNpi+P//P8PvPXIKIJrpZ4BaA/NF1fsMUZL/mRiA4NlSaYbfP3kYwBwQ+PZJggEggBhBakGA8Uehw2s2CRYelu8X/4swPXwAUQdSAxBAYDV/12n9Z/gHFPvLDMRMiiwg879/lmL4+kGeQVp9F0jxfRYGJADSCgYg7SD8xCju/2tbdwEQGyCA4PbCAMvfDZoOQIP3gy0AWsT4xUv/P5eLMIRz9grEPW/W8II5YC0wvSBfESfAxL31AiOQPvj7JzcD/+7DjAABhOKOP3sULjD8Z9Rn+AdU858xkMXj7gZw2PzK1JzBbM6dDpWAYCQ247PPn1n+Pfvz4teq3wy/fwiAsYgTw3fGZ9c5Gb5/glnAy8SABp5t4+f89+UHw7+/bHDMwoAF/PrBgxpe2BTBvAkDTOwbbjUAaUN0RVC8kXfHSUZ4/MDwM9NwPXQxgADCUARMZwLoYvDA/LNX3gAYPueh4fOQxf2eAsx6SGpar/UAKCGPJUAXMkdeSGD8M9HoNSMfswh6SMP4TMcfHGX5vferyJ+/ggzcLpwoUcL45MUPhldvOEAuAYfT/9//Gd6tZ2Ngk+T+wav88zfD/bO8QGEOrIH59T4LBy/TMQ70wMUIcVBcEVT09w+1FFHPOiwmXWDi2HgDlDMuIpuEhAWBuaUAnHx5d54wgKWpf39ZQXii0P69jED8ASW/wzAszyNjgADDyP/IAJh8QKm2AMptYHF+OAGXWtQMvF1FAJgAGhj+M+QDkwHQKQyQhMEApcFKwfRBkDrmwGsH4Ab9WakL0rwAKOnPgKaZEVUzLkMZGF98n8zyZ9mPgv//mfwZpXm+s+qyAx3CyIGuGavrvv18yXjnuTjDtx8gET14vP15+Ifz110WYDRwMDDxcTBw6zG9Y+L4L4SsmfHL5zcMT+6JMPz9CxIRJ1xWvGNgeLeHTejvH3agfnYGSaXdMCkRXIHNwkAA/PsNLE7+MRNSRtggcArEkuDJMujfH7aR7iJQ/hEA4nwyXPQRiBME9h7YgJFpPzg7NAATZf0/YMIEpSNQAuXgeYahWfjg7g04My06eGEeXgA0qIWd++UbkGaRQzsO4FILAEoB09rRjJ1iAAAAAElFTkSuQmCC);
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }
}

@-webkit-keyframes DataUpBlue {
    0% {
        top: 290px;
        left: 330px;
        opacity: 0;
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    30% {
        top: 290px;
        left: 330px;
        opacity: 1;
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    60% {
        top: 290px;
        left: 330px;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    to {
        top: 290px;
        left: 330px;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }
}

@keyframes DataUpBlue {
    0% {
        top: 290px;
        left: 330px;
        opacity: 0;
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    30% {
        top: 290px;
        left: 330px;
        opacity: 1;
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    60% {
        top: 290px;
        left: 330px;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    to {
        top: 290px;
        left: 330px;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }
}

@-webkit-keyframes DataUpgreen {
    0% {
        top: 272px;
        left: 316px;
        opacity: 0;
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    60% {
        top: 272px;
        left: 316px;
        opacity: 1;
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    90% {
        top: 272px;
        left: 316px;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    to {
        top: 272px;
        left: 316px;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }
}

@keyframes DataUpgreen {
    0% {
        top: 272px;
        left: 316px;
        opacity: 0;
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    60% {
        top: 272px;
        left: 316px;
        opacity: 1;
        -webkit-transform: scaleY(.01);
        transform: scaleY(.01);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    90% {
        top: 272px;
        left: 316px;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    to {
        top: 272px;
        left: 316px;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }
}

.pie {
    width: 58px;
    height: 55px;
    position: absolute;
    top: 336px;
    left: 247px;
    background: url(data:image/png;base64,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) 2px 5px no-repeat;
    -webkit-animation: circle 2.5s linear infinite;
    animation: circle 2.5s linear infinite
}

@-webkit-keyframes circle {
    0% {
        -webkit-clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0);
        -moz-clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0);
        -ms-clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0);
        -o-clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0);
        clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0)
    }

    10% {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0)
    }

    20% {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px)
    }

    30% {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px)
    }

    40% {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0)
    }

    to {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0)
    }
}

@keyframes circle {
    0% {
        -webkit-clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0);
        -moz-clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0);
        -ms-clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0);
        -o-clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0);
        clip-path: polygon(30px 30px,0 0,0 0,0 0,0 0,0 0)
    }

    10% {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 0,60px 0,60px 0)
    }

    20% {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,60px 60px,60px 60px)
    }

    30% {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 60px)
    }

    40% {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0)
    }

    to {
        -webkit-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -moz-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -ms-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        -o-clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0);
        clip-path: polygon(30px 30px,0 0,60px 0,60px 60px,0 60px,0 0)
    }
}

.Img1, .Img2 {
    width: 94px;
    height: 180px
}

.Img1 {
    background: url(../images/login/numlist-1.png);
    bottom: 370px;
    left: 125px;
    display: block;
    -webkit-animation: Datamove 5s infinite;
    animation: Datamove 5s infinite;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease
}

.Img2 {
    background: url(../images/login/numlist-2.png);
    bottom: 489px;
    left: 333px;
    -webkit-animation: Datamove 3s infinite;
    animation: Datamove 3s infinite;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
}

@-webkit-keyframes Datamove {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: .5
    }

    30% {
        -webkit-transform: translateY(-3%);
        transform: translateY(-3%);
        opacity: 1
    }

    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: .5
    }
}

@keyframes Datamove {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: .5
    }

    30% {
        -webkit-transform: translateY(-3%);
        transform: translateY(-3%);
        opacity: 1
    }

    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: .5
    }
}

.ImgUp {
    width: 21px;
    height: 37px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAlCAYAAAHaapKtAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAsVJREFUeNpi/P//PwMMsDCedRIA0u8TRRgaGUEyQAGwNBNczd0vcM5CEAEQQAwgZYkPHAMgBp1x/M90xvEbiANW9o+BgTPpoVMDI0gGrNx4HyMTiIAZCBBAYAPAmoEqgAb9h/HB+mEOmP+GgQFoDppjoGD+yS8MWCUw7IDbtdJUAEQDBBAjsvdhAGbxBeazTt9AjgcLQl2iD/IRkK4HK0IOIxAABRw2V9Rjc7MjVvfiFkQJNXRfAUNPAUQDBBCmV884Toi+jxq0MAz3PrIfQCBamIGBDWjZPHmElbBg+YDuuKVvGRh+/UfEDzxksJkMA6GCDAw8zBAbcMcbFKx+z8Dw5S/YhgkETQYlUSBw/B926gBBk3GFfCAhxSzwSDDetwHkGrjPISHEj6wYIIAwIgWaaRLQxTDcy3LO6QcotcCSIYZbgdYZgELi738G9l+Q8KjHlpgTgNR5mODytwzfQTSyqaAEfgBkFbJuUGJHNxVk4gFsQYJuKiibgxgH0RWCTAVFJ8xUJkJxDzOVYHTCTMWv8O//bzBT8Sv88uc1KDURlUbx5l86KgQGugOQekiUiUDFCkBKkSirgYofQMugRIIlLEoRtNO6A8YGCDCsJS46AMY1yA8TQOUtEH8EYgVgJHzApR6nodAKbQEQ+4P4upwMH0244ZkTr8EYhgINA7lqA0buJsFg5NIL5Kp4QkFBjMGgytUAOX8TAwgZjOxSBWiWl6fUYOSE9wBIPSDWtZe/M/Dv/cTwEsoFGf4AmEoESMof2MCjXwzi2AymyFCYwbvew5MQ2GDKDP34+yHDk28MTz/9ZXz96/91UL4FhqsAC6UuZfgJLJBf/GDY8oIhC1hpPqA4TCkuyAadoQ+obigwAyRAC1NgS4ihEZpTSAZElafQkgtUGdtjJKk3P2HZGtxkItpQLOVsAbhGhxgK4k8AGghvYAAAtxC8vR6h0LQAAAAASUVORK5CYII=);
    bottom: 408px;
    left: 250px;
    -webkit-animation: Up 5s infinite;
    animation: Up 5s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out
}

@-webkit-keyframes Up {
    0% {
        opacity: .5;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    50% {
        opacity: 1;
        -webkit-transform: translateY(-10%);
        transform: translateY(-10%)
    }

    to {
        opacity: 0;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes Up {
    0% {
        opacity: .5;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    50% {
        opacity: 1;
        -webkit-transform: translateY(-10%);
        transform: translateY(-10%)
    }

    to {
        opacity: 0;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.Img3, .Img4 {
    width: 263px;
    height: 328px
}

.Img3 {
    background: url(../images/login/a.png);
    bottom: 5px;
    left: 343px;
    -webkit-animation: Upmove 8s infinite;
    animation: Upmove 8s infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}

.Img4 {
    background: url(../images/login/b.png);
    bottom: 140px;
    left: 564px;
    -webkit-animation: Upmove 5s infinite;
    animation: Upmove 5s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out
}

@-webkit-keyframes Upmove {
    0% {
        -webkit-transform: translateY(-5%);
        transform: translateY(-5%)
    }

    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    to {
        -webkit-transform: translateY(-5%);
        transform: translateY(-5%)
    }
}

@keyframes Upmove {
    0% {
        -webkit-transform: translateY(-5%);
        transform: translateY(-5%)
    }

    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    to {
        -webkit-transform: translateY(-5%);
        transform: translateY(-5%)
    }
}

.ImgBox1 {
    width: 11px;
    height: 9px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAJCAYAAAGTY+a7AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAWJJREFUeNpi+P//PwP33P8KTAxA8Gvvhw8AAcTAu+H/ASaGPV8fAAQQo1n3f4Fv7xje31dhYAAIIAajlv8CPMv/N4A0gBS/B+J6kCamt99+e//d8/kjiAMQQIwgaeNWhv8PlBle/mJgEP//jYHhSxIDIwsDFDAe/y7+9+sfhj/f/zIwJAkwAAQQWIfcLIZd74UYrv3/zrDhSyzDAUbTrv8Nv74w1N/VZWAACjIwfGNQZILZyPiP4SfUtAsgcx2BeP+//V/YQWb+/v5vA9hMgcJvDX9+/HMAChr8WMAvABBgYEEQADpvwU9GhvhH2kCzfwMF/kDp3wwHgU51AFsB9LsBUP35v0BPgPBHQYbvb2QYOJEUg/DEL+kMBWCTzboZFgAVxoMU//nN8P3Jh2+cv9n/M/wDGcfP8pKBkfEPAxtTJNwZRq0MT15//CX08ftvzn9/gAp/A/GffyD64q+lAgYgNQAo77J9X09AngAAAABJRU5ErkJggg==);
    bottom: 457px;
    left: 496px;
    -webkit-animation: Boxmove1 2s infinite;
    animation: Boxmove1 2s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out
}

@-webkit-keyframes Boxmove1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(-600%);
        transform: translateY(-600%)
    }
}

@keyframes Boxmove1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(-600%);
        transform: translateY(-600%)
    }
}

.ImgBox2 {
    width: 10px;
    height: 11px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAALCAYAAAExaSyOAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAWZJREFUeNpi/P//PwMIMIEItpgPAQABxMyz7L8Ak8IlhvcAAcRg1v3fAcj7zxr/4T9AADHCFLLIz2b48JaVgZ9J5BXDB8bTXxkAAggsxbee4cL/Hwz6/38yMACxIyNI85+fDPt/fWFgePDpK8PPj7+BMkCVIKxT8V8BxgYIILggz+L/AjA2E98mBgfe1QwgO9/zzGF4AHaj6m2G/Yz/Gb6BOP9f/eZmCnnXwML8j4FB6SoD1/MvPxk+f/wpApT7APJNIAMCPPy3RmgC3CKJop96MDZAgMH9BQJACxMY/jBMYPgLNB9If0lgaIDJMWpP/W/7VJJhM1COHyjJwADCEIVgNpD+/vv2t0ks3N8YmFXvMPD//cXAAAwNhpdiDG9+Mvz/x3Drh9jf978Z/vz4xwnEP1iQHMjAAlQscY9B5NWvXwzffvxDljqA4kaDeoYGoMkFr379ZPn240/P359/J3ybw/cBJAcAt7PA42DmN54AAAAASUVORK5CYII=);
    bottom: 463px;
    left: 512px;
    -webkit-animation: Boxmove2 3s infinite;
    animation: Boxmove2 3s infinite;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease
}

@-webkit-keyframes Boxmove2 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(-300%);
        transform: translateY(-300%)
    }
}

@keyframes Boxmove2 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(-300%);
        transform: translateY(-300%)
    }
}

.ImgCircle, .ImgCircle2 {
    width: 6px;
    height: 6px;
    border-radius: 3px;
    background: #fff
}

.ImgCircle {
    bottom: 462px;
    left: 500px;
    -webkit-animation: Circlemove2 3s infinite;
    animation: Circlemove2 3s infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}

.ImgCircle2 {
    bottom: 472px;
    left: 520px;
    -webkit-animation: Circlemove 3s 1s infinite;
    animation: Circlemove 3s 1s infinite;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease
}

.ImgCircle3, .ImgCircle4 {
    width: 3px;
    height: 3px;
    border-radius: 3px;
    background: #fff
}

.ImgCircle3 {
    bottom: 472px;
    left: 485px;
    -webkit-animation: Circlemove2 3s infinite;
    animation: Circlemove2 3s infinite;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
}

.ImgCircle4 {
    bottom: 462px;
    left: 515px;
    -webkit-animation: Circlemove 3s 1s infinite;
    animation: Circlemove 3s 1s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out
}

@-webkit-keyframes Circlemove {
    0% {
        opacity: 0
    }

    65% {
        opacity: .9;
        -webkit-transform: translateY(-400%);
        transform: translateY(-400%)
    }

    to {
        opacity: 0;
        -webkit-transform: translateY(-650%);
        transform: translateY(-650%)
    }
}

@keyframes Circlemove {
    0% {
        opacity: 0
    }

    65% {
        opacity: .9;
        -webkit-transform: translateY(-400%);
        transform: translateY(-400%)
    }

    to {
        opacity: 0;
        -webkit-transform: translateY(-650%);
        transform: translateY(-650%)
    }
}

@-webkit-keyframes Circlemove2 {
    0% {
        opacity: 0
    }

    65% {
        opacity: .9;
        -webkit-transform: translateY(-500%);
        transform: translateY(-500%)
    }

    to {
        opacity: 0;
        -webkit-transform: translateY(-550%);
        transform: translateY(-550%)
    }
}

@keyframes Circlemove2 {
    0% {
        opacity: 0
    }

    65% {
        opacity: .9;
        -webkit-transform: translateY(-500%);
        transform: translateY(-500%)
    }

    to {
        opacity: 0;
        -webkit-transform: translateY(-550%);
        transform: translateY(-550%)
    }
}

@media(max-width:1600px) {
    .AnimationImg {
        height: 580px
    }

    .Img1, .Img2, .Img3, .Img4, .ImgBox1, .ImgBox2, .ImgUp {
        background-size: 100%;
        background-repeat: no-repeat
    }

    .Img1, .Img2 {
        width: 75.1px;
        height: 142px
    }

    .ImgUp {
        width: 16.8px;
        height: 29.6px;
        bottom: 394px;
        left: 252px
    }

    .orange {
        margin: 60px 0 0 100px
    }

    .Img3, .Img4 {
        width: 210.4px;
        height: 262.4px
    }

    .ImgBox1 {
        width: 8.8px;
        height: 7.2px
    }

    .ImgBox2 {
        width: 8px;
        height: 8.8px
    }

    .Img1 {
        bottom: 370px;
        left: 130px
    }

    .Img2 {
        bottom: 490px;
        left: 338px
    }

    .Img3 {
        bottom: 44px;
        left: 336px
    }

    .Img4 {
        bottom: 160px;
        left: 526px
    }

    .histogram {
        top: 218px;
        left: 264px
    }
}

@media(max-width:1440px) {
    .AnimationImg {
        background-size: 90%
    }

    .Img1, .Img2 {
        width: 60.08px;
        height: 113.6px
    }

    .ImgUp {
        width: 13.44px;
        height: 23.68px;
        bottom: 435px;
        left: 228px
    }

    .Img3, .Img4 {
        width: 168.32px;
        height: 220.92px
    }

    .ImgBox1 {
        width: 7.04px;
        height: 5.76px
    }

    .ImgBox2 {
        width: 6.4px;
        height: 7.04px
    }

    .Img1 {
        bottom: 396px;
        left: 115px
    }

    .Img2 {
        bottom: 505px;
        left: 304px
    }

    .Img3 {
        bottom: 88px;
        left: 315px
    }

    .Img4 {
        bottom: 211px;
        left: 507px
    }

    .ImgBox1 {
        bottom: 434px;
        left: 458px
    }

    .ImgBox2 {
        bottom: 424px;
        left: 450px
    }

    .ImgCircle {
        bottom: 464px;
        left: 468px
    }

    .ImgCircle2 {
        bottom: 444px;
        left: 438px
    }

    .ImgCircle3, .ImgCircle4 {
        bottom: 434px;
        left: 458px
    }

    .orange {
        margin: 95px 0 0 100px
    }

    .pie {
        top: 297px;
        left: 217px
    }

    .histogram {
        top: 165px;
        left: 209px
    }
}