/****************************************************************************
 * Default Container
 ****************************************************************************/
*:focus{ outline: none !important; }
.wrapper{ position: relative; padding-top: 4rem; }
#content { position: relative; z-index: 0; }


/****************************************************************************
 * Content-Section
 ****************************************************************************/
.content_section{
    position: relative;
    padding: 2rem 1rem;
    margin: 0 auto;
}

.content_section.slim{
    padding: 1rem;
}
.content_section.no_padding_bottom{
    padding-bottom: 0 !important;
}
.content_section.no_padding_top{
    padding-top: 0 !important;
}

/****************************************************************************
 * Post-Thumbnail
 ****************************************************************************/
.post_thumbnail{ position: relative; }


/****************************************************************************
 * Content-Read-More
 ****************************************************************************/
.content_read_more{
    margin-bottom: 1rem; display: inline-block;
}
.content_more{
    opacity: 0; visibility: hidden; max-height: 0;
    overflow: hidden;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -ms-transition: all .25s ease;
    -o-transition: all .25s ease;
    transition: all .25s ease;
}
.content_read_more.toggled + .content_more{
    opacity: 1; visibility: visible; max-height: 999rem;   
}
.content_read_more .expand{ display: block; }
.content_read_more .contract{ display: none; }
.content_read_more.toggled .expand{ display: none; }
.content_read_more.toggled .contract{ display: block; }


@media screen and (min-width: 40em){
    /****************************************************************************
     * Content-Section
     ****************************************************************************/
    .content_section {
        padding: 3rem 2rem;
    }
    .content_section.slim{
        padding: 1rem 2rem;
    }

}

@media screen and (min-width: 64em){
     /****************************************************************************
     * Content-Section
     ****************************************************************************/
    .content_section {
        padding: 4rem 4rem;
    }
    .content_section.slim{
        padding: 1rem 4rem;
    }
}
