    <!-- Header -->  <!-- THIS IS THE ANIMATION SECTION -->
    <header class="page__hero--overlay" id="particles-js" style="z-index: -1;">
        <div class="container" id="site-nav" style="height:0px;">
            <div class="row" style="position: relative; top: 40vh; transform: translateY(-50%); background-color: rgba(0, 0, 0, .5); padding: 2em 1em 2em 1em; width: 80%; margin: 0 auto;">
            	<div>
                	<div class="unselectable" style="font-size: 5em; color: #FFD800;"> Insights From Data </div>
                	<div class="unselectable" style="font-size: 3em; color: #FFD800;"> Personal Development Playground </div>
                </div>
            </div>
        </div>

        <div>
            <a id="go-down-icon"><img class="go-down-icon" src="/img/scroll1.png"></a>
        </div>
    </header>
    <!-- Header -->  <!-- THIS IS THE ANIMATION SECTION -->
    <header class="page__hero--overlay" id="particles-js" style="z-index: -1;">
        <div class="container" id="site-nav" style="height:0px;">
            <div class="row" style="position: relative; top: 40vh; transform: translateY(-50%); background-color: rgba(0, 0, 0, .5); padding: 2em 1em 2em 1em; width: 80%; margin: 0 auto;">
            	<div>
                	<div class="unselectable" style="font-size: 5em; color: #FFD800;"> Insights From Data </div>
                	<div class="unselectable" style="font-size: 3em; color: #FFD800;"> Personal Development Playground </div>
                </div>
            </div>
        </div>

        <div>
            <a id="go-down-icon" href="#about"><img class="go-down-icon" src="/img/scroll1.png"></a>
        </div>
    </header>
Add link to about for scroll icon
Add link to about for scroll icon
