@import (reference) "ui.less";

/* element */
html {
    font-size: 100px;
}
body {
    min-width: 1200px;
    position: relative;
}
.rel { position: relative; }
.abs { position: absolute; }
.fl { float: left; }
.fr { float: right; }
.i-b { display: inline-block; }
.cf { .clearfix(); }
.section {
    .clearfix();
    .shape-section();
}
.section-content {
    padding: @block-inner-vertical @block-inner-horizontal;
}
.block-section {
    &:extend(.section);
    &:extend(.section-content);
}

// layout
.container {
    .clearfix();
    box-sizing: border-box;
    position: relative;
    width: @container-width;
    margin: auto;
}
.main-container {
    padding-top: 24px;
}

.v-section + .v-section {
    margin-top: @block-outer-vertical;
}
.h-section + .h-section {
    margin-left: @block-outer-horizontal;
}
.section-item {
    .clearfix();
    padding: @block-inner-vertical 0;
    &:first-of-type {
        padding-top: 0;
    }
    &:last-of-type {
        padding-bottom: 0;
    }
}
.section-item + .section-item {
    border-top: @border-base;
}