/**
 * WARNING: do not edit this file. It was generated automatically, your changes will be overwritten and lost.
 * 2015-06-03 10:09:12 */






/* Grid container
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/



    .container {
        width:96%;

                                            max-width: 960px;
                        }

                .lte-ie8 .container { max-width:1200px; }























/* Desktop - design for a width of 1280px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* 1280px <= width */

@media only screen and (min-width: 1280px)  {

                        .container { max-width: 1200px; }

    /* Special grid units */
    .grid-col2-sidebar  { width: 20.41%; }
    .grid-col2-main     { width: 75.58%; }

    .no-gutter.grid-col2-sidebar    { width: 22.41%; }
    .no-gutter.grid-col2-main       { width: 77.58%; }

    .grid-col3-sidebar      { width:27.01%; }
    .grid-col3-main         { width:70.34%; }

    .no-gutter.grid-col3-sidebar        { width:27.01%; }
    .no-gutter.grid-col3-main           { width:70.34%; }

    /* Hide */
    .hide-below-1280 { display:inherit !important; }
}






/* Design for a width of less than 1024 px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* width < 1024px */
@media only screen and (max-width: 1023px) {

    /* Hide */
    .hide-below-1024 { display:none !important; }
}





/* Tablet (Portrait) - design for a width of 768px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* 768px <= width < 960px */
@media only screen and (min-width: 768px) and (max-width: 959px) {

        .container { max-width:737px; }

    /* Hide */
    .hide-below-960 { display:none !important; }
}





/* All mobile - design for a width of less than 768px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* width < 768px */
@media only screen and (max-width: 767px) {

    .nested-container { width:100%; margin-left:auto; }

    /* Nav container with outline (if nav container has background color).
       Apply the same vertical margins, as container's side padding. */
    .nav.has-outline > .grid-full { margin-top: 2%; margin-bottom: 2%; }

    /* Below 768px all grid units are stretched (full width) and stack vertically */
    .grid12-1,
    .grid12-2,
    .grid12-3,
    .grid12-4,
    .grid12-5,
    .grid12-6,
    .grid12-7,
    .grid12-8,
    .grid12-9,
    .grid12-10,
    .grid12-11,
    .grid12-12,
    .grid-full,

    .grid-col2-sidebar,
    .grid-col2-main,
    .grid-col3-sidebar,
    .grid-col3-main
    {
        width:100% !important; /* Added "!important" to override units with "no-gutter" */
        margin-left:0;
        margin-right:0;
    }

    /* Vertically aligned grid
    -------------------------------------------------------------- */
    .v-grid-container { display:block; }
    .v-grid { float:inherit; display:block; width:100%; }
}





/* Mobile (Landscape) - design for a width of 480px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* 480px <= width < 768px */
@media only screen and (min-width: 480px) and (max-width: 767px) {

        .container { max-width:440px; }

    /* Hide */
    .hide-below-960 { display:none !important; }
    .hide-below-768 { display:none !important; }

    /* Deprecated: persistent grid units (will be removed in the next update)
    -------------------------------------------------------------- */
        /* Half */
        .persistent-grid2-1 { width:48%; margin-left:1%; margin-right:1%; }

        /* One-third + two-thirds */
        .persistent-grid3-1 { width:31.33%; margin-left:1%; margin-right:1%; }
        .persistent-grid3-2 { width:64.67%; margin-left:1%; margin-right:1%; }

        /* One-fourth + two-fourths + three-fourths */
        .persistent-grid4-1 { width:23%; margin-left:1%; margin-right:1%; }
        .persistent-grid4-2 { width:48%; margin-left:1%; margin-right:1%; }
        .persistent-grid4-3 { width:73%; margin-left:1%; margin-right:1%; }

    /* Mobile grid (for browser viewport between 480px and 768px):
       Below 768px all grid units are stretched (full width) and stack vertically.
       The "mobile-grid" class forces narrow grid units to stay narrow,
       but the width is increased to avoid too small columns.
    -------------------------------------------------------------- */
    .mobile-grid.grid12-1 { width:14.66% !important;    margin-left:1%; margin-right:1%; } /* 1/12 turns into 1/6 */
    .mobile-grid.grid12-2 { width:31.33% !important;    margin-left:1%; margin-right:1%; } /* 1/6  turns into 1/3 */
    .mobile-grid.grid12-3 { width:48% !important;       margin-left:1%; margin-right:1%; } /* 1/4  turns into 1/2 */

    /* Force other grid units to take half of the available width */
    .mobile-grid-half { width:48% !important; margin-left:1%; margin-right:1%; }

}





/* Mobile (Landscape, iPhone 4 Portrait) - design for a width of 640px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/
/* 640px <= width < 768px */
@media only screen and (min-width: 640px) and (max-width: 767px) {

        .container { max-width:590px; }
    }





/* Design for a width of less than 480px (small mobile)
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* width < 480px */
@media only screen and (max-width: 479px) {

    /* Enlarge containers to full width and remove max width */
    .container { max-width: none !important; width: 100%; }
}





/* Mobile (Portrait) - design for a width of 320px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* 320px <= width < 480px */
@media only screen and (min-width: 320px) and (max-width: 479px) {

    /* Hide */
    .hide-below-960 { display:none !important; }
    .hide-below-768 { display:none !important; }
    .hide-below-480 { display:none !important; }
}





/* Mobile (Portrait) - design for a width of less than 320px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* width < 320px */
@media only screen and (max-width: 319px) {

    /* Hide */
    .hide-below-960 { display:none !important; }
    .hide-below-768 { display:none !important; }
    .hide-below-480 { display:none !important; }
    .hide-below-320 { display:none !important; }
}

