@bgColor-1:#283d52;
@bgColor-2:#66a5e4;
@color:#fff;
@blackColor:#000000;
@transparent:transparent;
@iconColor:#545455;
@optionFontColor:#535455;
@baseSelector:mini-web-;
@scrollBarColor-1:#f1f3f2;
@scrollBarColor-2:#fffcfc;
@full:1;
@half:0.5;
@none:0;

@position:relative,absolute,fixed;
@display:block,flex,inline-block,inline,inline-flex,none;
@content:flex-start,flex-end,space-between,space-around;
@cursor:pointer,not-allowed;
@align:left,center,right;
@rotate:unit(pow(10,2) + pow(6,2) - 1,deg);
@overflow:hidden,auto,scroll;

.flex-center {
    display: extract(@display,floor(2.6));
    justify-content: extract(@align,floor(2.7));
    align-items: extract(@align,floor(2.8));
}
.dirMarMap(){
    @t:margin-top;
    @b:margin-bottom;
    @l:margin-left;
    @r:margin-right;
    @n:none;
}
.dirPadMap {
    @t:padding-top;
    @b:padding-bottom;
    @l:padding-left;
    @r:padding-right;
    @n:none;
}
// margin
.m(@dir;@num;@unit) when (default()) {
    @dirProp:.dirMarMap[@@dir];
    @prop:if((@dirProp = none),margin,@dirProp);
    @{prop}: unit(@num,@unit);
}
// padding
.p(@dir;@num;@unit) when (default()) {
    @dirProp:.dirPadMap[@@dir];
    @prop:if((@dirProp = none),padding,@dirProp);
    @{prop}: unit(@num,@unit);
}