/* concert/index.html: narrow-screen spacing rhythm */
@media screen and (max-width: 767px) {
    /* Main section headings: clear separation, without the desktop-sized gap. */
    #contents > h2 {
        margin: 2.4rem 0 0.65rem;
        line-height: 1.2;
    }

    /* Section introductions align to the content width on narrow screens. */
    #contents > h2 + p {
        box-sizing: border-box;
        width: auto;
        margin: 0 1rem 1.25rem;
    }

    /* Keep a visible gap between content groups. */
    #contents > .twoCol {
        margin: 0 0 2rem;
    }

    /* Tighten spacing inside each performance item. */
    #contents > .twoCol > .inner {
        margin: 0 0 1.35rem;
    }

    #contents > .twoCol > .inner:last-child {
        margin-bottom: 0;
    }

    #contents > .twoCol > .inner > h4 {
        margin: 0.25rem 0 0.55rem;
    }

    #contents > .twoCol > .inner > .image {
        margin: 0 0 0.4rem;
    }

    #contents > .twoCol > .inner > p {
        margin: 0.35rem 0 0.7rem;
    }

    #contents > .twoCol > .inner > p:last-child {
        margin-bottom: 0;
    }

    /* The first section follows the page menu; the past heading is followed
       directly by an item title rather than an introductory paragraph. */
    #contents > #headmenu + h2 {
        margin-top: 1.35rem;
    }

    #contents > h2#past + h4 {
        margin: 0 0 0.65rem;
    }
}