index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>MapBox Choropleth Map - US Population Density By State</title>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <script src="https://api.tiles.mapbox.com/mapbox-gl-js/v2.14.1/mapbox-gl.js"></script>
        <link href="https://api.tiles.mapbox.com/mapbox-gl-js/v2.14.1/mapbox-gl.css" rel="stylesheet" />
        <link href="css/styles.css" rel="stylesheet" />
    </head>

    <body>
        <div id="map"></div>
        <div class="map-overlay" id="features">
        <h2>US population density</h2>
        <div id="pd"><p>Hover over a state!</p></div>
        </div>
        <div class="map-overlay" id="legend"></div>
    
        <script src="scripts/mapScript.js"></script>
    </body>
</html>