/*典型断点：手机（<768px）、平板（768px–1200px）、桌面（>1200px）。*/
html {
  font-size: 16px;
}
#LogoImage {
    height: 3rem;
    margin:0;
    padding:0;
}
#TitleContener{
    display:flex;
    flex-direction:column;
    align-items:center;
}
#WebTitle {
    color: white;
    line-height: 1rem;
    font-family: "LiSu", "STLiti", "Microsoft YaHei", "微软雅黑", "SimSun", serif;
}
#WebTitle_sub{
    padding:0;
    margin:0;
    color:gold;
}
#HomeImage {
    height: 2.5rem;
}

#footer-CopyRight {
    color: white;
    grid-area: CP;
    margin-top: 0;
    margin-bottom: 0;
}

#footer-wb {
    color: white;
    grid-area: WB;
    margin-top: 0;
    margin-bottom: 0;
}

#footer-wa {
    color: white;
    grid-area: WA;
    margin-top: 0;
    margin-bottom: 0;
}

/*2025 0330 模板*/
body {
    height: 100vh;
    width: 100vw;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns:1fr;
    grid-template-rows: 4rem calc( 100% - 6rem ) 2rem;
}


header {
    background-color: black;
    padding-left: 1rem;
    padding-right: 1rem;
    border-bottom: 1px solid gray;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content:space-between;
}

#MainBody {
/*    padding-left: 1rem;
    padding-right: 1rem;*/
    overflow-x: hidden;
    overflow-y: scroll;
}

footer {
    background-color:black;
    color:white;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: "CP WB WA";
    padding:2px 10px 2px 10px;
}




/*适应手机屏幕的布局*/
@media (max-width: 768px) {
    html {
        font-size: 14px;
    }
    body {
        grid-template-rows: 4rem calc( 100% - 8rem ) 4rem;
    }
    footer {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        grid-template-areas: "CP WB"
                             "WA WA";
    }
}