/* Simple flex-box styles */
@media print, (min-width: 640px) {
    .flex-container {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-align-content: stretch;
        -ms-flex-line-pack: stretch;
        align-content: stretch;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .flex-container.flex-between {
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .flex-item {
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
        -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        -webkit-align-self: auto;
        -ms-flex-item-align: auto;
        align-self: auto;
    }

    .flex-container.flex-padded .flex-item > div {
        padding: 1em;
    }

    .flex-container.flex-padded .flex-item:first-child > div {
        padding-left: 0;
    }

    .flex-container.flex-padded .flex-item:last-child > div {
        padding-right: 0;
    }

    /* Columns */
    .flex-cols-2 .flex-item {
        -webkit-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
    }

    .flex-cols-3 .flex-item {
        -webkit-flex: 0 1 33.333%;
        -ms-flex: 0 1 33.333%;
        flex: 0 1 33.333%;
    }

    .flex-cols-4 .flex-item {
        -webkit-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
    }
}