active the selected item should be highlighted

@import "../../style/themes/default";
@import "../../style/mixins/index";
@import "../../input/style/mixin";

@select-prefix-cls: ~"@{ant-prefix}-select";

.selection__clear() {
  display: inline-block;
  font-style: normal;
  vertical-align: baseline;
  text-align: center;
  text-transform: none;
  text-rendering: auto;
  opacity: 0;
  position: absolute;
  right: 8px;
  z-index: 1;
  background: @component-background;
  top: 50%;
  font-size: @font-size-base;
  color: @disabled-color;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  line-height: 12px;
  cursor: pointer;
  transition: color 0.3s ease, opacity 0.15s ease;
  &:before {
    display: block;
    .iconfont-font("\e62e");
  }
  &:hover {
    color: @text-color-secondary;
  }
}

.@{select-prefix-cls} {
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  color: @text-color;
  font-size: @font-size-base;

  > ul > li > a {
    padding: 0;
    background-color: @component-background;
  }

  // arrow
  &-arrow {
    .iconfont-mixin();
    position: absolute;
    top: 50%;
    right: 8px;
    line-height: 1;
    margin-top: -6px;
    .iconfont-size-under-12px(9px);

    * {
      display: none;
    }

    &:before {
      content: '\e61d';
      transition: transform 0.2s ease;
    }
  }

  &-selection {
    outline: none;
    user-select: none;

    box-sizing: border-box;
    display: block;

    background-color: @component-background;
    border-radius: @border-radius-base;
    border: @border-width-base @border-style-base @border-color-base;
    transition: all .3s @ease-in-out;

    &:hover {
      .hover;
    }

    .@{select-prefix-cls}-focused &,
    &:focus,
    &:active {
      .active;
    }

    &__clear {
      .selection__clear();
    }

    &:hover &__clear {
      opacity: 1;
    }

    &-selected-value {
      float: left;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-width: 100%;
      padding-right: 14px;
    }
  }

  &-disabled {
    color: @disabled-color;
  }

  &-disabled &-selection {
    background: @input-disabled-bg;
    cursor: not-allowed;
    &:hover,
    &:focus,
    &:active {
      border-color: @border-color-base;
      box-shadow: none;
    }

    &__clear {
      display: none;
      visibility: hidden;
      pointer-events: none;
    }
  }

  &-disabled &-selection--multiple &-selection__choice {
    background: @background-color-active;
    color: #aaa;
    padding-right: 10px;
    &__remove {
      display: none;
    }
  }

  &-selection--single {
    height: @input-height-base;
    position: relative;
    cursor: pointer;
  }

  &-selection__rendered {
    display: block;
    margin-left: 7px;
    margin-right: 7px;
    position: relative;
    line-height: @input-height-base - 2px;
    // https://github.com/ant-design/ant-design/issues/3481#issuecomment-254721026
    &:after {
      content: '.';
      visibility: hidden;
      pointer-events: none;
      display: inline-block;
      width: 0;
    }
  }

  &-lg {
    .@{select-prefix-cls}-selection--single {
      height: @input-height-lg;
    }
    .@{select-prefix-cls}-selection__rendered {
      line-height: @input-height-lg - 2px;
    }
    .@{select-prefix-cls}-selection--multiple {
      min-height: @input-height-lg;
      .@{select-prefix-cls}-selection__rendered {
        li {
          height: @input-height-lg - 8px;
          line-height: @input-height-lg - 8px;
        }
      }
      .@{select-prefix-cls}-selection__clear {
        top: @input-height-lg / 2;
      }
    }
  }

  &-sm {
    .@{select-prefix-cls}-selection--single {
      height: @input-height-sm;
    }
    .@{select-prefix-cls}-selection__rendered {
      line-height: @input-height-sm - 2px;
    }
    .@{select-prefix-cls}-selection--multiple {
      min-height: @input-height-sm;
      .@{select-prefix-cls}-selection__rendered {
        li {
          height: @input-height-sm - 8px;
          line-height: @input-height-sm - 8px;
        }
      }
      .@{select-prefix-cls}-selection__clear {
        top: @input-height-sm / 2;
      }
    }
  }

  &-disabled &-selection__choice__remove {
    color: @disabled-color;
    cursor: default;
    &:hover {
      color: @disabled-color;
    }
  }

  &-search__field__wrap {
    display: inline-block;
    position: relative;
  }

  &-selection__placeholder,
  &-search__field__placeholder { // for TreeSelect compatibility
    position: absolute;
    top: 50%;
    left: 0;
    right: 9px;
    color: @input-placeholder-color;
    line-height: 20px;
    height: 20px;
    max-width: 100%;
    margin-top: -10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
  }

  &-search__field__placeholder {
    left: 8px;
  }

  &-search--inline {
    position: absolute;
    height: 100%;
    width: 100%;

    .@{select-prefix-cls}-selection--multiple & {
      float: left;
      position: static;
    }

    .@{select-prefix-cls}-search__field__wrap {
      width: 100%;
      height: 100%;
    }

    .@{select-prefix-cls}-search__field {
      border-width: 0;
      font-size: 100%;
      height: 100%;
      width: 100%;
      background: transparent;
      outline: 0;
      border-radius: @border-radius-base;
    }

    .@{select-prefix-cls}-search__field__mirror {
      position: absolute;
      top: 0;
      left: -9999px;
      white-space: pre;
      pointer-events: none;
    }

    > i {
      float: right;
    }
  }

  &-selection--multiple {
    min-height: @input-height-base;
    cursor: text;
    padding-bottom: 3px;
    .clearfix;

    .@{select-prefix-cls}-search--inline {
      width: auto;
      padding: 0;
      max-width: 100%;
      .@{select-prefix-cls}-search__field {
        max-width: 100%;
        width: 0.75em;
      }
    }

    .@{select-prefix-cls}-selection__rendered {
      margin-left: 5px;
      margin-bottom: -3px;
      height: auto;
    }

    > ul > li,
    .@{select-prefix-cls}-selection__rendered > ul > li {  // for tree-select
      margin-top: 3px;
      height: @input-height-base - 8px;
      line-height: @input-height-base - 8px;
    }

    .@{select-prefix-cls}-selection__choice {
      color: @tag-default-color;
      background-color: @tag-default-bg;
      border-radius: 4px;
      cursor: default;
      float: left;
      margin-right: 4px;
      max-width: 99%;
      position: relative;
      overflow: hidden;
      transition: padding .3s @ease-in-out;
      padding: 0 20px 0 10px;
      &__disabled {
        padding: 0 10px;
      }
    }

    .@{select-prefix-cls}-selection__choice__content {
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 100%;
      transition: margin .3s @ease-in-out;
    }

    .@{select-prefix-cls}-selection__choice__remove {
      .iconfont-mixin();
      color: @text-color-secondary;
      line-height: inherit;
      cursor: pointer;
      display: inline-block;
      font-weight: bold;
      transition: all 0.3s @ease-in-out;
      .iconfont-size-under-12px(8px);
      position: absolute;
      right: 4px;
      padding: 0 0 0 8px;
      &:hover {
        color: #404040;
      }
      &:before {
        content: "\e633";
      }
    }

    .@{select-prefix-cls}-selection__clear {
      top: @input-height-base / 2;
    }
  }

  &-allow-clear &-selection--multiple &-selection__rendered {
    margin-right: 20px; // In case that clear button will overlap content
  }

  &-open {
    .@{select-prefix-cls}-arrow {
      .ie-rotate(2);
      -ms-transform: rotate(180deg);
      &:before {
        transform: rotate(180deg);
      }
    }
    .@{select-prefix-cls}-selection {
      .active();
    }
  }

  &-combobox {
    .@{select-prefix-cls}-arrow {
      display: none;
    }
    .@{select-prefix-cls}-search--inline {
      height: 100%;
      width: 100%;
      float: none;
    }
    .@{select-prefix-cls}-search__field__wrap {
      width: 100%;
      height: 100%;
    }
    .@{select-prefix-cls}-search__field {
      width: 100%;
      height: 100%;
      position: relative;
      z-index: 1;
      transition: all .3s @ease-in-out;
      box-shadow: none;
    }
  }
  &-combobox&-allow-clear &-selection:hover &-selection__rendered {
    margin-right: 20px; // In case that clear button will overlap content
  }
}

.@{select-prefix-cls}-dropdown {
  &.slide-up-enter.slide-up-enter-active&-placement-bottomLeft,
  &.slide-up-appear.slide-up-appear-active&-placement-bottomLeft {
    animation-name: antSlideUpIn;
  }

  &.slide-up-enter.slide-up-enter-active&-placement-topLeft,
  &.slide-up-appear.slide-up-appear-active&-placement-topLeft {
    animation-name: antSlideDownIn;
  }

  &.slide-up-leave.slide-up-leave-active&-placement-bottomLeft {
    animation-name: antSlideUpOut;
  }

  &.slide-up-leave.slide-up-leave-active&-placement-topLeft {
    animation-name: antSlideDownOut;
  }

  &-hidden {
    display: none;
  }

  background-color: @component-background;
  box-shadow: @box-shadow-base;
  border-radius: @border-radius-base;
  box-sizing: border-box;
  z-index: @zindex-dropdown;
  left: -9999px;
  top: -9999px;
  position: absolute;
  outline: none;
  overflow: hidden;
  font-size: @font-size-base;

  &-menu {
    outline: none;
    margin-bottom: 0;
    padding-left: 0; // Override default ul/ol
    list-style: none;
    max-height: 250px;
    overflow: auto;

    &-item-group-list {
      margin: 0;
      padding: 0;

      > .@{select-prefix-cls}-dropdown-menu-item {
        padding-left: 16px;
      }
    }

    &-item-group-title {
      color: @text-color-secondary;
      line-height: 1.5;
      padding: 8px;
    }

    &-item {
      position: relative;
      display: block;
      padding: 7px 8px;
      font-weight: normal;
      color: @text-color;
      white-space: nowrap;
      cursor: pointer;
      overflow: hidden;
      transition: background 0.3s ease;

      &:hover {
        background-color: @item-hover-bg;
      }

      &-disabled {
        color: @disabled-color;
        cursor: not-allowed;

        &:hover {
          color: @disabled-color;
          background-color: @component-background;
          cursor: not-allowed;
        }
      }

      &-selected {
        &,
        &:hover {
          background-color: @background-color-base;
          font-weight: 600;
          color: @text-color;
        }
      }

      &-active {
        background-color: @item-active-bg;
      }

      &-divider {
        height: 1px;
        margin: 1px 0;
        overflow: hidden;
        background-color: #e5e5e5;
        line-height: 0;
      }
    }
  }

  &&--multiple {
    .@{select-prefix-cls}-dropdown-menu-item {
      &:after {
        .iconfont-font("\e632");
        color: transparent;
        .iconfont-size-under-12px(10px);
        transition: all 0.2s ease;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 8px;
        font-weight: bold;
        text-shadow: 0 0.1px 0, 0.1px 0 0, 0 -0.1px 0, -0.1px 0;
      }

      &:hover:after {
        color: #ddd;
      }

      &-disabled:after {
        display: none;
      }

      &-selected:after,
      &-selected:hover:after {
        color: @primary-color;
        display: inline-block;
      }
    }
  }

  &-container-open,
  &-open {
    .@{select-prefix-cls}-dropdown {
      display: block;
    }
  }
}

@import "../../style/themes/default";
@import "../../style/mixins/index";
@import "../../input/style/mixin";

@select-prefix-cls: ~"@{ant-prefix}-select";

.selection__clear() {
  display: inline-block;
  font-style: normal;
  vertical-align: baseline;
  text-align: center;
  text-transform: none;
  text-rendering: auto;
  opacity: 0;
  position: absolute;
  right: 8px;
  z-index: 1;
  background: @component-background;
  top: 50%;
  font-size: @font-size-base;
  color: @disabled-color;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  line-height: 12px;
  cursor: pointer;
  transition: color 0.3s ease, opacity 0.15s ease;
  &:before {
    display: block;
    .iconfont-font("\e62e");
  }
  &:hover {
    color: @text-color-secondary;
  }
}

.@{select-prefix-cls} {
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  color: @text-color;
  font-size: @font-size-base;

  > ul > li > a {
    padding: 0;
    background-color: @component-background;
  }

  // arrow
  &-arrow {
    .iconfont-mixin();
    position: absolute;
    top: 50%;
    right: 8px;
    line-height: 1;
    margin-top: -6px;
    .iconfont-size-under-12px(9px);

    * {
      display: none;
    }

    &:before {
      content: '\e61d';
      transition: transform 0.2s ease;
    }
  }

  &-selection {
    outline: none;
    user-select: none;

    box-sizing: border-box;
    display: block;

    background-color: @component-background;
    border-radius: @border-radius-base;
    border: @border-width-base @border-style-base @border-color-base;
    transition: all .3s @ease-in-out;

    &:hover {
      .hover;
    }

    .@{select-prefix-cls}-focused &,
    &:focus,
    &:active {
      .active;
    }

    &__clear {
      .selection__clear();
    }

    &:hover &__clear {
      opacity: 1;
    }

    &-selected-value {
      float: left;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-width: 100%;
      padding-right: 14px;
    }
  }

  &-disabled {
    color: @disabled-color;
  }

  &-disabled &-selection {
    background: @input-disabled-bg;
    cursor: not-allowed;
    &:hover,
    &:focus,
    &:active {
      border-color: @border-color-base;
      box-shadow: none;
    }

    &__clear {
      display: none;
      visibility: hidden;
      pointer-events: none;
    }
  }

  &-disabled &-selection--multiple &-selection__choice {
    background: @background-color-active;
    color: #aaa;
    padding-right: 10px;
    &__remove {
      display: none;
    }
  }

  &-selection--single {
    height: @input-height-base;
    position: relative;
    cursor: pointer;
  }

  &-selection__rendered {
    display: block;
    margin-left: 7px;
    margin-right: 7px;
    position: relative;
    line-height: @input-height-base - 2px;
    // https://github.com/ant-design/ant-design/issues/3481#issuecomment-254721026
    &:after {
      content: '.';
      visibility: hidden;
      pointer-events: none;
      display: inline-block;
      width: 0;
    }
  }

  &-lg {
    .@{select-prefix-cls}-selection--single {
      height: @input-height-lg;
    }
    .@{select-prefix-cls}-selection__rendered {
      line-height: @input-height-lg - 2px;
    }
    .@{select-prefix-cls}-selection--multiple {
      min-height: @input-height-lg;
      .@{select-prefix-cls}-selection__rendered {
        li {
          height: @input-height-lg - 8px;
          line-height: @input-height-lg - 8px;
        }
      }
      .@{select-prefix-cls}-selection__clear {
        top: @input-height-lg / 2;
      }
    }
  }

  &-sm {
    .@{select-prefix-cls}-selection--single {
      height: @input-height-sm;
    }
    .@{select-prefix-cls}-selection__rendered {
      line-height: @input-height-sm - 2px;
    }
    .@{select-prefix-cls}-selection--multiple {
      min-height: @input-height-sm;
      .@{select-prefix-cls}-selection__rendered {
        li {
          height: @input-height-sm - 8px;
          line-height: @input-height-sm - 8px;
        }
      }
      .@{select-prefix-cls}-selection__clear {
        top: @input-height-sm / 2;
      }
    }
  }

  &-disabled &-selection__choice__remove {
    color: @disabled-color;
    cursor: default;
    &:hover {
      color: @disabled-color;
    }
  }

  &-search__field__wrap {
    display: inline-block;
    position: relative;
  }

  &-selection__placeholder,
  &-search__field__placeholder { // for TreeSelect compatibility
    position: absolute;
    top: 50%;
    left: 0;
    right: 9px;
    color: @input-placeholder-color;
    line-height: 20px;
    height: 20px;
    max-width: 100%;
    margin-top: -10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
  }

  &-search__field__placeholder {
    left: 8px;
  }

  &-search--inline {
    position: absolute;
    height: 100%;
    width: 100%;

    .@{select-prefix-cls}-selection--multiple & {
      float: left;
      position: static;
    }

    .@{select-prefix-cls}-search__field__wrap {
      width: 100%;
      height: 100%;
    }

    .@{select-prefix-cls}-search__field {
      border-width: 0;
      font-size: 100%;
      height: 100%;
      width: 100%;
      background: transparent;
      outline: 0;
      border-radius: @border-radius-base;
    }

    .@{select-prefix-cls}-search__field__mirror {
      position: absolute;
      top: 0;
      left: -9999px;
      white-space: pre;
      pointer-events: none;
    }

    > i {
      float: right;
    }
  }

  &-selection--multiple {
    min-height: @input-height-base;
    cursor: text;
    padding-bottom: 3px;
    .clearfix;

    .@{select-prefix-cls}-search--inline {
      width: auto;
      padding: 0;
      max-width: 100%;
      .@{select-prefix-cls}-search__field {
        max-width: 100%;
        width: 0.75em;
      }
    }

    .@{select-prefix-cls}-selection__rendered {
      margin-left: 5px;
      margin-bottom: -3px;
      height: auto;
    }

    > ul > li,
    .@{select-prefix-cls}-selection__rendered > ul > li {  // for tree-select
      margin-top: 3px;
      height: @input-height-base - 8px;
      line-height: @input-height-base - 8px;
    }

    .@{select-prefix-cls}-selection__choice {
      color: @tag-default-color;
      background-color: @tag-default-bg;
      border-radius: 4px;
      cursor: default;
      float: left;
      margin-right: 4px;
      max-width: 99%;
      position: relative;
      overflow: hidden;
      transition: padding .3s @ease-in-out;
      padding: 0 20px 0 10px;
      &__disabled {
        padding: 0 10px;
      }
    }

    .@{select-prefix-cls}-selection__choice__content {
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 100%;
      transition: margin .3s @ease-in-out;
    }

    .@{select-prefix-cls}-selection__choice__remove {
      .iconfont-mixin();
      color: @text-color-secondary;
      line-height: inherit;
      cursor: pointer;
      display: inline-block;
      font-weight: bold;
      transition: all 0.3s @ease-in-out;
      .iconfont-size-under-12px(8px);
      position: absolute;
      right: 4px;
      padding: 0 0 0 8px;
      &:hover {
        color: #404040;
      }
      &:before {
        content: "\e633";
      }
    }

    .@{select-prefix-cls}-selection__clear {
      top: @input-height-base / 2;
    }
  }

  &-allow-clear &-selection--multiple &-selection__rendered {
    margin-right: 20px; // In case that clear button will overlap content
  }

  &-open {
    .@{select-prefix-cls}-arrow {
      .ie-rotate(2);
      -ms-transform: rotate(180deg);
      &:before {
        transform: rotate(180deg);
      }
    }
    .@{select-prefix-cls}-selection {
      .active();
    }
  }

  &-combobox {
    .@{select-prefix-cls}-arrow {
      display: none;
    }
    .@{select-prefix-cls}-search--inline {
      height: 100%;
      width: 100%;
      float: none;
    }
    .@{select-prefix-cls}-search__field__wrap {
      width: 100%;
      height: 100%;
    }
    .@{select-prefix-cls}-search__field {
      width: 100%;
      height: 100%;
      position: relative;
      z-index: 1;
      transition: all .3s @ease-in-out;
      box-shadow: none;
    }
  }
  &-combobox&-allow-clear &-selection:hover &-selection__rendered {
    margin-right: 20px; // In case that clear button will overlap content
  }
}

.@{select-prefix-cls}-dropdown {
  &.slide-up-enter.slide-up-enter-active&-placement-bottomLeft,
  &.slide-up-appear.slide-up-appear-active&-placement-bottomLeft {
    animation-name: antSlideUpIn;
  }

  &.slide-up-enter.slide-up-enter-active&-placement-topLeft,
  &.slide-up-appear.slide-up-appear-active&-placement-topLeft {
    animation-name: antSlideDownIn;
  }

  &.slide-up-leave.slide-up-leave-active&-placement-bottomLeft {
    animation-name: antSlideUpOut;
  }

  &.slide-up-leave.slide-up-leave-active&-placement-topLeft {
    animation-name: antSlideDownOut;
  }

  &-hidden {
    display: none;
  }

  background-color: @component-background;
  box-shadow: @box-shadow-base;
  border-radius: @border-radius-base;
  box-sizing: border-box;
  z-index: @zindex-dropdown;
  left: -9999px;
  top: -9999px;
  position: absolute;
  outline: none;
  overflow: hidden;
  font-size: @font-size-base;

  &-menu {
    outline: none;
    margin-bottom: 0;
    padding-left: 0; // Override default ul/ol
    list-style: none;
    max-height: 250px;
    overflow: auto;

    &-item-group-list {
      margin: 0;
      padding: 0;

      > .@{select-prefix-cls}-dropdown-menu-item {
        padding-left: 16px;
      }
    }

    &-item-group-title {
      color: @text-color-secondary;
      line-height: 1.5;
      padding: 8px;
    }

    &-item {
      position: relative;
      display: block;
      padding: 7px 8px;
      font-weight: normal;
      color: @text-color;
      white-space: nowrap;
      cursor: pointer;
      overflow: hidden;
      transition: background 0.3s ease;

      &:hover {
        background-color: @item-hover-bg;
      }

      &-active {
        background-color: @item-active-bg;
      }

      &-disabled {
        color: @disabled-color;
        cursor: not-allowed;

        &:hover {
          color: @disabled-color;
          background-color: @component-background;
          cursor: not-allowed;
        }
      }

      &-selected {
        &,
        &:hover {
          background-color: @background-color-base;
          font-weight: 600;
          color: @text-color;
        }
      }

      &-divider {
        height: 1px;
        margin: 1px 0;
        overflow: hidden;
        background-color: #e5e5e5;
        line-height: 0;
      }
    }
  }

  &&--multiple {
    .@{select-prefix-cls}-dropdown-menu-item {
      &:after {
        .iconfont-font("\e632");
        color: transparent;
        .iconfont-size-under-12px(10px);
        transition: all 0.2s ease;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 8px;
        font-weight: bold;
        text-shadow: 0 0.1px 0, 0.1px 0 0, 0 -0.1px 0, -0.1px 0;
      }

      &:hover:after {
        color: #ddd;
      }

      &-disabled:after {
        display: none;
      }

      &-selected:after,
      &-selected:hover:after {
        color: @primary-color;
        display: inline-block;
      }
    }
  }

  &-container-open,
  &-open {
    .@{select-prefix-cls}-dropdown {
      display: block;
    }
  }
}


fix: cluster dropdown extra margin

fix: cluster dropdown extra margin

Remove extra margin on cluster dropdown

Closes DCOS-39963

& when (@user-dropdown-menu-enabled) {

  .user-account-dropdown {
    display: flex;

    &-list {

      .dropdown-menu-items {
        padding-top: @user-account-dropdown-menu-padding-top;
      }
    }
  }

  .user-account-dropdown-button {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    height: auto;
    justify-content: flex-start;
    min-width: 0;
    padding: @pod-margin-top * @pod-short-margin-top-scale @pod-margin-right * @pod-narrow-margin-right-scale @pod-margin-bottom * @pod-short-margin-bottom-scale @pod-margin-left * @pod-narrow-margin-left-scale;

    &,
    &:hover,
    &:active,
    &:focus {
      background: transparent;
      border: none;
    }

    .cluster-header {
      align-items: stretch;
      color: @white;
      // This !important overrides an awful CNVS !important tag.
      // https://github.com/mesosphere/canvas/issues/24
      display: flex !important;
      flex: 1 1 auto;
      flex-direction: column;
      min-width: 0;
      overflow: hidden;
      text-align: left;

      &-primary {
        flex: 0 1 auto;
        min-width: 0;
        overflow: hidden;
        padding-right: @user-account-dropdown-menu-primary-padding-right;

        &-wrapper {
          align-items: center;
          display: flex;
          flex: 1 1 auto;

          & + .cluster-header {

            &-secondary {
              margin-top: @user-account-dropdown-menu-primary-margin-bottom;
            }
          }
        }
      }

      &-secondary {
        font-size: 0.75rem;
        font-weight: 400;
      }
    }

    .icon {
      fill: @white;
      flex: 0 0 auto;
      transition: fill 0.2s, transform 0.2s;

      .open & {
        transform: rotate(180deg);
      }
    }
  }

  .user-account-dropdown-menu {
    margin-left: @pod-margin-left * @pod-narrow-margin-left-scale;

    li:empty {
      display: none;
    }

    li:empty + .dropdown-menu-section-header {
      margin-top: 0;
    }

    &-public-ip {

      li& {
        padding: 0;
      }

      &:hover {

        .user-account-dropdown-menu {

          &-copy-text {
            visibility: visible;
          }
        }
      }
    }

    &-copy-text {
      color: @purple;
      display: inline-block;
      margin-left: @user-account-dropdown-menu-copy-text-margin-left;
      text-decoration: underline;
      visibility: hidden;
    }
  }
}

& when (@user-dropdown-menu-enabled) and (@layout-screen-small-enabled) {

  @media (min-width: @layout-screen-small-min-width) {

    .user-account-dropdown-button {
      padding: @pod-margin-top-screen-small * @pod-short-margin-top-scale @pod-margin-right-screen-small * @pod-narrow-margin-right-scale @pod-margin-bottom-screen-small * @pod-short-margin-bottom-scale @pod-margin-left-screen-small * @pod-narrow-margin-left-scale;

      .cluster-header {

        &-primary {

          &-wrapper {
            padding-right: @user-account-dropdown-menu-primary-padding-right-screen-small;

            & + .cluster-header {

              &-secondary {
                margin-top: @user-account-dropdown-menu-primary-margin-bottom-screen-small;
              }
            }
          }
        }
      }
    }

    .user-account-dropdown-menu {
      margin-left: @pod-margin-left-screen-small * @pod-narrow-margin-left-scale;

      &-copy-text {
        margin-left: @user-account-dropdown-menu-copy-text-margin-left-screen-small;
      }
    }
  }
}

& when (@user-dropdown-menu-enabled) and (@layout-screen-medium-enabled) {

  @media (min-width: @layout-screen-medium-min-width) {

    .user-account-dropdown-button {
      padding: @pod-margin-top-screen-medium * @pod-short-margin-top-scale @pod-margin-right-screen-medium * @pod-narrow-margin-right-scale @pod-margin-bottom-screen-medium * @pod-short-margin-bottom-scale @pod-margin-left-screen-medium * @pod-narrow-margin-left-scale;

      .cluster-header {

        &-primary {

          &-wrapper {
            padding-right: @user-account-dropdown-menu-primary-padding-right-screen-medium;

            & + .cluster-header {

              &-secondary {
                margin-top: @user-account-dropdown-menu-primary-margin-bottom-screen-medium;
              }
            }
          }
        }
      }
    }

    .user-account-dropdown-menu {
      margin-left: @pod-margin-left-screen-medium * @pod-narrow-margin-left-scale;

      &-copy-text {
        margin-left: @user-account-dropdown-menu-copy-text-margin-left-screen-medium;
      }
    }
  }
}

& when (@user-dropdown-menu-enabled) and (@layout-screen-large-enabled) {

  @media (min-width: @layout-screen-large-min-width) {

    .user-account-dropdown-button {
      padding: @pod-margin-top-screen-large * @pod-short-margin-top-scale @pod-margin-right-screen-large * @pod-narrow-margin-right-scale @pod-margin-bottom-screen-large * @pod-short-margin-bottom-scale @pod-margin-left-screen-large * @pod-narrow-margin-left-scale;

      .cluster-header {

        &-primary {

          &-wrapper {
            padding-right: @user-account-dropdown-menu-primary-padding-right-screen-large;

            & + .cluster-header {

              &-secondary {
                margin-top: @user-account-dropdown-menu-primary-margin-bottom-screen-large;
              }
            }
          }
        }
      }
    }

    .user-account-dropdown-menu {
      margin-left: @pod-margin-left-screen-large * @pod-narrow-margin-left-scale;

      &-copy-text {
        margin-left: @user-account-dropdown-menu-copy-text-margin-left-screen-large;
      }
    }
  }
}

& when (@user-dropdown-menu-enabled) and (@layout-screen-jumbo-enabled) {

  @media (min-width: @layout-screen-jumbo-min-width) {

    .user-account-dropdown-button {
      padding: @pod-margin-top-screen-jumbo * @pod-short-margin-top-scale @pod-margin-right-screen-jumbo * @pod-narrow-margin-right-scale @pod-margin-bottom-screen-jumbo * @pod-short-margin-bottom-scale @pod-margin-left-screen-jumbo * @pod-narrow-margin-left-scale;

      .cluster-header {

        &-primary {

          &-wrapper {
            padding-right: @user-account-dropdown-menu-primary-padding-right-screen-jumbo;

            & + .cluster-header {

              &-secondary {
                margin-top: @user-account-dropdown-menu-primary-margin-bottom-screen-jumbo;
              }
            }
          }
        }
      }
    }

    .user-account-dropdown-menu {
      margin-left: @pod-margin-left-screen-jumbo * @pod-narrow-margin-left-scale;

      &-copy-text {
        margin-left: @user-account-dropdown-menu-copy-text-margin-left-screen-jumbo;
      }
    }
  }
}

& when (@user-dropdown-menu-enabled) {

  .user-account-dropdown {
    display: flex;

    &-list {

      .dropdown-menu-items {
        padding-top: @user-account-dropdown-menu-padding-top;
      }
    }
  }

  .user-account-dropdown-button {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    height: auto;
    justify-content: flex-start;
    min-width: 0;
    padding: @pod-margin-top * @pod-short-margin-top-scale @pod-margin-right * @pod-narrow-margin-right-scale @pod-margin-bottom * @pod-short-margin-bottom-scale @pod-margin-left * @pod-narrow-margin-left-scale;

    &,
    &:hover,
    &:active,
    &:focus {
      background: transparent;
      border: none;
    }

    .cluster-header {
      align-items: stretch;
      color: @white;
      // This !important overrides an awful CNVS !important tag.
      // https://github.com/mesosphere/canvas/issues/24
      display: flex !important;
      flex: 1 1 auto;
      flex-direction: column;
      min-width: 0;
      overflow: hidden;
      text-align: left;

      &-primary {
        flex: 0 1 auto;
        min-width: 0;
        overflow: hidden;
        padding-right: @user-account-dropdown-menu-primary-padding-right;

        &-wrapper {
          align-items: center;
          display: flex;
          flex: 1 1 auto;

          & + .cluster-header {

            &-secondary {
              margin-top: @user-account-dropdown-menu-primary-margin-bottom;
            }
          }
        }
      }

      &-secondary {
        font-size: 0.75rem;
        font-weight: 400;
      }
    }

    .icon {
      fill: @white;
      flex: 0 0 auto;
      transition: fill 0.2s, transform 0.2s;

      .open & {
        transform: rotate(180deg);
      }
    }
  }

  .user-account-dropdown-menu {
    margin-left: @pod-margin-left * @pod-narrow-margin-left-scale;

    li:empty {
      display: none;
    }

    &-public-ip {

      li& {
        padding: 0;
      }

      &:hover {

        .user-account-dropdown-menu {

          &-copy-text {
            visibility: visible;
          }
        }
      }
    }

    &-copy-text {
      color: @purple;
      display: inline-block;
      margin-left: @user-account-dropdown-menu-copy-text-margin-left;
      text-decoration: underline;
      visibility: hidden;
    }
  }
}

& when (@user-dropdown-menu-enabled) and (@layout-screen-small-enabled) {

  @media (min-width: @layout-screen-small-min-width) {

    .user-account-dropdown-button {
      padding: @pod-margin-top-screen-small * @pod-short-margin-top-scale @pod-margin-right-screen-small * @pod-narrow-margin-right-scale @pod-margin-bottom-screen-small * @pod-short-margin-bottom-scale @pod-margin-left-screen-small * @pod-narrow-margin-left-scale;

      .cluster-header {

        &-primary {

          &-wrapper {
            padding-right: @user-account-dropdown-menu-primary-padding-right-screen-small;

            & + .cluster-header {

              &-secondary {
                margin-top: @user-account-dropdown-menu-primary-margin-bottom-screen-small;
              }
            }
          }
        }
      }
    }

    .user-account-dropdown-menu {
      margin-left: @pod-margin-left-screen-small * @pod-narrow-margin-left-scale;

      &-copy-text {
        margin-left: @user-account-dropdown-menu-copy-text-margin-left-screen-small;
      }
    }
  }
}

& when (@user-dropdown-menu-enabled) and (@layout-screen-medium-enabled) {

  @media (min-width: @layout-screen-medium-min-width) {

    .user-account-dropdown-button {
      padding: @pod-margin-top-screen-medium * @pod-short-margin-top-scale @pod-margin-right-screen-medium * @pod-narrow-margin-right-scale @pod-margin-bottom-screen-medium * @pod-short-margin-bottom-scale @pod-margin-left-screen-medium * @pod-narrow-margin-left-scale;

      .cluster-header {

        &-primary {

          &-wrapper {
            padding-right: @user-account-dropdown-menu-primary-padding-right-screen-medium;

            & + .cluster-header {

              &-secondary {
                margin-top: @user-account-dropdown-menu-primary-margin-bottom-screen-medium;
              }
            }
          }
        }
      }
    }

    .user-account-dropdown-menu {
      margin-left: @pod-margin-left-screen-medium * @pod-narrow-margin-left-scale;

      &-copy-text {
        margin-left: @user-account-dropdown-menu-copy-text-margin-left-screen-medium;
      }
    }
  }
}

& when (@user-dropdown-menu-enabled) and (@layout-screen-large-enabled) {

  @media (min-width: @layout-screen-large-min-width) {

    .user-account-dropdown-button {
      padding: @pod-margin-top-screen-large * @pod-short-margin-top-scale @pod-margin-right-screen-large * @pod-narrow-margin-right-scale @pod-margin-bottom-screen-large * @pod-short-margin-bottom-scale @pod-margin-left-screen-large * @pod-narrow-margin-left-scale;

      .cluster-header {

        &-primary {

          &-wrapper {
            padding-right: @user-account-dropdown-menu-primary-padding-right-screen-large;

            & + .cluster-header {

              &-secondary {
                margin-top: @user-account-dropdown-menu-primary-margin-bottom-screen-large;
              }
            }
          }
        }
      }
    }

    .user-account-dropdown-menu {
      margin-left: @pod-margin-left-screen-large * @pod-narrow-margin-left-scale;

      &-copy-text {
        margin-left: @user-account-dropdown-menu-copy-text-margin-left-screen-large;
      }
    }
  }
}

& when (@user-dropdown-menu-enabled) and (@layout-screen-jumbo-enabled) {

  @media (min-width: @layout-screen-jumbo-min-width) {

    .user-account-dropdown-button {
      padding: @pod-margin-top-screen-jumbo * @pod-short-margin-top-scale @pod-margin-right-screen-jumbo * @pod-narrow-margin-right-scale @pod-margin-bottom-screen-jumbo * @pod-short-margin-bottom-scale @pod-margin-left-screen-jumbo * @pod-narrow-margin-left-scale;

      .cluster-header {

        &-primary {

          &-wrapper {
            padding-right: @user-account-dropdown-menu-primary-padding-right-screen-jumbo;

            & + .cluster-header {

              &-secondary {
                margin-top: @user-account-dropdown-menu-primary-margin-bottom-screen-jumbo;
              }
            }
          }
        }
      }
    }

    .user-account-dropdown-menu {
      margin-left: @pod-margin-left-screen-jumbo * @pod-narrow-margin-left-scale;

      &-copy-text {
        margin-left: @user-account-dropdown-menu-copy-text-margin-left-screen-jumbo;
      }
    }
  }
}


Update .list-wide li margins

Update .list-wide li margins

.content-area {
    @media (max-width: @screen-xs-max) {
        padding-top: @content-area-padding / 2;
    }
    @media (min-width: @screen-sm-min) {
        padding-top: @content-area-padding;
    }
    padding-bottom: @content-area-padding;

    .post-thumbnail {
        &:not(:first-child) {
            margin-top: @grid-gutter-width / 2;
        }
        &:not(:last-child) {
            margin-bottom: @grid-gutter-width / 2;
        }
    }
}

.list-service-icons {
    .list-inline;
    .list-wide;
    margin-left: 0;
    font-size: 0; // Removes any text elements before the icons
    margin-top: @grid-gutter-width;
    margin-bottom: @grid-gutter-width;
    text-align: center;
    li {
        margin: @grid-gutter-width / 6;
    }
    .image {
        max-width: 30px !important;
    }
}

.address-list {
    font-size: @font-size-h5;
    margin-top: @grid-gutter-width * 2;
}

.post-list {
    text-align: right;
}

.lead-post-text {
    font-size: @font-size-large;
    color: @keitaro-green-light;
    margin: 30px 0 20px 0;
}

.main-post-title {
    color: @keitaro-green-dark;
    letter-spacing: @letter-spacing-base;
}

.main-post-item {
    margin-top: 45px;
}

.post-icons {
    margin-left: 10px;
    min-width: 120px;
}

.post-wrapper {
    margin: 70px 0 40px 0;
}

.tweets {
    margin: 150px 0;
}

.main-tweets-title {
    letter-spacing: @letter-spacing-base;
}

.date-stamp {
    border-bottom: 2px solid @keitaro-gray-lightest;
    padding-bottom: 20px;
}

.lead-md {
    font-size: @font-size-large;
}

.lead-block {
    display: block;
    font-size: @font-size-large;
    @media (min-width: @screen-md-min) {
        min-height: @grid-gutter-width;
    }
}

.border-transparent {
    border: transparent;
    background: transparent;
}

.dl-navigation {
    dt {
        .text-uppercase;
        font-weight: inherit;
        margin-bottom: @grid-gutter-width / 3;
    }
    dd {
        margin: @grid-gutter-width / 24 0;
    }
}

.entry-meta {
    color: @keitaro-green-gray-d-30;
}

.entry-content {
    margin-top: @grid-gutter-width / 2;
    margin-bottom: @grid-gutter-width / 2;
    @media (max-width: @screen-sm-max){
        margin-bottom: @grid-gutter-width;
    }
    p {
        &:last-child {
            margin-bottom: 0;
        }
    }
}

.entry-group {
    .hentry {
        margin: @grid-gutter-width / 3 0;
    }
}

.page-template-parent {
    .hentry {
        @media (min-width: @screen-md-min) {
            .col-md-8 {
                float: right;
            }
        }
        @media (max-width: @screen-sm-max) {
            .col-md-4 {
                clear: both;
            }
        }
    }
}

.page-template-parent,
.page-template-contact {
    &:not(.page-child) {
        @media (min-width: @screen-md-min) {
            .post-thumbnail,
            .service-list {
                text-align: right;
            }
        }
    }
}

.entry-title {
    word-break: break-word;
    overflow-wrap: break-word;
    @media (max-width: @screen-sm-max) {
        margin-top: @grid-gutter-width / 2;
    }
}

.img-round {
    border-radius: 50%;
    border: 1px solid @keitaro-green-gray-l-30;
}

hr {
    border-width: 2px;
}

.hr-green {
    border-color: @keitaro-green-light;
}

.keitaro-dark-green {
    color: @keitaro-green-dark;
}

.call-to-action {
    .text-center;
    color: @body-bg;
    background-color: @keitaro-green-light;
    padding: @grid-gutter-width - 10px;

    .list-wide {
        margin-bottom: 0;
    }

    .menu {
        .list-inline;

        a {
            color: inherit;
        }
    }

    .menu-item {
        margin-top: @grid-gutter-width / 2;

        &:first-child {
            a {
                .btn;
                .btn-primary;
            }
        }

        &:not(first-child) {
            a {
                .btn;
                .btn-inverse;
            }
        }
    }

    .textwidget {
        * :last-child {
            margin-bottom: 0;
        }
    }
}

.call-to-action-title {
    color: @body-bg;
    font-weight: 400;
    letter-spacing: @letter-spacing-small;
    margin: 0;
}

.call-to-action-secondary {
    .text-center;
    margin: @grid-gutter-width 0;
}

.discover {
    text-align: right;
}

.list-wide {
    letter-spacing: @letter-spacing-large;
    li {
        margin-left: @grid-gutter-width / 4;
        margin-right: @grid-gutter-width / 4;
    }
}

.subpage-title {
    text-transform: uppercase;
    letter-spacing: @letter-spacing-small;
}

.hentry {
    &:not(:last-child) {
        margin-bottom: @grid-gutter-width;
    }

}

.featured-post {

    &:not(.sticky) {
        &.hentry {
            &:first-child {
                margin-bottom: @content-area-padding;
            }
        }
        &:not(:last-child) {
            margin-bottom: @content-area-padding;
        }

    }
}

.post-meta-list {
    .list-inline;
    margin-top: @padding-large-vertical * 2;

    li {
        margin-bottom: @padding-large-vertical;
    }
}

.post-categories {

    .post-meta-list;

    a {
        .btn;
        .btn-default;
    }
}

.post-tags {

    .post-meta-list;

    a {
        .btn;
        .btn-sm;
        .btn-default;
    }
}

.entry-meta {
    color: @keitaro-green-gray-l-10;
}

iframe,
embed,
object {
    max-width: 100%;
}

hr {
    border-width: 1px;
}

.twitter-content-widget {
    border: @sticky-border;
    margin: @grid-gutter-width 0;
    padding: 0 @grid-gutter-width;
}

.twitter-content-widget-title {
    margin-bottom: @grid-gutter-width / 2;
}

.no-results {
    margin-bottom: @grid-gutter-width;
    .page-header {
        padding-bottom: 0;
    }
}

.location-map {
    width: 100%;
    height: 150px;
}

.widget-contact {
    .entry-title {
        color: @brand-primary;
    }
}

.highlight {
    color: @brand-success;
}

pre {
    font-size: @font-size-small;
}

.content-area {
    @media (max-width: @screen-xs-max) {
        padding-top: @content-area-padding / 2;
    }
    @media (min-width: @screen-sm-min) {
        padding-top: @content-area-padding;
    }
    padding-bottom: @content-area-padding;

    .post-thumbnail {
        &:not(:first-child) {
            margin-top: @grid-gutter-width / 2;
        }
        &:not(:last-child) {
            margin-bottom: @grid-gutter-width / 2;
        }
    }
}

.list-service-icons {
    .list-inline;
    .list-wide;
    margin-left: 0;
    font-size: 0; // Removes any text elements before the icons
    margin-top: @grid-gutter-width;
    margin-bottom: @grid-gutter-width;
    text-align: center;
    li {
        margin: @grid-gutter-width / 6;
    }
    .image {
        max-width: 30px !important;
    }
}

.address-list {
    font-size: @font-size-h5;
    margin-top: @grid-gutter-width * 2;
}

.post-list {
    text-align: right;
}

.lead-post-text {
    font-size: @font-size-large;
    color: @keitaro-green-light;
    margin: 30px 0 20px 0;
}

.main-post-title {
    color: @keitaro-green-dark;
    letter-spacing: @letter-spacing-base;
}

.main-post-item {
    margin-top: 45px;
}

.post-icons {
    margin-left: 10px;
    min-width: 120px;
}

.post-wrapper {
    margin: 70px 0 40px 0;
}

.tweets {
    margin: 150px 0;
}

.main-tweets-title {
    letter-spacing: @letter-spacing-base;
}

.date-stamp {
    border-bottom: 2px solid @keitaro-gray-lightest;
    padding-bottom: 20px;
}

.lead-md {
    font-size: @font-size-large;
}

.lead-block {
    display: block;
    font-size: @font-size-large;
    @media (min-width: @screen-md-min) {
        min-height: @grid-gutter-width;
    }
}

.border-transparent {
    border: transparent;
    background: transparent;
}

.dl-navigation {
    dt {
        .text-uppercase;
        font-weight: inherit;
        margin-bottom: @grid-gutter-width / 3;
    }
    dd {
        margin: @grid-gutter-width / 24 0;
    }
}

.entry-meta {
    color: @keitaro-green-gray-d-30;
}

.entry-content {
    margin-top: @grid-gutter-width / 2;
    margin-bottom: @grid-gutter-width / 2;
    @media (max-width: @screen-sm-max){
        margin-bottom: @grid-gutter-width;
    }
    p {
        &:last-child {
            margin-bottom: 0;
        }
    }
}

.entry-group {
    .hentry {
        margin: @grid-gutter-width / 3 0;
    }
}

.page-template-parent {
    .hentry {
        @media (min-width: @screen-md-min) {
            .col-md-8 {
                float: right;
            }
        }
        @media (max-width: @screen-sm-max) {
            .col-md-4 {
                clear: both;
            }
        }
    }
}

.page-template-parent,
.page-template-contact {
    &:not(.page-child) {
        @media (min-width: @screen-md-min) {
            .post-thumbnail,
            .service-list {
                text-align: right;
            }
        }
    }
}

.entry-title {
    word-break: break-word;
    overflow-wrap: break-word;
    @media (max-width: @screen-sm-max) {
        margin-top: @grid-gutter-width / 2;
    }
}

.img-round {
    border-radius: 50%;
    border: 1px solid @keitaro-green-gray-l-30;
}

hr {
    border-width: 2px;
}

.hr-green {
    border-color: @keitaro-green-light;
}

.keitaro-dark-green {
    color: @keitaro-green-dark;
}

.call-to-action {
    .text-center;
    color: @body-bg;
    background-color: @keitaro-green-light;
    padding: @grid-gutter-width - 10px;

    .list-wide {
        margin-bottom: 0;
    }

    .menu {
        .list-inline;

        a {
            color: inherit;
        }
    }

    .menu-item {
        margin-top: @grid-gutter-width / 2;

        &:first-child {
            a {
                .btn;
                .btn-primary;
            }
        }

        &:not(first-child) {
            a {
                .btn;
                .btn-inverse;
            }
        }
    }

    .textwidget {
        * :last-child {
            margin-bottom: 0;
        }
    }
}

.call-to-action-title {
    color: @body-bg;
    font-weight: 400;
    letter-spacing: @letter-spacing-small;
    margin: 0;
}

.call-to-action-secondary {
    .text-center;
    margin: @grid-gutter-width 0;
}

.discover {
    text-align: right;
}

.list-wide {
    letter-spacing: @letter-spacing-large;
    li {
        margin-right: @grid-gutter-width / 3;
    }
}

.subpage-title {
    text-transform: uppercase;
    letter-spacing: @letter-spacing-small;
}

.hentry {
    &:not(:last-child) {
        margin-bottom: @grid-gutter-width;
    }

}

.featured-post {

    &:not(.sticky) {
        &.hentry {
            &:first-child {
                margin-bottom: @content-area-padding;
            }
        }
        &:not(:last-child) {
            margin-bottom: @content-area-padding;
        }

    }
}

.post-meta-list {
    .list-inline;
    margin-top: @padding-large-vertical * 2;

    li {
        margin-bottom: @padding-large-vertical;
    }
}

.post-categories {

    .post-meta-list;

    a {
        .btn;
        .btn-default;
    }
}

.post-tags {

    .post-meta-list;

    a {
        .btn;
        .btn-sm;
        .btn-default;
    }
}

.entry-meta {
    color: @keitaro-green-gray-l-10;
}

iframe,
embed,
object {
    max-width: 100%;
}

hr {
    border-width: 1px;
}

.twitter-content-widget {
    border: @sticky-border;
    margin: @grid-gutter-width 0;
    padding: 0 @grid-gutter-width;
}

.twitter-content-widget-title {
    margin-bottom: @grid-gutter-width / 2;
}

.no-results {
    margin-bottom: @grid-gutter-width;
    .page-header {
        padding-bottom: 0;
    }
}

.location-map {
    width: 100%;
    height: 150px;
}

.widget-contact {
    .entry-title {
        color: @brand-primary;
    }
}

.highlight {
    color: @brand-success;
}

pre {
    font-size: @font-size-small;
}


improve the smoothness of the nav

improve the smoothness of the nav

.dl-menuwrapper {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1000;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	perspective: 1000px;
	-webkit-perspective-origin: 50% 200%;
	-moz-perspective-origin: 50% 200%;
	perspective-origin: 50% 200%;
	@media @medium {
		position: fixed;
		max-width: 175px;
		top: 25px;
		left: 25px;
	}
	button {
		top: 0;
		left: 0;
		background: @comp-color;
		border: none;
		width: 48px;
		height: 45px;
		text-indent: -900em;
		overflow: hidden;
		position: relative;
		cursor: pointer;
		outline: none;
		.border-radius(0,3px,0,0);
		opacity: 0.6;
		@media @medium {
			.border-radius(3px,3px,3px,3px);
		}
	}
	button:hover,
	button.dl-active,
	ul {
		background: #aaa;
	}
	button:after {
		content: '';
		position: absolute;
		width: 68%;
		height: 5px;
		background: @white;
		top: 10px;
		left: 16%;
		box-shadow:
			0 10px 0 @white,
			0 20px 0 @white;
	}
	button.dl-active {
		display: none;
	}
	ul {
		padding: 0;
		list-style: none;
		-webkit-transform-style: preserve-3d;
		-moz-transform-style: preserve-3d;
		transform-style: preserve-3d;
	}
	li {
		position: relative;
		h4 {
			margin:0;
			padding: 15px 20px 0;
			color: fade(@white,90);
		}
		p {
			margin: 0;
			padding: 15px 20px;
			.font-rem(14);
			color: fade(@white,80);
			a {
				display: inline;
				padding: 0;
				.font-rem(14);
			}
		}
		i {
			display: inline-block;
			width: 2em;
		}
		a {
			display: block;
			position: relative;
			padding: 15px 20px;
			.font-rem(14);
			line-height: 20px;
			font-weight: 300;
			color: @white;
			outline: none;
		}
		&.dl-back > a {
			padding-left: 30px;
			background: rgba(0,0,0,0.2);
		}
		&.dl-back:after,
		> a:not(:only-child):after {
			position: absolute;
			top: 0;
			line-height: 50px;
			font-family: 'fontawesome';
			color: @white;
			speak: none;
			-webkit-font-smoothing: antialiased;
			content: "\f105";
		}
		&.dl-back:after {
			left: 10px;
			color: rgba(212,204,198,0.5);
			-webkit-transform: rotate(180deg);
			-moz-transform: rotate(180deg);
			transform: rotate(180deg);
		}
		> a:after {
			right: 10px;
			color: rgba(0,0,0,0.15);
		}
	}
	.dl-menu {
		margin: 0;
		position: absolute;
		width: 100%;
		max-width: 400px;
		overflow-y: auto;
		max-height: 600px;
		opacity: 0;
		pointer-events: none;
		box-shadow: 0 12px 24px fade(@black,35);
		-webkit-transform: translateY(10px);
		-moz-transform: translateY(10px);
		transform: translateY(10px);
		-webkit-backface-visibility: hidden;
		-moz-backface-visibility: hidden;
		backface-visibility: hidden;
		@media @medium {
			.border-radius(3px,3px,3px,3px);
			max-height: 650px;
		}
	}
	.dl-menu.dl-menu-toggle {
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
	.dl-menu.dl-menuopen {
		opacity: 1;
		pointer-events: auto;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		transform: translateY(0px);
	}
	.dl-submenu {
		.rounded(3px);
		box-shadow: 0 12px 24px fade(@black,35);
	}
	/* Hide the inner submenus */
	li .dl-submenu {
		display: none;
	}
}
/*
When a submenu is openend, we will hide all li siblings.
For that we give a class to the parent menu called "dl-subview".
We also hide the submenu link.
The opened submenu will get the class "dl-subviewopen".
All this is done for any sub-level being entered.
*/
.dl-menu.dl-subview li,
.dl-menu.dl-subview li.dl-subviewopen > a,
.dl-menu.dl-subview li.dl-subview > a {
	display: none;
}
.dl-menu.dl-subview li.dl-subview,
.dl-menu.dl-subview li.dl-subview .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen,
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu > li {
	display: block;
}
/* Animation classes for moving out and in */
.dl-menu.dl-animate-out {
	-webkit-animation: MenuAnimOut 0.4s ease;
	-moz-animation: MenuAnimOut 0.4s ease;
	animation: MenuAnimOut 0.4s ease;
}
@-webkit-keyframes MenuAnimOut {
	100% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
}
@-moz-keyframes MenuAnimOut {
	100% {
		-moz-transform: translateZ(300px);
		opacity: 0;
	}
}
@keyframes MenuAnimOut {
	100% {
		transform: translateZ(300px);
		opacity: 0;
	}
}
.dl-menu.dl-animate-in {
	-webkit-animation: MenuAnimIn 0.4s ease;
	-moz-animation: MenuAnimIn 0.4s ease;
	animation: MenuAnimIn 0.4s ease;
}
@-webkit-keyframes MenuAnimIn {
	0% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}
@-moz-keyframes MenuAnimIn {
	0% {
		-moz-transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-moz-transform: translateZ(0px);
		opacity: 1;
	}
}
@keyframes MenuAnimIn {
	0% {
		transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		transform: translateZ(0px);
		opacity: 1;
	}
}
.dl-menuwrapper > .dl-submenu.dl-animate-in {
	-webkit-animation: SubMenuAnimIn 0.4s ease;
	-moz-animation: SubMenuAnimIn 0.4s ease;
	animation: SubMenuAnimIn 0.4s ease;
}
@-webkit-keyframes SubMenuAnimIn {
	0% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}
@-moz-keyframes SubMenuAnimIn {
	0% {
		-moz-transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-moz-transform: translateZ(0px);
		opacity: 1;
	}
}
@keyframes SubMenuAnimIn {
	0% {
		transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		transform: translateZ(0px);
		opacity: 1;
	}
}
.dl-menuwrapper > .dl-submenu.dl-animate-out {
	-webkit-animation: SubMenuAnimOut 0.4s ease;
	-moz-animation: SubMenuAnimOut 0.4s ease;
	animation: SubMenuAnimOut 0.4s ease;
}
@-webkit-keyframes SubMenuAnimOut {
	0% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
}
@-moz-keyframes SubMenuAnimOut {
	0% {
		-moz-transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-moz-transform: translateZ(-300px);
		opacity: 0;
	}
}
@keyframes SubMenuAnimOut {
	0% {
		transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		transform: translateZ(-300px);
		opacity: 0;
	}
}
/* No Touch Fallback */
.no-touch .dl-menuwrapper li a:hover {
	background: rgba(255,248,213,0.1);
}
/* No JS Fallback */
.no-js {
	.dl-trigger {
		display: none;
	}
	.dl-menuwrapper .dl-menu {
		position: relative;
		opacity: 1;
		pointer-events: auto;
		-webkit-transform: none;
		-moz-transform: none;
		transform: none;
	}
	.dl-menuwrapper li .dl-submenu {
		display: block;
	}
	.dl-menuwrapper li.dl-back {
		display: none;
	}
	.dl-menuwrapper li > a:not(:only-child) {
		background: rgba(0,0,0,0.1);
	}
	.dl-menuwrapper li > a:not(:only-child):after {
		content: '';
	}
}
// Menu Color
.dl-menuwrapper button:hover,
.dl-menuwrapper button.dl-active,
.dl-menuwrapper ul {
	background: @comp-color;
}
// Fix for IE
.dl-menu li {
	display: none
}
.dl-menuopen li {
	display: block
}

.dl-menuwrapper {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1000;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	perspective: 1000px;
	-webkit-perspective-origin: 50% 200%;
	-moz-perspective-origin: 50% 200%;
	perspective-origin: 50% 200%;
	@media @medium {
		position: fixed;
		max-width: 175px;
		top: 25px;
		left: 25px;
	}
	button {
		top: 0;
		left: 0;
		background: @comp-color;
		border: none;
		width: 48px;
		height: 45px;
		text-indent: -900em;
		overflow: hidden;
		position: relative;
		cursor: pointer;
		outline: none;
		.border-radius(0,3px,0,0);
		opacity: 0.6;
		@media @medium {
			.border-radius(3px,3px,3px,3px);
		}
	}
	button:hover,
	button.dl-active,
	ul {
		background: #aaa;
	}
	button:after {
		content: '';
		position: absolute;
		width: 68%;
		height: 5px;
		background: @white;
		top: 10px;
		left: 16%;
		box-shadow:
			0 10px 0 @white,
			0 20px 0 @white;
	}
	button.dl-active {
		display: none;
	}
	ul {
		padding: 0;
		list-style: none;
		-webkit-transform-style: preserve-3d;
		-moz-transform-style: preserve-3d;
		transform-style: preserve-3d;
	}
	li {
		position: relative;
		h4 {
			margin:0;
			padding: 15px 20px 0;
			color: fade(@white,90);
		}
		p {
			margin: 0;
			padding: 15px 20px;
			.font-rem(14);
			color: fade(@white,80);
			a {
				display: inline;
				padding: 0;
				.font-rem(14);
			}
		}
		i {
			display: inline-block;
			width: 2em;
		}
		a {
			display: block;
			position: relative;
			padding: 15px 20px;
			.font-rem(14);
			line-height: 20px;
			font-weight: 300;
			color: @white;
			outline: none;
		}
		.dl-back > a {
			padding-left: 30px;
			background: rgba(0,0,0,0.2);
		}
		.dl-back:after,
		> a:not(:only-child):after {
			position: absolute;
			top: 0;
			line-height: 50px;
			font-family: 'fontawesome';
			color: @white;
			speak: none;
			-webkit-font-smoothing: antialiased;
			content: "\f105";
		}
		.dl-back:after {
			left: 10px;
			color: rgba(212,204,198,0.5);
			-webkit-transform: rotate(180deg);
			-moz-transform: rotate(180deg);
			transform: rotate(180deg);
		}
		> a:after {
			right: 10px;
			color: rgba(0,0,0,0.15);
		}
	}
	.dl-menu {
		margin: 0;
		position: absolute;
		width: 100%;
		max-width: 400px;
		overflow-y: auto;
		max-height: 600px;
		opacity: 0;
		pointer-events: none;
		box-shadow: 0 12px 24px fade(@black,35);
		-webkit-transform: translateY(10px);
		-moz-transform: translateY(10px);
		transform: translateY(10px);
		-webkit-backface-visibility: hidden;
		-moz-backface-visibility: hidden;
		backface-visibility: hidden;
		@media @medium {
			.border-radius(3px,3px,3px,3px);
			max-height: 650px;
		}
	}
	.dl-menu.dl-menu-toggle {
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
	.dl-menu.dl-menuopen {
		opacity: 1;
		pointer-events: auto;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		transform: translateY(0px);
	}
	.dl-submenu {
		.rounded(3px);
		box-shadow: 0 12px 24px fade(@black,35);
	}
	/* Hide the inner submenus */
	li .dl-submenu {
		display: none;
	}
}
/*
When a submenu is openend, we will hide all li siblings.
For that we give a class to the parent menu called "dl-subview".
We also hide the submenu link.
The opened submenu will get the class "dl-subviewopen".
All this is done for any sub-level being entered.
*/
.dl-menu.dl-subview li,
.dl-menu.dl-subview li.dl-subviewopen > a,
.dl-menu.dl-subview li.dl-subview > a {
	display: none;
}
.dl-menu.dl-subview li.dl-subview,
.dl-menu.dl-subview li.dl-subview .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen,
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu > li {
	display: block;
}
/* Animation classes for moving out and in */
.dl-menu.dl-animate-out {
	-webkit-animation: MenuAnimOut 0.4s ease;
	-moz-animation: MenuAnimOut 0.4s ease;
	animation: MenuAnimOut 0.4s ease;
}
@-webkit-keyframes MenuAnimOut {
	100% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
}
@-moz-keyframes MenuAnimOut {
	100% {
		-moz-transform: translateZ(300px);
		opacity: 0;
	}
}
@keyframes MenuAnimOut {
	100% {
		transform: translateZ(300px);
		opacity: 0;
	}
}
.dl-menu.dl-animate-in {
	-webkit-animation: MenuAnimIn 0.4s ease;
	-moz-animation: MenuAnimIn 0.4s ease;
	animation: MenuAnimIn 0.4s ease;
}
@-webkit-keyframes MenuAnimIn {
	0% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}
@-moz-keyframes MenuAnimIn {
	0% {
		-moz-transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-moz-transform: translateZ(0px);
		opacity: 1;
	}
}
@keyframes MenuAnimIn {
	0% {
		transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		transform: translateZ(0px);
		opacity: 1;
	}
}
.dl-menuwrapper > .dl-submenu.dl-animate-in {
	-webkit-animation: SubMenuAnimIn 0.4s ease;
	-moz-animation: SubMenuAnimIn 0.4s ease;
	animation: SubMenuAnimIn 0.4s ease;
}
@-webkit-keyframes SubMenuAnimIn {
	0% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}
@-moz-keyframes SubMenuAnimIn {
	0% {
		-moz-transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-moz-transform: translateZ(0px);
		opacity: 1;
	}
}
@keyframes SubMenuAnimIn {
	0% {
		transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		transform: translateZ(0px);
		opacity: 1;
	}
}
.dl-menuwrapper > .dl-submenu.dl-animate-out {
	-webkit-animation: SubMenuAnimOut 0.4s ease;
	-moz-animation: SubMenuAnimOut 0.4s ease;
	animation: SubMenuAnimOut 0.4s ease;
}
@-webkit-keyframes SubMenuAnimOut {
	0% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
}
@-moz-keyframes SubMenuAnimOut {
	0% {
		-moz-transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-moz-transform: translateZ(-300px);
		opacity: 0;
	}
}
@keyframes SubMenuAnimOut {
	0% {
		transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		transform: translateZ(-300px);
		opacity: 0;
	}
}
/* No Touch Fallback */
.no-touch .dl-menuwrapper li a:hover {
	background: rgba(255,248,213,0.1);
}
/* No JS Fallback */
.no-js {
	.dl-trigger {
		display: none;
	}
	.dl-menuwrapper .dl-menu {
		position: relative;
		opacity: 1;
		pointer-events: auto;
		-webkit-transform: none;
		-moz-transform: none;
		transform: none;
	}
	.dl-menuwrapper li .dl-submenu {
		display: block;
	}
	.dl-menuwrapper li.dl-back {
		display: none;
	}
	.dl-menuwrapper li > a:not(:only-child) {
		background: rgba(0,0,0,0.1);
	}
	.dl-menuwrapper li > a:not(:only-child):after {
		content: '';
	}
}
// Menu Color
.dl-menuwrapper button:hover,
.dl-menuwrapper button.dl-active,
.dl-menuwrapper ul {
	background: @comp-color;
}
// Fix for IE
.dl-menu li {
	display: none
}
.dl-menuopen li {
	display: block
}


Fixes floating issue on profile page

Fixes floating issue on profile page

/* 2012 PyCon Leipzig*/
/* colors */
/*

#CED9D9 bg CMYK 5,0,0,15 (shades: #B6BFBF, #8E99A6)
#990000 red CMYK 0,100,100,40
#153559 dark blue CMYK 76,41,0,65
#304359 1. shades blue CMYK 46,25,0,12
#5A7CA6 2. shades blue CMYK 46,25,0,35
#79A8E0 3. shades blue CMYK 46,25,0,65
#337FD9 python logo blue CMYK 80,50,15,0 #3d73a6 #175AA5
#FFCC33 python logo yellow CMYK 0,20,80,0 ,yellow bg nav #E8CB23
#90A617 green CMYK 13,0,86,35

#323232 font base color

*/

 /* Primary Styles
    Author: Stefania Trabucchi info@trabucchi.de
 */

@green: #6c9900;
@blue: #306998;
@red: #9C1006;
@yellow: #FFCC33;

@sidebar-width: 302px;
@sidebarbox-hpadding: 10px;

@border-color: #DDD;
@base-img-url: 'static_media/images';

@import "_reset";

@import "bootstrap/less/variables";
// Bootstrap config
@btnPrimaryBackground: @yellow;
@btnPrimaryBackgroundHighlight: darken(@yellow, 5);
@iconSpritePath: "/@{base-img-url}/glyphicons-halflings.png";
@iconWhiteSpritePath: "/@{base-img-url}/glyphicons-halflings-white.png";
@import "bootstrap/less/mixins";
@import "bootstrap/less/alerts";
@import "bootstrap/less/forms";
@import "bootstrap/less/buttons";
@import "bootstrap/less/sprites";
[class^="icon-"],
[class*=" icon-"] {
  background-image: url("/@{base-img-url}/glyphicons-halflings.png");

  .ie7-restore-right-whitespace();
}
.icon-white {
  background-image: url("/@{base-img-url}/glyphicons-halflings-white.png");
}
a.btn-danger:visited {
    color: white;
}
@import "bootstrap/less/tables";

@import "_grid";
@import "_base";
@import "_pagination";
@import "_header";
@import "_footer";
@import "_primary-nav";
@import "_content";
@import "_forms";
@import "_login";
@import "_sidebar";
@import "_proposals";
@import "_news";
@import "_schedule";
@import "_print";
@import "_sponsors";
@import "_reviews";
#proposals > .all();

.profilepage {
    .avatar {
        float: right;
        padding: 3px;
        border: 1px solid #CCC;
    }
    #info {
        float: left;
        width: 500px;
    }
    #sessions {
        clear: both;
    }

    article .post {
        width: 594px;
        overflow: hidden;
    }
}

/* 2012 PyCon Leipzig*/
/* colors */
/*

#CED9D9 bg CMYK 5,0,0,15 (shades: #B6BFBF, #8E99A6)
#990000 red CMYK 0,100,100,40
#153559 dark blue CMYK 76,41,0,65
#304359 1. shades blue CMYK 46,25,0,12
#5A7CA6 2. shades blue CMYK 46,25,0,35
#79A8E0 3. shades blue CMYK 46,25,0,65
#337FD9 python logo blue CMYK 80,50,15,0 #3d73a6 #175AA5
#FFCC33 python logo yellow CMYK 0,20,80,0 ,yellow bg nav #E8CB23
#90A617 green CMYK 13,0,86,35

#323232 font base color

*/

 /* Primary Styles
    Author: Stefania Trabucchi info@trabucchi.de
 */

@green: #6c9900;
@blue: #306998;
@red: #9C1006;
@yellow: #FFCC33;

@sidebar-width: 302px;
@sidebarbox-hpadding: 10px;

@border-color: #DDD;
@base-img-url: 'static_media/images';

@import "_reset";

@import "bootstrap/less/variables";
// Bootstrap config
@btnPrimaryBackground: @yellow;
@btnPrimaryBackgroundHighlight: darken(@yellow, 5);
@iconSpritePath: "/@{base-img-url}/glyphicons-halflings.png";
@iconWhiteSpritePath: "/@{base-img-url}/glyphicons-halflings-white.png";
@import "bootstrap/less/mixins";
@import "bootstrap/less/alerts";
@import "bootstrap/less/forms";
@import "bootstrap/less/buttons";
@import "bootstrap/less/sprites";
[class^="icon-"],
[class*=" icon-"] {
  background-image: url("/@{base-img-url}/glyphicons-halflings.png");

  .ie7-restore-right-whitespace();
}
.icon-white {
  background-image: url("/@{base-img-url}/glyphicons-halflings-white.png");
}
a.btn-danger:visited {
    color: white;
}
@import "bootstrap/less/tables";

@import "_grid";
@import "_base";
@import "_pagination";
@import "_header";
@import "_footer";
@import "_primary-nav";
@import "_content";
@import "_forms";
@import "_login";
@import "_sidebar";
@import "_proposals";
@import "_news";
@import "_schedule";
@import "_print";
@import "_sponsors";
@import "_reviews";
#proposals > .all();

.profilepage {
    .avatar {
        float: right;
        padding: 3px;
        border: 1px solid #CCC;
    }
    #info {
        float: left;
        width: 500px;
    }
    #sessions {
        clear: both;
    }
}


Padding droit après les labels

Padding droit après les labels

@charset "utf-8";
/**
 * Fichier : principal.less
 * Description : styles spécifiques au formulaire d'inscription
 * Auteur : Mathurin Petit - mpetit[at]actualys.com
 * Version : 1.0.0
 ******************************************/

/**
 * vrac_soussigne
 ******************************************/
#vrac_soussigne, #vrac_marche, #vrac_condition, #vrac_validation, #vrac_recapitulatif
{
	h1
	{   font-size: 16px;
            font-weight: bold;
            margin: 0 0 20px;
            text-align: center;
            color: @couleur-a1;

	}

	h2
	{
		font-size: 16px;
		margin: 0 0 15px;
	}

	.col
	{
		display: inline-block;
		vertical-align: top;
		width: 425px;

		.ielt8 & { .inline-block-ie; }
	}

        section
        {
                padding: 5px 0px;
        }

	.ligne_form
	{
		margin: 0 0 15px;

		.error_list { width: 310px; }

		label
		{
			display: inline-block;
			vertical-align: middle;
			width: 200px;
		}

		&.ligne_form_large label
		{
			display: block;
			margin: 0 0 10px;
			width: auto;
		}

		input[type=text], input[type=password], select
		{
			background: #fff;
			border: 1px solid #d3d2cd;
			.border-radius(2px);
			font-size: 12px;
			position: relative;
			vertical-align: middle;
			.pie;
		}

		input[type=text], input[type=password]
		{
			height: 18px;
			padding: 0 4px;
			width: 120px;

			.ielt9 &
			{
				height: 16px;
				padding-top: 2px;
			}
		}

		select
		{
			height: 20px;
			width: 130px;
		}

		.champ_form_radio_cb
		{
			label
			{
				display: inline-block;
				margin: 0 20px 0 0;
				width: auto;
			}
		}

		&.ligne_form_large .champ_form_radio_cb
		{
			input
			{
				margin: 0 5px 0 0;
				vertical-align: middle;
			}
		}
	}

	.ligne_btn
	{
		margin: 34px 0 0;
                right: 23px;

		button, a
		{
			line-height: 24px;
			font-weight: normal;
			text-transform: uppercase;
			&:hover { text-decoration: none; }
		}

		.btn_valider
		{
			.btn_suiv;
			padding: 0 17px 0 15px;
		}

		.btn_ajouter
		{
			.btn_violet;
			background-image: url(../images/boutons/btn_ajouter.png);
			background-position: 7px center;
			margin: 0 10px 0 0;
			padding: 0 10px 0 30px;
		}

		.btn_supprimer
		{
			.btn_gris;
			background-image: url(../images/boutons/btn_supprimer.png);
			background-position: 7px center;
			padding: 0 10px 0 30px;
                        margin-right:20px;
                        text-transform: none;
		}
	}

	/* Ajout d'établissements */
	#infos_etablissements
	{
		margin: 15px 0 0;
		position: relative;
		padding: 0;
		width: 895px;

		.etablissement
		{
			.border(@couleur-a3);
			background: @couleur-a4;
			display: inline-block;
			margin: 0 20px 20px 0;
			padding: 10px 10px 0;
			position: relative;
			vertical-align: top;
			width: 250px;

			.ielt8 & { .inline-block-ie; }

			.error_list { width: auto; }

			.ligne_form label { width: 110px; }

			a.supprimer
			{
				.box-dimensions(13px, 13px);
				.pos-abs(-5px, -5px);
				background: url(../images/pictos/pi_supprimer.png) 0 0 no-repeat;
				display: inline-block;
				text-indent: -9999px;
			}
		}
	}

        a.btn_ajouter_etab
        {
                .btn_gris;
                background-image: url(../images/boutons/btn_ajouter.png);
                background-position: 7px center;
                margin: 0 10px 0 0;
                padding: 5px 10px 6px 30px;
                position: absolute;
                right: 127px;
                text-transform : none;
        }

        a#btn_ajouter_etablissement
        {
                .btn_gris;
                background-image: url(../images/boutons/btn_ajouter.png);
                background-position: 10px center;
                font-size: 15px;
                line-height: 1;
                position: absolute;
                padding: 4px 10px 4px 32px;
                font-size: 15px;
                text-transform: uppercase;

                &:hover { text-decoration: none; }

                span
                {
                        color: #fff;
                        display: block;
                        font-size: 14px;
                        font-weight: bold;
                        text-transform: none;
                }
        }

	/* Récapitulatif */
	#recapitulatif
	{
		.recap_perso,
		.recap_etablissement
		{
			margin: 0 0 20px;

			p
			{
				margin: 5px 0;
				span { font-weight: bold; }
				strong
				{
					color: @couleur-a2;
					font-style: italic;
					font-weight: normal;
				}
			}

			.adresse_comptabilite
			{
				margin: 20px 0 0;
			}

                        .btn_ajouter
                        {
                                .btn_violet;
                                background-image: url(../images/boutons/btn_ajouter.png);
                                background-position: 7px center;
                                margin: 0 10px 0 0;
                                padding: 0 10px 0 30px;
                        }

                        .btn_supprimer
                        {
                                .btn_gris;
                                background-image: url(../images/boutons/btn_supprimer.png);
                                background-position: 7px center;
                                padding: 0 10px 0 30px;
                                margin-right:20px;
                                text-transform: none;
                        }
		}

		.ligne_btn
                {
                        text-align: right;
                        margin:0;
                }

	}

	input.ui-autocomplete-input
	{
		background: none repeat scroll 0 0 #FFFFFF;
	    border: 1px solid #D3D2CD;
	    font-size: 12px;
	    vertical-align: top;
	    height: 20px;
    	padding: 0 4px;
    	width: 250px;
		& + button
		{
			background: #fff;
			border: 1px solid #d3d2cd;
			border-left: 0;
			vertical-align: top;

			&:hover { background-color: #E9E9E9; }

			.ui-icon
			{
				background: url(../images/pictos/pi_desc.png) center center no-repeat;
				height: 20px;
				width: 20px;
			}
		}
	}

	.ui-dropdownchecklist-selector-wrapper,
	.ui-dropdownchecklist-selector
	{
		font-size: 0;
		line-height: 1;

		.ui-dropdownchecklist-text
		{
			background: #fff;
			border: 1px solid #d3d2cd;
			color: @couleur-a1;
			font-size: 12px;
			height: 18px;
			padding: 2px 4px 0;
			width: 190px !important;
		}

		&.ui-state-active
		{
			.ui-dropdownchecklist-text { border-bottom-color: #f4f4f4; }
		}
	}

	.ui-dropdownchecklist-dropcontainer-wrapper
	{
		height: auto !important;
		width: auto !important;
	}

	.ui-dropdownchecklist-dropcontainer,
	{
		background: #fff;
		border: 1px solid #d3d2cd;
		height: 200px !important;
		width: 250px;

		.ui-dropdownchecklist-item
		{
			padding: 2px 4px;

			label
			{
				width: auto;
				vertical-align: middle;
			}
		}
	}

	label {
		padding-right: 10px;
	}
}

#vrac_validation
{
    ul
        {
                list-style: decimal
        }
}

@charset "utf-8";
/**
 * Fichier : principal.less
 * Description : styles spécifiques au formulaire d'inscription
 * Auteur : Mathurin Petit - mpetit[at]actualys.com
 * Version : 1.0.0
 ******************************************/

/**
 * vrac_soussigne
 ******************************************/
#vrac_soussigne, #vrac_marche, #vrac_condition, #vrac_validation, #vrac_recapitulatif
{
	h1
	{   font-size: 16px;
            font-weight: bold;
            margin: 0 0 20px;
            text-align: center;
            color: @couleur-a1;

	}

	h2
	{
		font-size: 16px;
		margin: 0 0 15px;
	}

	.col
	{
		display: inline-block;
		vertical-align: top;
		width: 425px;

		.ielt8 & { .inline-block-ie; }
	}

        section
        {
                padding: 5px 0px;
        }

	.ligne_form
	{
		margin: 0 0 15px;

		.error_list { width: 310px; }

		label
		{
			display: inline-block;
			vertical-align: middle;
			width: 200px;
		}

		&.ligne_form_large label
		{
			display: block;
			margin: 0 0 10px;
			width: auto;
		}

		input[type=text], input[type=password], select
		{
			background: #fff;
			border: 1px solid #d3d2cd;
			.border-radius(2px);
			font-size: 12px;
			position: relative;
			vertical-align: middle;
			.pie;
		}

		input[type=text], input[type=password]
		{
			height: 18px;
			padding: 0 4px;
			width: 120px;

			.ielt9 &
			{
				height: 16px;
				padding-top: 2px;
			}
		}

		select
		{
			height: 20px;
			width: 130px;
		}

		.champ_form_radio_cb
		{
			label
			{
				display: inline-block;
				margin: 0 20px 0 0;
				width: auto;
			}
		}

		&.ligne_form_large .champ_form_radio_cb
		{
			input
			{
				margin: 0 5px 0 0;
				vertical-align: middle;
			}
		}
	}

	.ligne_btn
	{
		margin: 34px 0 0;
                right: 23px;

		button, a
		{
			line-height: 24px;
			font-weight: normal;
			text-transform: uppercase;
			&:hover { text-decoration: none; }
		}

		.btn_valider
		{
			.btn_suiv;
			padding: 0 17px 0 15px;
		}

		.btn_ajouter
		{
			.btn_violet;
			background-image: url(../images/boutons/btn_ajouter.png);
			background-position: 7px center;
			margin: 0 10px 0 0;
			padding: 0 10px 0 30px;
		}

		.btn_supprimer
		{
			.btn_gris;
			background-image: url(../images/boutons/btn_supprimer.png);
			background-position: 7px center;
			padding: 0 10px 0 30px;
                        margin-right:20px;
                        text-transform: none;
		}
	}

	/* Ajout d'établissements */
	#infos_etablissements
	{
		margin: 15px 0 0;
		position: relative;
		padding: 0;
		width: 895px;

		.etablissement
		{
			.border(@couleur-a3);
			background: @couleur-a4;
			display: inline-block;
			margin: 0 20px 20px 0;
			padding: 10px 10px 0;
			position: relative;
			vertical-align: top;
			width: 250px;

			.ielt8 & { .inline-block-ie; }

			.error_list { width: auto; }

			.ligne_form label { width: 110px; }

			a.supprimer
			{
				.box-dimensions(13px, 13px);
				.pos-abs(-5px, -5px);
				background: url(../images/pictos/pi_supprimer.png) 0 0 no-repeat;
				display: inline-block;
				text-indent: -9999px;
			}
		}
	}

        a.btn_ajouter_etab
        {
                .btn_gris;
                background-image: url(../images/boutons/btn_ajouter.png);
                background-position: 7px center;
                margin: 0 10px 0 0;
                padding: 5px 10px 6px 30px;
                position: absolute;
                right: 127px;
                text-transform : none;
        }

        a#btn_ajouter_etablissement
        {
                .btn_gris;
                background-image: url(../images/boutons/btn_ajouter.png);
                background-position: 10px center;
                font-size: 15px;
                line-height: 1;
                position: absolute;
                padding: 4px 10px 4px 32px;
                font-size: 15px;
                text-transform: uppercase;

                &:hover { text-decoration: none; }

                span
                {
                        color: #fff;
                        display: block;
                        font-size: 14px;
                        font-weight: bold;
                        text-transform: none;
                }
        }

	/* Récapitulatif */
	#recapitulatif
	{
		.recap_perso,
		.recap_etablissement
		{
			margin: 0 0 20px;

			p
			{
				margin: 5px 0;
				span { font-weight: bold; }
				strong
				{
					color: @couleur-a2;
					font-style: italic;
					font-weight: normal;
				}
			}

			.adresse_comptabilite
			{
				margin: 20px 0 0;
			}

                        .btn_ajouter
                        {
                                .btn_violet;
                                background-image: url(../images/boutons/btn_ajouter.png);
                                background-position: 7px center;
                                margin: 0 10px 0 0;
                                padding: 0 10px 0 30px;
                        }

                        .btn_supprimer
                        {
                                .btn_gris;
                                background-image: url(../images/boutons/btn_supprimer.png);
                                background-position: 7px center;
                                padding: 0 10px 0 30px;
                                margin-right:20px;
                                text-transform: none;
                        }
		}

		.ligne_btn
                {
                        text-align: right;
                        margin:0;
                }

	}

	input.ui-autocomplete-input
	{
		background: none repeat scroll 0 0 #FFFFFF;
	    border: 1px solid #D3D2CD;
	    font-size: 12px;
	    vertical-align: top;
	    height: 20px;
    	padding: 0 4px;
    	width: 250px;
		& + button
		{
			background: #fff;
			border: 1px solid #d3d2cd;
			border-left: 0;
			vertical-align: top;

			&:hover { background-color: #E9E9E9; }

			.ui-icon
			{
				background: url(../images/pictos/pi_desc.png) center center no-repeat;
				height: 20px;
				width: 20px;
			}
		}
	}

	.ui-dropdownchecklist-selector-wrapper,
	.ui-dropdownchecklist-selector
	{
		font-size: 0;
		line-height: 1;

		.ui-dropdownchecklist-text
		{
			background: #fff;
			border: 1px solid #d3d2cd;
			color: @couleur-a1;
			font-size: 12px;
			height: 18px;
			padding: 2px 4px 0;
			width: 190px !important;
		}

		&.ui-state-active
		{
			.ui-dropdownchecklist-text { border-bottom-color: #f4f4f4; }
		}
	}

	.ui-dropdownchecklist-dropcontainer-wrapper
	{
		height: auto !important;
		width: auto !important;
	}

	.ui-dropdownchecklist-dropcontainer,
	{
		background: #fff;
		border: 1px solid #d3d2cd;
		height: 200px !important;
		width: 250px;

		.ui-dropdownchecklist-item
		{
			padding: 2px 4px;

			label
			{
				width: auto;
				vertical-align: middle;
			}
		}
	}
}

#vrac_validation
{
    ul
        {
                list-style: decimal
        }
}


Added CSS for post inline editing

Added CSS for post inline editing

/* ############## Board List ############## */
.wbbBoardList {
	> li.wbbBoardNodeTop:not(.wbbBoardNodeTopEmpty) > div {
		.borderRadius(@wcfContainerBorderRadius - 2, 0);
	}

	> li > ul > li:last-child div.wbbBoard:last-child {
		.borderRadius(0, @wcfContainerBorderRadius - 2);
	}

	> li > ul > .wbbCategory > hgroup {
		padding-left: 43px;
	}

	> li > ul > li > ul > .wbbCategory > hgroup {
		padding-left: 79px;
	}

	.tabularBox:not(.wbbBoardNodeTop) {
		border-radius: 0;
		border-width: 1px 0 0;
	}

	.wbbStats {
		left: 50%;
		margin-top: @wcfGapSmall;
		position: absolute;
		top: @wcfGapSmall;
		width: 15%;

		dl {
			dt {
				line-height: @wcfBaseLineHeight;
				width: 40%;
			}

			dd {
				font-weight: normal;
				font-size: @wcfSmallFontSize;
				width: 58%;
			}
		}
	}

	.wbbLastPost {
		left: 65%;
		position: absolute;
		top: @wcfGapSmall;
		width: 35%; /* = 100% - left */

		> div {
			background-color: @wcfContentBackgroundColor;
			padding: @wcfGapSmall;
			margin-right: @wcfGapSmall;

			.borderRadius();
			.boxShadowNative(~"inset 0 1px 1px rgba(0, 0, 0, .1)");
		}

		hgroup {
			h1 a {
				display: inline-block;
				overflow: hidden;
				text-overflow: ellipsis;
				width: 98%;
				white-space: nowrap;
			}

			h2 {
				font-size: @wcfSmallFontSize;

				time {
					color: @wcfDimmedColor;
				}
			}
		}
	}

	.wbbSubBoards {
		li {
			display: inline-block;
		}
	}

	.wbbBoardDescription {
		font-size: 90%;
	}

	.wbbBoardContainer {
		position: relative;
	}

	.wbbBoardNodeTop {
		margin-top: @wcfGapMedium;
	}

	.wbbBoard {
		min-height: 44px;
		padding: @wcfGapSmall;
		padding-right: 51%;

		.transition(background, .1s);

		&~ ul > .wbbBoardContainer > .wbbBoard {
			padding-left: 43px;

			&~ ul > .wbbBoardContainer > .wbbBoard {
				padding-left: 79px;
			}
		}

		&:hover {
			background-color: @wcfContainerHoverBackgroundColor;
		}
	}

	.wbbBoardNode1 {
		background-color: @wcfContainerBackgroundColor;
	}

	.wbbBoardNode2 {
		background-color: @wcfContainerAccentBackgroundColor;
	}

	.wbbBoardNodeTopEmpty div.wbbBoard {
		.borderRadius(@wcfContainerBorderRadius - 2);
	}

	.wbbBoard > div > hgroup > h1 {
		font-weight: normal;
	}

	.new > div > hgroup > h1, .wbbSubBoards li.new a {
		font-weight: bold;
	}

	.wbbCollapsibleCategory .collapsibleButton {
		display: inline-block;
		margin-right: 7px;
	}
}

/* ignored boards */
.wbbIgnoredBoards {
	.wbbCategory > hgroup label {
		color: @wcfPageLinkHoverColor;
	}

	.wbbBoardContainer {
		> div {
			padding: 7px;
		}

		> ul > .wbbBoardContainer {
			> div {
				padding-left: 28px;
			}

			> ul > .wbbBoardContainer > div {
				padding-left: 56px;
			}
		}
	}
}

/* ############## Thread List ############## */
.wbbThreadList {
	.wbbLastPost h2 {
		color: @wcfDimmedColor;
		font-size: @wcfSmallFontSize;
	}

	.columnLastPost {
		white-space: nowrap;
	}

	.columnAvatar {
		div {
			position: relative;
			width: 40px;
			height: 38px;

			> p > img {
				opacity: .6;

				.transition(opacity, .2s);
			}
		}

		.myAvatar {
			position: absolute;
			width: 16px;
			height: 16px;
			bottom: -2px;
			left: 24px;
			opacity: 1;

			.boxShadow(0, 0, rgba(0, 0, 0, .3), 3px);
		}
	}

	.columnTopic .labelList {
		float: right;
		padding-left: 7px;
	}

	.columnTopic .wbbTopicLink {
		font-size: @wcfTitleFontSize;
	}

	tr.new .columnTopic > h1 {
		font-weight: bold;
	}

	tr.new .columnAvatar div > p > img, tr:hover .columnAvatar div > p > img {
		opacity: 1;
	}
}

/* ############## Post List ############## */
.wbbThreadPostList {
	.wbbThreadStarter {
		position: relative;

		> .message {
			&:after,
			&:before {
				content: "";
				display: block;
				height: 128px;
				left: 0;
				position: absolute;
				top: 0;
				width: 128px;
			}

			&:after {
				background-image: url(../../icon/threadStarter1.svg);
				background-position: 4px 4px;
				background-repeat: no-repeat;
				background-size: 16px;
				height: 20px;
				width: 20px;
			}

			&:before {
				.borderRadius(@wcfContainerBorderRadius, 0, 0, 0);
				.linearGradientNative(~"left top, rgba(255, 255, 255, .85) 0%, rgba(255, 255, 255, 0) 40%");
			}
		}
	}

	.newMessageBadge {
		border: 1px solid @wcfLinkColor;
		border-radius: 2px;
		color: @wcfLinkColor;
		display: inline-block;
		font-weight: bold;
		font-size: @wcfSmallFontSize;
		left: -220px;
		top: 30px;
		padding: 6px 10px;
		position: absolute;
		text-transform: uppercase;

		.linearGradient(darken(@wcfContainerHoverBackgroundColor, 10%), @wcfContainerHoverBackgroundColor, darken(@wcfContainerHoverBackgroundColor, 10%));
		.textShadow(darken(@wcfContainerHoverBackgroundColor, 10%));
		.boxShadow(1px, 1px, rgba(0, 0, 0, .2), 3px);

		&:before {
			border-color: transparent @wcfLinkColor transparent transparent;
			border-width: 0px 7px 7px;
			border-style: solid;
			bottom: -7px;
			content: "";
			display: block;
			height: 0px;
			left: -8px;
			position: absolute;
			width: 0px;
		}
	}
}

.wbbPostLoading {
	background-image: url(../icon/spinner1.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 64px;
}

/* Thread quick reply */
#threadQuickReply {
	.wbbThreadQuickReplyLoading {
		background-image: url(../icon/spinner1.svg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 64px;
	}

	.formSubmit {
		padding-bottom: @wcfGapMedium;
	}
}

/* ############## Board List ############## */
.wbbBoardList {
	> li.wbbBoardNodeTop:not(.wbbBoardNodeTopEmpty) > div {
		.borderRadius(@wcfContainerBorderRadius - 2, 0);
	}

	> li > ul > li:last-child div.wbbBoard:last-child {
		.borderRadius(0, @wcfContainerBorderRadius - 2);
	}

	> li > ul > .wbbCategory > hgroup {
		padding-left: 43px;
	}

	> li > ul > li > ul > .wbbCategory > hgroup {
		padding-left: 79px;
	}

	.tabularBox:not(.wbbBoardNodeTop) {
		border-radius: 0;
		border-width: 1px 0 0;
	}

	.wbbStats {
		left: 50%;
		margin-top: @wcfGapSmall;
		position: absolute;
		top: @wcfGapSmall;
		width: 15%;

		dl {
			dt {
				line-height: @wcfBaseLineHeight;
				width: 40%;
			}

			dd {
				font-weight: normal;
				font-size: @wcfSmallFontSize;
				width: 58%;
			}
		}
	}

	.wbbLastPost {
		left: 65%;
		position: absolute;
		top: @wcfGapSmall;
		width: 35%; /* = 100% - left */

		> div {
			background-color: @wcfContentBackgroundColor;
			padding: @wcfGapSmall;
			margin-right: @wcfGapSmall;

			.borderRadius();
			.boxShadowNative(~"inset 0 1px 1px rgba(0, 0, 0, .1)");
		}

		hgroup {
			h1 a {
				display: inline-block;
				overflow: hidden;
				text-overflow: ellipsis;
				width: 98%;
				white-space: nowrap;
			}

			h2 {
				font-size: @wcfSmallFontSize;

				time {
					color: @wcfDimmedColor;
				}
			}
		}
	}

	.wbbSubBoards {
		li {
			display: inline-block;
		}
	}

	.wbbBoardDescription {
		font-size: 90%;
	}

	.wbbBoardContainer {
		position: relative;
	}

	.wbbBoardNodeTop {
		margin-top: @wcfGapMedium;
	}

	.wbbBoard {
		min-height: 44px;
		padding: @wcfGapSmall;
		padding-right: 51%;

		.transition(background, .1s);

		&~ ul > .wbbBoardContainer > .wbbBoard {
			padding-left: 43px;

			&~ ul > .wbbBoardContainer > .wbbBoard {
				padding-left: 79px;
			}
		}

		&:hover {
			background-color: @wcfContainerHoverBackgroundColor;
		}
	}

	.wbbBoardNode1 {
		background-color: @wcfContainerBackgroundColor;
	}

	.wbbBoardNode2 {
		background-color: @wcfContainerAccentBackgroundColor;
	}

	.wbbBoardNodeTopEmpty div.wbbBoard {
		.borderRadius(@wcfContainerBorderRadius - 2);
	}

	.wbbBoard > div > hgroup > h1 {
		font-weight: normal;
	}

	.new > div > hgroup > h1, .wbbSubBoards li.new a {
		font-weight: bold;
	}

	.wbbCollapsibleCategory .collapsibleButton {
		display: inline-block;
		margin-right: 7px;
	}
}

/* ignored boards */
.wbbIgnoredBoards {
	.wbbCategory > hgroup label {
		color: @wcfPageLinkHoverColor;
	}

	.wbbBoardContainer {
		> div {
			padding: 7px;
		}

		> ul > .wbbBoardContainer {
			> div {
				padding-left: 28px;
			}

			> ul > .wbbBoardContainer > div {
				padding-left: 56px;
			}
		}
	}
}

/* ############## Thread List ############## */
.wbbThreadList {
	.wbbLastPost h2 {
		color: @wcfDimmedColor;
		font-size: @wcfSmallFontSize;
	}

	.columnLastPost {
		white-space: nowrap;
	}

	.columnAvatar {
		div {
			position: relative;
			width: 40px;
			height: 38px;

			> p > img {
				opacity: .6;

				.transition(opacity, .2s);
			}
		}

		.myAvatar {
			position: absolute;
			width: 16px;
			height: 16px;
			bottom: -2px;
			left: 24px;
			opacity: 1;

			.boxShadow(0, 0, rgba(0, 0, 0, .3), 3px);
		}
	}

	.columnTopic .labelList {
		float: right;
		padding-left: 7px;
	}

	.columnTopic .wbbTopicLink {
		font-size: @wcfTitleFontSize;
	}

	tr.new .columnTopic > h1 {
		font-weight: bold;
	}

	tr.new .columnAvatar div > p > img, tr:hover .columnAvatar div > p > img {
		opacity: 1;
	}
}

/* ############## Post List ############## */
.wbbThreadPostList {
	.wbbThreadStarter {
		position: relative;

		> .message {
			&:after,
			&:before {
				content: "";
				display: block;
				height: 128px;
				left: 0;
				position: absolute;
				top: 0;
				width: 128px;
			}

			&:after {
				background-image: url(../../icon/threadStarter1.svg);
				background-position: 4px 4px;
				background-repeat: no-repeat;
				background-size: 16px;
				height: 20px;
				width: 20px;
			}

			&:before {
				.borderRadius(@wcfContainerBorderRadius, 0, 0, 0);
				.linearGradientNative(~"left top, rgba(255, 255, 255, .85) 0%, rgba(255, 255, 255, 0) 40%");
			}
		}
	}

	.newMessageBadge {
		border: 1px solid @wcfLinkColor;
		border-radius: 2px;
		color: @wcfLinkColor;
		display: inline-block;
		font-weight: bold;
		font-size: @wcfSmallFontSize;
		left: -220px;
		top: 30px;
		padding: 6px 10px;
		position: absolute;
		text-transform: uppercase;

		.linearGradient(darken(@wcfContainerHoverBackgroundColor, 10%), @wcfContainerHoverBackgroundColor, darken(@wcfContainerHoverBackgroundColor, 10%));
		.textShadow(darken(@wcfContainerHoverBackgroundColor, 10%));
		.boxShadow(1px, 1px, rgba(0, 0, 0, .2), 3px);

		&:before {
			border-color: transparent @wcfLinkColor transparent transparent;
			border-width: 0px 7px 7px;
			border-style: solid;
			bottom: -7px;
			content: "";
			display: block;
			height: 0px;
			left: -8px;
			position: absolute;
			width: 0px;
		}
	}
}

/* Thread quick reply */
#threadQuickReply {
	.wbbThreadQuickReplyLoading {
		background-image: url(../icon/spinner1.svg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 64px;
	}

	.formSubmit {
		padding-bottom: @wcfGapMedium;
	}
}