.qrcode-login-box{
    width: 300px;
}

.qrcode-expire{
    position: absolute;
    width: 300px;
    height: 300px;
    background-color:#fff; filter: alpha(opacity=95); -moz-opacity: 0.9; -khtml-opacity: 0.9; opacity: 0.9;
    z-index: 10;
    text-align: center;
    vertical-align: center;
    padding-top: 55px;
    display: none;
}
.qrcode-expire i{
    font-size: 6rem;
    color: #333;
}

.qrcode-login-box .title{
    font-size: 1.25rem;
    text-align: center;
    margin-bottom: 1rem;
}

.qrcode-login-box .desc-text{
    font-size: 0.85rem;
    text-align: center;
    margin-top: 0.85rem;
}

.qrcode-login-box .icon-succ {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAYAAAAehFoBAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAALKADAAQAAAABAAAALAAAAAD8buejAAAEF0lEQVRYCe2Zz2sTQRTHZ3YTk6ZSUQ+VHj168KCiIm2k6kVEK4IHPTWtKIg9KohnERRPiiBa05OCB7EKBQWVph6K1AoePPgHBD1URNtN0mR3fN9NN83O/shud9NS7F52Z+bNe599Oz/evGVs49rwgM0D3FaKUBBC8K7Pl7YbmtFT46IHqhKCF5WMUvyz9+Ec51xEUN/oGgm489PlHXqlfEoYYoAxcYS0phua7Q9lxvh7rvBxNZV+tbD/wQ97c/DSioA3F3K7qoLdYlycZIKF08Gph+Cvk5xdn8/mvwVHrUuGMtY5faFbr9ZuCoMNUnc1rDFJXucKG1OTiRsLBx//lNo8i4GBMx+H9hmGGKexao5PT40hG2hsFxWFD2i9T2aCdFWCCHVM5c7phlGIGxa2oRO6YSMIS0sPQxF59mkQZVFlyNPnS335Z356fIExDPD2NE06/JTE1sZZSVWUrN/w8AQ2J9iiPtuOYeD3ghjT6iZ1j9dE9BzD5moQ8wTzA7XazDFNK5FVlu+uHq6vs+IrCUddumR7Qct6kvPdbuu0q4fNTWHtYPFS6hKD4wUdHsZ2WytrxdA7mEO1XwWvkOHftOV1e0rRjphIZ3rkbdzhYcQG7YZVVXEmqSSymGCewLTlmyySgAOYApnTkkyMRV4BrNY7NvG379F3RfW35cZiA6YZSl9K9MdI2KRqGRaV26ZHugyd32sScHkU/XWm5SYbMOJZavIKEZd7hX5ywmqL828J5kALVeklpoaYDRjBd6Ol1QPn1VYi9fYVw5rdZSYbsHVSaAVCk+UXLdAHFc7v+8tGg4VumSnhb9CtlVeUhHJMOzT6hVpnOwo5ZghxxSkZHdapkzGbh3EGcxOy14mUXtMboWApmx9xejo+WJnJBowDox3OoyTY1VRh8LbVaoeODxb6ZSbbToclJF3IaSQXbKXg7E4lO3bNAk8Vhu6qivEO6yzqts5c3FLSqm8CrAaWCvleLmfzGZozjRO3DRjSqckcGRPH5Z6eZQnakosBllTxicrh/AlLJ+62IYEKOoq/xD3wheExmXuRnhraiT5nxXM1XRg+WlqozkTwrGkeaQGZw+HhKMEPKZujb4fh1CkbCl0OGvyY0RHlDUIboA4Ei50yOiyME4McqaHaMSRQiSQH3XQ8r9FFAbzJ4DDvCoxIH0kOh/QqVcC222kD5l2B0YCMjG+8CqE2XLAJ216qPYFxakVGhjJnJa/OsdeTLdj0OjHDnicwGpEfoG13GM+rccGWX04CDL7AEEAmBhmZtnq67tmWWR/wONZhVLpd6yoZiBfAp0JGhmbwKBXjWPKQbh2FzlbDoNmBgT3c3GndJLSbofHc9MuATtrm4dUrysMvgw+IU9bkl4EMjjJC09X4KeNme6Puv/bAP9U/9N7f2fg5AAAAAElFTkSuQmCC");
    width: 44px;
    height: 44px;
    background-size: cover;
    display: inline-block;
    float: left;
    margin-right: 10px;
    margin-left: 15px;
}

.qrcode-login-box .icon-warn {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAYAAAAehFoBAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAALKADAAQAAAABAAAALAAAAAD8buejAAAFL0lEQVRYCe1ZvW8cRRSf2fuIFSkSFpY4Iv8BfHRWUlIABTS2iddG8jVYClybOqJGoaW1CEplI9lnxXYTipiCDqNUBHpkGSMdihQp8fk+dvj93u3eze7t3s3a4MjCI63m6733++27tzPz5pS6LJceiHlAx3pn6BhjtKpWX1et1vVOEFynqaLnHapy+VCtrf2ttTZnMN9XPRNhs7RUaQfBnDZmHhY/AOmJvmWrAbJNdPeM1tslz9vRGxtH1nSu5qkIg+g7nW73njJmFm6L2UDHKK0bwsKYqYz53WKhcBfEf8vFFsIxsHHKZnn5jfbJyVdQWoE3C5SH9w7Q34H3dhACv6vJyT/16mqbc3ixMqoKQuRt/ApzID8HvWnOQa+L/oPSlStf6vX1vzjmUpwJt3z/hg6CbYBIfAJwX3ne3dLm5mMXoEimvbj4oQqCeyB+k2MgcGg8b75cr/8SyYyqnQh3fH8ZAN/hmQDRIzx3CpubG6jBP3+BHd1dXFxC/Q2eCuwc47ldrNfXx1kbS5hkgyBYE0NaPykpNa+3tg7GGXaZNwsL04idbXwLM5T3PK86jrQ3yjDDAB64Txl4YLc0NfXev0VWbOLFxSZss08sYrKdVTI9zA+s02w+kZilZ0l2dfVllqFo3NRqV9uNxrvsQ+dpDp2f6GnGdHFiYibrQ8z0MFcDkoVnjyQMHMgK6UbjLQD/LA/bDoUvJRjAIiaxs9RSCXOdxZuuUAmE7+QKA2O6fTC73R9MbxCDWJwlNjmkSaYS5qaAeCrAwD5XgzTFEWMDwkrZ7REqvalw5dkntmxMKRpDhPFmFfycsyKLdRak8y1d5fKApOd1UjAzhwQLmCLAXZRcEmWIMM8GYAhdfZB3UxDbnY5NckA+AZzVJSaxyYFcknJDhLGbfUIhKG0nhR37Nkm77ag+wI642IoxwogdDabvUwBvKGujLezUtj80u+2k3BPqY4OLcLJ0Y4R5noWAHBHlIGMJ5mjaXrXbziYibOHCM7ZV4oRx+OYclhXDU5cll6dpk7Tb7jZ44pMfGSohp0g5RjjKFBAWjeiIGAk613YY2G1nA3AYj6fhmbrPKdSPEc5hM1v02rWBV+12tkaumRhhycGozkyhVsNueYrieQPCx8f2EudsTLDBgQp9TqF2MWaFCWOzyRVCq2fP3sTcH7F5l86LFyeIv8ehaMtFZUgG2MKBE+RkFdgeFC4hOP++5NepPe/jUr3+w2D2/Fpt3//IBMEj7AVNnI+vogb/XomFRDixxynmYKHMuVcW9p5NlkRihDnAVFxqJIysX0WBOwU74mJzGCIs9wb87JDdSsJoSzu0zcrKa61btx7wMdXqpINKTISYxOY6TC6xSXSGCMslR5iyhNltLM6TBpL9zvPnNYx9xgcZyxfJ+VF9ENXA/FpkwCHtwmWIMIXlkoP3BkjFmd2OAknOIeZ+pXfC52lyflS/6/ufAvMGbHTJIU0203uthYVvERi3oXyEte9mnqzD+L7kdLpedybMDBqLNg/vFexy98tbW5/nInzaJDQNZNxYmLieLQll1sobGXj4GJ6e6TQa39PwOPC887RJ28QglmCOuLrKDIkI+EJdpJA0b2J4I9P3NOIML8GPY+zLRi+drKlLG4zZyLMutz604wx6oS4DIw9lXrdid8TutCuZgn3dyhMfDjJy3arULDw7j2daPPVfX7dGpFnzkuNCXGjbpEPivb8MmGn3EkbJB5NyiH+cWc2PWAEevpK/DJKEhDw/wnP4UyYN+3Lsf+2BfwBTcLaQW0rX9AAAAABJRU5ErkJggg==");
    width: 44px;
    height: 44px;
    background-size: cover;
    display: inline-block;
    float: left;
    margin-right: 10px;
    margin-left: 15px;
}

.qrcode-success{
    line-height: 1.25rem;
    clear: both;
    display: none;
    margin-top: 0.85rem;
}
.qrcode-success span{
    font-size: 0.85rem;
}


.qrcode-cancel{
    line-height: 1.25rem;
    clear: both;
    display: none;
    margin-top: 0.85rem;
}
.qrcode-cancel span{
    font-size: 0.85rem;
}

.qrcode-auth-box{
    font-size: 1.25rem;
    line-height: 1.5rem;
}
.qrcode-auth-box span{
    font-size: 0.85rem;
}
.qrcode-auth-box .qrcode-auth-logo{
    width: 50px;
    height: 50px;
    display: inline-block;
    float: left;
    margin-right: 10px;
    border-radius: 5px;
}