body {
    .font();
}

/** --------------------------------------------------------------
 *  Outer
 */

.outer-wrap-header,
.outer-wrap-footer {
    background-color: #2b2b2b;
}

/** --------------------------------------------------------------
 *  Inner
 */

.inner-wrap {
    max-width: 960px;
    .container();

    html.vgrid & {
        .showGrid(960px);
    }

    html.hgrid & {
        .showHGrid(960px);
    }
}

.row {
    .row();
}

/** --------------------------------------------------------------
 *  Header
 */

.site-header {
    position: relative;
    .column(12);
}

/** --------------------------------------------------------------
 *  Flash
 */

.flash-wrap {
    .column(12);
}

/** --------------------------------------------------------------
 *  Breadcrumb
 */

.breadcrumb-wrap {
    .column(12);
}

/** --------------------------------------------------------------
 *  Main Content
 */

.sidebar {
    .column(3);
}

.main {
    .column(12);
}

.main.has-sidebar {
    .column(9);
}

/** --------------------------------------------------------------
 *  Footer
 */

.footer {
    .column(12);
}

.footer-column-wrapper {
    .row();
}

.footer-column {
    .column(4);
}

.site-footer {
    .column(12);
}

/** --------------------------------------------------------------
 *  Querys
 */

@media screen and (max-width: 960px) {
    img {
        max-width: 100%;
    }

    .wrap-all {
        margin-left: 8px;
        margin-right: 8px;
    }
}

@media screen and (max-width: 480px) {
    .inner-wrap-main img {
        display: block;
        float: none;
    }

    .flash-wrap img {
        display: none;
    }

    .sidebar {
        .column(12);
    }

    .main.has-sidebar {
        .column(12);
    }

    .footer-column {
        .column(12);
    }
}
