/*----------------------------
    Text Alignment
-----------------------------*/
.text-center { text-align: center !important; }
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }


/*----------------------------
    Float
-----------------------------*/
.clearfix { .clearfix(); }
.pull-right { float: right !important; }
.pull-left { float: left !important; }


/*----------------------------
    Position
-----------------------------*/
.p-relative { position: relative; }


/*---------------------------------------------------------------------------
    Generate Margin Class
    margin, margin-top, margin-bottom, margin-left, margin-right
----------------------------------------------------------------------------*/

.margin (@label, @size: 1, @key:1) when (@size =< 30){
    .m-@{key} {
        margin: @size !important;
    }

    .m-t-@{key} {
        margin-top: @size !important;
    }

    .m-b-@{key} {
        margin-bottom: @size !important;
    }

    .m-l-@{key} {
        margin-left: @size !important;
    }

    .m-r-@{key} {
        margin-right: @size !important;
    }

    .margin(@label - 5; @size + 5; @key + 5);
}

.margin(25, 0px, 0);


/*---------------------------------------------------------------------------
    Generate Padding Class
    padding, padding-top, padding-bottom, padding-left, padding-right
----------------------------------------------------------------------------*/
.padding (@label, @size: 1, @key:1) when (@size =< 30){
    .p-@{key} {
        padding: @size !important;
    }

    .p-t-@{key} {
        padding-top: @size !important;
    }

    .p-b-@{key} {
        padding-bottom: @size !important;
    }

    .p-l-@{key} {
        padding-left: @size !important;
    }

    .p-r-@{key} {
        padding-right: @size !important;
    }

    .padding(@label - 5; @size + 5; @key + 5);
}

.padding(25, 0px, 0);