/****************************************************************************
 * 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{
    padding: 0 !important;
}
.content_section.no_padding_bottom{
    padding-bottom: 0 !important;
}
.content_section.no_padding_top{
    padding-top: 0 !important;
}
.content_section.no_padding_left{
    padding-left: 0 !important;
}
.content_section.no_padding_right{
    padding-right: 0 !important;
}

/****************************************************************************
 * Image-Sections
 ****************************************************************************/
.content_section.background_image_section{
    padding: 0; overflow: hidden;
}
.content_section.background_image_section .background_image{
    padding: 0 0 75%;
}


/****************************************************************************
 * Content-Container
 ****************************************************************************/
.content_wrapper{
    margin: 0 -0.625rem; position: relative;
}
.content_wrapper:first-child{ margin-top: -0.625rem; }
.content_wrapper:last-child{ margin-bottom: -0.625rem; }
.content_wrapper >  *{
    padding: .625rem; 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;
    }
    
    /****************************************************************************
     * Image-Sections
     ****************************************************************************/
    .content_section.background_image_section .background_image{
        padding: 0 0 66.666%;
    }
    
    /****************************************************************************
     * Content-Container
     ****************************************************************************/
    .content_wrapper{
        margin: 0 -0.9375rem;
        font-size: 0;
    }
    .content_wrapper:first-child{ margin-top: -0.9375rem; }
    .content_wrapper:last-child{ margin-bottom: -0.9375rem; }
    .content_wrapper >  *{
        padding: .9375rem;
        font-size: 1rem;
        display: inline-block;
        vertical-align: top;
        width: 100%;
    }
    
    
    /****************************************************************************
     * Sidebars
     ****************************************************************************/
    .content_wrapper.sidebar_right > .post_content,
    .content_wrapper.sidebar_left > .post_content{
        width: 66.666%;
    }
    .content_wrapper.sidebar_right > .sidebar_content,
    .content_wrapper.sidebar_left > .sidebar_content{
        width: 33.333%;
    }
    .content_wrapper.sidebar_left > .post_content{
        left: 33.333%;
    }
    .content_wrapper.sidebar_left > .sidebar_content{
        left: -66.666%;
    }
    
    
    /****************************************************************************
     * Post-Content Images
     ****************************************************************************/
    .content_section.has_post_thumbnail.image_left .content_wrapper > *,
    .content_section.has_post_thumbnail.image_right .content_wrapper > *{
        width: 50%; 
    }
    .content_section.has_post_thumbnail.image_left .content_wrapper > .post_content{
        left: 50%;
    }
    .content_section.has_post_thumbnail.image_left .content_wrapper > .post_thumbnail{
        left: -50%;
    }
    .content_section.has_post_thumbnail.image_left .content_wrapper > *:first-child:last-child,
    .content_section.has_post_thumbnail.image_right .content_wrapper > *:first-child:last-child{
        width: 100%; left: 0;
    }
}

@media screen and (min-width: 64em){
     /****************************************************************************
     * Content-Section
     ****************************************************************************/
    .content_section {
        padding: 4rem 4rem;
    }
    .content_section.slim{
        padding: 1rem 4rem;
    }
    
    /****************************************************************************
     * Image-Sections
     ****************************************************************************/
    .content_section.background_image_section .background_image{
        padding: 0 0 56.25%;
    }
    
}
