.singleblog {
    padding-top: 100px
}

.post-side {
    width: calc(100% - 380px)
}

.sidebar {
    width: 350px
}

main .rt-bg {
    background-color: var(--color2)
}

.rt-post {
    padding: 45px
}

.rt-post .title {
    width: calc(100% - 55px);
    margin-top: 3px;
    color: #fff
}

.rt-post .info {
    margin-top: 15px
}

.rt-post .info li {
    padding: 5px 0 5px 35px;
    color: #ddd
}

.rt-post .info li.tags {
    display: none;
}

.rt-post .info li:last-child {
    padding-left: 0
}

.rt-post .info li i {
    margin: 2px 0 0 7px
}

.rt-post .info li a {
    display: inline-block;
    margin: 0 2.5px;
    border-radius: 30px;
    padding: 2px 10px;
    background-color: #eaecf0;
    color: #6b6b6b;
    font-size: 13px
}

.rt-post .rt-matn {
    margin-top: 20px
}

.rt-post .pic {
    display: flex;
    justify-content: center;
    float: right;
    width: 100%;
    margin-top: 20px;
}

.rt-post .btn-share {
    width: 45px;
    height: 45px;
    background-color: var(--blur);
    color: #fff
}



.rt-box {
    padding: 20px
}

.rt-box .title,
.top-boxs .title {
    border-bottom: 1px rgba(255, 255, 255, 0.07) solid;
    margin-bottom: 10px;
    color: #ddd
}

.rt-box .title .name,
.top-boxs .title .name {
    margin-bottom: -1px;
    border-bottom: 1px var(--color) solid;
    padding-bottom: 10px
}

.rt-box ul li {
    padding: 13px 0
}

.rt-box ul li .pic {
    width: 100px;
    height: 75px
}

.rt-box ul li .inside {
    width: calc(100% - 120px)
}

.rt-box ul li .inside h2 a {
    padding-bottom: 7px;
    color: #ddd
}

.rt-box ul li .inside span i {
    margin: 5px 0 0 7px
}

.rt-box ul li .inside span {
    color: #999
}

.top-boxs {
    padding: 20px;
    margin-bottom: 25px
}

.top-boxs ul li {
    width: 50%
}

.top-boxs ul li>a {
    padding: 10px 0 10px 20px;
    margin: 3px 0;
    color: #ddd
}

.top-boxs ul li>a:before {
    content: "";
    width: 7px;
    height: 7px;
    background-color: var(--color2);
    border-radius: 50%;
    margin-left: 7px;
    display: inline-block
}

.top-boxs ul li.active>a {
    color: var(--color);
    font-weight: bold
}


.rt-box ul li .inside h2 a:hover,
.top-boxs ul li>a:hover {
    color: var(--color)
}

.rt-box ul li .pic:hover,
.rt-post .btn-share:hover {
    opacity: .8
}

.rt-post .info li a:hover {
    color: #fff;
    background-color: var(--color)
}

.rt-comments {
    padding: 35px 30px
}


@media only screen and (max-width:940px) {
    .rt-comments {
        padding: 30px 0
    }

    .post-side,
    .sidebar {
        width: 100%
    }

    .sidebar {
        position: inherit !important;
        top: inherit !important;
        margin-top: 25px
    }

    .singleblog {
        padding-top: 75px
    }

    .rt-post {
        padding: 20px
    }

    .rt-post .title {
        font-size: 18px
    }

    .rt-post .info li:last-child {
        float: right
    }

    .rt-post .info li {
        margin-bottom: 5px;
        font-size: 13px
    }

    .rt-post .btn-share {
        width: 35px;
        height: 35px;
        font-size: 16px
    }
}