.post {
    padding: 1rem 0.5rem;
    margin: 1.2rem 0.2rem;
    outline-offset: 0.2rem;
    outline: 2px solid rgb(19, 172, 155);
    outline-style: inset;
    background-color: #e07d69be;
    transition: all 0.2s ease-in-out;
    max-width: 675px;
}
.post:hover {
    outline-offset: 0rem;
    outline-width: 3px;
}
.post a {
    cursor: default;
    text-decoration: none;
    color: rgb(9, 69, 62);
}
.post-header {
    text-align: center;
    color: rgb(9, 69, 62);
    padding: 0.5rem 1.2rem;
    border-block: 02px dashed rgb(90, 90, 90);
    transition: 0.2s;
}
.post-header:hover {
    background-color: rgba(255, 255, 255, 0.112);
}
    .post-body {
    text-shadow: 0.01rem 0.01rem 0.02rem rgb(1, 51, 45);
    color: rgb(16, 41, 37);
    padding: 1.2rem 1rem 0 0.8rem;
}

.post-container{
    padding: 2rem;
    max-width: 1000px;
    font-size: 1rem;
    letter-spacing: 0.05rem;
    line-height: 1.5rem;
}
.post-container p {
    color: black;
}

.post-container h2,h3,h4 {
    font-weight: 700;
    color: var(--bs-secondary);
}

.post-container h2{
    margin-top: 2rem;
    margin-bottom: 1.2rem;
}

.post-container h1,h2,h3 {
    color:rgb(7, 49, 45);
    margin-top: 1.2rem;
}
.post-container img {
    padding: 1rem;
    width: 100%;
    max-height: 250px;
    object-fit: scale-down;
}
.wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;

}
.wrap > div:first-child{
    flex: 1 0 100%;
    padding-bottom: 2rem;
    display: inline-flex;
    justify-content: center;
    border-bottom: #352a2a85 1px solid;
}
.wrap > * {
    flex: 1 1 calc(50% - 1rem);
    margin-inline-end: 1rem;
    min-width: 250px;
    max-width: 675px;
}

@media screen and (min-width: 700px) {
    .post-container {
        font-size: 1.1rem;
    }
    .post-container h2 {
        font-size: 2rem;
    }
}
@media screen and (min-width: 900px) {
    .post-container {
        font-size: 1.2rem;
    }
    .post-container h2 {
        font-size: 2.2rem;
    }
}