@media all and (min-width: 49rem) {

    body {

    }

    body:after {
        content: 'viewport-l';
        display: none;
    }

    head {
        font-family: 'viewport-l';
    }

    /* header */

    #header {
        max-width: 48rem;
    }
    #header .ce-gallery {
        grid-column: span 4;
        grid-column-gap: 1rem;
        grid-row-gap: 0;
    }
    #header .ce-bodytext {
        grid-column: span 20;
        padding: 0;
    }
    #header h1 {
        font-size: 1.6875rem;
    }
    #header h2 {
        font-size: 1.5rem;
    }



    /* main */

    #content-container {
        max-width: 48rem;
    }
    #content {
        grid-column: 1 / span 8;
    }

    /* sidebar */

    #sidebar {
        grid-column: 10 / span 3;
        margin-top: -2rem;
    }




    /* grid elements */

    .grid-25 { float: left; width: 25%; padding-right: 1rem; }
    .grid-33 { float: left; width: 33%; padding-right: 1rem; }
    .grid-40 { float: left; width: 40%; padding-right: 1rem; }
    .grid-50 { float: left; width: 50%; padding-right: 1rem; }
    .grid-60 { float: left; width: 60%; padding-right: 1rem; }
    .grid-66 { float: left; width: 66%; padding-right: 1rem; }
    .grid-75 { float: left; width: 75%; padding-right: 1rem; }

    #footer-content .grid-25 { padding: 0 1rem; }

}