* {
            padding: 0;
            margin: 0;
        }
        body{
            width: 100vw;
            background: #9796f0;  /* fallback for old browsers */
            overflow: hidden;
            background: -webkit-linear-gradient(to top, #fbc7d4, #9796f0);  /* Chrome 10-25, Safari 5.1-6 */
            background: linear-gradient(to top, #fbc7d4, #9796f0); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        }
        a{
            text-decoration: none;
        }
        /*顶栏*/
        .top-nav{
            height: 100px;
            width: 100vw;
            position: sticky;
            top: 0;
            background: rgba(226, 166, 166, 0.600);
            display: flex;
            flex-direction: column;
            flex-wrap: nowrap;
            align-content: center;
            justify-content: center;
            align-items: center;
            box-shadow: 0 7px 5px -5px #333;
        }
        .top-nav > a > img{
            height: 40px;
            width: 40px;
            border: 4px solid white;
            border-radius: 50%;
            transform: 0.5s;
            -webkit-transition: 0.5s;
        }
        .top-nav > a > img:hover{
            height: 50px;
            width: 50px;
            border: 4px solid rgb(139, 198, 231);
        }
        .top-nav > p{
            color: #FFF;
        }
        /*主内容*/
        .main{
            height: 100vh;
            scroll-snap-type: y mandatory;
            scroll-padding: 100px;
            overflow: scroll;
        }
        .content{
            width: 100vw;
            height: 100vh;
            scroll-snap-align: start;
            display: flex;
            flex-direction: column;
            flex-wrap: nowrap;
            align-content: center;
            justify-content: center;
            align-items: center;
        }
        .content p{
            font-size: 1.5em;
            color: white;
            line-height: 1.2em;
            overflow-wrap: break-word;
        }
        /*底部*/
        .footer{
            width: 100vw;
            font-size: 0.8em;
            display: flex;
            flex-direction: column;
        }
        .footer a{
            color: white;
        }
        .footer-nav{
            font-size: 0.95em;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: space-evenly;
            align-content: center;
            align-items: center;
            margin-top: 15vh;
        }
        .footer-nav-title{
            font-size: 1.35rem;
        }
        .footer-nav-col{
            display: flex;
            flex-direction: column;
            flex-wrap: nowrap;
            justify-content: center;
            align-content: center;
            align-items: center;
        }
        .footer-nav-col a{
            padding: 5px 10px;
            width: 100%;
            height: auto;
            text-align: center;
        }
        hr{
            background: rgba(211, 72, 72, 0.493);
            height: 90%;
            width: 2px;
            border: none;
            border-radius: 2px;         
        }
        .footer span{
            color: white;
            height: 50px;
            line-height: 50px;
            text-align: center;
        }