add elements.less stylesheet

add elements.less stylesheet

/*---------------------------------------------------
    LESS Elements 0.6
  ---------------------------------------------------
    A set of useful LESS mixins by Dmitry Fadeyev
    Special thanks for mixin suggestions to:
      Kris Van Herzeele,
      Benoit Adam,
      Portenart Emile-Victor,
      Ryan Faerman

    More info at: http://lesselements.com
-----------------------------------------------------*/

.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) {
  background: @color;
  background: -webkit-gradient(linear,
                               left bottom,
                               left top,
                               color-stop(0, @start),
                               color-stop(1, @stop));
  background: -ms-linear-gradient(bottom,
                                  @start,
                                  @stop);
  background: -moz-linear-gradient(center bottom,
                                   @start 0%,
                                   @stop 100%);
}
.bw-gradient(@color: #F5F5F5, @start: 0, @stop: 255) {
  background: @color;
  background: -webkit-gradient(linear,
                               left bottom,
                               left top,
                               color-stop(0, rgb(@start,@start,@start)),
                               color-stop(1, rgb(@stop,@stop,@stop)));
  background: -ms-linear-gradient(bottom,
                                  rgb(@start,@start,@start) 0%,
                                  rgb(@start,@start,@start) 100%);
  background: -moz-linear-gradient(center bottom,
                                   rgb(@start,@start,@start) 0%,
                                   rgb(@stop,@stop,@stop) 100%);
}
.bordered(@top-color: #EEE, @right-color: #EEE, @bottom-color: #EEE, @left-color: #EEE) {
  border-top: solid 1px @top-color;
  border-left: solid 1px @left-color;
  border-right: solid 1px @right-color;
  border-bottom: solid 1px @bottom-color;
}
.drop-shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @alpha: 0.1) {
  -webkit-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
  -moz-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
  box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
}
.rounded(@radius: 2px) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  border-radius: @radius;
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}
.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) {
  -webkit-border-top-right-radius: @topright;
  -webkit-border-bottom-right-radius: @bottomright;
  -webkit-border-bottom-left-radius: @bottomleft;
  -webkit-border-top-left-radius: @topleft;
  -moz-border-radius-topright: @topright;
  -moz-border-radius-bottomright: @bottomright;
  -moz-border-radius-bottomleft: @bottomleft;
  -moz-border-radius-topleft: @topleft;
  border-top-right-radius: @topright;
  border-bottom-right-radius: @bottomright;
  border-bottom-left-radius: @bottomleft;
  border-top-left-radius: @topleft;
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}
.opacity(@opacity: 0.5) {
  -moz-opacity: @opacity;
  -khtml-opacity: @opacity;
  -webkit-opacity: @opacity;
  opacity: @opacity;
}
.transition-duration(@duration: 0.2s) {
  -moz-transition-duration: @duration;
  -webkit-transition-duration: @duration;
  transition-duration: @duration;
}
.rotation(@deg:5deg){
  -webkit-transform: rotate(@deg);
  -moz-transform: rotate(@deg);
  transform: rotate(@deg);
}
.scale(@ratio:1.5){
  -webkit-transform:scale(@ratio);
  -moz-transform:scale(@ratio);
  transform:scale(@ratio);
}
.transition(@duration:0.2s, @ease:ease-out) {
  -webkit-transition: all @duration @ease;
  -moz-transition: all @duration @ease;
  transition: all @duration @ease;
}
.inner-shadow(@horizontal:0, @vertical:1px, @blur:2px, @alpha: 0.4) {
  -webkit-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
  -moz-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
  box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
}
.box-shadow(@arguments) {
  -webkit-box-shadow: @arguments;
  -moz-box-shadow: @arguments;
  box-shadow: @arguments;
}
.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #EEE, @columnRuleStyle: solid, @columnRuleWidth: 1px) {
  -moz-column-width: @colwidth;
  -moz-column-count: @colcount;
  -moz-column-gap: @colgap;
  -moz-column-rule-color: @columnRuleColor;
  -moz-column-rule-style: @columnRuleStyle;
  -moz-column-rule-width: @columnRuleWidth;
  -webkit-column-width: @colwidth;
  -webkit-column-count: @colcount;
  -webkit-column-gap: @colgap;
  -webkit-column-rule-color: @columnRuleColor;
  -webkit-column-rule-style: @columnRuleStyle;
  -webkit-column-rule-width: @columnRuleWidth;
  column-width: @colwidth;
  column-count: @colcount;
  column-gap: @colgap;
  column-rule-color: @columnRuleColor;
  column-rule-style: @columnRuleStyle;
  column-rule-width: @columnRuleWidth;
}
.translate(@x:0, @y:0) {
  -moz-transform: translate(@x, @y);
  -webkit-transform: translate(@x, @y);
  -o-transform: translate(@x, @y);
  -ms-transform: translate(@x, @y);
  transform: translate(@x, @y);
}

error: pathspec 'static/stylesheets/elements.less' did not match any file(s) known to git


Create 14-print.less

Create 14-print.less

@media print {
  /**
   * ajouter là-dedans les éléments qui ont besoin d'être
   * resetés de manière très bourrine pour le print
   */
  body,
  html,
  #page,
  .reset4print {
    background-color: #fff;
    background-image: none;
    border: 0;
    box-shadow: none;
    color: #000;
    float: none;
    height: auto;
    margin: 0;
    max-width: 100%;
    min-height: auto;
    padding: 0;
    position: static;
    width: auto;
  }

  body {
    padding: .5em;
  }

  /* cachage des éléments inutiles ! */
  .noprint {
    display: none;
  }

  /* affichage éléments spécifiques au print */
  .onprint {
    display: block;
  }

  /* éviter saut de page hasardeux */
  blockquote, ul, ol {
    page-break-inside: avoid;
  }
  h1, h2, h3, caption {
    page-break-after: avoid;
  }

  /* affichage des liens, sauf pour image contenue */
  /* attention, penser à vérifier le résultat et penser
   * à limiter cette possibilité aux liens dans le contenu */
  /*a:after {
    content: " (" attr(href) ") ";
  }
  a:after img {
    content: "";
  }*/

  /* ici fix propriétés particulières */

} /* end print */

error: pathspec 'less/rocssti-fr/14-print.less' did not match any file(s) known to git


better byline alignment (thanks basta)

better byline alignment (thanks basta)

@import 'lib';

// On page load this gets transformed by JS into a star picker.
select[name=rating] {
    display: none;
}

section.replies .review.reply {
    display: block;
}

#reviews-info {
    margin-top: 20px;
    position: relative;
}

// Detail page.
#reviews {
    position: relative;
    ul {
        margin: 0;
        padding: 0;
    }
    #submit-review {
        position: absolute;
        margin: 10px 0;
    }
    .not-rated + p a {
        padding: 5px 20px 5px 0;
    }
}

.review {
    .transition(~'.3s all');
    list-style-type: none;
    padding: 10px 16px;
    position: relative;
    &.reply {
        background: url(../../img/mkt/icons/reply.png) 10px 15px no-repeat;
        display: none;
        padding-left: 35px;
    }
    &.deleting {
        background: fade(@red, 40%);
    }
    &.deleted {
        border: 0;
        height: 0;
        overflow: hidden;
        padding: 0;
        + .review {
            border-top: 0;
        }
    }
    .byline, .timestamp {
        font-size: 12px;
    }
    .byline {
        color: @medium-gray;
        font-weight: 600;
        line-height: 18px;
        vertical-align: middle;
        b {
            color: @gray;
        }
        strong {
            color: #444;
        }
    }
    .timestamp {
        color: @note-gray;
        float: right;
        &:hover {
            color: @gray;
        }
    }
    .body {
        margin: 5px 0 15px;
    }
    .view-reply {
        font-size: 12px;
        font-weight: 600;
        padding: 5px 10px;
    }
    ul {
        float: left;
        list-style: none;
    }
    li {
        display: inline-block;
        &.hidden {
            display: none;
        }
        &:not(.hidden) + li:before,
        + li.hidden + li:before {
            color: @note-gray;
            content: "\00a0\2022\00a0\00a0";
        }
    }
}

// This applies to "app details" pages only.
.reviews {
    border-top: 1px solid rgba(255,255,255,.5);
    border-bottom: 1px solid rgba(3,16,26,.13);
    .not-rated {
        color: lighten(@text, 5%);
        font-size: 14px;
        font-weight: 600;
        margin: 0;
    }
    #reviews {
        margin: 15px;
    }
}

#reviews-detail {
    padding: 15px;
    ul {
        margin: 0;
        padding: 0;
        .review {
            padding: 0;
        }
    }
}

// This applies to "reviews list" pages only.
// TODO: make proper review tiles. This is an interim solution.
.reviews-listing {
    #add-review {
        margin: 30px 16px;
    }
    .button.fat {
        line-height: 35px;
        height: 35px;
        &:hover {
            line-height: 35px;
        }
    }
    .review {
        border-top: 1px solid #bcc0c2;
        border-bottom: 1px solid #bcc0c2;
        &:nth-of-type(2n) {
            border-top: 1px solid #eceff0;
            border-bottom: 0;
        }
    }
}

#review-list .review:nth-of-type(2n + 1) {
    background-color: darken(@bg, 5%);
    + .replies .review {
        background-color: darken(@bg, 5%);
    }
}

/*
// TODO: Expose later sometime (`rating_header` function)
header.product {
    margin-bottom: 15px;
    position: relative;
    .visual {
        margin-right: 15px;
        height: 64px;
        width: 64px;
        + div {
            float: left;
            max-width: 905px;
        }
    }
    h1 {
        color: @navy-gray;
        font-size: 22px;
        font-weight: 400;
        line-height: 1.2;
        &.multi {
            font-size: 22px;
            small, span {
                .ellipsis;
                display: block;
                margin-bottom: -8px;
                padding-bottom: 6px;
            }
            small {
                color: lighten(@navy-gray, 10%);
                display: block;
                font-size: 14px;
                font-weight: 600;
            }
        }
    }
    p {
        font-size: 14px;
        line-height: 1;
        margin: 5px 0;
    }
}
*/

#submit-review {
    padding: 0 15px;
    header.product .simple-field,
    &.friendly header .errorlist {
        margin: 5px 0 0;
    }
    h2 {
        font-size: 18px;
        font-weight: 400;
    }
    .req,
    label[for=id_rating] {
        display: none;
    }
}
// 180x18, 120x12, 90x9, 332x32
.stars {
    background: url(../../img/mkt/stars/sprite_12.png) no-repeat;
    display: inline-block;
    height: 15px;
    margin-right: 4px;
    text-indent: -9999px;
    vertical-align: middle;
    width: 60px;
    &.stars-4 { background-position: -12px 1px; }
    &.stars-3 { background-position: -24px 1px; }
    &.stars-2 { background-position: -36px 1px; }
    &.stars-1 { background-position: -48px 1px; }
    &.stars-0 { background-position: -60px 1px; }
    &.ratingwidget {
        background: url(../../img/mkt/stars/sprite_32.png) repeat-x;
        background-repeat: repeat-x 5px 0;
        height: 32px;
        width: 200px;
        // Yeah, maybe I should just set a class in JS. I thought I was being clever.
        &.stars-1 label[data-stars="1"], &.stars-2 label[data-stars="1"], &.stars-2 label[data-stars="2"],
        &.stars-3 label[data-stars="1"], &.stars-3 label[data-stars="2"], &.stars-3 label[data-stars="3"],
        &.stars-4 label[data-stars="1"], &.stars-4 label[data-stars="2"], &.stars-4 label[data-stars="3"], &.stars-4 label[data-stars="4"],
        &.stars-5 label[data-stars="1"], &.stars-5 label[data-stars="2"], &.stars-5 label[data-stars="3"], &.stars-5 label[data-stars="4"], &.stars-5 label[data-stars="5"] {
            background: url(../../img/mkt/stars/sprite_32.png) 100% 100%;
        }
        label {
            height: 32px;
            width: 40px;
        }
    }
    &.large {
        background: url(../../img/mkt/stars/sprite_18.png) no-repeat;
        width: 90px;
        height: 18px;
    }
}

.html-rtl .stars {
    margin: 0 0 0 4px;
}

.creatured .stars,
.featured .stars {
    background-image: url(../../img/mkt/stars/sprite_9.png);
    height: 9px;
    width: 45px;
    &.stars-4 { background-position: -9px 0; }
    &.stars-3 { background-position: -18px 0; }
    &.stars-2 { background-position: -27px 0; }
    &.stars-1 { background-position: -36px 0; }
    &.stars-0 { background-position: -45px 0; }
}

.featured .rating .cnt {
    display: none;
}

.no-rating strong {
    font-size: 12px;
    font-weight: 700;
}

.average-rating {
    span {
        color: @text;
        vertical-align: bottom;
        &:first-child {
            line-height: 18px;
            padding-right: 6px;
        }
    }
}

.full #add-first-review {
    margin-top: 15px;
}

.split {
    + .split {
        margin-top: 15px;
    }
}

@media (min-width: @7col) {
    .split {
        float: left;
        padding: 0 5px 15px 0;
        width: 50%;
        + .split {
            margin-top: 0;
            padding: 0 0 15px 5px;
        }
    }
}

.simple-field.rating {
    .border-radius(4px);
    .box-shadow(inset 0 1px 4px rgba(0,0,0,.25),
                inset 0 1px 0 fade(@white, 80%),
                0 1px 0 fade(@white, 80%));
    background: rgba(200,200,200,.2);
    margin-bottom: 15px;
    padding: 20px 10px;
    .ratingwidget {
        margin: 0 auto;
    }
    .errorlist {
        margin-top: 10px;
        text-align: center;
    }
}

.ratingwidget {
    display: block;
    float: none;
    width: 65px;
    input {
        display: none;
    }
    label {
        cursor: pointer;
        display: block;
        float: left;
        margin: 0;
        text-indent: -9999px;
        width: 13px;
    }
}

/*
// TODO: Expose maybe later.
.grouped-ratings {
    .border-radius(4px);
    background: rgb(226,230,233);
    border: 1px solid @bg-gray;
    color: @medium-gray;
    display: none;
    padding: 17px 15px;
    position: relative;
    top: -5px;
    width: 100%;
    z-index: 0;
    // The arrow.
    &:before {
        .transform(~'rotate(45deg)');
        background: rgb(226,230,233);
        border: 1px solid @bg-gray;
        border-width: 1px 0 0 1px;
        content: "";
        height: 12px;
        position: absolute;
        top: -8px;
        left: 116px;
        right: 22px;
        width: 12px;
        z-index: 0;
    }
    .rating-bar {
        height: 22px;
        float: left;
        overflow: visible;
        width: 96px;
        // OMFG.
        &:before {
            .box-shadow(0 3px 6px @dark-gray);
            content: "";
            display: block;
            height: 22px;
            position: absolute;
            top: 0;
            left: 71px;  // old stars: 96px
            width: 2px;
            z-index: 0;
        }
        &:after {
            content: "";
            background: rgb(226,230,233);
            height: 36px;
            position: absolute;
            top: -5px;
            left: 64px;  // old stars: 89px
            width: 9px;
            z-index: 1;
        }
        .bar {
            background: rgb(205,210,214);
            border-top: rgb(183,188,192) 1px solid;
            border-bottom: rgb(234,238,239) 1px solid;
            display: block;
            height: 4px;
            position: relative;
            margin: 10px 10px 0 3px;
            &:before {
                background: @barely-gray;
                content: "";
                display: block;
                height: 22px;
                position: absolute;
                top: -11px;
                left: -2px;
                width: 1px;
            }
        }
    }
    li {
        position: relative;
        &:first-child,
        &:last-child {
            .rating-bar:before {
                .box-shadow(0 3px 6px @medium-gray);
            }
            .bar:before {
                height: 26px;
            }
        }
        &:first-child .bar:before {
            top: -10px;
        }
    }
    .num-ratings {
        color: lighten(@navy-gray, 10%);
        font-size: 11px;
        line-height: 8px;
        position: absolute;
        top: -2px;
        right: -5px;
        width: 1px;
        word-wrap: normal;
    }
    .stars {
        float: left;
        margin: 7px 8px 0 0;  // old stars: 4px 8px 0 0
    }
}
*/

.items-profile {
    padding: 0;

    .review {
        background: @white;
    }
    .review:first-child {
        border-top: 1px solid @light-gray;
    }

    .review-inner {
        padding: 0 10px 0 95px;
    }
    h3 {
        font-size: 18px;
    }
    .icon-profile {
        position: absolute;
        left: 10px;
        max-height: 64px;
        max-width: 64px;
    }
    .byline {
        display: none;
    }
    .body {
        margin: 5px 0;
    }
    .timestamp {
        position: absolute;
        top: 10px;
        right: 10px;
    }
    .actions {
        position: absolute;
        bottom: 15px;
        right: 10px;
    }
}

.submit-review {
    float: left;
}
p.support-link {
    float: right;
    font-size: 13px;
    margin-top: 48px;
}

@import 'lib';

// On page load this gets transformed by JS into a star picker.
select[name=rating] {
    display: none;
}

section.replies .review.reply {
    display: block;
}

#reviews-info {
    margin-top: 20px;
    position: relative;
}

// Detail page.
#reviews {
    position: relative;
    ul {
        margin: 0;
        padding: 0;
    }
    #submit-review {
        position: absolute;
        margin: 10px 0;
    }
    .not-rated + p a {
        padding: 5px 20px 5px 0;
    }
}

.review {
    .transition(~'.3s all');
    list-style-type: none;
    padding: 10px 16px;
    position: relative;
    &.reply {
        background: url(../../img/mkt/icons/reply.png) 10px 15px no-repeat;
        display: none;
        padding-left: 35px;
    }
    &.deleting {
        background: fade(@red, 40%);
    }
    &.deleted {
        border: 0;
        height: 0;
        overflow: hidden;
        padding: 0;
        + .review {
            border-top: 0;
        }
    }
    .byline, .timestamp {
        font-size: 12px;
    }
    .byline {
        color: @medium-gray;
        font-weight: 600;
        b {
            color: @gray;
        }
        strong {
            color: #444;
        }
    }
    .timestamp {
        color: @note-gray;
        float: right;
        &:hover {
            color: @gray;
        }
    }
    .body {
        margin: 5px 0 15px;
    }
    .view-reply {
        font-size: 12px;
        font-weight: 600;
        padding: 5px 10px;
    }
    ul {
        float: left;
        list-style: none;
    }
    li {
        display: inline-block;
        &.hidden {
            display: none;
        }
        &:not(.hidden) + li:before,
        + li.hidden + li:before {
            color: @note-gray;
            content: "\00a0\2022\00a0\00a0";
        }
    }
}

// This applies to "app details" pages only.
.reviews {
    border-top: 1px solid rgba(255,255,255,.5);
    border-bottom: 1px solid rgba(3,16,26,.13);
    .not-rated {
        color: lighten(@text, 5%);
        font-size: 14px;
        font-weight: 600;
        margin: 0;
    }
    #reviews {
        margin: 15px;
    }
}

#reviews-detail {
    padding: 15px;
    ul {
        margin: 0;
        padding: 0;
        .review {
            padding: 0;
        }
    }
}

// This applies to "reviews list" pages only.
// TODO: make proper review tiles. This is an interim solution.
.reviews-listing {
    #add-review {
        margin: 30px 16px;
    }
    .button.fat {
        line-height: 35px;
        height: 35px;
        &:hover {
            line-height: 35px;
        }
    }
    .review {
        border-top: 1px solid #bcc0c2;
        border-bottom: 1px solid #bcc0c2;
        &:nth-of-type(2n) {
            border-top: 1px solid #eceff0;
            border-bottom: 0;
        }
    }
}

#review-list .review:nth-of-type(2n + 1) {
    background-color: darken(@bg, 5%);
    + .replies .review {
        background-color: darken(@bg, 5%);
    }
}

/*
// TODO: Expose later sometime (`rating_header` function)
header.product {
    margin-bottom: 15px;
    position: relative;
    .visual {
        margin-right: 15px;
        height: 64px;
        width: 64px;
        + div {
            float: left;
            max-width: 905px;
        }
    }
    h1 {
        color: @navy-gray;
        font-size: 22px;
        font-weight: 400;
        line-height: 1.2;
        &.multi {
            font-size: 22px;
            small, span {
                .ellipsis;
                display: block;
                margin-bottom: -8px;
                padding-bottom: 6px;
            }
            small {
                color: lighten(@navy-gray, 10%);
                display: block;
                font-size: 14px;
                font-weight: 600;
            }
        }
    }
    p {
        font-size: 14px;
        line-height: 1;
        margin: 5px 0;
    }
}
*/

#submit-review {
    padding: 0 15px;
    header.product .simple-field,
    &.friendly header .errorlist {
        margin: 5px 0 0;
    }
    h2 {
        font-size: 18px;
        font-weight: 400;
    }
    .req,
    label[for=id_rating] {
        display: none;
    }
}
// 180x18, 120x12, 90x9, 332x32
.stars {
    background: url(../../img/mkt/stars/sprite_12.png) no-repeat;
    display: inline-block;
    height: 15px;
    margin-right: 4px;
    text-indent: -9999px;
    vertical-align: middle;
    width: 60px;
    &.stars-4 { background-position: -12px 1px; }
    &.stars-3 { background-position: -24px 1px; }
    &.stars-2 { background-position: -36px 1px; }
    &.stars-1 { background-position: -48px 1px; }
    &.stars-0 { background-position: -60px 1px; }
    &.ratingwidget {
        background: url(../../img/mkt/stars/sprite_32.png) repeat-x;
        background-repeat: repeat-x 5px 0;
        height: 32px;
        width: 200px;
        // Yeah, maybe I should just set a class in JS. I thought I was being clever.
        &.stars-1 label[data-stars="1"], &.stars-2 label[data-stars="1"], &.stars-2 label[data-stars="2"],
        &.stars-3 label[data-stars="1"], &.stars-3 label[data-stars="2"], &.stars-3 label[data-stars="3"],
        &.stars-4 label[data-stars="1"], &.stars-4 label[data-stars="2"], &.stars-4 label[data-stars="3"], &.stars-4 label[data-stars="4"],
        &.stars-5 label[data-stars="1"], &.stars-5 label[data-stars="2"], &.stars-5 label[data-stars="3"], &.stars-5 label[data-stars="4"], &.stars-5 label[data-stars="5"] {
            background: url(../../img/mkt/stars/sprite_32.png) 100% 100%;
        }
        label {
            height: 32px;
            width: 40px;
        }
    }
    &.large {
        background: url(../../img/mkt/stars/sprite_18.png) no-repeat;
        width: 90px;
        height: 18px;
    }
}

.html-rtl .stars {
    margin: 0 0 0 4px;
}

.creatured .stars,
.featured .stars {
    background-image: url(../../img/mkt/stars/sprite_9.png);
    height: 9px;
    width: 45px;
    &.stars-4 { background-position: -9px 0; }
    &.stars-3 { background-position: -18px 0; }
    &.stars-2 { background-position: -27px 0; }
    &.stars-1 { background-position: -36px 0; }
    &.stars-0 { background-position: -45px 0; }
}

.featured .rating .cnt {
    display: none;
}

.no-rating strong {
    font-size: 12px;
    font-weight: 700;
}

.average-rating {
    span {
        color: @text;
        vertical-align: bottom;
        &:first-child {
            line-height: 18px;
            padding-right: 6px;
        }
    }
}

.full #add-first-review {
    margin-top: 15px;
}

.split {
    + .split {
        margin-top: 15px;
    }
}

@media (min-width: @7col) {
    .split {
        float: left;
        padding: 0 5px 15px 0;
        width: 50%;
        + .split {
            margin-top: 0;
            padding: 0 0 15px 5px;
        }
    }
}

.simple-field.rating {
    .border-radius(4px);
    .box-shadow(inset 0 1px 4px rgba(0,0,0,.25),
                inset 0 1px 0 fade(@white, 80%),
                0 1px 0 fade(@white, 80%));
    background: rgba(200,200,200,.2);
    margin-bottom: 15px;
    padding: 20px 10px;
    .ratingwidget {
        margin: 0 auto;
    }
    .errorlist {
        margin-top: 10px;
        text-align: center;
    }
}

.ratingwidget {
    display: block;
    float: none;
    width: 65px;
    input {
        display: none;
    }
    label {
        cursor: pointer;
        display: block;
        float: left;
        margin: 0;
        text-indent: -9999px;
        width: 13px;
    }
}

/*
// TODO: Expose maybe later.
.grouped-ratings {
    .border-radius(4px);
    background: rgb(226,230,233);
    border: 1px solid @bg-gray;
    color: @medium-gray;
    display: none;
    padding: 17px 15px;
    position: relative;
    top: -5px;
    width: 100%;
    z-index: 0;
    // The arrow.
    &:before {
        .transform(~'rotate(45deg)');
        background: rgb(226,230,233);
        border: 1px solid @bg-gray;
        border-width: 1px 0 0 1px;
        content: "";
        height: 12px;
        position: absolute;
        top: -8px;
        left: 116px;
        right: 22px;
        width: 12px;
        z-index: 0;
    }
    .rating-bar {
        height: 22px;
        float: left;
        overflow: visible;
        width: 96px;
        // OMFG.
        &:before {
            .box-shadow(0 3px 6px @dark-gray);
            content: "";
            display: block;
            height: 22px;
            position: absolute;
            top: 0;
            left: 71px;  // old stars: 96px
            width: 2px;
            z-index: 0;
        }
        &:after {
            content: "";
            background: rgb(226,230,233);
            height: 36px;
            position: absolute;
            top: -5px;
            left: 64px;  // old stars: 89px
            width: 9px;
            z-index: 1;
        }
        .bar {
            background: rgb(205,210,214);
            border-top: rgb(183,188,192) 1px solid;
            border-bottom: rgb(234,238,239) 1px solid;
            display: block;
            height: 4px;
            position: relative;
            margin: 10px 10px 0 3px;
            &:before {
                background: @barely-gray;
                content: "";
                display: block;
                height: 22px;
                position: absolute;
                top: -11px;
                left: -2px;
                width: 1px;
            }
        }
    }
    li {
        position: relative;
        &:first-child,
        &:last-child {
            .rating-bar:before {
                .box-shadow(0 3px 6px @medium-gray);
            }
            .bar:before {
                height: 26px;
            }
        }
        &:first-child .bar:before {
            top: -10px;
        }
    }
    .num-ratings {
        color: lighten(@navy-gray, 10%);
        font-size: 11px;
        line-height: 8px;
        position: absolute;
        top: -2px;
        right: -5px;
        width: 1px;
        word-wrap: normal;
    }
    .stars {
        float: left;
        margin: 7px 8px 0 0;  // old stars: 4px 8px 0 0
    }
}
*/

.items-profile {
    padding: 0;

    .review {
        background: @white;
    }
    .review:first-child {
        border-top: 1px solid @light-gray;
    }

    .review-inner {
        padding: 0 10px 0 95px;
    }
    h3 {
        font-size: 18px;
    }
    .icon-profile {
        position: absolute;
        left: 10px;
        max-height: 64px;
        max-width: 64px;
    }
    .byline {
        display: none;
    }
    .body {
        margin: 5px 0;
    }
    .timestamp {
        position: absolute;
        top: 10px;
        right: 10px;
    }
    .actions {
        position: absolute;
        bottom: 15px;
        right: 10px;
    }
}

.submit-review {
    float: left;
}
p.support-link {
    float: right;
    font-size: 13px;
    margin-top: 48px;
}


hopefully, last adjustment

hopefully, last adjustment

@import "variables";

.card-wrapper {
  margin: 0px 4px 0px 0px;
  vertical-align: middle;
}

.card-frame {
  position: relative;
}

.card {
  position: relative;
  border-radius: 4px;
  box-shadow: 0 0 12px rgba(0,0,0,0.4), inset 0 0 0 1px rgba(255,255,255,0.1);
  overflow: hidden;
  z-index: @layer-cards;

  &.vertical {
    height: @card-height;
    width: @card-width;

    &.honor {
      height: @card-height-honor;

      &.attachment {
        height: @card-height;
        width: @card-width;
      }
    }
  }

  &.horizontal {
    height: @card-width;
    width: @card-height;

    &.honor {
      width: @card-height-honor;

      &.attachment {
        width: @card-height;
      }
    }

  }

  &.selectable {
    box-shadow: 0 0 10px 1px fadeout(lighten(@brand-primary, 60%), 10%);
  }

  &.unselectable {
    filter: grayscale(100%) brightness(60%);
  }

  &.in-danger {
    box-shadow: 0 0 1px 2px red;
  }

  &.saved {
    box-shadow: 0 0 1px 2px green;
  }

  &.selected {
    box-shadow: 0 0 1px 4px @brand-primary;
  }

  &.new {
    box-shadow: 0 0 1px 2px @brand-info;
  }

  &.controlled {
    box-shadow: 0 0 1px 2px @brand-warning;
  }

  &.challenge {
    box-shadow: 0 0 1px 2px @brand-danger;
  }

  &.stealth {
    box-shadow: 0 0 1px 2px #c14e15;
  }
}

.card-image {
  left: 0;
  position: absolute;
  top: 0;

  &.vertical {
    height: @card-height;
    width: @card-width;
  }

  &.horizontal {
    height: @card-width;
    width: @card-height;
  }

  &.bowed {
    left: 9px;
    top: -10px;
    transform: rotate(90deg);

    &.honor {
      left: 53px;
    }
  }
}

.honor .card-image {
  left: 0px;
  position: absolute;
  top: 0;

  &.vertical {
    height: @card-height;
    width: @card-width;
  }

  &.horizontal {
    height: @card-width;
    width: @card-height;
  }

  &.bowed {
    left: 53px;
    top: -10px;
    transform: rotate(90deg);

    &.honor {
      left: 53px;
    }
  }
}

.honor.attachment .card-image {
  left: 0px;
  position: absolute;
  top: 0;

  &.vertical {
    height: @card-height;
    width: @card-width;
  }

  &.horizontal {
    height: @card-width;
    width: @card-height;
  }

  &.bowed {
    left: 9px;
    top: -10px;
    transform: rotate(90deg);

    &.honor {
      left: 53px;
    }
  }
}

.honored {
  position: absolute;
  width: @card-width;
  top: @card-height;
  left: 0px;

  &.bowed {
    left: -10px;
    top: 11px;
    transform: rotate(90deg);
  }
}

.dishonored {
  position: absolute;
  width: @card-width;
  top: @card-height;
  left: 0px;

  &.bowed {
    left: @card-height-honor;
    top: -10px;
    transform: rotate(90deg);
  }
}

.card-order {
  background: rgba(0, 0, 0, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.9);
  border-radius: 4px;
  color: white;
  font-size: 16px;
  font-weight: bold;
  height: 26px;
  left: 50%;
  line-height: 24px;
  margin: 0 0 0 -12px;
  position: absolute;
  text-align: center;
  top: -28px;
  width: 24px;
  z-index: @layer-card-menu;
}

.card-name {
  font-size: 10px;
  line-height: 14px;
}

.card-large {
  width: 220px;
  height: 307px;
  position: absolute;
  top: 0;
  right: 0;
  margin-right: 5px;
  margin-top: 5px;
}

.card-large-horizontal {
  width: 307px;
  height: 220px;
  position: relative;
  margin-right: 5px;
  margin-top: 5px;
}

.card-zoomed {
  width: 100%;
  height: 100%;
}

.card-zoomed > img {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  border-radius: 12px;
}

.attachment {
  margin-top: -(@card-height);

  &.honor {
    margin-top: -(@card-height-honor);
  }

}

.generate-attachments(@n, @i: 1) when (@i =< @n) {
  .attachment-@{i} {
    margin-left: -(@attachment-offset)*@i;
    z-index: @layer-cards - @i;
  }
  .attachment-@{i}.horizontal {
    margin-left: -(@attachment-offset)*@i;
    margin-top: -(@card-height)-(@attachment-offset);
    z-index: @layer-cards - @i;

    &.honor {
      margin-left: 53px-((@attachment-offset)*@i);
    }
  }
  .generate-attachments(@n, (@i + 1));
}

.generate-attachments(5, 1);

.card-dupe {
  margin-bottom: @attachment-offset;
  margin-top: -(@attachment-offset + @card-height);
}

.generate-card-dupes(@n, @i: 1) when (@i =< @n) {
  .card-dupe-@{i} {
    z-index: @layer-cards - @i;
  }
  .generate-card-dupes(@n, (@i + 1));
}
.generate-card-dupes(5, 1);

.card-type-faction.horizontal {
    margin: 10px 0 0 -10px;
}

.counters {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  justify-content: center;
  display: flex;
  align-content: center;
  align-items: center;
  flex-wrap: wrap;
  z-index: @layer-cards + 1;
}

.card.vertical .counters {
  flex-direction: column;

  &.many-counters {
    flex-direction: row;
  }
}

.card.horizontal .counters {
  flex-direction: row;

  &.many-counters {
    flex-direction: column;
  }
}

.counter {
  padding: 0;
  font-size: 12px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  margin: 2px;
  text-shadow: 1px 1px 2px #000;
  border-radius: 4px;
  color: white;

  &.intrigue {
    span {
      display: none;
    }

    font-family: 'thronesdb';

    &:before {
      content: "\e602";
      color: @intrigue-icon-color;
    }

    background-color: rgba(0, 0, 0, 0.85);
  }

  &.military {
    span {
      display: none;
    }

    font-family: 'thronesdb';

    &:before {
      content: "\e605";
      color: @military-icon-color;
    }

    background-color: rgba(0, 0, 0, 0.85);
  }

  &.power {
    span {
      display: none;
    }

    font-family: 'thronesdb';

    &:before {
      content: "\e607";
      color: @power-icon-color;
    }

    background-color: rgba(0, 0, 0, 0.85);
  }

  &.fade-out {
    opacity: 0.4;
  }

  &.cancel {
    position: relative;

    &:after {
      border-bottom: 0.17em solid @brand-danger;
      content: "";
      left: 0;
      margin-top: calc(0.17em / 2 * -1);
      position: absolute;
      right: 0;
      top: 50%;
    }
  }
}

.dupe {
  background-color: @dupe-color;
}

.attachment-dupe {
  background-color: fade(@dupe-color, 50%);
}

.card-power {
  background-color: @power-color;
}

.attachment-power {
  background-color: fade(@power-color, 50%);
}

.strength {
  background-color: @strength-color;
}

.stand {
  background-color: rgba(128,128,128,0.85);
}

.poison {
  background-color: rgba(43,43, 0, 0.85);
}

.gold {
    background-color: rgba(255, 215, 0, 0.85);
}

.valarmorghulis {
  background-color: rgba(192, 192, 192, 0.85);
}

.betrayal {
  background-color: rgba(153, 77, 0, 0.85);
}

.vengeance {
  background-color: rgba(87, 17, 124, 0.85);
}

.ear {
  background-color: rgba(162, 255, 81, 0.85);
}

.venom {
  background-color: @venom-color;
}

.attachment-venom {
  background-color: fade(@venom-color, 50%);
}

.plot-selected {
  box-shadow: 0 0 1px 2px @brand-danger;
}

.province-attachment {
  margin-top: @attachment-offset - @card-height;
}

.generate-province-attachment(@n, @i: 1) when (@i =< @n) {
  .province-attachment-@{i} {
    z-index: @layer-cards - @i;
  }
  .generate-province-attachment(@n, (@i + 1));
}

.generate-province-attachment(5, 1);

@import "variables";

.card-wrapper {
  margin: 0px 4px 0px 0px;
  vertical-align: middle;
}

.card-frame {
  position: relative;
}

.card {
  position: relative;
  border-radius: 4px;
  box-shadow: 0 0 12px rgba(0,0,0,0.4), inset 0 0 0 1px rgba(255,255,255,0.1);
  overflow: hidden;
  z-index: @layer-cards;

  &.vertical {
    height: @card-height;
    width: @card-width;

    &.honor {
      height: @card-height-honor;

      &.attachment {
        height: @card-height;
        width: @card-width;
      }
    }
  }

  &.horizontal {
    height: @card-width;
    width: @card-height;

    &.honor {
      width: @card-height-honor;

      &.attachment {
        width: @card-height;
      }
    }

  }

  &.selectable {
    box-shadow: 0 0 10px 1px fadeout(lighten(@brand-primary, 60%), 10%);
  }

  &.unselectable {
    filter: grayscale(100%) brightness(60%);
  }

  &.in-danger {
    box-shadow: 0 0 1px 2px red;
  }

  &.saved {
    box-shadow: 0 0 1px 2px green;
  }

  &.selected {
    box-shadow: 0 0 1px 4px @brand-primary;
  }

  &.new {
    box-shadow: 0 0 1px 2px @brand-info;
  }

  &.controlled {
    box-shadow: 0 0 1px 2px @brand-warning;
  }

  &.challenge {
    box-shadow: 0 0 1px 2px @brand-danger;
  }

  &.stealth {
    box-shadow: 0 0 1px 2px #c14e15;
  }
}

.card-image {
  left: 0;
  position: absolute;
  top: 0;

  &.vertical {
    height: @card-height;
    width: @card-width;
  }

  &.horizontal {
    height: @card-width;
    width: @card-height;
  }

  &.bowed {
    left: 9px;
    top: -10px;
    transform: rotate(90deg);

    &.honor {
      left: 53px;
    }
  }
}

.honor .card-image {
  left: 0px;
  position: absolute;
  top: 0;

  &.vertical {
    height: @card-height;
    width: @card-width;
  }

  &.horizontal {
    height: @card-width;
    width: @card-height;
  }

  &.bowed {
    left: 53px;
    top: -10px;
    transform: rotate(90deg);

    &.honor {
      left: 53px;
    }
  }
}

.honor.attachment .card-image {
  left: 0px;
  position: absolute;
  top: 0;

  &.vertical {
    height: @card-height;
    width: @card-width;
  }

  &.horizontal {
    height: @card-width;
    width: @card-height;
  }

  &.bowed {
    left: 13px;
    top: -10px;
    transform: rotate(90deg);

    &.honor {
      left: 53px;
    }
  }
}

.honored {
  position: absolute;
  width: @card-width;
  top: @card-height;
  left: 0px;

  &.bowed {
    left: -10px;
    top: 11px;
    transform: rotate(90deg);
  }
}

.dishonored {
  position: absolute;
  width: @card-width;
  top: @card-height;
  left: 0px;

  &.bowed {
    left: @card-height-honor;
    top: -10px;
    transform: rotate(90deg);
  }
}

.card-order {
  background: rgba(0, 0, 0, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.9);
  border-radius: 4px;
  color: white;
  font-size: 16px;
  font-weight: bold;
  height: 26px;
  left: 50%;
  line-height: 24px;
  margin: 0 0 0 -12px;
  position: absolute;
  text-align: center;
  top: -28px;
  width: 24px;
  z-index: @layer-card-menu;
}

.card-name {
  font-size: 10px;
  line-height: 14px;
}

.card-large {
  width: 220px;
  height: 307px;
  position: absolute;
  top: 0;
  right: 0;
  margin-right: 5px;
  margin-top: 5px;
}

.card-large-horizontal {
  width: 307px;
  height: 220px;
  position: relative;
  margin-right: 5px;
  margin-top: 5px;
}

.card-zoomed {
  width: 100%;
  height: 100%;
}

.card-zoomed > img {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  border-radius: 12px;
}

.attachment {
  margin-top: -(@card-height);

  &.honor {
    margin-top: -(@card-height-honor);
  }

}

.generate-attachments(@n, @i: 1) when (@i =< @n) {
  .attachment-@{i} {
    margin-left: -(@attachment-offset)*@i;
    z-index: @layer-cards - @i;
  }
  .attachment-@{i}.horizontal {
    margin-left: -(@attachment-offset)*@i;
    margin-top: -(@card-height)-(@attachment-offset);
    z-index: @layer-cards - @i;

    &.honor {
      margin-left: 53px-((@attachment-offset)*@i);
    }
  }
  .generate-attachments(@n, (@i + 1));
}

.generate-attachments(5, 1);

.card-dupe {
  margin-bottom: @attachment-offset;
  margin-top: -(@attachment-offset + @card-height);
}

.generate-card-dupes(@n, @i: 1) when (@i =< @n) {
  .card-dupe-@{i} {
    z-index: @layer-cards - @i;
  }
  .generate-card-dupes(@n, (@i + 1));
}
.generate-card-dupes(5, 1);

.card-type-faction.horizontal {
    margin: 10px 0 0 -10px;
}

.counters {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  justify-content: center;
  display: flex;
  align-content: center;
  align-items: center;
  flex-wrap: wrap;
  z-index: @layer-cards + 1;
}

.card.vertical .counters {
  flex-direction: column;

  &.many-counters {
    flex-direction: row;
  }
}

.card.horizontal .counters {
  flex-direction: row;

  &.many-counters {
    flex-direction: column;
  }
}

.counter {
  padding: 0;
  font-size: 12px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  margin: 2px;
  text-shadow: 1px 1px 2px #000;
  border-radius: 4px;
  color: white;

  &.intrigue {
    span {
      display: none;
    }

    font-family: 'thronesdb';

    &:before {
      content: "\e602";
      color: @intrigue-icon-color;
    }

    background-color: rgba(0, 0, 0, 0.85);
  }

  &.military {
    span {
      display: none;
    }

    font-family: 'thronesdb';

    &:before {
      content: "\e605";
      color: @military-icon-color;
    }

    background-color: rgba(0, 0, 0, 0.85);
  }

  &.power {
    span {
      display: none;
    }

    font-family: 'thronesdb';

    &:before {
      content: "\e607";
      color: @power-icon-color;
    }

    background-color: rgba(0, 0, 0, 0.85);
  }

  &.fade-out {
    opacity: 0.4;
  }

  &.cancel {
    position: relative;

    &:after {
      border-bottom: 0.17em solid @brand-danger;
      content: "";
      left: 0;
      margin-top: calc(0.17em / 2 * -1);
      position: absolute;
      right: 0;
      top: 50%;
    }
  }
}

.dupe {
  background-color: @dupe-color;
}

.attachment-dupe {
  background-color: fade(@dupe-color, 50%);
}

.card-power {
  background-color: @power-color;
}

.attachment-power {
  background-color: fade(@power-color, 50%);
}

.strength {
  background-color: @strength-color;
}

.stand {
  background-color: rgba(128,128,128,0.85);
}

.poison {
  background-color: rgba(43,43, 0, 0.85);
}

.gold {
    background-color: rgba(255, 215, 0, 0.85);
}

.valarmorghulis {
  background-color: rgba(192, 192, 192, 0.85);
}

.betrayal {
  background-color: rgba(153, 77, 0, 0.85);
}

.vengeance {
  background-color: rgba(87, 17, 124, 0.85);
}

.ear {
  background-color: rgba(162, 255, 81, 0.85);
}

.venom {
  background-color: @venom-color;
}

.attachment-venom {
  background-color: fade(@venom-color, 50%);
}

.plot-selected {
  box-shadow: 0 0 1px 2px @brand-danger;
}

.province-attachment {
  margin-top: @attachment-offset - @card-height;
}

.generate-province-attachment(@n, @i: 1) when (@i =< @n) {
  .province-attachment-@{i} {
    z-index: @layer-cards - @i;
  }
  .generate-province-attachment(@n, (@i + 1));
}

.generate-province-attachment(5, 1);


nye less filer ;)

nye less filer ;)

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/Det-Kongelige-Bibliotek/rex.git/'


add browser-specific styles for hover state

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/rohm/reviveourhearts_com_redesign.git/'


update offline indicator

update offline indicator

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/websage-team/sp-boilerplate.git/'


fix typo

fix typo

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/MatTheCat/clean.git/'


Updates navabar inverse design

Updates navabar inverse design

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/sonatra/sonatra-bootstrap-nav-scroll.git/'


Delete variables.less

Delete variables.less

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/hackersvsharassment/hackersvsharassment.github.io.git/'


New content markup; .gitignore updates; Angularizing app

html {
	position: relative;
	min-height: 100%;
}

.casmgmt-app {
    margin-bottom: @footer-height;
}

error: pathspec 'cas-management-webapp/src/main/webapp/less/layout/layout.less' did not match any file(s) known to git


Fix aligning of the close button.

Fix aligning of the close button.

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/gmist/five-studio2.git/'


Name of Media items easyer to read

Name of Media items easyer to read

The contrast between the text color and background was to low. The text
color has to be darker - black would be the right one.

//
// Container styles
// --------------------------------------------------
.umb-editor {
  min-width:66.6%;
}

.umb-editor-tiny {
  width: 50px;
}

.umb-editor-small {
  width: 90px;
}

.umb-modal .umb-editor {
  width: 95%;
}

.umb-dialog .umb-editor {
  width: 95%;
}
.umb-dialog .umb-control-group .help-block {
  width: 95%;
}

.umb-codeeditor{
  width: 99%;
}

//
// Content picker
// --------------------------------------------------
.umb-contentpicker li a:hover .hover-hide, .umb-contentpicker li a .hover-show{
  display: none;
}
.umb-contentpicker li a:hover .hover-show{display: inline-block;}

.umb-contentpicker-popover .search-holder {
  padding: 10px;
}

/* CODEMIRROR DATATYPE */
div.umb-codeeditor {
  border: 1px solid #e8e8e8;
}
div.umb-codeeditor .umb-el-wrap {
  padding: 0px;
}
div.umb-codeeditor .umb-btn-toolbar {
  padding: 0px;
  margin: 0px;
  border-bottom: #e8e8e8 1px solid;
  background: #f7f7f7
}

//
// RTE
// --------------------------------------------------
.mce-tinymce{border: 1px solid @grayLight !important; }
.mce-panel{background: @grayLighter !important; border-color: @grayLight !important;}
.mce-btn-group, .mce-btn{border: none !important; background: none !important;}
.mce-ico{font-size: 12px !important; color: @blackLight !important;}
/* Special case to support helviticons for the tiny mce button controls */
.mce-ico.mce-i-custom[class^="icon-"],
.mce-ico.mce-i-custom[class*=" icon-"] {
  font-family: icomoon;
  font-size:16px !important;
}

//
// Color picker
// --------------------------------------------------
ul.color-picker li {
  padding: 2px;
  margin: 3px;
  border: 2px solid transparent;
  width: 60px;
}
ul.color-picker li.active {
  border: 2px dashed #d9d9d9;
}
ul.color-picker li a  {
  height: 50px;
  display:block;
  cursor:pointer;
}

.control-group.color-picker-preval .thumbnail {
  width:30px;
  border:none;
}

//
// Media picker
// --------------------------------------------------
.umb-mediapicker .add-link{
  display: inline-block;
  height: 120px;
  width: 120px;
  text-align: center;
  color: @grayLight;
  border: 2px @grayLight dashed !important;
  line-height: 120px;
  text-decoration: none;
}

.umb-mediapicker .picked-image{
  position: absolute;
  bottom: 10px;
  right: 10px;
  opacity: 0.5;

  font-size: 24px;
  color: red;
  background: white;

  line-height: 36px;
  text-align: center;
  -moz-border-radius: 15px;
  border-radius: 15px;

  height: 32px;
  width: 32px;
  overflow: hidden;
  display: none;
  text-decoration: none;
}

.umb-thumbnails{
  position: relative;
}

.umb-thumbnails i{margin: auto;}
.umb-thumbnails a{
  outline: none;
  border:none !important;
  box-shadow:none !important;
}

.umb-sortable-thumbnails {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: block;
}

.umb-sortable-thumbnails li{
    display: inline-block;
    border: 1px solid @grayLighter;
    padding: 2px;
    background: white;
    margin: 5px;
    position: relative;
    text-align: center;
    vertical-align: top;
}

.umb-sortable-thumbnails li:hover a{
  display: block;
}

.umb-sortable-thumbnails li img
{
  max-width:100%;
  max-height:100%;
  margin:auto;
  display:block;
}

.umb-sortable-thumbnails li img.noScale{
  max-width: none !important;
  max-height: none !important;
}

.umb-sortable-thumbnails .icon-holder .icon{
  font-size: 60px;
  line-height: 70px;
}
.umb-sortable-thumbnails .icon-holder *
{
  color: @grayLight;
  display: block
}

//
// Cropper
// -------------------------------------------------

.umb-cropper{
  position: relative;
  padding-bottom: 30px;
}

.umb-cropper img, .umb-cropper-gravity img{
   position: absolute;
   top: 0;
   left: 0;
 }

 .umb-cropper .overlay, .umb-cropper-gravity .overlay {
  top: 0;
  left: 0;
  cursor: move;
  z-index: 6001;
}

.umb-cropper .viewport{
    overflow: hidden;
    position: relative;
    border: 1px solid @grayLight;
 }

.umb-cropper-gravity .viewport{
   overflow: hidden;
   position: relative;
   width: 400px;
   height: 300px
}

.umb-cropper .viewport:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5999;
  -moz-opacity: .75;
  opacity: .75;
  filter: alpha(opacity=7);
  -webkit-box-shadow: inset 0 0 0 40px white,inset 0 0 0 41px rgba(0,0,0,.1),inset 0 0 40px 41px rgba(0,0,0,.2);
  -moz-box-shadow: inset 0 0 0 40px white,inset 0 0 0 41px rgba(0,0,0,.1),inset 0 0 40px 41px rgba(0,0,0,.2);
  box-shadow: inset 0 0 0 40px white,inset 0 0 0 41px rgba(0,0,0,.1),inset 0 0 40px 41px rgba(0,0,0,.2);
}

.umb-cropper-gravity .overlay{
  width: 14px;
  height: 14px;
  text-align: center;
  border-radius: 20px;
  background: @blue;
  border: 3px solid white;
  opacity: 0.8;
}

.umb-cropper-gravity .overlay i{
  font-size: 26px;
  line-height: 26px;
  opacity: 0.8 !important;
}

.umb-cropper .crop-container{
    text-align: center;
}

.umb-cropper .crop-slider{
   vertical-align: middle;
   width: 250px;
   padding-top: 12px;
}

.umb-cropper .crop-slider i{color: @gray;}
.umb-cropper .crop-slider input{
   margin-top: 7px;
}

//
// folder-browser
// --------------------------------------------------
.umb-folderbrowser .add-link{
  display: inline-block;
  height: 120px;
  width: 120px;
  text-align: center;
  border: 1px @grayLight dashed;
  line-height: 120px
}

.umb-upload-drop-zone .info, .umb-upload-button-big{
  display: block;
  padding: 20px;
  opacity: 1;

  border: 1px dashed @grayLight;
  background: none;
  text-align: center;
  font-size: 14px;

  color: @grayLight;
}

.umb-upload-button-big:hover{color: @grayLight;}

.umb-upload-drop-zone .info i.icon, .umb-upload-button-big i.icon{
  font-size: 55px;
  line-height: 70px
}

.umb-upload-button-big {display: block}
.umb-upload-button-big input {
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
}

//
// Photo folder styling
// --------------------------------------------------

.umb-photo-folder .picrow{
  overflow-y: hidden;
  position: relative;
}

.umb-photo-folder .picrow div, .umb-photo-preview{
  margin: 0px;
  padding: 0px;
  border: none;
  display: inline-block;
  vertical-align: top;
  position: relative;
}

.umb-photo-folder .picrow div a:first-child {
    width:100%;
    height:100%;
}

.umb-photo-folder .picrow div.umb-photo {
    width:100%;
    height:100%;
    background-color: @grayLighter;
}

.umb-photo-folder a:hover{text-decoration: none}
.umb-photo-folder .umb-non-thumbnail{
  text-align: center;
  vertical-align: center;
  font-size: 12px;
  background: @grayLighter;
  color: @black;
  text-decoration: none;
}

//this is a temp hack, to provide selectors in the dialog:
.umb-photo-folder .pic:hover .selector-overlay{
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  padding: 5px;
  background: black;
  z-index: 100;
  display: block;
  text-align: center;
  color: white;
  opacity: 0.4;
}

.umb-photo-folder .umb-non-thumbnail i{
  color: @grayLight;
  font-size: 70px;
  line-height: 80px;
  display: block;
  margin: auto;
  padding-top: 25%;
}

.umb-photo-folder .selected{
  position: relative;
}

.umb-photo-folder .selected:before{
  content: "\e165";
  font-family: Icomoon;

  position: absolute;
  bottom: 10px;
  right: 10px;

  font-size: 24px;
  color: black;
  opacity: 0.5;
  background: white;

  line-height: 36px;
  text-align: center;
  -moz-border-radius: 15px;
  border-radius: 15px;

  height: 32px;
  width: 32px;
  overflow: hidden;
  display: block;
  z-index: 100;
}

//
// File upload
// --------------------------------------------------
.umb-fileupload .preview {
  border-radius: 5px;
  border: 1px solid #a0a0a0;
  padding: 3px;
  background: #efefef;
  float: left;
  margin-right: 30px;
  margin-bottom: 30px
}
.umb-fileupload ul {
  list-style: none;
  vertical-align: middle;
  margin-bottom: 0px
}
.umb-fileupload label {
  vertical-align: middle;
  padding-left: 7px;
  font-weight: normal
}
.umb-fileupload .preview-file {
  color: #666;
  height: 45px;
  width: 55px;
  text-align: center;
  text-transform: uppercase;
  font-size: 10px;
  padding-top: 27px
}
.umb-fileupload input {
  font-size: 12px
}

//
// Member group picker
// --------------------------------------------------

.umb-member-group-box {
  width: 45%;
}
.umb-member-group-box:nth-child(1){
  float:left;
}
.umb-member-group-box:nth-child(2){
  float:right;
}

//
// tags
// --------------------------------------------------
.umb-tags{border: @grayLighter solid 1px; padding: 10px; font-size: 13px; text-shadow: none;}
.umb-tags .tag{cursor: pointer;  margin: 7px; padding: 7px; background: @blue}
.umb-tags .tag i{padding: 2px;}
.umb-tags input{border: none; background: white}

//
// Container styles
// --------------------------------------------------
.umb-editor {
  min-width:66.6%;
}

.umb-editor-tiny {
  width: 50px;
}

.umb-editor-small {
  width: 90px;
}

.umb-modal .umb-editor {
  width: 95%;
}

.umb-dialog .umb-editor {
  width: 95%;
}
.umb-dialog .umb-control-group .help-block {
  width: 95%;
}

.umb-codeeditor{
  width: 99%;
}

//
// Content picker
// --------------------------------------------------
.umb-contentpicker li a:hover .hover-hide, .umb-contentpicker li a .hover-show{
  display: none;
}
.umb-contentpicker li a:hover .hover-show{display: inline-block;}

.umb-contentpicker-popover .search-holder {
  padding: 10px;
}

/* CODEMIRROR DATATYPE */
div.umb-codeeditor {
  border: 1px solid #e8e8e8;
}
div.umb-codeeditor .umb-el-wrap {
  padding: 0px;
}
div.umb-codeeditor .umb-btn-toolbar {
  padding: 0px;
  margin: 0px;
  border-bottom: #e8e8e8 1px solid;
  background: #f7f7f7
}

//
// RTE
// --------------------------------------------------
.mce-tinymce{border: 1px solid @grayLight !important; }
.mce-panel{background: @grayLighter !important; border-color: @grayLight !important;}
.mce-btn-group, .mce-btn{border: none !important; background: none !important;}
.mce-ico{font-size: 12px !important; color: @blackLight !important;}
/* Special case to support helviticons for the tiny mce button controls */
.mce-ico.mce-i-custom[class^="icon-"],
.mce-ico.mce-i-custom[class*=" icon-"] {
  font-family: icomoon;
  font-size:16px !important;
}

//
// Color picker
// --------------------------------------------------
ul.color-picker li {
  padding: 2px;
  margin: 3px;
  border: 2px solid transparent;
  width: 60px;
}
ul.color-picker li.active {
  border: 2px dashed #d9d9d9;
}
ul.color-picker li a  {
  height: 50px;
  display:block;
  cursor:pointer;
}

.control-group.color-picker-preval .thumbnail {
  width:30px;
  border:none;
}

//
// Media picker
// --------------------------------------------------
.umb-mediapicker .add-link{
  display: inline-block;
  height: 120px;
  width: 120px;
  text-align: center;
  color: @grayLight;
  border: 2px @grayLight dashed !important;
  line-height: 120px;
  text-decoration: none;
}

.umb-mediapicker .picked-image{
  position: absolute;
  bottom: 10px;
  right: 10px;
  opacity: 0.5;

  font-size: 24px;
  color: red;
  background: white;

  line-height: 36px;
  text-align: center;
  -moz-border-radius: 15px;
  border-radius: 15px;

  height: 32px;
  width: 32px;
  overflow: hidden;
  display: none;
  text-decoration: none;
}

.umb-thumbnails{
  position: relative;
}

.umb-thumbnails i{margin: auto;}
.umb-thumbnails a{
  outline: none;
  border:none !important;
  box-shadow:none !important;
}

.umb-sortable-thumbnails {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: block;
}

.umb-sortable-thumbnails li{
    display: inline-block;
    border: 1px solid @grayLighter;
    padding: 2px;
    background: white;
    margin: 5px;
    position: relative;
    text-align: center;
    vertical-align: top;
}

.umb-sortable-thumbnails li:hover a{
  display: block;
}

.umb-sortable-thumbnails li img
{
  max-width:100%;
  max-height:100%;
  margin:auto;
  display:block;
}

.umb-sortable-thumbnails li img.noScale{
  max-width: none !important;
  max-height: none !important;
}

.umb-sortable-thumbnails .icon-holder .icon{
  font-size: 60px;
  line-height: 70px;
}
.umb-sortable-thumbnails .icon-holder *
{
  color: @grayLight;
  display: block
}

//
// Cropper
// -------------------------------------------------

.umb-cropper{
  position: relative;
  padding-bottom: 30px;
}

.umb-cropper img, .umb-cropper-gravity img{
   position: absolute;
   top: 0;
   left: 0;
 }

 .umb-cropper .overlay, .umb-cropper-gravity .overlay {
  top: 0;
  left: 0;
  cursor: move;
  z-index: 6001;
}

.umb-cropper .viewport{
    overflow: hidden;
    position: relative;
    border: 1px solid @grayLight;
 }

.umb-cropper-gravity .viewport{
   overflow: hidden;
   position: relative;
   width: 400px;
   height: 300px
}

.umb-cropper .viewport:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5999;
  -moz-opacity: .75;
  opacity: .75;
  filter: alpha(opacity=7);
  -webkit-box-shadow: inset 0 0 0 40px white,inset 0 0 0 41px rgba(0,0,0,.1),inset 0 0 40px 41px rgba(0,0,0,.2);
  -moz-box-shadow: inset 0 0 0 40px white,inset 0 0 0 41px rgba(0,0,0,.1),inset 0 0 40px 41px rgba(0,0,0,.2);
  box-shadow: inset 0 0 0 40px white,inset 0 0 0 41px rgba(0,0,0,.1),inset 0 0 40px 41px rgba(0,0,0,.2);
}

.umb-cropper-gravity .overlay{
  width: 14px;
  height: 14px;
  text-align: center;
  border-radius: 20px;
  background: @blue;
  border: 3px solid white;
  opacity: 0.8;
}

.umb-cropper-gravity .overlay i{
  font-size: 26px;
  line-height: 26px;
  opacity: 0.8 !important;
}

.umb-cropper .crop-container{
    text-align: center;
}

.umb-cropper .crop-slider{
   vertical-align: middle;
   width: 250px;
   padding-top: 12px;
}

.umb-cropper .crop-slider i{color: @gray;}
.umb-cropper .crop-slider input{
   margin-top: 7px;
}

//
// folder-browser
// --------------------------------------------------
.umb-folderbrowser .add-link{
  display: inline-block;
  height: 120px;
  width: 120px;
  text-align: center;
  border: 1px @grayLight dashed;
  line-height: 120px
}

.umb-upload-drop-zone .info, .umb-upload-button-big{
  display: block;
  padding: 20px;
  opacity: 1;

  border: 1px dashed @grayLight;
  background: none;
  text-align: center;
  font-size: 14px;

  color: @grayLight;
}

.umb-upload-button-big:hover{color: @grayLight;}

.umb-upload-drop-zone .info i.icon, .umb-upload-button-big i.icon{
  font-size: 55px;
  line-height: 70px
}

.umb-upload-button-big {display: block}
.umb-upload-button-big input {
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
}

//
// Photo folder styling
// --------------------------------------------------

.umb-photo-folder .picrow{
  overflow-y: hidden;
  position: relative;
}

.umb-photo-folder .picrow div, .umb-photo-preview{
  margin: 0px;
  padding: 0px;
  border: none;
  display: inline-block;
  vertical-align: top;
  position: relative;
}

.umb-photo-folder .picrow div a:first-child {
    width:100%;
    height:100%;
}

.umb-photo-folder .picrow div.umb-photo {
    width:100%;
    height:100%;
    background-color: @grayLighter;
}

.umb-photo-folder a:hover{text-decoration: none}
.umb-photo-folder .umb-non-thumbnail{
  text-align: center;
  vertical-align: center;
  font-size: 12px;
  background: @grayLighter;
  color: @grayLight;
  text-decoration: none;
}

//this is a temp hack, to provide selectors in the dialog:
.umb-photo-folder .pic:hover .selector-overlay{
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  padding: 5px;
  background: black;
  z-index: 100;
  display: block;
  text-align: center;
  color: white;
  opacity: 0.4;
}

.umb-photo-folder .umb-non-thumbnail i{
  color: @grayLight;
  font-size: 70px;
  line-height: 80px;
  display: block;
  margin: auto;
  padding-top: 25%;
}

.umb-photo-folder .selected{
  position: relative;
}

.umb-photo-folder .selected:before{
  content: "\e165";
  font-family: Icomoon;

  position: absolute;
  bottom: 10px;
  right: 10px;

  font-size: 24px;
  color: black;
  opacity: 0.5;
  background: white;

  line-height: 36px;
  text-align: center;
  -moz-border-radius: 15px;
  border-radius: 15px;

  height: 32px;
  width: 32px;
  overflow: hidden;
  display: block;
  z-index: 100;
}

//
// File upload
// --------------------------------------------------
.umb-fileupload .preview {
  border-radius: 5px;
  border: 1px solid #a0a0a0;
  padding: 3px;
  background: #efefef;
  float: left;
  margin-right: 30px;
  margin-bottom: 30px
}
.umb-fileupload ul {
  list-style: none;
  vertical-align: middle;
  margin-bottom: 0px
}
.umb-fileupload label {
  vertical-align: middle;
  padding-left: 7px;
  font-weight: normal
}
.umb-fileupload .preview-file {
  color: #666;
  height: 45px;
  width: 55px;
  text-align: center;
  text-transform: uppercase;
  font-size: 10px;
  padding-top: 27px
}
.umb-fileupload input {
  font-size: 12px
}

//
// Member group picker
// --------------------------------------------------

.umb-member-group-box {
  width: 45%;
}
.umb-member-group-box:nth-child(1){
  float:left;
}
.umb-member-group-box:nth-child(2){
  float:right;
}

//
// tags
// --------------------------------------------------
.umb-tags{border: @grayLighter solid 1px; padding: 10px; font-size: 13px; text-shadow: none;}
.umb-tags .tag{cursor: pointer;  margin: 7px; padding: 7px; background: @blue}
.umb-tags .tag i{padding: 2px;}
.umb-tags input{border: none; background: white}


alerts on top

alerts on top

/**
 * Import Twitter Bootstrap Base File
 */
@import "../../vendor/twbs/bootstrap/less/bootstrap";

body { padding-top: 60px; padding-bottom: 60px; }

.list-main { margin: 0; padding-left: 20px; list-style-type: none; background: url(../../../img/fond_liste.png);

	ul { list-style-type: none;	}
	.private > div .title { padding-left: 20px; background: url(../../../img/icn_locked.png) no-repeat left center; }

	li { line-height: 26px; position: relative;
		.title { color: #333; line-height: 26px; position: absolute; left: 45px; padding-left: 3px; top: 0; display: block; max-width: 500px; white-space: nowrap; overflow: hidden; -ms-text-overflow: ellipsis; text-overflow: ellipsis; }
	}
	form { display: inline-block; }
	.switch { display: inline-block; width: 22px; text-indent: -9999px; background: no-repeat 0 2px url(../../../img/switch-xs.png); margin-left: 5px; }
	.offline > div .switch { background-position: 0 -20px; }

}

.sortable {
	.disclose { position: absolute; left: -15px; top: 9px; width: 10px; height: 10px; display: inline-block; background-repeat: no-repeat; }
	.mjs-nestedSortable-branch .disclose { cursor: pointer; }
	li { position: relative;
		div { cursor: move; display: inline-block; }
	}
	li.mjs-nestedSortable-collapsed > ul { display: none; }
	li.mjs-nestedSortable-collapsed > div > .disclose { background-image: url(../../../img/directoryCollapsed.png); }
	li.mjs-nestedSortable-expanded > div > .disclose { background-image: url(../../../img/directory.png); }
	li.mjs-nestedSortable-collapsed.mjs-nestedSortable-hovering div { background: #fafafa; }

	.placeholder { overflow: hidden; background-color: #9D9; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
	.mjs-nestedSortable-error { background: #fbe3e4; border-color: transparent; }
}

.thumbnail { float: left; margin: 10px 20px 10px 0; display: block; position: relative; width: 110px;
	.caption { font-size: 12px; padding: 0; margin-top: 1px; height: 64px; overflow: hidden; line-height: 16px; }
	input[type=checkbox] { position: absolute; top: 2px; left: 2px; margin: 0; }
	&:hover { text-decoration: none; }
}

.thumbnail-dropzone { margin: 10px 20px 10px 0; height: 174px; width: 110px; display: inline-block; background-color: #EEE; float: left; }

.dz-message { text-align: center; margin-top: 40px; }
.dz-clickable { cursor: pointer; }
.dz-preview { position: relative;
	.dz-error-message { display: none; position: absolute; top: 4px; left: 4px; background: rgba(255,255,255,1); color: @brand-danger; width: 100px; min-height: 100px; max-height: 160px; z-index: 500; }
	.dz-progress { position: absolute; top: 98px; left: 4px; right: 4px; height: 6px; background: #d7d7d7; display: none; }
	.dz-progress .dz-upload { position: absolute; top: 0; bottom: 0; left: 0; width: 0%; background-color: #8cc657; }
	&.dz-error:hover .dz-error-message { display: block; }
	&.dz-processing .dz-progress { display: block; }
	&.dz-success { border-color: @brand-success;
		.dz-progress { display: none; }
	}
	&.dz-error { border-color: @brand-danger;
		.dz-progress { display: none; }
	}
}

// Alertify
.alertify-logs { top: 50px; }


removing commented code

removing commented code

/*
 * Tooltips component theme overrides
 *------------------------------------------------------------------------------------------
 */

//
// Tooltips
// --------------------------------------------------

// Base class
.tooltip {
    position: absolute;
    z-index: @zindex-tooltip;
    display: block;
    visibility: visible;
    // Reset font and text propertes given new insertion method
    font-family: @font-family-base;
    font-size: @font-size-small;
    font-weight: normal;
    line-height: 1.4;
    border: 1px solid #999999;
    .opacity(0);

    &.in     { .opacity(@tooltip-opacity); }
    &.top    { margin-top:  -4px; margin-left:  7px; padding: 4px 3px;}
    &.right  { margin-left:  7px; padding: 4px 0; }
    &.bottom { margin-top:   10px; padding: 4px 3px;}
    &.left   { margin-left: -8px; padding: 4px 0; }
}

// Wrapper for the tooltip content
.tooltip-inner {
    max-width: @tooltip-max-width;
    padding: 4px 0;
    margin: -2px 6px;
    color: @tooltip-color;
    text-align: center;
    text-decoration: none;
    background-color: @tooltip-bg;
    border-radius: @border-radius-base;
}

//adjusted tooltip-inner
.tooltip {
    &.right .tooltip-inner {
        margin: -2px 2px;
    }
    &.left .tooltip-inner {
        margin: -2px 2px;
    }
}

// Arrows
.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
// Note: Deprecated .top-left, .top-right, .bottom-left, and .bottom-right as of v3.3.1
.tooltip {
    &.top .tooltip-arrow {
        bottom: -8px;
        left: 50%;
        margin-left: -5px;
        border-width: 7px 7px 0;
        border-top-color: #666;
    }
    &.top-left .tooltip-arrow {
        bottom: 0;
        right: @tooltip-arrow-width;
        margin-bottom: -@tooltip-arrow-width;
        border-width: @tooltip-arrow-width @tooltip-arrow-width 0;
        border-top-color: @tooltip-arrow-color;
    }
    &.top-right .tooltip-arrow {
        bottom: 0;
        left: -7px;
        margin-bottom: -@tooltip-arrow-width;
        border-width: @tooltip-arrow-width @tooltip-arrow-width 0;
        border-top-color: @tooltip-arrow-color;
    }
    &.right .tooltip-arrow {
        top: 50%;
        left: -7px;
        margin-top: -7px;
        border-width: 7px 7px 7px 0;
        border-right-color: #666666;
    }
    &.left .tooltip-arrow {
        top: 50%;
        right: -7px;
        margin-top: -7px;
        border-width: 7px 0 7px 7px;
        border-left-color: #666666;
    }
    &.bottom .tooltip-arrow {
        top: -8px;
        left: 50%;
        margin-left: -7px;
        border-width: 0 7px 7px;
        border-bottom-color: #666666;
    }
    &.bottom-left .tooltip-arrow {
        top: 0;
        right: @tooltip-arrow-width;
        margin-top: -@tooltip-arrow-width;
        border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;
        border-bottom-color: @tooltip-arrow-color;
    }
    &.bottom-right .tooltip-arrow {
        top: 0;
        left: @tooltip-arrow-width;
        margin-top: -@tooltip-arrow-width;
        border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;
        border-bottom-color: @tooltip-arrow-color;
    }
}

.tooltip.right .tooltip-arrow:after {
    left: 1px;
}

.tooltip.bottom .tooltip-arrow:after {
    top: 1px;
}

.tooltip.left .tooltip-arrow:after {
    right: 1px;
}

/*
 * Tooltips component theme overrides
 *------------------------------------------------------------------------------------------
 */

//
// Tooltips
// --------------------------------------------------

// Base class
.tooltip {
    position: absolute;
    z-index: @zindex-tooltip;
    display: block;
    visibility: visible;
    // Reset font and text propertes given new insertion method
    font-family: @font-family-base;
    font-size: @font-size-small;
    font-weight: normal;
    line-height: 1.4;
    border: 1px solid #999999;
    .opacity(0);

    &.in     { .opacity(@tooltip-opacity); }
    &.top    { margin-top:  -4px; margin-left:  7px; padding: 4px 3px;}
    &.right  { margin-left:  7px; padding: 4px 0; }
    &.bottom { margin-top:   10px; padding: 4px 3px;}
    &.left   { margin-left: -8px; padding: 4px 0; }
}

// Wrapper for the tooltip content
.tooltip-inner {
    max-width: @tooltip-max-width;
    padding: 4px 0px;
    margin: -2px 6px;
    color: @tooltip-color;
    text-align: center;
    text-decoration: none;
    background-color: @tooltip-bg;
    border-radius: @border-radius-base;
}

//adjusted tooltip-inner
.tooltip {
    &.right .tooltip-inner {
        margin: -2px 2px;
    }
    &.left .tooltip-inner {
        margin: -2px 2px;
    }
}

// Arrows
.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
// Note: Deprecated .top-left, .top-right, .bottom-left, and .bottom-right as of v3.3.1
.tooltip {
    &.top .tooltip-arrow {
        bottom: -8px;
        left: 50%;
        margin-left: -5px;
        border-width: 7px 7px 0;
        border-top-color: #666;
    }
    &.top-left .tooltip-arrow {
        bottom: 0;
        right: @tooltip-arrow-width;
        margin-bottom: -@tooltip-arrow-width;
        border-width: @tooltip-arrow-width @tooltip-arrow-width 0;
        border-top-color: @tooltip-arrow-color;
    }
    &.top-right .tooltip-arrow {
        bottom: 0;
        left: -7px;
        margin-bottom: -@tooltip-arrow-width;
        border-width: @tooltip-arrow-width @tooltip-arrow-width 0;
        border-top-color: @tooltip-arrow-color;
    }
    &.right .tooltip-arrow {
        top: 50%;
        left: -7px;
        margin-top: -7px;
        border-width: 7px 7px 7px 0;
        border-right-color: #666666;
    }
    &.left .tooltip-arrow {
        top: 50%;
        right: -7px;
        margin-top: -7px;
        border-width: 7px 0 7px 7px;
        border-left-color: #666666;
    }
    &.bottom .tooltip-arrow {
        top: -8px;
        left: 50%;
        margin-left: -7px;
        border-width: 0 7px 7px;
        border-bottom-color: #666666;
    }
    &.bottom-left .tooltip-arrow {
        top: 0;
        right: @tooltip-arrow-width;
        margin-top: -@tooltip-arrow-width;
        border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;
        border-bottom-color: @tooltip-arrow-color;
    }
    &.bottom-right .tooltip-arrow {
        top: 0;
        left: @tooltip-arrow-width;
        margin-top: -@tooltip-arrow-width;
        border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;
        border-bottom-color: @tooltip-arrow-color;
    }
}

.tooltip.right .tooltip-arrow:after {
    left: 1px;
}

.tooltip.bottom .tooltip-arrow:after {
    top: 1px;
}

.tooltip.left .tooltip-arrow:after {
    right: 1px;
}


refactored using a table

refactored using a table

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/dedalozzo/pit-bootstrap.git/'


Delete core.less

Delete core.less

error: pathspec 'lesson' did not match any file(s) known to git
error: pathspec '4/font-awesome/less/core.less' did not match any file(s) known to git


Delete list.less

Delete list.less

error: pathspec 'lesson' did not match any file(s) known to git
error: pathspec '4/font-awesome/less/list.less' did not match any file(s) known to git


fix(JobCard): remove flex wrap to fix ie and edge broken logo

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/seekinternational/seek-asia-style-guide.git/'


fix(jobCard): long title exceed card border


Change margin to padding on scroller items

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/McBits/DungeonR.git/'


BL-6713 fix Calendar margins

BL-6713 fix Calendar margins

* delete obsolete Stylizer rule
* fix both pages so they have even margins
   (and smaller margins) both in Edit and Publish

error: pathspec 'src/BloomBrowserUI/templates/template' did not match any file(s) known to git
error: pathspec 'books/Wall' did not match any file(s) known to git
error: pathspec 'Calendar/wallCalendar.less' did not match any file(s) known to git


update font size to fit for phones

update font size to fit for phones

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/Karmacons/Karmacons.git/'


update comments, use variable for media query

// Logo series wrapper
.bs-brand-logos {
  display: table;
  width: 100%;
  margin-bottom: 15px;
  overflow: hidden;
  color: #563d7c;
  background-color: #f9f9f9;
  border-radius: 4px;
}

// Individual items
.bs-brand-item {
  padding: 60px 0;
  text-align: center;
}
.bs-brand-item + .bs-brand-item {
  border-top: 1px solid #fff;
}
.bs-brand-logos .inverse {
  color: #fff;
  background-color: #563d7c;
}

// Heading content within
.bs-brand-item h1,
.bs-brand-item h3 {
  margin-top: 0;
  margin-bottom: 0;
}
.bs-brand-item .bs-docs-booticon {
  margin-right: auto;
  margin-left: auto;
}

// Make the icons stand out on what is/isn't okay
.bs-brand-item .glyphicon {
  width: 30px;
  height: 30px;
  margin: 10px auto -10px;
  line-height: 30px;
  color: #fff;
  border-radius: 50%;
}
.bs-brand-item .glyphicon-ok {
  background-color: #5cb85c;
}
.bs-brand-item .glyphicon-remove {
  background-color: #d9534f;
}

@media (min-width: @screen-sm-min) {
  .bs-brand-item {
    display: table-cell;
    width: 1%;
  }
  .bs-brand-item + .bs-brand-item {
    border-top: 0;
    border-left: 1px solid #fff;
  }
  .bs-brand-item h1 {
    font-size: 60px;
  }
}

/* Logo series wrapper */
.bs-brand-logos {
  display: table;
  width: 100%;
  margin-bottom: 15px;
  overflow: hidden;
  color: #563d7c;
  background-color: #f9f9f9;
  border-radius: 4px;
}

/* Individual items */
.bs-brand-item {
  padding: 60px 0;
  text-align: center;
}
.bs-brand-item + .bs-brand-item {
  border-top: 1px solid #fff;
}
.bs-brand-logos .inverse {
  color: #fff;
  background-color: #563d7c;
}

/* Heading content within */
.bs-brand-item h1,
.bs-brand-item h3 {
  margin-top: 0;
  margin-bottom: 0;
}
.bs-brand-item .bs-docs-booticon {
  margin-right: auto;
  margin-left: auto;
}

/* Make the icons stand out on what is/isn't okay */
.bs-brand-item .glyphicon {
  width: 30px;
  height: 30px;
  margin: 10px auto -10px;
  line-height: 30px;
  color: #fff;
  border-radius: 50%;
}
.bs-brand-item .glyphicon-ok {
  background-color: #5cb85c;
}
.bs-brand-item .glyphicon-remove {
  background-color: #d9534f;
}

@media (min-width: 768px) {
  .bs-brand-item {
    display: table-cell;
    width: 1%;
  }
  .bs-brand-item + .bs-brand-item {
    border-top: 0;
    border-left: 1px solid #fff;
  }
  .bs-brand-item h1 {
    font-size: 60px;
  }
}


:fail: *ing skins

:fail: *ing skins

.define-if-not-set() {
	@btn-primary-bg: darken(#428bca, 6.5%);
	@btn-primary-color: #fff;
	@gray-light: lighten(#000, 46.7%);
}

.define-if-not-set();

@topbarHeight: 50px;

html.composing {
	&.mobile {

		body {
			overflow: hidden;
		}

		.composer {
			.composer-container {
				display: flex;
				flex-direction: column;
			}

			.formatting-bar {
				.formatting-group {
					overflow-x: scroll;
    				white-space: nowrap;
    				display: block;
				}
			}

			.title-container {
				margin-top: 0px;
				border-bottom: 1px solid #eee;

				.title {
					font-size: 18px;
				}

				input.title {
					height: 45px;
				}
			}

			.write, .preview {
				min-height: auto;
				flex-grow: 1;
				height: auto !important;
			}

			.write-preview-container, .write-preview-container > div {
				min-height: auto;
				flex-grow: 1;
				height: auto !important;
				display: flex;
			}

			.category-selector {
			    margin: 0;
			    position: fixed;
			    left: 0 !important;
			    right: 0 !important;
			    width: auto !important;
			    bottom: 0;
			    top: auto;
			    padding: 0px 5px;
			    display: block;
			    max-height: 350px;
			    border-radius: 0;
			    background: #fff;
			    -webkit-box-shadow: 0 2px 6px rgba(0,0,0,0.35);
			    box-shadow: 0 2px 6px rgba(0,0,0,0.35);
			    visibility: hidden;
			    overflow: auto;
			    -webkit-overflow-scrolling: touch;
			    -webkit-transform: translate3d(0, 350px, 0);
			    transform: translate3d(0, 350px, 0);
			    -webkit-transition: -webkit-transform 0.3s, visibility 0s 0.3s;
			    -moz-transition: -moz-transform 0.3s, visibility 0s 0.3s;
			    -o-transition: -o-transform 0.3s, visibility 0s 0.3s;
			    transition: transform 0.3s, visibility 0s 0.3s;

			    &.open {
			    	-webkit-transform: none;
				    transform: none;
				    visibility: visible;
				    transition-delay: 0s;
			    }

			    li {
			    	padding: 10px;
			    	color: #333;

			    	&.active {
						background-color: @btn-primary-bg;
						color: @btn-primary-color;
					}
			    }
			}
		}
	}

	body {
		height: 0px !important;
	}

	.composer {
		padding: 0;

		.composer-container {
			overflow-y: visible;
			overflow-x: hidden;
			padding: 0;
			padding-top: 40px;
			height: 100%;
			background: white;
		}

		.title-container {
			margin-top: 0px;

			.title {
				padding-left: 8px;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				width: 100%;
			}
		}

		.write, .preview {
			border-bottom: 0;
			min-height: 100%;
			outline: none;
			padding: 25px 10px;
			margin-bottom: 0px;
			padding-bottom: 0px;
			font-size: 18px;
		}

		.form-control {
			box-shadow: none;
		}

		.formatting-bar {
			margin: 0;
			padding: 0;
		}

		.mobile-navbar {
			background: @btn-primary-bg;
			color: @btn-primary-color;
			position: absolute;
			margin-bottom: 0px;
			min-height: 40px;

			button {
				font-size: 20px;
			}

			.category-name-container {
				font-size: 16px;
			    padding: 10px 5px;
			    vertical-align: middle;
			    display: inline-block;
			    text-align: center;
			    width: ~"calc(100% - 75px)";
		    	white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
		}
	}

	.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
		padding: 0;
	}
}

.composer {
	.no-select;

	&.resizable {
		position: fixed;
		bottom: 0;
		top: 0;
		right: 0;
		left: 0;
		.box-shadow(0px 6px 12px rgba(0, 0, 0, 0.5));

		.write, .preview {
			min-height: 0;
		}
	}

	z-index: 10000;

	padding-top: 20px;

	background: white;
	visibility: hidden;

	.composer-container {
		min-height: 50px;
		padding-left: 10px;
		padding-right: 10px;
	}

	.title-container {
		margin-top: 10px;
		padding-left: 8px;
		padding-right: 8px;

		.title {
			display: block;
			font-size: 22px;
			padding-left: 3px;
			border: 0;
			.box-shadow(none);
			background: white;
			overflow: hidden;
		}

		input.title {
			height: 47px;
		}
	}

	.category-list {
		padding: 0 6px;
	}

	.category-tag-row {
		margin: 5px 0;
	}

	.tag-row {
		margin: 0px;
	}

	.tags-container {
		.bootstrap-tagsinput {
			width:100%;
			margin-bottom: 0px;
			border: 0;
			box-shadow: none;

			input {
				height:28px;
				padding: 4px 6px;
			}

			.label {
				color: white;
				font-size: 13px;
			}
		}
	}

	.write-preview-container {
		height:100%;
		margin: 0 0;
		min-height: 200px;

		> div {
			height:100%;
		}
	}

	.write {
		border: 1px solid #EDEDED;
		.border-radius(0px);
		.box-shadow(inset 0px 1px 1px rgba(0, 0, 0, 0.05));
	}

	.write, .preview  {
		display: block;
		width: 100%;
		height: 100%;
		min-height: 250px;
		margin: 0 auto;
		font-size: 14px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
		resize:none;
		overflow: auto;
		padding: 20px 20px 0px;
	}

	.preview-container {
		word-wrap: break-word;
	}

	.write-container {
		&.maximized {
			width: 100%;
		}
	}

	.write-container, .preview-container {
		.help-text {
			text-transform: uppercase;
			position: absolute;
			right: 35px;
			top: 8px;
			font-size: 10px;
			color: #999;
			z-index: 1;
		}
	}

	.help {
		.pointer;
	}

	.toggle-preview {
		margin-left: 20px;
		.pointer;
	}

	.preview {
		overflow-y: auto;

		-webkit-touch-callout: default;
		-webkit-user-select: text;
		-khtml-user-select: text;
		-moz-user-select: text;
		-ms-user-select: text;
		user-select: text;

		p {
			margin: 0 0 18px;
		}
	}

	.formatting-bar {
		margin: 5px 0;
		padding: 0px 8px;
		span {
			color: #000;
		}

		.spacer {
			&:before {
				content: ' | ';
				color: @gray-light;
			}
		}

		.formatting-group {
			display: inline-block;
			list-style: none;
			padding: 0px;
			margin-bottom: 0px;

			li {
				display: inline-block;
				padding: 10px 15px;
				cursor: pointer;
				color: #333;

				&:focus {
					outline: none;
				}
			}
		}
	}

	.resizer {
		position: absolute;
		width: 100%;
		top: 10px;
		height: 0px;

		.pointer;

		.trigger {
			position: relative;
			display: block;
			width: 32px;
			height: 32px;
			top: -20px;
			margin: 0 auto;
			margin-left: 20px;

			background: #333;
			border: 1px solid #333;
			.border-radius(50%);

			line-height: 26px;

			i {
				position: relative;
				color: #FFF;
				font-size: 16px;

				&:before {
					content: @fa-var-arrows-v;
					position: relative;
					top: 3px;
				}
			}
		}
	}

	&.maximized {
		.resizer .trigger i {
			&:before {
				content: @fa-var-chevron-down;
			}
		}

		box-shadow: none;
	}

	.imagedrop {
		position: absolute;
		top: 250px;
		text-align: center;
		font-size: 24px;
		color: #999;
		width: 100%;
		display: none;
	}

	.topic-thumb-container {
		margin-top: 5px;
		margin-left: 8px;
		margin-right: 8px;
		background: rgb(255, 255, 255);
		background: rgba(255, 255, 255, 0.6);
		padding: 10px;
	}

	.topic-thumb-btn {
		cursor: hand;
		cursor: pointer;
	}

	.topic-thumb-preview {
		width: auto;
		height: auto;
		max-width: 100px;
		max-height: 100px
	}

	.topic-thumb-ctrl.form-group {
		display: inline-block;
		vertical-align: -50% !important;
	}
}

@media (max-width: 767px), (max-height: 480px) {
	.composer {
		width: 100%;
		padding-top: 0px;
	}

	.resizer {
		visibility: hidden;
	}
}

.define-if-not-set() {
	@btn-primary-bg: darken(#428bca, 6.5%);
	@btn-primary-color: #fff;
	@gray-light: lighten(#000, 46.7%);
}

.define-if-not-set();

@topbarHeight: 50px;

html.composing {
	&.mobile {

		body {
			overflow: hidden;
		}

		.composer {
			.composer-container {
				display: flex;
				flex-direction: column;
			}

			.formatting-bar {
				.formatting-group {
					overflow-x: scroll;
    				white-space: nowrap;
    				display: block;
				}
			}

			.title-container {
				margin-top: 0px;
				border-bottom: 1px solid #eee;

				.title {
					font-size: 18px;
				}

				input.title {
					height: 45px;
				}
			}

			.write, .preview {
				min-height: auto;
				flex-grow: 1;
				height: auto !important;
			}

			.write-preview-container, .write-preview-container > div {
				min-height: auto;
				flex-grow: 1;
				height: auto !important;
				display: flex;
			}

			.category-selector {
			    margin: 0;
			    position: fixed;
			    left: 0 !important;
			    right: 0 !important;
			    width: auto !important;
			    bottom: 0;
			    top: auto;
			    padding: 0px 5px;
			    display: block;
			    max-height: 350px;
			    border-radius: 0;
			    background: #fff;
			    -webkit-box-shadow: 0 2px 6px rgba(0,0,0,0.35);
			    box-shadow: 0 2px 6px rgba(0,0,0,0.35);
			    visibility: hidden;
			    overflow: auto;
			    -webkit-overflow-scrolling: touch;
			    -webkit-transform: translate3d(0, 350px, 0);
			    transform: translate3d(0, 350px, 0);
			    -webkit-transition: -webkit-transform 0.3s, visibility 0s 0.3s;
			    -moz-transition: -moz-transform 0.3s, visibility 0s 0.3s;
			    -o-transition: -o-transform 0.3s, visibility 0s 0.3s;
			    transition: transform 0.3s, visibility 0s 0.3s;

			    &.open {
			    	-webkit-transform: none;
				    transform: none;
				    visibility: visible;
				    transition-delay: 0s;
			    }

			    li {
			    	padding: 10px;

			    	&.active {
						background-color: @btn-primary-bg;
						color: @btn-primary-color;
					}
			    }
			}
		}
	}

	body {
		height: 0px !important;
	}

	.composer {
		padding: 0;

		.composer-container {
			overflow-y: visible;
			overflow-x: hidden;
			padding: 0;
			padding-top: 40px;
			height: 100%;
			background: white;
		}

		.title-container {
			margin-top: 0px;

			.title {
				padding-left: 8px;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				width: 100%;
			}
		}

		.write, .preview {
			border-bottom: 0;
			min-height: 100%;
			outline: none;
			padding: 25px 10px;
			margin-bottom: 0px;
			padding-bottom: 0px;
			font-size: 18px;
		}

		.form-control {
			box-shadow: none;
		}

		.formatting-bar {
			margin: 0;
			padding: 0;
		}

		.mobile-navbar {
			background: @btn-primary-bg;
			color: @btn-primary-color;
			position: absolute;
			margin-bottom: 0px;
			min-height: 40px;

			button {
				font-size: 20px;
			}

			.category-name-container {
				font-size: 16px;
			    padding: 10px 5px;
			    vertical-align: middle;
			    display: inline-block;
			    text-align: center;
			    width: ~"calc(100% - 75px)";
		    	white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
		}
	}

	.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
		padding: 0;
	}
}

.composer {
	.no-select;

	&.resizable {
		position: fixed;
		bottom: 0;
		top: 0;
		right: 0;
		left: 0;
		.box-shadow(0px 6px 12px rgba(0, 0, 0, 0.5));

		.write, .preview {
			min-height: 0;
		}
	}

	z-index: 10000;

	padding-top: 20px;

	background: white;
	visibility: hidden;

	.composer-container {
		min-height: 50px;
		padding-left: 10px;
		padding-right: 10px;
	}

	.title-container {
		margin-top: 10px;
		padding-left: 8px;
		padding-right: 8px;

		.title {
			display: block;
			font-size: 22px;
			padding-left: 3px;
			border: 0;
			.box-shadow(none);
			background: white;
			overflow: hidden;
		}

		input.title {
			height: 47px;
		}
	}

	.category-list {
		padding: 0 6px;
	}

	.category-tag-row {
		margin: 5px 0;
	}

	.tag-row {
		margin: 0px;
	}

	.tags-container {
		.bootstrap-tagsinput {
			width:100%;
			margin-bottom: 0px;
			border: 0;
			box-shadow: none;

			input {
				height:28px;
				padding: 4px 6px;
			}

			.label {
				color: white;
				font-size: 13px;
			}
		}
	}

	.write-preview-container {
		height:100%;
		margin: 0 0;
		min-height: 200px;

		> div {
			height:100%;
		}
	}

	.write {
		border: 1px solid #EDEDED;
		.border-radius(0px);
		.box-shadow(inset 0px 1px 1px rgba(0, 0, 0, 0.05));
	}

	.write, .preview  {
		display: block;
		width: 100%;
		height: 100%;
		min-height: 250px;
		margin: 0 auto;
		font-size: 14px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
		resize:none;
		overflow: auto;
		padding: 20px 20px 0px;
	}

	.preview-container {
		word-wrap: break-word;
	}

	.write-container {
		&.maximized {
			width: 100%;
		}
	}

	.write-container, .preview-container {
		.help-text {
			text-transform: uppercase;
			position: absolute;
			right: 35px;
			top: 8px;
			font-size: 10px;
			color: #999;
			z-index: 1;
		}
	}

	.help {
		.pointer;
	}

	.toggle-preview {
		margin-left: 20px;
		.pointer;
	}

	.preview {
		overflow-y: auto;

		-webkit-touch-callout: default;
		-webkit-user-select: text;
		-khtml-user-select: text;
		-moz-user-select: text;
		-ms-user-select: text;
		user-select: text;

		p {
			margin: 0 0 18px;
		}
	}

	.formatting-bar {
		margin: 5px 0;
		padding: 0px 8px;
		span {
			color: #000;
		}

		.spacer {
			&:before {
				content: ' | ';
				color: @gray-light;
			}
		}

		.formatting-group {
			display: inline-block;
			list-style: none;
			padding: 0px;
			margin-bottom: 0px;

			li {
				display: inline-block;
				padding: 10px 15px;
				cursor: pointer;

				&:focus {
					outline: none;
				}
			}
		}
	}

	.resizer {
		position: absolute;
		width: 100%;
		top: 10px;
		height: 0px;

		.pointer;

		.trigger {
			position: relative;
			display: block;
			width: 32px;
			height: 32px;
			top: -20px;
			margin: 0 auto;
			margin-left: 20px;

			background: #333;
			border: 1px solid #333;
			.border-radius(50%);

			line-height: 26px;

			i {
				position: relative;
				color: #FFF;
				font-size: 16px;

				&:before {
					content: @fa-var-arrows-v;
					position: relative;
					top: 3px;
				}
			}
		}
	}

	&.maximized {
		.resizer .trigger i {
			&:before {
				content: @fa-var-chevron-down;
			}
		}

		box-shadow: none;
	}

	.imagedrop {
		position: absolute;
		top: 250px;
		text-align: center;
		font-size: 24px;
		color: #999;
		width: 100%;
		display: none;
	}

	.topic-thumb-container {
		margin-top: 5px;
		margin-left: 8px;
		margin-right: 8px;
		background: rgb(255, 255, 255);
		background: rgba(255, 255, 255, 0.6);
		padding: 10px;
	}

	.topic-thumb-btn {
		cursor: hand;
		cursor: pointer;
	}

	.topic-thumb-preview {
		width: auto;
		height: auto;
		max-width: 100px;
		max-height: 100px
	}

	.topic-thumb-ctrl.form-group {
		display: inline-block;
		vertical-align: -50% !important;
	}
}

@media (max-width: 767px), (max-height: 480px) {
	.composer {
		width: 100%;
		padding-top: 0px;
	}

	.resizer {
		visibility: hidden;
	}
}


Add Obsidian stylesheet.

Add Obsidian stylesheet.

@obsidian-green: rgb(131,190,81);
@obsidian-blue: rgb(85,121,162);
@obsidian-orange: rgb(229,96,6);
@obsidian-dark: rgb(26,30,22);
@obsidian-purple: rgb(121,120,165);
@obsidian-light: rgb(226,221,169);
@obsidian-yellow: rgb(254,196,28);
@obsidian-white: rgb(237,239,240);
@obsidian-comment-dark: rgb(109,109,109);
@obsidian-comment-light: rgb(135,147,119);

.editor {
  .keyword {
    color: @obsidian-green;
  }

  .string {
    color: @obsidian-orange;
  }

  .cmdlet {
    color: @obsidian-blue;
  }

  .variable {
    color: @obsidian-white;
  }

  .operator {
    color: @obsidian-light;
  }

  .keyword.operator.comparison.powershell {
    color: @obsidian-blue;
  }

  .constant.numeric.powershell {
    color: @obsidian-yellow;
  }

  .comment.line.number-sign.powershell {
    color: @obsidian-comment-light;
  }

  .type {
    color: @obsidian-green;
  }

  .meta.function-call.powershell {
    color: @obsidian-green;
  }

  .punctuation.definition.arguments.begin.powershell {
      color: @obsidian-white;
  }

  .punctuation.definition.arguments.end.powershell {
      color: @obsidian-white;
  }

  .punctuation.definition.comment {
    color: @obsidian-comment-dark;
  }
}

error: pathspec 'stylesheets/obsidian.less' did not match any file(s) known to git


added LESS

added LESS

div {
	color: brown;
}

.foo {
	color: #aaa;
}

#class {
	background-color: #fff;
	margin: auto;
	margin-left: 10px;
}

error: pathspec 'less.less' did not match any file(s) known to git


:bug: [LGCY-46] add missing word break class

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/NCI-GDC/portal-ui-legacy.git/'


Fix bug that prevents post container from filling viewport width

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/hevnly/asset-bazaar.git/'


Node detail attribute values wrap instead of overflow #730

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/paul-krohn/rundeck.git/'