/*================================================================
                 Fluid Grid Styles
================================================================*/

.containerFlex {
    position: relative;
    margin: 0px auto;
    padding: 0px;
    min-width: 16em;
    max-width: 1060px;
    -webkit-transition: all .1s linear;
    -moz-transition: all .1s linear;
    -ms-transition: all .1s linear;
    -o-transition: all .1s linear;
    transition: all .1s linear;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

    /* ## Embedded clearfix on container ## */
    .containerFlex:before, .containerFlex:after {
        content: " ";
        display: table;
    }

    .containerFlex:after {
        clear: both;
    }

.containerFlex {
    *zoom: 1;
}


    /* ## Setup for Padding ## */
    .containerFlex [class*="grid_"] {
        padding: 0 10px;
        -webkit-transition: all .2s linear;
        -moz-transition: all .2s linear;
        -ms-transition: all .2s linear;
        -o-transition: all .2s linear;
        transition: all .2s linear;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

.gutterless {
    padding: 0 10px;
}

    .gutterless > [class*="grid_"] {
        padding: 0 !important;
    }


/* ## 16px baseline (256px) s = small ## */
@media only screen and (min-width:16em) {
    .containerFlex [class*="grid_"] {
        position: relative;
        float: left;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .containerFlex [class*="grid_"]:last-child {
         float: right;
    }

    [class*="grid_"] [class*="grid_"] {
        padding: 0;
    }

    .alpha {
        padding: 0;
    }

    .omega {
        padding: 0;
    }

    .s_1half > [class*="grid_"] {
        width: 50%;
        padding: 0 10px;
    }

    .s_1half > .alpha {
        padding: 0 10px 0 0;
    }

    .s_1half > .omega {
        padding: 0 0 0 10px;
    }

    /* show & hide base helpers */
    .s_showInline {
        display: inline !important;
        visibility: visible !important;
    }

    .s_showBlock {
        display: block !important;
        visibility: visible !important;
    }

    .s_hide {
        display: none !important;
        visibility: hidden !important;
    }
}


/* ## 16px baseline (480px - 767px) sw = small wide ## */
@media only screen and (min-width:30em) {
    [class*="grid_"] [class*="grid_"] {
        padding: 0 10px;
    }

    .alpha {
        padding: 0;
    }

    .omega {
        padding: 0;
    }

    .containerFlex .alpha {
        padding-left: 0;
    }

    .containerFlex .omega {
        padding-right: 0;
    }

    [class*="grid_"] .grid_1 {
        width: 8.333%;
    }

        [class*="grid_"] .grid_1fifth {
        width: 20%;
    }

    [class*="grid_"] .grid_2 {
        width: 16.666%;
    }

    [class*="grid_"] .grid_3 {
        width: 25%;
    }

    [class*="grid_"] .grid_4 {
        width: 33.333%;
    }

    [class*="grid_"] .grid_5 {
        width: 41.666%;
    }

    [class*="grid_"] .grid_6 {
        width: 50%;
    }

    [class*="grid_"] .grid_7 {
        width: 58.333%;
    }

    [class*="grid_"] .grid_8 {
        width: 66.666%;
    }

    [class*="grid_"] .grid_9 {
        width: 75%;
    }

    [class*="grid_"] .grid_10 {
        width: 83.333%;
    }

    [class*="grid_"] .grid_11 {
        width: 91.666%;
    }

    [class*="grid_"] .grid_12 {
        width: 100%;
    }

    .sw_1half > [class*="grid_"] {
        width: 50%;
    }

    .sw_1half > [class*="push_"] {
        left: 50%;
    }

    .sw_1half > [class*="pull_"] {
        left: -50%;
    }

    .sw_1half > [class*="grid_"] .alpha {
        padding: 0 10px 0 0;
    }

    .sw_1half > [class*="grid_"] .omega {
        padding: 0 0 0 10px;
    }

    .sw_1third > [class*="grid_"] {
        width: 33.333%;
    }

    .sw_1third > [class*="push_"] {
        left: 33.333%;
    }

    .sw_1third > [class*="pull_"] {
        left: -33.333%;
    }

    .sw_1third > [class*="grid_"] .alpha {
        padding: 0 10px 0 0;
    }

    .sw_1third > [class*="grid_"] .omega {
        padding: 0 0 0 10px;
    }

    .sw_stack > [class*="grid_"] {
        width: 100%;
    }

    .sw_stack > .alpha, .sw_stack > .omega {
        padding: 0;
    }

    /* show & hide base helpers */
    .sw_showInline {
        display: inline !important;
        visibility: visible !important;
    }

    .sw_showBlock {
        display: block !important;
        visibility: visible !important;
    }

    .sw_hide {
        display: none !important;
        visibility: hidden !important;
    }
}


/* ## 16px baseline (768px) m = medium ## */
@media only screen and (min-width:48em) {
    [class*="grid_"] [class*="grid_"] {
        padding: 0 10px;
    }

    .containerFlex .alpha {
        padding-left: 0;
    }

    .containerFlex .omega {
        padding-right: 0;
    }

    .containerFlex .grid_1 {
        width: 8.333%;
    }

   .containerFlex .grid_1fifth {
        width: 20%;
    }

    .containerFlex .grid_2 {
        width: 16.666%;
    }

    .containerFlex .grid_3 {
        width: 25%;
    }

    .containerFlex .grid_4 {
        width: 33.333%;
    }

    .containerFlex .grid_5 {
        width: 41.666%;
    }

    .containerFlex .grid_6 {
        width: 50%;
    }

    .containerFlex .grid_7 {
        width: 58.333%;
    }

    .containerFlex .grid_8 {
        width: 66.666%;
    }

    .containerFlex .grid_9 {
        width: 75%;
    }

    .containerFlex .grid_10 {
        width: 83.333%;
    }

    .containerFlex .grid_11 {
        width: 91.666%;
    }

    .containerFlex .grid_12 {
        width: 100%;
    }

    .containerFlex .push_1 {
        left: 8.333%;
    }

    .containerFlex .push_2 {
        left: 16.666%;
    }

    .containerFlex .push_3 {
        left: 25%;
    }

    .containerFlex .push_4 {
        left: 33.333%;
    }

    .containerFlex .push_5 {
        left: 41.666%;
    }

    .containerFlex .push_6 {
        left: 50%;
    }

    .containerFlex .push_7 {
        left: 58.333%;
    }

    .containerFlex .push_8 {
        left: 66.666%;
    }

    .containerFlex .push_9 {
        left: 75%;
    }

    .containerFlex .push_10 {
        left: 83.333%;
    }

    .containerFlex .push_11 {
        left: 91.666%;
    }

    .containerFlex .push_12 {
        left: 100%;
    }

    .containerFlex .pull_1 {
        left: -8.333%;
    }

    .containerFlex .pull_2 {
        left: -16.666%;
    }

    .containerFlex .pull_3 {
        left: -25%;
    }

    .containerFlex .pull_4 {
        left: -33.333%;
    }

    .containerFlex .pull_5 {
        left: -41.666%;
    }

    .containerFlex .pull_6 {
        left: -50%;
    }

    .containerFlex .pull_7 {
        left: -58.333%;
    }

    .containerFlex .pull_8 {
        left: -66.666%;
    }

    .containerFlex .pull_9 {
        left: -75%;
    }

    .containerFlex .pull_10 {
        left: -83.333%;
    }

    .containerFlex .pull_11 {
        left: -91.666%;
    }

    .containerFlex .pull_12 {
        left: -100%;
    }

    .containerFlex .prefix_1 {
        margin-left: 8.333%;
    }

    .containerFlex .prefix_2 {
        margin-left: 16.666%;
    }

    .containerFlex .prefix_3 {
        margin-left: 25%;
    }

    .containerFlex .prefix_4 {
        margin-left: 33.333%;
    }

    .containerFlex .prefix_5 {
        margin-left: 41.666%;
    }

    .containerFlex .prefix_6 {
        margin-left: 50%;
    }

    .containerFlex .prefix_7 {
        margin-left: 58.333%;
    }

    .containerFlex .prefix_8 {
        margin-left: 66.666%;
    }

    .containerFlex .prefix_9 {
        margin-left: 75%;
    }

    .containerFlex .prefix_10 {
        margin-left: 83.333%;
    }

    .containerFlex .prefix_11 {
        margin-left: 91.666%;
    }

    .containerFlex .prefix_12 {
        margin-left: 100%;
    }

    .containerFlex .suffix_1 {
        margin-right: 8.333%;
    }

    .containerFlex .suffix_2 {
        margin-right: 16.666%;
    }

    .containerFlex .suffix_3 {
        margin-right: 25%;
    }

    .containerFlex .suffix_4 {
        margin-right: 33.333%;
    }

    .containerFlex .suffix_5 {
        margin-right: 41.666%;
    }

    .containerFlex .suffix_6 {
        margin-right: 50%;
    }

    .containerFlex .suffix_7 {
        margin-right: 58.333%;
    }

    .containerFlex .suffix_8 {
        margin-right: 66.666%;
    }

    .containerFlex .suffix_9 {
        margin-right: 75%;
    }

    .containerFlex .suffix_10 {
        margin-right: 83.333%;
    }

    .containerFlex .suffix_11 {
        margin-right: 91.666%;
    }

    .containerFlex .suffix_12 {
        margin-right: 100%;
    }
}

/* ## left right padding wrapper helper ## */
.section-wrapper {
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 960px;
}

    .section-wrapper:after {
        clear: both;
        content: " ";
        display: block;
        height: 0;
        visibility: hidden;
    }

@media only screen and (max-width: 767px) {
    .section-wrapper {
        width: 300px;
    }
}

@media only screen and (max-width: 767px) and (min-width: 480px) {
    .section-wrapper {
        width: 420px;
    }
}

@media only screen and (max-width: 959px) and (min-width: 768px) {
    .section-wrapper {
        width: 768px;
    }
}



/* ## 16px baseline (768px - 959px) m = medium ## */
@media only screen and (min-width:48em) and (max-width:59.938em) {
    .m_1half > [class*="grid_"] {
        width: 50%;
    }

    .m_1half > [class*="push_"] {
        left: 50%;
    }

    .m_1half > [class*="pull_"] {
        left: -50%;
    }

    .m_1half > [class*="prefix_"] {
        margin-left: 0;
    }

    .m_1half > [class*="suffix_"] {
        margin-right: 0;
    }

    .m_1third > [class*="grid_"] {
        width: 33.333%;
    }

    .m_1third > [class*="push_"] {
        left: 33.333%;
    }

    .m_1third > [class*="pull_"] {
        left: -33.333%;
    }

    .m_1fourth > [class*="grid_"] {
        width: 25%;
    }

    .m_1fourth > [class*="push_"] {
        left: 25%;
    }

    .m_1fourth > [class*="pull_"] {
        left: -25%;
    }

    .m_2thirds_left > [class*="grid_"] {
        width: 50%;
    }

        .m_2thirds_left > [class*="grid_"]:nth-child(2n) {
            width: 33.333%;
        }

        .m_2thirds_left > [class*="grid_"]:nth-child(2n+1) {
            width: 66.666%;
        }

    .m_2thirds_left > [class*="push_"] {
        left: 0;
    }

    .m_2thirds_left > [class*="pull_"] {
        left: 0;
    }

    .m_2thirds_left > [class*="prefix_"] {
        margin-left: 0;
    }

    .m_2thirds_left > [class*="suffix_"] {
        margin-right: 0;
    }

    .m_2thirds_right > [class*="grid_"] {
        width: 50%;
    }

        .m_2thirds_right > [class*="grid_"]:nth-child(2n) {
            width: 66.666%;
        }

        .m_2thirds_right > [class*="grid_"]:nth-child(2n+1) {
            width: 33.333%;
        }

    .m_2thirds_right > [class*="push_"] {
        left: 0;
    }

    .m_2thirds_right > [class*="pull_"] {
        left: 0;
    }

    .m_2thirds_right > [class*="prefix_"] {
        margin-left: 0;
    }

    .m_2thirds_right > [class*="suffix_"] {
        margin-right: 0;
    }

    .m_stack > [class*="grid_"] {
        width: 100%;
    }

    .m_stack > .alpha, .m_stack > .omega {
        padding: 0;
    }

    /* show & hide base helpers */
    .m_showInline {
        display: inline !important;
        visibility: visible !important;
    }

    .m_showBlock {
        display: block !important;
        visibility: visible !important;
    }

    .m_hide {
        display: none !important;
        visibility: hidden !important;
    }
}


/* ## 16px baseline (960px - 1139px) mw = medium wide ## */
@media only screen and (min-width:60em) and (max-width:71.188em) {

    /* show & hide base helpers */
    .mw_showInline {
        display: inline !important;
        visibility: visible !important;
    }

    .mw_showBlock {
        display: block !important;
        visibility: visible !important;
    }

    .mw_hide {
        display: none !important;
        visibility: hidden !important;
    }
}


/* ## 16px baseline (1140px +) l = large ## */
@media only screen and (min-width:72em) {

    /* show & hide base helpers */
    .l_showInline {
        display: inline !important;
        visibility: visible !important;
    }

    .l_showBlock {
        display: block !important;
        visibility: visible !important;
    }

    .l_hide {
        display: none !important;
        visibility: hidden !important;
    }
}