body {
    background: #f8f8f8;
    font-family: 'PT Sans', Helvetica, Arial, sans-serif;
    text-align: center;
    color: #fff;
    background-image: url('../img/2.jpg');
    background-size: cover;
}
@media (min-width: 640px) {
    body {
        padding: 2em;
        font-size: 112.5%;
    }
}
@media (min-width: 768px) {
    #main-menu > li {
        float: none;
        display: table-cell;
        width: 1%;
        text-align: center;
    }
}
p#back-to-top {
    position: fixed;
    bottom: 0px;
    right: 44px;
}

    p#back-to-top a {
        text-align: center;
        text-decoration: none;
        color: rgba(209, 209, 209, 0);
        display: block;
        width: 50px;
        /*使用CSS3中的transition属性给跳转链接中的文字添加渐变效果*/
        -moz-transition: color 1s;
        -webkit-transition: color 1s;
        -o-transition: color 1s;
    }

        p#back-to-top a:hover {
            color: #979797;
        }

        p#back-to-top a span {
            background: #d1d1d1 url(../img/top.jpg) no-repeat center center;
            border-radius: 6px;
            display: block;
            height: 50px;
            width: 50px;
            margin-bottom: 5px;
            /*使用CSS3中的transition属性给<span>标签背景颜色添加渐变效果*/
            -moz-transition: background 1s;
            -webkit-transition: background 1s;
            -o-transition: background 1s;
        }

#back-to-top a:hover span {
    background: #979797 url(../img/top.jpg) no-repeat center center;
}
footer {
    background-color: #222222;
    color: #ddd;
    padding: 10px 0;
    text-align: center;
    margin-top: 50px;
}
h1 {
    padding: 24px 48px;
    font-size: 80px;
}
h2 {
    padding: 24px 48px;
    font-size: 70px;
}