/**
 * 布局相关的样式
 * @author xupingmao
 * @since 2021/07/25 09:22:04
 * @modified 2021/07/31 14:09:11
 * @filename common-layout.css
 */


.content-left {
    float: left;
    width: 700px;
}

.content-right {
    padding-left: 10px;
    float: left;
    width: 300px;
}

.foot-placeholder {
    float: left;
    width: 100%;
    height: 50px;
}

.mobile-only {
    display: none;
}

.mobile-hidden {
    display: block;
}

.desktop-only {
    display: block;
}

.desktop-only-inline {
    display: inline;
}

.desktop-only-inline-block {
    display: inline-block;
}

.nav-left {
    display: block;
    float: left;
    top: 0px;
    width: 180px;
    height: 100%;
    position: fixed;
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #515865;
}

.nav-scroll {
    height: 100%;
    overflow-y: auto;
}

.nav-left li {
    display: block;
    color: white;
}

.nav-left li>a {
    color: white;
    line-height: 25px;
}

/** 移动端样式放在最后 **/
@media screen and (max-width: 800px) {
    /** mobile **/
    .content-left {
        width: 100%;
    }

    .content-right {
        padding-left: 0px;
        width: 100%;
    }

    .mobile-only {
        display: block;
    }

    .mobile-hidden {
        display: none;
    }

    .desktop-only, .desktop-only-inline, .desktop-only-inline-block {
        display: none;
    }

}
