@media all and (max-width: 1300px) {
    .post {
        width: 50%;
    }
    #arrow-up {
        right: calc((100% - 50%)/4 - 2.5vh);
        top: 80vh;
    }
}

@media all and (max-width: 1150px) {
    .post {
        width: 55%;
    }

    #arrow-up {
        right: calc((100% - 55%)/4 - 2.5vh);
        top: 80vh;
    }
}

@media all and (max-width: 950px) {
    .header-content h1 {
        font-size: 16px;
    }

    .text-content span,
    .read-full {
        font-size: 14px;
    }

    .post-time {
        font-size: 12px;
    }
}

@media all and (max-width: 800px) {
    .post {
        width: 60%;
    }

    #arrow-up {
        right: calc((100% - 60%)/4 - 2.5vh);
        top: 80vh;
    }
}

@media all and (max-width: 768px) {

    #feed-body {
        margin-top: calc(10vh + 20px);
    }

    #alert {
        font-size: 14px;
        width: 155px;
        height: 45px;
    }

    .alert-noactive {
        top: 105vh !important;
        opacity: 0;
        right: unset;
    }
    
    .alert-active {
        right: unset;
        top: 60vh !important;
        opacity: 1;
    }

    .text-content span {
        line-height: 18px;
    }
    
    #arrow-up:hover {
    transform: none;
    box-shadow:     box-shadow: 0px 5px 10px 0px rgb(0, 0, 0);
}
}

@media all and (max-width: 580px) {
    .post {
        width: 65%;
    }

    #arrow-up {
        right: calc((100% - 65%)/4 - 2.5vh);
        top: 70vh;
    }

    .header-content h1 {
        font-size: 16px;
    }

    .text-content span,
    .read-full {
        font-size: 14px;
    }

    .text-content span {
        line-height: 16px;
    }

    .post-time {
        font-size: 10px;
    }

    #copy-alert {
        font-size: 13px;
        width: 135px;
        height: 40px;
    }

    .to-post-img {
        width: 12px;
    }

    .button {
        font-size: 12px;
    }
}

@media all and (max-width: 460px) {
    .post {
        width: 95%;
    }

    #copy-alert {
        font-size: 12px;
        width: 135px;
        height: 35px;
    }


}