/* OVERVIEW */

.hg_gallery__flexcontainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border: 1px #e3e3e3 solid;
}

.hg_gallery__flexelement {
    padding: 5px;
}

.hg_gallery__overview:nth-child(even) {
    background: #F4F4F4;
}

.hg_gallery__overview:nth-child(odd) {
    background: #E7EDF1;
}

.hg_gallery__overview .hg_gallery_overview_thumb {
    max-width: 130px;
    height: auto;
}

.hg_gallery__overview_title-atag {
    font-size: 1.05rem;
}

.hg_gallery__overview_descr, .hg_gallery__overview_count {
    padding-top: 5px;
}

.hg_gallery__overview_count {
    font-size: 0.75rem;
}

.hg_gallery__green_italic {
    margin-bottom: 3px;
    font-size: 83%;
    color: green;
    font-style: italic;
}


/* SINGLE_VIEW */

.hg_gallery__single_head {
    background: #E7EDF1;
    border: 1px #e3e3e3 solid;
    padding: 7px 10px;
}

.hg_gallery__single_head_title {
    font-size: 1.2rem;
    padding-bottom: 6px;
}

.hg_gallery__single_head_descr {
    font-size: 0.9rem;
    padding-bottom: 10px;
}

.hg_gallery__single_head_atag-back {
    font-size: 0.75rem;
    color: #0000EE;
    text-decoration: underline;
}

.hg_gallery__single_flexcontainer {
    margin: 0 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
       -ms-flex-pack: justify;
            justify-content: space-between;
}

.hg_gallery__single_flexitem {
    border: 1px solid lightgray;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 180px;
            flex: 0 0 180px; /* setting the three properties: flex-grow, flex-shrink, flex-basis */
    text-align: center;
    margin: 5px 2px 10px; /* top, left u. right, bottom */
    background-color: #F8F8F8;
    padding-bottom: 5px;
}

figure.hg_gallery__single-figure,
figcaption.hg_gallery__single-figcaption {
    margin: 0;
}

figcaption.hg_gallery__single-figcaption {
    
}

figure.hg_gallery__single-figure img {
    width: 100%;
}

.hg_gallery__single_hr1, .hg_gallery__single_hr2 {
    border-width: 0;
    height: 1px;
    background: #c0c0c0;
}

.hg_gallery__single_hr1 {
     margin-top: 5px;
 }

.hg_gallery__single_hr2 {
    margin-bottom: 5px;
}

@media screen and (max-width: 580px) {
    
    .hg_gallery__single_flexcontainer {
        -webkit-box-pack: center;
           -ms-flex-pack: center;
                justify-content: center;
    }

    .hg_gallery__single_flexitem {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%; /* setting the three properties: flex-grow, flex-shrink, flex-basis */
        margin: 5px 0px 10px; /* top, left u. right, bottom */
    }
    
    figure.hg_gallery__single-figure {
        width: 106.5%;
    }
}