@charset "utf-8";
html{width:100%; height:100%;}
html, body, ul, li, p, img, div, span, table, button, input, textarea, h1, h2, h3, h4, iframe{margin:0; padding:0; box-sizing:border-box; cursor:default; font: "Calibri", "Arial", sans-serif;}
body{height:100%; background:#1f1f1f;}
img{display:block; border:none;}
.noWrapping{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.flex{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; align-content:center;}

.siteTop{color:#5db5f3; padding:28px 0;}
    .siteTop > p{width:100%;}
    .siteTop > h1{width:100%;}
.codeList{align-items:flex-start; border-bottom:1px dotted #585858;  border-top:1px dotted #585858;}
    .codes{width:368px; padding:18px; flex-wrap:wrap;}
        .codeBody{width:100%; align-items:flex-start;}
            .codes > h2{text-align:center; font-size:22px; color:#fff; padding-bottom:18px;}
            .codeBody > div{width:45%;}
            .codeBody > div:nth-child(2n){margin-left:18px; padding-left:18px;}
                .codeBody img{width:128px; height:128px; border-radius:5%;}
                .wxPro > img{border-radius:50%;}
            .codeBody b{display:inline-block; width:100%; text-align:center; margin:8px 0;}
            .codeBody p, .codes b, .codes a{color:#BBB;}
            .codeBody p, .cdes a{font-size:12px;}
.siteBottom{text-align:center; padding:28px 0;}
@media screen and (max-width: 600px) {
    body{width:100%;}
        .siteTop{text-align:center;}
        .codeList{justify-content:center;}
}

@media screen and (min-width: 601px){
    body{width:1200px; margin:0 auto;}
        .codeList{justify-content:space-between;}
}