﻿@import "bootstrap/variables.less";

* {
    box-sizing: border-box;
}

html, body {
    width: 100%;
    height: 100%;
}

body {
    background-color: #f2f2f2;
}

main {
    //padding: 20px;
}

.layout {
    display: table;
    width: 100%;
    height: 100%;
}

.layout-cell {
    display: table-cell;
    position: relative;

    &.layout-cell-half {
        width: 50%;
    }
}

.layout-row {
    display: table-row;
    position: relative;
}

.layout-expand {
    height: 100%;
    width: 100%;
}

.layout-cell-content {
    position: relative;
    overflow: auto;
    height: 100%;
}

.layout-cell-content-fit {
    position: absolute;
    overflow: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.layout-flex {
    display: block;

    @media (min-width: @screen-lg) {
        display: table;
        height: 100%;
        width: 100%;
    }

    > .layout-flex-row {
        display: block;
        border: none;

        @media (min-width: @screen-lg) {
            display: table-row;
            float: none;
        }

        > .layout-flex-cell {
            display: block;
            border: none;

            @media (min-width: @screen-lg) {
                display: table-cell;
                float: none;
                vertical-align: top;

                &.layout-flex-cell-half {
                    width: 50%;
                }
            }
        }
    }
}

.layout-space {
    padding: 20px;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .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-md-1, .col-md-10, .col-md-11, .col-md-12, .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-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .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-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    padding: 0;
}
