.bio {
  @include flexbox();
  @include justify-content(center);
  @include align-items(flex-start);
  @include flex-direction(column);
  @include animation('slide-in-down .5s .2s 1 ease both');

  width: 100%;
  font-family: $title-font;

  &__photo {
    border-radius: 0.25rem;
    width: 100%;
    height: auto;
    @include box-shadow(0, 2px, 4px, 0, rgba(0, 0, 0, 0.25));

    &-wrapper {
      width: 90%;
      height: 100%;
      border-radius: 0.25rem;  
      margin: 1rem auto;
      @include flexbox();
      @include align-items(center);
      @include justify-content(center);
    }
  }

  &__name {
    font-weight: 700;
    letter-spacing: 1px;
    font-family: inherit;
    font-size: 26px;
    margin-top: 0.8rem;
  }

  &__desc {
    margin: 0.5rem 0;
    font-size: 14px;
  }

  &__info {
    font-size: 14px;
    margin: 0.1rem 0;
    @include flexbox();
    @include align-items(center);
    @include justify-content(center);

    &--icon {
      margin-right: 0.25rem;
      @include flexbox();
      @include align-items(center);
      @include themify($themes) {
        color: themed('social-icon-color');
      }      
    }

    a {
      padding-right: 1rem;
      @include truncate(calcSideWidth());
    }
  }

  &__social {
    width: 100%;
    margin-top: 0.5rem;
    
    @include flexbox();
    a {      
      text-decoration: none !important;
      width: 100%;
      padding: 0.5rem;
      border-radius: 0.125rem;
      
      @include flexbox();    
      @include align-items(center);
      @include justify-content(space-around);
      @include themify($themes) {
        color: themed('social-icon-color');
        @include on-event {
          color: themed('social-icon-hover-color');
        }
      }
    }
  }

  &-hr {
    border-radius: 0.5rem;
  }
}