<div class="row row-cols-1 row-cols-md-3">
    <div class="col col-md-3">
        <div class="row row-cols-1 g-0 content" id="nav">
            <img src="/assets/images/me-square.jpg" class="me" style="height: 40px;width: 40px; border-radius: 20px;border: 2px solid white;"><br>
            <b>andrew conlin</b><br>
            software engineer @ MathWorks<br>
            &nbsp;<br>
            {% for item in site.data.nav %}
            <div class="col">
                <h4 style="font-family: Geist Bold;">
                    <a href="{{ item.link }}" class="text-decoration-none" style="color: white;">
                        <img src="/assets/images/{{ item.icon }}.ico" style="height:30px;width:30px;display: inline;">&nbsp;{{ item.name }}
                    </a>
                </h4>
            </div>
            {% endfor %}
            &nbsp;<br>
            <!--<div class="col gy-2" style="font-family: Arial, Helvetica, sans-serif;">
                <h4>
                    <div>
                        <span>
                            {% for item in site.data.icons %}
                            {% if item.icon != "letterboxd" %}
                            <a rel="me" href="{{ item.link }}" target="_blank"><i class="{{ item.icon }}" style="color: white;"></i></a>
                            {% else %}
                            <a href="{{ item.link }}" target="_blank"><img class="letterboxd" src="/assets/images/letterboxd.png"></a>
                            {% endif %}
                            {% endfor %}
                        </span>
                    </div>
                </h4>
            </div>-->
            <hr class="menu">
        </div>
    </div>
    <!--
    <h1 class="display-3 logo" style="font-weight:700;" id="logo">
        <span style="color:black;background-color:gold;">ac</span>
    </h1>
    -->