*{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box;}html,body{min-height:100%;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;}body{font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif;background-color:#ebedee;position:relative;}::-webkit-scrollbar{width:5px;}::-webkit-scrollbar-track{background-color:#dcdcdc;}::-webkit-scrollbar-thumb{background-color:#bbbbbb;}.warpper{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:25px;}.warpper .container{width:100%;max-width:720px;min-height:250px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:12px;-webkit-box-shadow:0 8px 20px rgba(0,0,0,0.06);box-shadow:0 8px 20px rgba(0,0,0,0.06);-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;opacity:0;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-delay:.25s;animation-delay:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}.warpper .container.row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;height:0;}.warpper .container.row > div{height:100%;}.warpper .container.row .card-a-part{width:auto;border-radius:12px 0 0 12px;}.warpper .container.row .card-b-part{width:0;border-radius:0 12px 12px 0;background-color: #008eff17;}.warpper .container.row .card-b-part .b-part-down{width:75%;}.warpper .container.column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:auto;max-width:360px;}.warpper .container.column > div{height:auto;width:100%;}.warpper .container.column .card-a-part{border-radius:12px 12px 0 0;}.warpper .container.column .card-b-part{border-radius:0 0 12px 12px;}.warpper .container.column .card-b-part .b-part-up{margin-bottom:40px;}.warpper .container.column .card-b-part .b-part-down{width:100%;}.warpper .container > div{padding:40px;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;}.warpper .container .card-a-part{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;background-color:rgba(0,0,0,0.25);}.warpper .container .card-a-part .img-back,.warpper .container .card-a-part .avatar-name .avatar{background-image:url(https://thirdqq.qlogo.cn/g?b=sdk&k=yMujtcOn6Ub69OHOpwpnhQ&s=0);}.warpper .container .card-a-part .img-back{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:50% 50%;-webkit-transform:scale(1.2);transform:scale(1.2);-webkit-filter:blur(20px);filter:blur(20px);opacity:0.75;}.warpper .container .card-a-part .avatar-name{z-index:1;width:100%;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.warpper .container .card-a-part .avatar-name .avatar{width:60%;max-width:110px;min-width:80px;height:auto;-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;border-radius:50%;-webkit-box-shadow:0 0 6px rgba(0,0,0,0.5);box-shadow:0 0 6px rgba(0,0,0,0.5);background-size:cover;}.warpper .container .card-a-part .avatar-name .avatar:before{content:"";display:inline-block;width:100%;padding-bottom:100%;vertical-align:middle;}.warpper .container .card-a-part .avatar-name .name{text-align:center;width:100%;font-size:20px;font-weight:500;margin-top:10px;color:white;text-shadow:0 2px 2px rgba(0,0,0,0.6);}.warpper .container .card-b-part{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:5;-ms-flex:5 1 auto;flex:5 1 auto;background-color:#fff;}.warpper .container .card-b-part > div{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;width:100%;}.warpper .container .card-b-part .b-part-up .text-content{color:#7c8891;font-size:18px;line-height:27px;}.warpper .container .card-b-part .b-part-down{height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;}.warpper .container .card-b-part .b-part-down .item{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:0.3s ease-in-out all;transition:0.3s ease-in-out all;}.warpper .container .card-b-part .b-part-down .item svg{width:20px;height:20px;fill:#7c8891;-webkit-transition:0.3s ease-in-out all;transition:0.3s ease-in-out all;}.warpper .container .card-b-part .b-part-down .item:focus::after,.warpper .container .card-b-part .b-part-down .item:hover::after{opacity:1;-webkit-transform:translate(-50%,-0.2rem);transform:translate(-50%,-0.2rem);}.warpper .container .card-b-part .b-part-down .item::after{background:rgba(48,55,66,0.6);border-radius:4px;color:#fafafa;content:attr(title);display:block;margin-top:10px;font-size:15px;max-width:300px;opacity:0;overflow:hidden;padding:3px 6px;pointer-events:none;position:absolute;text-overflow:ellipsis;-webkit-transform:translate(-50%,0.5rem);transform:translate(-50%,0.5rem);-webkit-transition:opacity 0.2s,-webkit-transform 0.2s;transition:opacity 0.2s,-webkit-transform 0.2s;transition:opacity 0.2s,transform 0.2s;transition:opacity 0.2s,transform 0.2s,-webkit-transform 0.2s;white-space:pre;z-index:3;left:50%;bottom:auto;top:100%;}.warpper .container .card-b-part .b-part-down > a:hover{-webkit-transform:translateY(-2px) scale(1.05);transform:translateY(-2px) scale(1.05);}.warpper .container .card-b-part .b-part-down .github:hover svg{fill:black;}.warpper .container .card-b-part .b-part-down .blog:hover svg{fill:#22c292;}.warpper .container .card-b-part .b-part-down .telegram:hover svg{fill:#31aee7;}.warpper .container .card-b-part .b-part-down .love:hover svg{fill:#e64c4c;}.warpper .container .card-b-part .b-part-down .wallet:hover svg{fill:#b6aaff;}.warpper #footer{text-align:center;margin-top:25px;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;opacity:0;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-delay:.5s;animation-delay:.5s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}.warpper #footer .about{font-size:17px;color:#bfc4c7;}.warpper #footer .about a{color:#000000;/*background-color:#c5d1d3;*/text-decoration:none;padding:4px 8px;border-radius:4px;font-size:16px;-webkit-transition:0.3s ease-in-out all;transition:0.3s ease-in-out all;}.warpper #footer .about a:hover{background-color:#fbfbfb;color:#bfc4c7;}@-webkit-keyframes fadeInDown{from{-webkit-transform:translate3d(0,-50px,0);transform:translate3d(0,-50px,0);}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}}@keyframes fadeInDown{from{-webkit-transform:translate3d(0,-50px,0);transform:translate3d(0,-50px,0);}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}}@-webkit-keyframes fadeInUp{from{-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0);}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}}@keyframes fadeInUp{from{-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0);}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown;}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp;}
.warpper .container .card-a-part .item svg {
    width:50px;
    height:20px;
    fill:#7c8891;
    -webkit-transition:0.3s ease-in-out all;
    transition:0.3s ease-in-out all;
}
#main {
    flex: 1; 
}