{{ $sidebar := .Site.Data.sidebar }}
{{ $social := .Site.Data.social }}
<section id="sidebar" class="sidebar d-flex align-items-center p-5">
  <div class="main-info">

    <img src="{{.Site.BaseURL}}images/{{ $sidebar.displayPicture }}" class="rounded-circle mb-3" width="160px">

    <h1 class="heading">{{ $sidebar.title }} <span class="highlight">{{ $sidebar.highlightedText }}</span></h1>
    <p class="text-muted">{{ $sidebar.description }}</p>

    <div class="social my-4">

      {{ range $key, $value := $social }}
        <a target="_blank" href="{{ $value }}" rel="me">
          <i class="fab fa-{{ $key }}"></i>
        </a>
      {{ end }}
      
    </div>
    
    <a href="#contact" class="btn btn-dark btn-lg">Contact</a>

    
  </div>
</section>