/* Posts container*/
.posts{
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.post{
  color: rgb(220,220,230);
  width: 100%;
  padding: 0.5rem 1rem;
  border-top: solid;
  border-width: 2px;
  border-color: rgb(51,48,54, 1);
}

.post-title{
    padding: 0 0 0.1rem 0;
    font-size: calc(12px + 1.0vw);
    font-weight: 400;
    text-align: center;
}

.post-skills{
    color: #C586C0;
    padding: 0.1rem 0 0.5rem 0;
    font-size: calc(8px + 0.5vw);
    font-weight: 400;
    text-align: center;
}

.skill{
    display: inline-block;
}

.post-image-wrapper{
    float: left;
    width: 38%;
    aspect-ratio: 9 / 8;
}

.post-image{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.post-summary-wrapper{
    float: right;
    width: calc(62% - 12px);
    margin: 5px 5px;
    text-align: justify;
    font-size: small;
    overflow-y: hidden;
}

.read-more{
    color: #b1ccff;
    padding-top: 5px;
    float: left;
    font-size: small;
}


@media (min-width: 768px) {
    .post {
      width: 50%;
    }
}


@media (min-width: 1024px) {
    .post-summary-wrapper{
        font-size: large;
    }

    .read-more{
        font-size: large;
    }
}