﻿

.ip-main {
    margin-top: 2em;
}

.ip-content-1 {
    grid-column-start: 2;
    grid-column-end: 10;
    grid-row-start: 1;
    grid-row-end: 2;
}

.ip-context-1 {
    grid-column-start: 10;
    grid-column-end: 15;
    grid-row-start: 1;
    grid-row-end: 2;
}

.ip-main img {
    width: 100%;
}

.ip-main video {
    width: 100%;
}

.ip-content-1 > img,
.ip-content-1 > video {
    display: none;
}

.ip-content-1 h1 {
    margin-top: 0;
}


.ip-context-1 > nav > ul {
    list-style: none;
    font-size: 150%;
    font-weight: bold;
    padding-left: 0;
    margin-left: 0;
}

    .ip-context-1 > nav > ul > li {
        margin-top: 1em;
    }

    .ip-context-1 > nav > ul > li:first-child {
        margin-top: 0;
    }

    .ip-context-1 > nav > ul ul {
        list-style: disc;
        font-size: 80%;
        font-weight: normal;
    }

        .ip-context-1 > nav > ul ul > li {
            padding-top: 0.4em;
            padding-bottom: 0.4em;
        }


/*******************************************************************************
    Responsive adjustments
*******************************************************************************/

/* bp-major-narrow-max */
@media all and (max-width: 670px) {

    .ip-content-1 {
        grid-column-start: 1;
        grid-column-end: 9;
    }

        .ip-content-1 > h1,
        .ip-content-1 > h2,
        .ip-content-1 > h3,
        .ip-content-1 > p {
            margin-left: var(--ip-narrow-text-margin);
            margin-right: var(--ip-narrow-text-margin);
        }

        .ip-content-1 > img,
        .ip-content-1 > video {
            display: block;
        }

    .ip-context-1 {
        grid-column-start: 1;
        grid-column-end: 9;
        grid-row-start: 2;
        grid-row-end: 3;
    }

        .ip-context-1 > nav {
            margin-left: var(--ip-narrow-text-margin);
            margin-right: var(--ip-narrow-text-margin);
        }

        .ip-context-1 > img,
        .ip-context-1 > video {
            display: none;
        }
}


/* bp-major-wide-min */
@media all and (min-width: 1024px) {
}
