#projects {
  #context-menu .dropdown-menu {
    min-width: inherit;
  }

  ul#projects-container {
    margin-top: $header-height;
    margin-bottom: $footer-height;
    float: left;
    width: 100%;
    height: 295px;
    overflow: auto;

    li.empty {
      margin: 15px;
      text-align: center;

    }

    li.project {
      @include user-select(none);

      padding: 5px 20px;
      border-bottom: 1px solid #EEE;
      position: relative;

      &.loading {
        &:hover {
          cursor: wait;
        }

        color: #ccc;

        h4 {
          color: #ccc;
        }

        small {
          color: #ccc;
        }
      }

      &.loaded:hover {
        cursor: pointer;
        background-color: #EEE;
      }

      h4 {
        margin-bottom: 0;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        color: #444;
      }

      small {
        color: #999;
        font-size: 90%;
        display: block;
        margin-top: 4px;
        @include text-overflow;
        margin-bottom: 7px;
      }

      i {
        font-size: 20px;
        position: absolute;
        right: 10px;
        top: 50%;
        margin-top: -13px;
      }
    }
  }
}

.add-project {

  .fa-stack-1x {
    font-size: 9px;
  }
}

.btn .add-project {
  position: relative;
  line-height: inherit;
  height: auto;

  .fa-stack-2x {
    font-size: 20px;
    position: relative;
    top: 1px;
  }

  .fa-stack-1x {
    position: relative;
    left: -32px;
    top: -3px;
    font-size: 7px;
  }
}

header {
  .add-project {
    position: relative;
    top: 3px;

    &:hover, &:active {
      cursor: pointer;
      i {
        color: #47484C;
      }
    }

    i  {
      color: #7A7B80;
    }

    .fa-stack-1x {
      font-size: 9px;
    }
  }
}

#project {
  height: 347px;
  overflow: auto;

  .well {
    margin: 20px 0;
  }
}


#project, #projects .error {
  text-align: center;
  padding-top: 10px;

  h3 {
    @include text-overflow;
  }

  .project-path {
    width: 90%;
    @include text-overflow;
    margin: 0 5% 10px;
  }

  a {
    padding-top: 5px;
    margin-top: 5px;
    border-top: 1px dashed #999;
    display: inline-block;
  }
}

#projects .error {
  padding-top: 25px;
}

#project, #projects {
  p.bg-danger {
    padding: 5px;
  }
}