/*
 * # Semantic - Breadcrumb
 * http://github.com/jlukic/semantic-ui/
 *
 *
 * Copyright 2013 Contributors
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */

/*******************************
           Breadcrumb
*******************************/

/*******************************
            Label
*******************************/

.ui.label {
    display: inline-block;
    vertical-align: middle;
    margin: -0.25em 0.25em 0em;
    background-color: #101324;
    border-color: #101324;
    padding: 0.5em 0.8em;
    color: rgba(0, 0, 0, 0.65);
    text-transform: uppercase;
    font-weight: normal;
    border-radius: 0.325em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: background 0.1s linear;
    transition: background 0.1s linear;
}

    .ui.label:first-child {
        margin-left: 0em;
    }

    .ui.label:last-child {
        margin-right: 0em;
    }

/* Link */

a.ui.label {
    cursor: pointer;
}

/* Inside Link */

.ui.label a {
    cursor: pointer;
    color: inherit;
    opacity: 0.8;
    -webkit-transition: 0.2s opacity ease;
    transition: 0.2s opacity ease;
}

    .ui.label a:hover {
        opacity: 1;
    }

/* Detail */

.ui.label .detail {
    display: inline-block;
    margin-left: 0.5em;
    font-weight: bold;
    opacity: 0.8;
}

/* Icon */

.ui.label .icon {
    width: auto;
}

/* Removable label */

.ui.label .delete.icon {
    cursor: pointer;
    margin: 0em 0em 0em 0.5em;
    opacity: 0.7;
    -webkit-transition: background 0.1s linear;
    transition: background 0.1s linear;
}

    .ui.label .delete.icon:hover {
        opacity: 0.99;
    }

/*-------------------
    Corner Label
--------------------*/

.ui.corner.label {
    background-color: transparent;
    position: absolute;
    top: 0em;
    right: 0em;
    z-index: 10;
    margin: 0em;
    width: 3em;
    height: 3em;
    padding: 0em;
    text-align: center;
    font-family: 'Lato', sans-serif;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
}

    .ui.corner.label:after {
        position: absolute;
        content: "";
        right: 0em;
        top: 0em;
        z-index: -1;
        width: 0em;
        height: 0em;
        border-top: 0em solid transparent;
        border-right: 3em solid transparent;
        border-bottom: 3em solid transparent;
        border-left: 0em solid transparent;
        border-right-color: inherit;
        -webkit-transition: border-color 0.2s ease;
        transition: border-color 0.2s ease;
    }

    .ui.corner.label .icon {
        font-size: 0.875em;
        margin: 0.5em 0em 0em 1.25em;
    }

    .ui.corner.label .text {
        display: inline-block;
        font-weight: bold;
        margin: 0.5em 0em 0em 1em;
        width: 2.5em;
        font-size: 0.875em;
        text-align: center;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

/*-------------------
       Pointing
--------------------*/

.ui.pointing.label {
    position: relative;
}

.ui.attached.pointing.label {
    position: absolute;
}



/*--- Above ---*/

.ui.pointing.label:before {
    background-color: #101324;
}

.ui.pointing.label,
.ui.pointing.above.label {
    margin-top: 1em;
}

    .ui.pointing.label:before,
    .ui.pointing.above.label:before {
        margin-left: -0.3em;
        top: -0.3em;
        left: 50%;
    }

/*--- Below ---*/

.ui.pointing.below.label {
    margin-top: 0em;
    margin-bottom: 1em;
}

    .ui.pointing.below.label:before {
        margin-left: -0.3em;
        top: auto;
        right: auto;
        bottom: -0.3em;
        left: 3%;
    }

/*--- Left ---*/

.ui.pointing.left.label {
    margin-top: 0em;
    margin-left: 1em;
}

    .ui.pointing.left.label:before {
        margin-top: -0.3em;
        bottom: auto;
        right: auto;
        top: 50%;
        left: 0em;
    }

/*--- Right ---*/

.ui.pointing.right.label {
    margin-top: 0em;
    margin-right: 1em;
}

    .ui.pointing.right.label:before {
        margin-top: -0.3em;
        right: -0.3em;
        top: 50%;
        bottom: auto;
        left: auto;
    }

/*--- Red ---*/

.ui.red.labels .label,
.ui.red.label {
    background-color: #D95C5C !important;
    border-color: #D95C5C !important;
    color: #FFFFFF !important;
}

    .ui.labels .red.label:before,
    .ui.red.labels .label:before,
    .ui.red.label:before {
        background-color: #D95C5C !important;
    }