.break-word {
    -ms-word-break: break-all;
    word-break: break-all;
    /* Non standard for webkit */
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

.transform (@func) {
    -webkit-transform: @arguments;
    -moz-transform: @arguments;
    -ms-transform: @arguments;
    -o-transform: @arguments;
    transform: @arguments;
}

.transform-origin (@x, @y) {
    -webkit-transform-origin: @arguments;
    -moz-transform-origin: @arguments;
    -ms-transform-origin: @arguments;
    -o-transform-origin: @arguments;
    transform-origin: @arguments;
}

// Allows use of rgba() in gradients. This will not provide a fallback for IE.
.rgba-vertial-gradient(@startColor: #555, @endColor: #333) {
    background-color: mix(@startColor, @endColor, 60%);
    background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
    background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
    background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
    background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
    background-image: linear-gradient(top, @startColor, @endColor); // The standard
    background-repeat: repeat-x;
}

.rgba-vertical-gradient-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
    background-color: mix(@midColor, @endColor, 80%);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
    background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
    background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
    background-image: -ms-linear-gradient(@startColor, @midColor @colorStop, @endColor);
    background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
    background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
    background-repeat: no-repeat;
}

.tag {
    display: inline-block;
    margin-bottom: 4px;
    color: @tabTextColor;
    background-color: @tagBackgroundColor;
    padding: 1px 10px;
    border: 1px solid darken(@tagBackgroundColor, 10%);
    .border-radius(100px);
    .box-shadow(inset 0 1px 0 lighten(@tagBackgroundColor, 10%));
}

a.tag:hover {
    text-decoration: none;
    color: #fff;
    background-color: @btnPrimaryBackground;
    border: 1px solid darken(@btnPrimaryBackground, 10%);
    .box-shadow(inset 0 1px 0 lighten(@btnPrimaryBackground, 10%));
}

.pill {
    display: inline-block;
    background-color: @pillBackgroundColor;
    color: @pillTextColor;
    padding: 2px 10px 1px 10px;
    margin-right: 5px;
    font-weight: normal;
    .border-radius(100px);
    a {
        color: @pillTextColor;
        &.remove {
            font-size: 11px;
        }
    }
}

.list-unstyled {
    margin: 0;
    list-style: none;
}

.simple-item {
    font-size: 12px;
    line-height: 14 / 12em;
    padding: 7px @gutterX;
    border-bottom: 1px dotted @genericBorderColor;
    &:last-of-type {
        border-bottom: 0;
    }
}

.simple-list {
    .clearfix;
    .list-unstyled;
    &>li {
        .simple-item;
    }
    .ckan-icon {
        position: relative;
        top: 0px;
    }
}

.module-narrow .simple-list>li {
    padding-left: @gutterSmallX;
    padding-right: @gutterSmallX;
    position: relative;
}

.listing li {
    text-align: right; //overflow: hidden;
    //white-space: nowrap;
    //text-overflow: ellipsis;
    margin-bottom: 5px;
}

.listing .key,
.listing .value {}

.listing .key {
    clear: right;
    font-weight: bold;
}

.js .tab-content {
    display: none;
}

.js .tab-content.active {
    display: block;
}

.box {
    background-color: @body-bg;
    border: 1px solid @layoutTrimBorderColor;
    .border-radius(4px);
    .box-shadow(0 0 0 4px rgba(0, 0, 0, 0.05));
}

.border-radius(@size) {
    border-radius: @size;
}