.sidebar { //general styles for the sidebar

  h1 {
    text-align: left;
    color: @white;
    line-height: 60px;
    margin-bottom: 20px;
  }

  .button {
    font-size: 15px;
    color: @dark-blue-text;
    letter-spacing: 3px;

    &.big-text {
      font-size: 25px;
    }
  }

  .toggle {
    font-size: 20px;
    .museo-sans-light;
    color: @white;
    margin-left: 20px;
    padding: 20px 0;

    a {
      display: block;
      color: @white;

      &:hover {
        color: @white;
      }
    }

    .open-close {
      background: url(/images/open_close.png) no-repeat 0 0;
      height: 20px;
      width: 20px;
      position: absolute;
      right: 0;
      top: 25px;
    }

  }

  .sidebar-nav {
    //position:fixed;
  }

  ul {

    li {
      font-size: 20px;
      .museo-sans-light;

      a {
        display: block;
      }

      &:hover {
      }
    }

    ul.sub {
      border-top: none;
      list-style-type: none;
      margin:0 0 5px 0;

      li {
        padding: 5px 0 5px 20px;
        font-size: 15px;
        border: none;
        border-bottom: none !important;
      }
    }

  }


  .inner & {
    .padded;
    position:fixed;

    li.current a {
      color: @purple;
    }

    ul {


      li {
        color: @dark-blue-text;
        padding: 20px 0;
        border-top: 1px solid fade(@white, 40%);

        &:last-child {
          border-bottom: 1px solid fade(@white, 40%);
        }

        &.current {

        }
      }
    }
  }

  .docs & {

    li.current a {
      color: @blue;
    }

    ul {
      margin-top: 60px;

      li {
        text-transform: capitalize;
        color: @white;
        padding: 12px 0;
        border-top: 1px solid fade(@white, 20%);

        &:first-child {
          border-top: none;
        }

        &:last-child {
          border-bottom: 1px solid fade(@white, 20%);
        }

        &.current {

        }
      }
    }
  }
}