.toolbar {
  margin:0;
  padding-top:0;
  padding-right:10px;
  top:0;
  right:0;
  left:@leftPaneWidth;
  height:@toolbarHeight;
  overflow: visible;
  position:absolute;
  background-color:@toolbarBackground;
  border: none !important;

  * {
    outline:none;
  }

  .group{
    padding-right:20px;
    display: inline-block;
    vertical-align: top;

    .image-button{
      display: inline-block;
      img{
        margin: 5px;
        margin-bottom:0;
        padding: 0;
        width: @toolbarHeight - 20;
        height: @toolbarHeight - 20;
        position: relative;
        display: inline-block;
        text-align: center;
        color:#777;
        font-size:45px;
        transition: all 0.5s;
      }
      div{
        color:@toolbarButtonFontColor;
        text-align: center;
        font-size: 10px;
        &.highlight{
          animation: highlight 3s infinite;
        }
      }
      &.disabled{
        opacity:0.2;
      }
      &:not(.disabled){
        img, svg {
          cursor:pointer;
          &:hover{
            box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
          }
        }
      }
    }
  }
}


@keyframes highlight {
  0%   { color: @tintColor  }
  50%  { color: rgba(0,0,0,0.4) }
  100% { color: @tintColor  }
}
