/*
 * @file
 * Provides the layout styles for layout_twocol.
 */

.layout--twocol-wide {
    display: flex;
    flex-wrap: wrap;
    flex-direction:column;
}

.layout--twocol-wide > .layout__region {
    /*   Not sure if anything needed here for mobile*/
}


@media screen and (min-width: 40em) {
    .layout--twocol-wide {
        flex-wrap: nowrap;
        flex-direction: row;
    }

    .layout--twocol-wide > .layout__region--first,
    .layout--twocol-wide > .layout__region--second {
        flex-shrink: 1;
    }

    .layout--twocol-wide .wide{
        flex-grow: 2;
    }

    .layout--twocol-wide .narrow{
        flex-grow: 1;
    }
}