.centered{
    float        : none !important;
    margin-left  : auto !important;
    margin-right : auto !important;
}

.text-left{ text-align : left; }
.text-center{ text-align : center; }
.text-right{ text-align : right; }
.text-justify{ text-align : justify; }

.align-top{ vertical-align : top !important; }
.align-middle{ vertical-align : middle !important; }
.align-bottom{ vertical-align : bottom !important; }

.ws-nowrap{ white-space : nowrap !important; }
.ws-normal{ white-space : normal !important; }

.text-light{ font-weight : 300 !important; }
.text-normal{ font-weight : normal !important; font-style : normal !important; }
.text-medium{ font-weight : 500 !important; }
.text-bold{ font-weight : bold !important; }
.text-italic{ font-style : italic !important; }

.lh-inherit{ line-height : inherit !important; }
.lh-small{ line-height : 1 !important; }
.lh-medium{ line-height : @line-height * .85 !important; }
.lh-normal{ line-height : @line-height !important; }
.lh-large{ line-height : @line-height * 1.25 !important; }

.cl-none{ clear : none; }
.cl-both{ clear : both; }

.fl-left{ float : left !important; }
.fl-right{ float : right !important; }
.fl-none{ float : none !important; }

.scroll{ overflow : auto !important; }
.wrap{ overflow : hidden !important; }
.overflow-none{ overflow : visible !important; }

.show{ display : block !important; }
.block{ display : block; }
.inline-block-wrap{ .inline-block-wrap(); }
.inline-block{ .inline-block(); }
.word-break{
    -ms-word-break : break-all;
    word-break     : break-all;
    // Non standard for webkit
    //word-break: break-word;
    .hyphens();
}
.hide, .ui-helper-hidden, .ui-helper-hidden-accessible{ display : none; }

.pointer{ cursor : pointer !important; }
.help{ cursor : help !important; }

.fs12, .is12:before{ font-size : 12px !important; }
.fs14, .is14:before{ font-size : 14px !important; }
.fs16, .is16:before{ font-size : 16px !important; }
.fs18, .is18:before{ font-size : 18px !important; }
.fs24, .is24:before{ font-size : 24px !important; }
.fs32, .is32:before{ font-size : 32px !important; }
.fs48, .is48:before{ font-size : 48px !important; }
.fs64, .is64:before{ font-size : 64px !important; }
.fs-inherit, .is-inherit:before{ font-size : inherit !important;; }

.inherit{
    color      : inherit;
    background : inherit;
}
.inherit-bg{
    background : inherit;
}
.inherit-color{
    color : inherit;

    a&:hover{
        color : @link-color;
    }
}

.text-overflow{
    .text-overflow();
}

// Helper classes
//==================================================
//--- Position
.position-list(none; top);
.position-list(none; bottom);
.position-list(none; right);
.position-list(none; left);

//--- Margin
.margin-list(0px);
.margin-list(30px; top);
.margin-list(30px; bottom);
.margin-list(none; right);
.margin-list(none; left);

.mtInput{ margin-top : unit(@button-line-height * 2, em); }
.ml-grid{ margin-left : @grid-margin-width / 2 !important; }
.mr-grid{ margin-right : @grid-margin-width / 2 !important; }

//--- Padding
.padding-list(0px);
.padding-list(none; top);
.padding-list(none; bottom);
.padding-list(none; right);
.padding-list(none; left);

.pl-grid{ padding-left : @grid-margin-width / 2; }
.pr-grid{ padding-right : @grid-margin-width / 2; }

.ff-text{ font-family: @font-family-text; }
.ff-header{ font-family: @font-family-headings; }

//--- Height
.h-auto{ height : auto !important; }
.maxH-none{ max-height: none !important; }
.height-list(none; 25);

//--- Width
.w-auto{ width : auto !important; }
.maxW-none{ max-width : none !important; }
.width-list(none; 25);

// -- Grays color
.gray-darker-bg{
    color            : #fff;
    background-color : @gray-darker;
}
.gray-dark-bg{
    color            : #fff;
    background-color : @gray-dark;
}
.gray-bg{
    color            : #fff;
    background-color : @gray;
}
.gray-light-bg{
    color            : #fff;
    background-color : @gray-light;
}
.gray-lighter-bg{
    color            : @gray-dark;
    background-color : @gray-lighter;
}
.white-bg{
    background : #fff;
}

.fade25{
    .rgba(#000; .25);
}
.fade50{
    .rgba(#000; .50);
}
.fade75{
    .rgba(#000; .75);
}

.gray-darker{ color : @gray-darker; }
.gray-dark{ color : @gray-dark; }
.gray{ color : @gray; }
.gray-light{ color : @gray-light; }
.gray-lighter{ color : @gray-lighter; }
.white{ color : #fff; }

// Table classes
//==================================================
.table{
    float   : none;
    display : table;
    width   : 100%;
}

.tr{
    float   : none;
    display : table-row;
}

.td{
    float   : none;
    display : table-cell;
}

// Change style for Generator Links
//==================================================
.gl-change when (@flexkit-icons){
    font-size : 0;

    a, :before{ font-size : @font-size-base; }

    .generator-links{
        .inline-block();
        .box-sizing(content-box);
        .icon-size(@icon-size-small; true) !important;
        .button-color(@button-info-color; @button-info-bg);
        padding  : @padding-small-vertical !important;
        position : relative;

        img{
            display : none !important;
        }

        &:before{
            font-family : @font-family-icons;
            content     : "\e008";
        }

        & + .generator-links{
            margin-left : 1px;

            &:before{
                content : "\e095";
            }
        }
    }

    a.icon + .generator-links:before{
        content        : "\e095";
        border-left    : 2px solid #fff;
        border-top     : 2px solid #fff;
        margin         : 0 0 -2px -(@icon-size-small + @padding-mini-vertical * 2);
        vertical-align : bottom;
    }

    .btn ~ .generator-links{
        vertical-align : top;
    }

    .btn + .generator-links{
        & + .generator-links{
            & ~ .generator-links{
                top  : (@icon-size-small + @padding-small-vertical * 2);
                left : -(@icon-size-small + @padding-small-vertical * 2 + 1) * 2;
            }
        }
    }

    &.color{
        .generator-links{
            padding : @padding-small-vertical;
            .icon-size(@icon-size-base);

            &:before{
                content : "\e00a";
            }
        }
    }
}

.relative{ position : relative; }
.absolute{ position : absolute; }

//.flexbox{
//    .flexbox();
//}
//.flexbox-column{
//    .flexbox(column);
//}
//.flexbox-row{
//    .flexbox(row);
//}
//
//.flex-order_1{
//    .flex-box-order(1);
//}
//.flex-order_2{
//    .flex-box-order(2);
//}
//.flex-order_3{
//    .flex-box-order(3);
//}
//
//.flex-size_1{
//    .flex-box-size(1);
//}
//
//.flex-item-align-center{
//    .flex-align(center);
//    .flex-box-align(center);
//}