@import "../_style/app.theme";
@import "../_components/user-avatar/user-avatar.component";

.content {
  text-align: center;
  padding-top: 0;
  background-color: #F9F9F9;
  .thanks {
    font-size:1.3rem;
    font-weight:bold;
    color:#4B4B4C;
    line-height: 2.2rem;
    padding-top: 1.5rem;
    font-family: $main-font;
    h2 {
      color: $secondary-bg-color;
      font-weight: bold;
      margin-top: 5px;
      //font-family: $main-font;
    }
  }
  .users {
    margin-top: 2rem;
    margin-bottom: 2rem;
    .user {
      border: .5px #ccc solid;
      padding: 1rem 1rem 1.5rem;
      .avatar {
        
         width: 100px;
         height: 100px;
        border-radius: 50%;
        border: 1px #ccc solid;
      }
      .avatar-circle  {
         margin: 0 auto 0.47rem;
      }
      .fullname {
        font-size: 1.5rem;
        color: $secondary-bg-color;
        text-transform: uppercase;
        font-weight: 600;
      }
      .hide{
        display: none;
      }
      .title {
        font-size: 1.2rem;
        font-weight: 100;
        font-family: 'Myriad Pro';
      }
      .label {
        float: left;
        font-weight: bold;
      }
      .label-content {
        float: right;
        text-align:right;
      }
      .location {
        font-size: 1rem;
        text-align: right;
        border-top: .5px #ccc solid;
        border-bottom: .5px #ccc solid;
        padding-top: .5rem;
        padding-bottom: .5rem;
        margin-top: 1rem;
      }
      .badges {
        padding-top: .5rem;
        padding-bottom: .5rem;
        border-bottom: .5px #ccc solid;
        i.material-icons {
          font-size: 20px;
        }
        .name:hover {
          text-decoration-line: underline;
          text-decoration-color: #84c44c;
        }
        a:hover + div#projects {
          display: block;
        }
        #projects {
          display: none;
        }

      }
      .skills-tag-wrapper {
        padding: 5px;
        margin-top: 1rem;
        .chip {
          background: lighten($secondary-bg-color, 20%);
          border-radius: 2px;
          padding: 2px 5px;
        }
      }
    }
  }
}
