.container-1 
  margin: 0 6rem
  @include phone
    margin: 0

.portfolio-data
  padding: 6%
  text-align: center
.name
  text-transform: uppercase
  margin: 0px 0px
  font-weight: 600
  font-size: 2rem

.bio-image
  text-align: center
  position: absolute
  left: 45%
  top: -20%
  @include tablet
    left: 35%
    top: -13%
  @include phone
    left: 25%
    top: -10%
  img
    border-radius: 50%
    width: 174px
    border: solid 1px

.bio-content
  text-align: left

  p
    font-weight: 600
    font-size: 14px

.bio-info-1
  margin-top: 8rem
  position: relative
  display: flex
  flex-direction: row
  padding: 50px
  padding-top: 8rem
  padding-bottom: 20px
  border: 1px solid
  border-radius: 20px
  @include tablet
    flex-direction: column
    margin-top: 30%
  @include phone
    flex-direction: column
    margin-top: 35%
    
.left-author
  padding-right: 20px
  width: 100vw
  @include tablet
    width: auto
  @include phone
    width: auto
  .pl-3
    padding-left: 2rem
    font-style: italic
    font-weight: 550
    margin-top: 4px
.right-author
  padding-top: 14px
  width: 60vw
  @include tablet
    width: auto
  @include phone
    width: auto
  h4
    font-size: 1.3rem
    font-weight: 500

.left-author-headers
  display: flex
  flex-direction: row

.vertical-line 
  border-left: 1px solid #DCDCDC
  padding: 0 13px
  height: 15rem
  margin-top: 1rem
  @include tablet
    display: none
  @include phone
    display: none

.card-custom-author
  flex-wrap: wrap
  gap: 3rem
  justify-content: center
  .card
    margin-top: 1rem
    padding-top: 1rem
  .card-title
    display: flex
    text-align: center !important
    margin-bottom: 1.25rem !important
    &:hover
      text-decoration: underline
  .card-img-top
    width: 14rem
    position: absolute
    border-radius: 0
    bottom: 80%
    left: 11%
  .card-body
    font-size: 14px

.article-header
  margin: 5rem 0 2rem