.row {
    margin-bottom: @padding-default-size;
    display: flex;
    flex-wrap: wrap;

    &.row-table {
        display: table;
        table-layout: fixed;
        border-collapse: collapse;
        width: 100%;

        &.row-auto {
            table-layout: auto;
        }

        .col,
        .col-lg,
        .col-md,
        .col-sm,
        .col-xs,
        .col-1,
        .col-2,
        .col-3,
        .col-4,
        .col-5,
        .col-6,
        .col-7,
        .col-8,
        .col-9,
        .col-10,
        .col-11,
        .col-12,
        .col-lg-1,
        .col-lg-2,
        .col-lg-3,
        .col-lg-4,
        .col-lg-5,
        .col-lg-6,
        .col-lg-7,
        .col-lg-8,
        .col-lg-9,
        .col-lg-10,
        .col-lg-11,
        .col-lg-12,
        .col-md-1,
        .col-md-2,
        .col-md-3,
        .col-md-4,
        .col-md-5,
        .col-md-6,
        .col-md-7,
        .col-md-8,
        .col-md-9,
        .col-md-10,
        .col-md-11,
        .col-md-12,
        .col-sm-1,
        .col-sm-2,
        .col-sm-3,
        .col-sm-4,
        .col-sm-5,
        .col-sm-6,
        .col-sm-7,
        .col-sm-8,
        .col-sm-9,
        .col-sm-10,
        .col-sm-11,
        .col-sm-12,
        .col-xs-1,
        .col-xs-2,
        .col-xs-3,
        .col-xs-4,
        .col-xs-5,
        .col-xs-6,
        .col-xs-7,
        .col-xs-8,
        .col-xs-9,
        .col-xs-10,
        .col-xs-11,
        .col-xs-12,
        .col-auto {
            display: table-cell;
            vertical-align: top;
        }

        &.row-top {
            .col,
            .col-lg,
            .col-md,
            .col-sm,
            .col-xs,
            .col-1,
            .col-2,
            .col-3,
            .col-4,
            .col-5,
            .col-6,
            .col-7,
            .col-8,
            .col-9,
            .col-10,
            .col-11,
            .col-12,
            .col-lg-1,
            .col-lg-2,
            .col-lg-3,
            .col-lg-4,
            .col-lg-5,
            .col-lg-6,
            .col-lg-7,
            .col-lg-8,
            .col-lg-9,
            .col-lg-10,
            .col-lg-11,
            .col-lg-12,
            .col-md-1,
            .col-md-2,
            .col-md-3,
            .col-md-4,
            .col-md-5,
            .col-md-6,
            .col-md-7,
            .col-md-8,
            .col-md-9,
            .col-md-10,
            .col-md-11,
            .col-md-12,
            .col-sm-1,
            .col-sm-2,
            .col-sm-3,
            .col-sm-4,
            .col-sm-5,
            .col-sm-6,
            .col-sm-7,
            .col-sm-8,
            .col-sm-9,
            .col-sm-10,
            .col-sm-11,
            .col-sm-12,
            .col-xs-1,
            .col-xs-2,
            .col-xs-3,
            .col-xs-4,
            .col-xs-5,
            .col-xs-6,
            .col-xs-7,
            .col-xs-8,
            .col-xs-9,
            .col-xs-10,
            .col-xs-11,
            .col-xs-12,
            .col-auto {
                vertical-align: top;
            }
        }

        &.row-middle {
            .col,
            .col-lg,
            .col-md,
            .col-sm,
            .col-xs,
            .col-1,
            .col-2,
            .col-3,
            .col-4,
            .col-5,
            .col-6,
            .col-7,
            .col-8,
            .col-9,
            .col-10,
            .col-11,
            .col-12,
            .col-lg-1,
            .col-lg-2,
            .col-lg-3,
            .col-lg-4,
            .col-lg-5,
            .col-lg-6,
            .col-lg-7,
            .col-lg-8,
            .col-lg-9,
            .col-lg-10,
            .col-lg-11,
            .col-lg-12,
            .col-md-1,
            .col-md-2,
            .col-md-3,
            .col-md-4,
            .col-md-5,
            .col-md-6,
            .col-md-7,
            .col-md-8,
            .col-md-9,
            .col-md-10,
            .col-md-11,
            .col-md-12,
            .col-sm-1,
            .col-sm-2,
            .col-sm-3,
            .col-sm-4,
            .col-sm-5,
            .col-sm-6,
            .col-sm-7,
            .col-sm-8,
            .col-sm-9,
            .col-sm-10,
            .col-sm-11,
            .col-sm-12,
            .col-xs-1,
            .col-xs-2,
            .col-xs-3,
            .col-xs-4,
            .col-xs-5,
            .col-xs-6,
            .col-xs-7,
            .col-xs-8,
            .col-xs-9,
            .col-xs-10,
            .col-xs-11,
            .col-xs-12,
            .col-auto {
                vertical-align: middle;
            }
        }

        &.row-bottom {
            .col,
            .col-lg,
            .col-md,
            .col-sm,
            .col-xs,
            .col-1,
            .col-2,
            .col-3,
            .col-4,
            .col-5,
            .col-6,
            .col-7,
            .col-8,
            .col-9,
            .col-10,
            .col-11,
            .col-12,
            .col-lg-1,
            .col-lg-2,
            .col-lg-3,
            .col-lg-4,
            .col-lg-5,
            .col-lg-6,
            .col-lg-7,
            .col-lg-8,
            .col-lg-9,
            .col-lg-10,
            .col-lg-11,
            .col-lg-12,
            .col-md-1,
            .col-md-2,
            .col-md-3,
            .col-md-4,
            .col-md-5,
            .col-md-6,
            .col-md-7,
            .col-md-8,
            .col-md-9,
            .col-md-10,
            .col-md-11,
            .col-md-12,
            .col-sm-1,
            .col-sm-2,
            .col-sm-3,
            .col-sm-4,
            .col-sm-5,
            .col-sm-6,
            .col-sm-7,
            .col-sm-8,
            .col-sm-9,
            .col-sm-10,
            .col-sm-11,
            .col-sm-12,
            .col-xs-1,
            .col-xs-2,
            .col-xs-3,
            .col-xs-4,
            .col-xs-5,
            .col-xs-6,
            .col-xs-7,
            .col-xs-8,
            .col-xs-9,
            .col-xs-10,
            .col-xs-11,
            .col-xs-12,
            .col-auto {
                vertical-align: bottom;
            }
        }
    }

    &.row-compact > .col-pd,
    &.row-compact > .col-pd-lg {
        &:first-child {
            padding-left: 0;
        }

        &:last-child {
            padding-right: 0;
        }
    }

    &.row-flex-start {
        justify-content: flex-start;
    }

    &.row-flex-center {
        justify-content: center;
    }

    &.row-flex-end {
        justify-content: flex-end;
    }

    &:last-child {
        margin-bottom: 0;
    }

    .col-mixin() {
        position: relative;
        text-align: left;
        box-sizing: border-box;
    }

    .col {
        flex: 1;
    }


    .col-lg,
    .col-md,
    .col-sm,
    .col-xs,
    .col-1,
    .col-2,
    .col-3,
    .col-4,
    .col-5,
    .col-6,
    .col-7,
    .col-8,
    .col-9,
    .col-10,
    .col-11,
    .col-12,
    .col-lg-1,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12,
    .col-md-1,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-sm-1,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12,
    .col-xs-1,
    .col-xs-2,
    .col-xs-3,
    .col-xs-4,
    .col-xs-5,
    .col-xs-6,
    .col-xs-7,
    .col-xs-8,
    .col-xs-9,
    .col-xs-10,
    .col-xs-11,
    .col-xs-12,
    .col-auto {
        flex: initial;
    }


    .col-lg,
    .col-md,
    .col-sm,
    .col-xs,
    .col-lg-1,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12,
    .col-md-1,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-sm-1,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12,
    .col-xs-1,
    .col-xs-2,
    .col-xs-3,
    .col-xs-4,
    .col-xs-5,
    .col-xs-6,
    .col-xs-7,
    .col-xs-8,
    .col-xs-9,
    .col-xs-10,
    .col-xs-11,
    .col-xs-12 {
        width: 100%;
    }

    .col,
    .col-lg,
    .col-md,
    .col-sm,
    .col-xs,
    .col-1,
    .col-2,
    .col-3,
    .col-4,
    .col-5,
    .col-6,
    .col-7,
    .col-8,
    .col-9,
    .col-10,
    .col-11,
    .col-12,
    .col-lg-1,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12,
    .col-md-1,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-sm-1,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12,
    .col-xs-1,
    .col-xs-2,
    .col-xs-3,
    .col-xs-4,
    .col-xs-5,
    .col-xs-6,
    .col-xs-7,
    .col-xs-8,
    .col-xs-9,
    .col-xs-10,
    .col-xs-11,
    .col-xs-12 {
        .col-mixin();

        &.col-sm {
            padding-left: @padding-default-size-sm;
            padding-right: @padding-default-size-sm;
        }

        &.col-pd {
            padding-left: @padding-default-size;
            padding-right: @padding-default-size;
        }

        &.col-pd-lg {
            padding-left: @padding-default-size-lg;
            padding-right: @padding-default-size-lg;
        }

        &.justify {
            text-align: justify;
        }

        &.left {
            text-align: left;
        }

        &.center {
            text-align: center;
        }

        &.right {
            text-align: right;
        }
    }

    .col-1 {
        width: 8.33%;
    }

    .col-ofs-1 {
        margin-left: 8.33%
    }

    &.row-auto {
        .col-1 {
            width: auto;
            min-width: 8.33%;
        }

        &.row-table {
            .col-1 {
                width: 8.33%;
            }
        }
    }

    &.row-weight {
        .col-1 {
            flex: 1;
        }
    }

    .col-2 {
        width: 16.66%;
    }

    .col-ofs-2 {
        margin-left: 16.66%
    }

    &.row-auto {
        .col-2 {
            width: auto;
            min-width: 16.66%;
        }

        &.row-table {
            .col-2 {
                width: 16.66%;
            }
        }
    }

    &.row-weight {
        .col-2 {
            flex: 2;
        }
    }

    .col-3 {
        width: 25%;
    }

    .col-ofs-3 {
        margin-left: 25%
    }

    &.row-auto {
        .col-3 {
            width: auto;
            min-width: 25%;
        }

        &.row-table {
            .col-3 {
                width: 25%;
            }
        }
    }

    &.row-weight {
        .col-3 {
            flex: 3;
        }
    }

    .col-4 {
        width: 33.33%;
    }

    .col-ofs-4 {
        margin-left: 33.33%
    }

    &.row-auto {
        .col-4 {
            width: auto;
            min-width: 33.33%;
        }

        &.row-table {
            .col-4 {
                width: 33.33%;
            }
        }
    }

    &.row-weight {
        .col-4 {
            flex: 4;
        }
    }

    .col-5 {
        width: 41.65%;
    }

    .col-ofs-5 {
        margin-left: 41.65%
    }

    &.row-auto {
        .col-5 {
            width: auto;
            min-width: 41.65%;
        }

        &.row-table {
            .col-5 {
                width: 41.65%;
            }
        }
    }

    &.row-weight {
        .col-5 {
            flex: 5;
        }
    }

    .col-6 {
        width: 50%;
    }

    .col-ofs-6 {
        margin-left: 50%
    }

    &.row-auto {
        .col-6 {
            width: auto;
            min-width: 50%;
        }

        &.row-table {
            .col-6 {
                width: 50%;
            }
        }
    }

    &.row-weight {
        .col-6 {
            flex: 6;
        }
    }

    .col-7 {
        width: 58.33%;
    }

    .col-ofs-7 {
        margin-left: 58.33%
    }

    &.row-auto {
        .col-7 {
            width: auto;
            min-width: 58.33%;
        }

        &.row-table {
            .col-7 {
                width: 58.33%;
            }
        }
    }

    &.row-weight {
        .col-7 {
            flex: 7;
        }
    }

    .col-8 {
        width: 66.65%;
    }

    .col-ofs-8 {
        margin-left: 66.65%
    }

    &.row-auto {
        .col-8 {
            width: auto;
            min-width: 66.65%;
        }

        &.row-table {
            .col-8 {
                width: 66.65%;
            }
        }
    }

    &.row-weight {
        .col-8 {
            flex: 8;
        }
    }

    .col-9 {
        width: 75%;
    }

    .col-ofs-9 {
        margin-left: 75%
    }

    &.row-auto {
        .col-9 {
            width: auto;
            min-width: 75%;
        }

        &.row-table {
            .col-9 {
                width: 75%;
            }
        }
    }

    &.row-weight {
        .col-9 {
            flex: 9;
        }
    }

    .col-10 {
        width: 83.33%;
    }

    .col-ofs-10 {
        margin-left: 83.33%
    }

    &.row-auto {
        .col-10 {
            width: auto;
            min-width: 83.33%;
        }

        &.row-table {
            .col-10 {
                width: 83.33%;
            }
        }
    }

    &.row-weight {
        .col-10 {
            flex: 10;
        }
    }

    .col-11 {
        width: 91.63%;
    }

    .col-ofs-11 {
        margin-left: 91.63%
    }

    &.row-auto {
        .col-11 {
            width: auto;
            min-width: 91.63%;
        }

        &.row-table {
            .col-11 {
                width: 91.63%;
            }
        }
    }

    &.row-weight {
        .col-11 {
            flex: 11;
        }
    }

    .col-12 {
        width: 100%;
    }

    .col-ofs-12 {
        margin-left: 100%
    }

    &.row-auto {
        .col-12 {
            width: auto;
            min-width: 100%;
        }

        &.row-table {
            .col-12 {
                width: 100%;
            }
        }
    }

    &.row-weight {
        .col-12 {
            flex: 12;
        }
    }
}

@import 'block.less';
@import 'helper.less';
@import 'media.less';
