.author-avatar {
    width: 24px;
    height: 24px;
    margin-right: 8px;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    cursor: pointer;
}

.detail-tags {
    width: 48px;
    height: 24px;
    border: 1px solid #D0191E;
    color: #D0191E;
    background-color: #fdf3f4;
}

.detail-line {
    width: 100px;
    height: 2px;
    background-color: #EEEEEE;
    margin-top: 24px;
    margin-bottom: 24px;
}

.detail-capsule {
    width: 140px;
    height: 60px;
}

.detail-capsule {
    width: 140px;
    height: 60px;
    border: 1px solid #bbbbbb;
    border-radius: 30px;
    cursor: pointer;
}

.detail-capsule .icon {
    width: 24px;
    height: 24px;
}

.detail-capsule:hover {
    border: 1px solid #D0191E;
}

.detail-share {
    height: 100px;
    background-color: #f4f4f4;
    border-top: 6px solid #D0191E;
    padding-left: 24px;
    padding-right: 32px;
}

.detail-share .icon {
    width: 38px;
    height: 38px;
}

.publisher-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.evaluate-item:first-child {
    margin-top: 20px;
}

.evaluate-item:not(:first-child) {
    margin-top: 32px;
}

.evaluate-content {
    padding: 16px;
    border-radius: 8px;
    background-color: #f4f4f4;
}

.evaluate-operate .icon {
    width: 20px;
    height: 20px;
    margin-right: 9px;
}

.common-right .info-item:first-child {
    margin-top: 12px;
}

.common-right .info-item:not(:first-child) {
    margin-top: 20px;
}

.info-item {

}

.info-item-left {
    width: calc(70% - 12px);
}

.info-item-tags {
    width: 40px;
    height: 23px;
    background-color: #F4F4F4;
}

.info-item-img {
    width: 30%;
    height: 70px;
}

.info-item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

@media screen and (max-width: 850px) {
    h3{
        font-size: 20px !important;
    }
    .common-right {
        display: none;
    }
    .sidebar {
        padding: 10px;
        display: flex;
        justify-content: center;

        .div {
            display: block;
        }
    }

    .common-left {
        width: 100%;
        margin-right: 5px;
        h1{
            font-size: 25px;
        }
    }
    .bottom-height {
        height: 30px !important;
    }
    .footer {
        p {
            font-size: 12px;
        }

        a {
            font-size: 12px;
        }
    }

    .footer-right {
        display: none;
    }

    .box-left {
        display: flex;
        justify-content: space-between;
    }

    .footer-logo {
        margin-top: 0;
    }

    .bottom-width {
        width: 20px !important;
    }
    .detail-capsule{
        width: 100px;
        height: 40px;
        border: 1px solid #bbbbbb;
        border-radius: 20px;
        cursor: pointer;
    }

    .detail-share {
        height: 60px;
        border-top: 3px solid #D0191E;

        span {
            font-size: 14px;
        }

        div {
            display: flex;
        }
    }

    .detail-share .icon {
        width: 25px;
        height: 25px;
    }

    .live-history-operate .icon {
        width: 15px;
        height: 15px;
    }

    .add-like, .comment-child {
        span {
            font-size: 12px !important;
        }
    }

    .icon-dianzan {
        background: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20width%3D%27100%25%27%20height%3D%27100%25%27%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20id%3D%22icon-dianzan%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cpath%20d%3D%22M411.904%20153.728c19.808-63.232%2054.176-90.24%20122.016-70.656l1.728%200.544c19.84%206.08%2042.656%2017.728%2064.064%2037.184%2033.728%2030.72%2053.76%2073.28%2053.76%20126.784%200%2047.808-2.752%2077.312-10.88%20110.816l-0.256%200.96h175.488c107.264%200%20149.888%2072.32%20122.944%20192.64l-2.304%209.888-5.472%2017.984-20.608%2067.136-9.632%2030.656-9.184%2028.672-17.056%2051.648-11.648%2033.6-7.232%2020.064-9.984%2026.368-6.08%2015.232c-29.536%2071.264-90.464%20104-170.112%2094.592l-387.136-28.8a568.032%20568.032%200%200%200-7.36-0.32l-15.36-0.352H218.016l-12.48-0.224-9.984-0.416-8.32-0.768-3.712-0.576-7.136-1.408-11.52-3.008c-59.36-17.632-90.24-67.936-90.24-139.616v-283.52c0-90.56%2054.944-142.208%20148.576-142.208l75.776-0.032%205.184-3.968a293.6%20293.6%200%200%200%2072.256-88.32l6.08-11.968c6.112-12.544%2011.104-25.664%2015.84-40.992l0.768-2.592%2012.8-45.024z%20m88.64%208.064c-1.824-0.416-2.624%200.16-3.52%202.784l-3.872%2014.912-10.688%2038.464-2.56%208.512c-5.44%2018.24-12.32%2036-20.544%2053.184a387.84%20387.84%200%200%201-72.64%20102.432c-15.04%2015.584-31.52%2029.664-49.28%2042.016l5.504-3.904v417.408l336.704%2025.344c41.888%204.896%2065.6-6.112%2080.192-36.096l2.88-6.24%205.76-14.4%209.504-25.152%206.912-19.296%2011.2-32.448%208.096-24.064%2017.344-53.76%2019.2-61.376%2015.456-50.848c18.976-76.064%207.808-94.592-38.368-94.592h-217.664a53.696%2053.696%200%200%201-50.752-71.136l2.176-6.4%203.328-10.912c10.304-35.744%2013.248-59.136%2013.248-108.64%200-48.416-26.88-72.96-57.056-82.24l-3.712-1.152-6.816-2.4z%20m-242.912%20270.112H223.232c-47.616%200-63.232%2014.72-63.232%2056.928v283.52c0%2038.016%209.92%2053.344%2033.792%2059.008l1.504%200.32%203.744%200.576%205.12%200.416%2011.552%200.256h28.608l13.312%200.096V431.904z%22%20fill%3D%22%23999999%22%20opacity%3D%22.9%22%20%3E%3C%2Fpath%3E%3C%2Fsvg%3E) no-repeat;
    }

    .evaluate-input {
        height: 30px;
    }


}