/*
 * Main column and sidebar layout
 */
.blog-main {
    color: #555;
    line-height: 1.2;
}

/*
 * Blog posts
 */
.blog-post {
    margin-bottom: 20px;
}

.blog-post-image {
    content: ' ';
    min-height: 25vh;
    margin: 0;
    padding: 0;

    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.blog-post-content {
    max-height: 40vh;
    overflow: hidden;
    position: relative;
    border: 1px solid #dadada;
    border-radius: 0.25rem;
    padding: 20px;
    transition: max-height 0.35s ease
}

.blog-post-description {
    margin-bottom: 30px;
}

.content-expand {
    max-height: var(--element-height) !important;
    /* height: auto !important; */
}
.state {
    transition: transform 0.35s ease;
}
.content-expand .state {
    transform: rotate(180deg);
}


.blog-post-content-shadow {
    box-shadow: 0px 0px 30px 15px white;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

.blog-post-title {
    font-weight: normal;
    color: #606265;
    margin-bottom: 10px;
}
.blog-post-meta {
    margin-bottom: 40px;
}

.fold-button {
    position: absolute;
    bottom: 5px;
    right: 5px;
 }
 
 .fold-button .state {
    padding: 6px 12px;
    margin-bottom:5px;
    color: #b41f21;
    cursor: pointer;
 }
 .fold-button .state:hover {
    color: #881819;
 }