/* -- 14. Demo classes -- */

.demo_grid .row {
    margin-bottom: 10px;
    text-align: center;
    .custom_font(400, 14px, 18px);
    & [class*='col-'] .col-wrapper {
        padding: 8px 0;
        background: @sub-bg;
    }
    & .row {
        & [class*='col-'] .col-wrapper {
            margin-top: 8px;
            background: darken(@sub-bg,5%);
        }
        & .row {
            & [class*='col-'] .col-wrapper {
                background: darken(@sub-bg,10%);
            }
        }
    }
}

.icon_list {
    .reset_ul();
    display: block;
    margin-bottom: 10px;
    .cf();
    li {
        float: left;
        width: 42px;
        height: 42px;
        margin: 2px;
        background: @sub-bg;
        text-align: center;
        .border-radius(4px);
        .box-shadow(inset 0 0 10px rgba(0, 0, 0, 0.08));
        > span {
            font-size: 20px;
            line-height: 44px;
            color: #383f47;
        }
    }
    &.list_small {
        li {
            width: 34px;
            height: 34px;
            > span {
                margin-top: 10px;
            }
        }
    }
}