@import "_common.css";
@import "_menu.css";
@import "_back_to_top.css";

@media (min-width: 481px) {
    #mnp-rheims {
        grid-template-rows: 1fr auto;
    }
    #mnp-rheims h1 {
        grid-column: 1/6;
        grid-row: 1;
        align-self: center;
    }
    #mnp-rheims span {
        grid-column: 4/6;
        grid-row: 2;
        align-self: end;
    }
    #mnp-rheims img {
        grid-column: 6/11;
        grid-row: 1/3;
    }
    #mnp-rheims div {
        grid-column: 13;
        text-align: right;
        align-self: center;
    }
    #mnp-rheims hr {
        grid-column: 4/11;
        grid-row: 3;
    }

    #rheims {
        grid-template-rows: auto auto 1fr;
    }
    #rheims span:first-of-type {
        grid-column: 8/6;
        grid-row: 3;
        align-self: end;
        text-align: right;
    }
    #rheims span:last-of-type {
        grid-column: 13/11;
        grid-row: 1;
        align-self: end;
        text-align: right;
    }
    #rheims img:first-of-type {
        grid-column: 2/6;
        grid-row: 1/4;
    }
    #rheims img:last-of-type {
        grid-column: 6/11;
        grid-row: 1;
    }
    #rheims hr:first-of-type {
        grid-column: 6/13;
        grid-row: 2;
    }
    #rheims hr:last-of-type {
        grid-column: 2/8;
        grid-row: 4;
    }

    #grinta video {
        display: none;
    }
    #grinta span {
        grid-column: 1/3;
        grid-row: 1;
        align-self: end;
    }
    #grinta img {
        grid-column: 4/13;
    }
    #grinta hr {
        grid-column: 1/13;
        grid-row: 2;
    }

    #greco-gapaillard {
        grid-template-rows: 1fr auto auto;
    }
    #greco-gapaillard span:first-of-type {
        grid-column: 1/3;
        grid-row: 3;
        align-self: end;
    }
    #greco-gapaillard span:last-of-type {
        grid-column: 13/11;
        grid-row: 1;
        align-self: end;
        text-align: right;
    }
    #greco-gapaillard img:first-of-type {
        grid-column: 3/8;
        grid-row: 1/4;
    }
    #greco-gapaillard img:last-of-type {
        grid-column: 8/12;
        grid-row: 3;
        align-self: end;
    }
    #greco-gapaillard hr:first-of-type {
        grid-column: 8/13;
    }
    #greco-gapaillard hr:last-of-type {
        grid-column: 1/8;
        grid-row: 4;
    }

    #bouquet-colbert {
        grid-template-rows: auto auto 1fr;
    }
    #bouquet-colbert span:first-of-type {
        grid-column: 2/4;
        grid-row: 3;
        align-self: end;
    }
    #bouquet-colbert span:last-of-type {
        grid-column: 13/11;
        grid-row: 3;
        text-align: right;
    }
    #bouquet-colbert img:first-of-type {
        grid-column: 4/8;
        grid-row: 1/4;
    }
    #bouquet-colbert img:last-of-type {
        grid-column: 8/12;
        grid-row: 1;
    }
    #bouquet-colbert hr:first-of-type {
        grid-column: 8/13;
    }
    #bouquet-colbert hr:last-of-type {
        grid-column: 2/8;
        grid-row: 4;
    }

    #schwoerer-degez {
        grid-template-rows: auto auto auto 1fr;
    }
    #schwoerer-degez img:first-of-type {
        grid-column: 1/8;
        grid-row: 1;
    }
    #schwoerer-degez img:last-of-type {
        grid-column: 8/12;
        grid-row: 1/5;
    }
    #schwoerer-degez span:first-of-type {
        grid-column: 1/3;
        grid-row: 3;
    }
    #schwoerer-degez span:last-of-type {
        grid-column: 5/7;
        grid-row: 4;
        align-self: end;
    }
    #schwoerer-degez hr:last-of-type {
        grid-column: 1/8;
        grid-row: 2;
    }
    #schwoerer-degez hr:first-of-type {
        grid-column: 5/12;
        grid-row: 5;
    }

    #hamon img:last-of-type {
        grid-column: 1/5;
        grid-row: 1;
    }
    #hamon img:first-of-type {
        grid-column: 5/9;
    }
    #hamon span {
        grid-column: 11/9;
        align-self: end;
        text-align: right;
    }
    #hamon hr:first-of-type {
        grid-column: 1/11;
        grid-row: 2;
    }
    #hamon hr:last-of-type {
        display: none;
    }

    #schwoerer img {
        grid-column: 5/11;
    }
    #schwoerer span {
        grid-column: 3/5;
        align-self: end;
        grid-row: 1;
    }
    #schwoerer hr {
        grid-column: 3/11;
        grid-row: 2;
    }

    #chic-legrand {
        grid-template-rows: auto auto auto 1fr;
    }
    #chic-legrand img:first-of-type {
        grid-column: 2/6;
        grid-row: 1;
    }
    #chic-legrand img:last-of-type {
        grid-column: 6/13;
        grid-row: 1/5;
    }
    #chic-legrand span:first-of-type {
        grid-column: 1;
        grid-row: 3;
    }
    #chic-legrand span:last-of-type {
        grid-column: 3/5;
        grid-row: 4;
        align-self: end;
    }
    #chic-legrand hr:first-of-type {
        grid-column: 1/6;
        grid-row: 2;
    }
    #chic-legrand hr:last-of-type {
        grid-column: 3/13;
        grid-row: 5;
    }

    #trautmann-stelzenberger img:first-of-type {
        grid-column: 7/11;
        grid-row: 1;
    }
    #trautmann-stelzenberger img:last-of-type {
        grid-column: 3/7;
        grid-row: 1;
        align-self: end;
    }
    #trautmann-stelzenberger span:first-of-type {
        grid-column: 13/11;
        grid-row: 1;
        align-self: end;
        text-align: right;
    }
    #trautmann-stelzenberger span:last-of-type {
        grid-column: 1/3;
        grid-row: 1;
        align-self: end;
    }
    #trautmann-stelzenberger hr:first-of-type {
        grid-column: 1/7;
        grid-row: 2;
    }
    #trautmann-stelzenberger hr:last-of-type {
        grid-column: 7/13;
        grid-row: 2;
    }

    #schwoerer-schaffner {
        grid-template-rows: auto auto 1fr;
    }
    #schwoerer-schaffner img:last-of-type {
        grid-column: 3/7;
        grid-row: 1/4;
    }
    #schwoerer-schaffner img:first-of-type {
        grid-column: 7/12;
        grid-row: 1;
    }
    #schwoerer-schaffner span:last-of-type {
        grid-column: 1/3;
        grid-row: 3;
        align-self: end;
    }
    #schwoerer-schaffner span:first-of-type {
        grid-column: 13/11;
        grid-row: 3;
        text-align: right;
    }
    #schwoerer-schaffner hr:first-of-type {
        grid-column: 7/13;
        grid-row: 2;
    }
    #schwoerer-schaffner hr:last-of-type {
        grid-column: 1/7;
    }

    #degez-schwoerer img:first-of-type {
        grid-column: 3/7;
        grid-row: 1;
    }
    #degez-schwoerer img:last-of-type {
        grid-column: 7/11;
        grid-row: 1;
    }
    #degez-schwoerer span:first-of-type {
        grid-column: 1/3;
        grid-row: 1;
        align-self: end;
    }
    #degez-schwoerer span:last-of-type {
        grid-column: 13/11;
        grid-row: 1;
        align-self: end;
        text-align: right;
    }
    #degez-schwoerer hr:first-of-type {
        grid-column: 1/7;
        grid-row: 2;
    }
    #degez-schwoerer hr:last-of-type {
        grid-column: 7/13;
        grid-row: 2;
    }

    #lipppmann span {
        grid-column: 3/5;
        align-self: end;
        grid-row: 1;
    }
    #lipppmann img {
        grid-column: 5/11;
    }
    #lipppmann hr {
        grid-column: 3/11;
        grid-row: 2;
    }

    #onset {
        grid-template-rows: auto 1fr;
    }
    #onset img:first-of-type {
        grid-column: 2/6;
        grid-row: 1;
    }
    #onset img:last-of-type {
        grid-column: 6/11;
        grid-row: 1/3;
    }
    #onset span {
        grid-column: 13;
        grid-row: 2;
        align-self: end;
        text-align: right;
    }
    #onset hr:first-of-type {
        grid-column: 2/6;
        grid-row: 2;
    }
    #onset hr:last-of-type {
        grid-column: 6/13;
        grid-row: 3;
    }
}

@media (max-width: 480px) {
    header nav ul li:first-of-type {
        display: none;
    }

    #mnp-rheims {
        margin-top: 33px;
    }
    #mnp-rheims span {
        text-align: right;
    }
    #mnp-rheims h1 {
        margin-top: 19px;
    }
    #mnp-rheims div {
        display: none;
    }

    #rheims img {
        margin-top: 39px;
    }
    #rheims span {
        text-align: right;
    }

    #grinta {
        margin-top: 36px;
    }
    #grinta img {
        display: none;
    }
    #grinta span {
        text-align: right;
    }

    #greco-gapaillard {
        margin-top: 28px;
    }
    #greco-gapaillard span {
        text-align: right;
    }
    #greco-gapaillard img:last-of-type {
        margin-top: 35px;
    }

    #bouquet-colbert {
        margin-top: 30px;
    }
    #bouquet-colbert img:first-of-type {
        grid-column: 2/-2;
        width: calc(100% + (2 * var(--gutters)));
        transform: translateX(calc(var(--gutters) * -1));
    }
    #bouquet-colbert hr:first-of-type {
        grid-column: 1/-2;
        width: calc(100% + 20px);
    }
    #bouquet-colbert img:last-of-type {
        margin-top: 34px;
    }
    #bouquet-colbert span:last-of-type {
        text-align: right;
    }

    #schwoerer-degez {
        margin-top: 36px;
    }
    #schwoerer-degez span {
        text-align: right;
    }
    #schwoerer-degez img:last-of-type {
        margin-top: 30px;
    }

    #hamon img:first-of-type {
        margin-top: 25px;
        grid-column: 2/-2;
        width: calc(100% + (2 * var(--gutters)));
        transform: translateX(calc(var(--gutters) * -1));
    }
    #hamon hr:first-of-type {
        grid-column: 1/-2;
        width: calc(100% + 20px);
    }
    #hamon span {
        text-align: right;
    }

    #schwoerer {
        margin-top: 33px;
    }
    #schwoerer span {
        text-align: right;
    }

    #chic-legrand img {
        margin-top: 35px;
    }
    #chic-legrand span {
        text-align: right;
    }

    #trautmann-stelzenberger {
        margin-top: 34px;
    }
    #trautmann-stelzenberger img:last-of-type {
        margin-top: 27px;
    }
    #trautmann-stelzenberger span {
        text-align: right;
    }

    #schwoerer-schaffner img {
        margin-top: 33px;
    }
    #schwoerer-schaffner span {
        text-align: right;
    }

    #degez-schwoerer img {
        margin-top: 33px;
    }
    #degez-schwoerer img:first-of-type {
        grid-column: 2/-2;
        width: calc(100% + (2 * var(--gutters)));
        transform: translateX(calc(var(--gutters) * -1));
    }
    #degez-schwoerer hr:first-of-type {
        grid-column: 1/-2;
        width: calc(100% + 20px);
    }
    #degez-schwoerer span:last-of-type {
        text-align: right;
    }

    #lipppmann {
        margin-top: 32px;
    }
    #lipppmann span {
        text-align: right;
    }

    #onset {
        margin-top: 33px;
    }
    #onset img:first-of-type {
        grid-column: 2/-2;
        width: calc(100% + (2 * var(--gutters)));
        transform: translateX(calc(var(--gutters) * -1));
    }
    #onset hr:first-of-type {
        grid-column: 1/-2;
        width: calc(100% + 20px);
    }
    #onset span {
        text-align: right;
    }

}