/*------------------------------------------------------------------

  Helper Classes

-------------------------------------------------------------------*/

/*
 * Text Color Helper
 */
.text-default {
    color: $main_color !important;
}
.text-primary {
    color: $color_primary !important;
}
.text-success {
    color: $color_success !important;
}
.text-info {
    color: $color_info !important;
}
.text-warning {
    color: $color_warning !important;
}
.text-danger {
    color: $color_danger !important;
}
.text-mute {
    color: $text_mute_color !important;
}



/*
 * Bg Color Helper
 */
.bg-default {
    background-color: $main_color !important;
}
.bg-primary {
    background-color: $color_primary !important;
}
.bg-success {
    background-color: $color_success !important;
}
.bg-info {
    background-color: $color_info !important;
}
.bg-warning {
    background-color: $color_warning !important;
}
.bg-danger {
    background-color: $color_danger !important;
}



/*
 * Circle / Rounded Images Helper
 */
img.circle {
    border-radius: 50%;
}
img.rounded {
    border-radius: 5px;
}



/*
 * Text Align Helper
 */
.align-left {
    text-align: left;
}
.align-center {
    text-align: center;
}
.align-right {
    text-align: right;
}
.align-justify {
    text-align: justify;
}


/*
 * Vertical Align Helper
 */
.va-t {
    vertical-align: top !important;
}
.va-m {
    vertical-align: middle !important;
}
.va-b {
    vertical-align: bottom !important;
}
.va-s {
    vertical-align: super !important;
}


/*
 * Inline Block Helper
 */
.dib {
    display: inline-block !important;
}


/*
 * Cursor Pointer Helper
 */
.cursor {
    cursor: pointer !important;
}


/*
 * Text Transform Helper
 */
.text-uppercase {
    text-transform: uppercase !important;
}


/*
 * Font Weight Helper
 */
$helper-fw: 100, 200, 300, 400, 500, 600, 700, 800, 900;
@each $item in $helper-fw {
    .fw-#{$item} {
        font-weight: #{$item} !important;
    }
}


/*
 * Font Size Helper
 */
$helper-fs: 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 35, 40, 45, 50;
@each $item in $helper-fs {
    .fs-#{$item} {
        font-size: #{$item}px !important;
    }
}


/*
 * Line Height Helper
 */
$helper-lh: 0, 5, 10, 15, 20, 25, 30, 35, 40, 45, 50;
@each $item in $helper-lh {
    .lh-#{$item} {
        line-height: #{$item}px !important;
    }
}


/*
 * Text Ellipsis Helper
 */
.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}



/*
 * Overflow Helper
 */
.of-a {
    overflow: auto !important;
}
.of-h {
    overflow: hidden !important;
}
.of-v {
    overflow: visible !important;
}
.of-x-a {
    overflow-x: auto !important;
}
.of-x-h {
    overflow-x: hidden !important;
}
.of-x-v {
    overflow-x: visible !important;
}
.of-y-a {
    overflow-y: auto !important;
}
.of-y-h {
    overflow-y: hidden !important;
}
.of-y-v {
    overflow-y: visible !important;
}


/*
 * Border Radius Helper
 */
$helper-br: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 14, 16, 18, 20, 25, 30, 35;
@each $item in $helper-br {
    .br-#{$item} {
        border-radius: #{$item}px !important;
    }
}


/*
 * Paddings Helper
 */
$helper-p: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 15, 20, 25, 30, 35, 40, 45, 50, 60, 70, 80, 90, 100;
@each $item in $helper-p {
    .p-#{$item} {
        padding: #{$item}px !important;
    }
}
@each $item in $helper-p {
    .pt-#{$item} {
        padding-top: #{$item}px !important;
    }
}
@each $item in $helper-p {
    .pl-#{$item} {
        padding-left: #{$item}px !important;
    }
}
@each $item in $helper-p {
    .pr-#{$item} {
        padding-right: #{$item}px !important;
    }
}
@each $item in $helper-p {
    .pb-#{$item} {
        padding-bottom: #{$item}px !important;
    }
}



/*
 * Margins Helper
 */
.mauto {
    margin-left: auto;
    margin-right: auto;
}

$helper-m: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 15, 20, 25, 30, 35, 40, 45, 50, 60, 70, 80, 90, 100;
@each $item in $helper-m {
    .m-#{$item} {
        margin: #{$item}px !important;
    }
}
@each $item in $helper-m {
    .mt-#{$item} {
        margin-top: #{$item}px !important;
    }
}
@each $item in $helper-m {
    .ml-#{$item} {
        margin-left: #{$item}px !important;
    }
}
@each $item in $helper-m {
    .mr-#{$item} {
        margin-right: #{$item}px !important;
    }
}
@each $item in $helper-m {
    .mb-#{$item} {
        margin-bottom: #{$item}px !important;
    }
}



/*
 * Negative Margins Helper
 */
@each $item in $helper-m {
    .mn-#{$item} {
        margin: #{$item * -1}px !important;
    }
}
@each $item in $helper-m {
    .mnt-#{$item} {
        margin-top: #{$item * -1}px !important;
    }
}
@each $item in $helper-m {
    .mnl-#{$item} {
        margin-left: #{$item * -1}px !important;
    }
}
@each $item in $helper-m {
    .mnr-#{$item} {
        margin-right: #{$item * -1}px !important;
    }
}
@each $item in $helper-m {
    .mnb-#{$item} {
        margin-bottom: #{$item * -1}px !important;
    }
}



/*
 * Responsive embeds
 */
.responsive-embed {
    position: relative;
    display: block;
    overflow: hidden;
    height: 0;
    padding: 0;
    clear: both;

    &.responsive-embed-16x9 {
        padding-bottom: 56.25%;
    }
    &.responsive-embed-4x3 {
        padding-bottom: 75%;
    }

    > .embed-item,
    > iframe,
    > embed,
    > object{
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        width: 100%;
        border: 0;
    }
}