<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="/css/style.css">

<!-- DETROIT FONT -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link id="css" href="https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap" rel="stylesheet"> 

<!-- NYC FONT -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Advent+Pro:wght@300&display=swap" rel="stylesheet">

<div class="main">
<div class="main-title">
    <a href="/cities"><p class="title"> <img class="car-art" src="https://www.clipartmax.com/png/full/0-6849_baby-cars-clipart-pink-car-clip-art-at-clker-com-vector-car.png"> EAST COAST BOOGIE <img class="airplane-art" src="https://cdn.pixabay.com/photo/2019/10/17/23/07/aircraft-4557973_1280.png"> </p></a>
    </div>
    
    <nav class="navbar">
        <ul>
            <li>
                <a href="/atl"><span class="atl">ATLANTA</span></a>
            </li>
            <li>
                <a href="/detroit"><span class="detroit">DETROIT</span></a>
            </li>
            <li>
                <a href="/nyc"><span class="nyc">NEW YORK CITY</span></a>
            </li>
            <li>
                <a href="/tampa"><span class="tpa">TAMPA</span></a>
            </li>
        </ul>
    </nav>
</div>
</body>
</html>
