.bounding {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-flow: row wrap;
                flex-flow: row wrap;
}



/* Mobile first */

article,
aside {
        padding: 0px;
        margin: 0px;
        -webkit-flex: 1 100%;
                flex: 1 100%;
}



article {
        background: none;
}

aside {
        background: none;
}





/* -------------------------  mid -------------------------  */

@media all and (min-width: 560px) {


        article {
                webkit-order: 2;
                       order: 2;
        }

        aside {
                -webkit-order: 1;
                         order: 1;

                -webkit-flex: 1 100%;
                        flex: 1 100%;
        }
}



/* ------------------------------------ Large ---------------------------- */

@media all and (min-width: 1000px) {
        article {
                -webkit-flex: 1 1 0%;
                        flex: 1 1 0%;
                -webkit-order: 2;
                        order: 2;

        }

        aside {
                -webkit-flex: 1 1 0%;
                        flex: 1 1 0%;
                -webkit-order: 1;
                        order: 1;
                padding-right:20px;
        }
}