.toolbar {
  /**
   * For IE 6/7 only
   * Include this rule to trigger hasLayout and contain floats.
   */
  *zoom: 1;
  background-color: #cccccc;
  padding: 0.6em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
    min-height: 41px;
  box-sizing: border-box; }
  .toolbar:before, .toolbar:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
  .toolbar:after {
    clear: both; }
  @media (min-width: 768px) {
    .toolbar {
      padding-right: 1em;
      padding-left: 1em; } }

.tools {
  position: relative;

  top: -2px; }

  .tools .tools-right {
      text-align: right;}
  @media (min-width: 768px) {
    .tools {
      float: left;
      width: 50%; }
      .tools .tools-right {
          text-align: right;
        float: right; }
      .tools li {
        display: inline;
        padding-right: 1.2em;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box; }
        .tools li:last-child {
          padding-right: 0; } }
  .tools a {
    color: #444444;
    font-weight: 700;
    text-transform: uppercase; }
    .tools a:hover {
      text-decoration: none;
      color: #0066cc; }

.middle {
  margin: 0 auto;
  width: 50%; }

.artist-detail-container .tools {
    float: none;
    width: auto;
}