@media screen and (max-width: 700px) {

    body {
        position: relative;
        top: 0;
    }

    :root {
        --unit-feinregler: 27px;
        /*--zab-9: calc(var(--unit) * 9);*/
        /*--font-size-9: calc(var(--unit) * 8);*/
        --unit-body-margin: calc(var(--unit) * 5);
        --unit-padding-top-bottom: calc(var(--unit) * 3);
        --variable-colums-number: 2;

        --zab-9: calc(var(--unit) * 8.0);

    }


    .header-container {
            grid-template-columns: 2fr 3fr 2fr;

    width: 100%;
}


.book-title-container {
    position: relative;
    max-width: 97%;
   
   
}

.book-pic img.active {
    width: 100%;
}

.four-col-container {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    border: var(--variable-border);
    grid-column-gap: var(--square-36);

}


}