<!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">
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/main.css">
    <link rel="stylesheet" href="/css/home.css">
    <title>noirUSA</title>
</head>
<body class="d-flex text-center text-white bg-dark">
    <div class="cover-container d-flex w-100 h-100 p-3 mx-auto flex-column">
        <header class="mb-auto">
            <div>
                <h3 class="float-md-left mb-0">noir<span class="purple">//</span>USA</h3>
                <nav class="nav nav-masthead justify-content-center float-md-right">
                    <a class="nav-link active" aria-current="page" href="#">Home</a>
                    <a class="nav-link" href="/products">Products</a>
                    <a class="nav-link" href="/about">About</a>
                    <a class="nav-link" href="/apply">Apply</a>
                </nav>
            </div>
        </header>
        <main class="px-3">
            <div id="heading-group" class="text-white text-center d-none d-lg-block mt-5">
                <p class="h1">noir<span class="purple">//</span>USA</p>
            </div>
            <p class="lead"> Welcome to noirUSA! <br> Jump right in and explore our many products and opportunities. <br></p>
            <a href="/products" class="btn btn-lg btn-secondary font-weight-bold text-white">View
                Products</a>
        </main>

        <footer class="mt-auto text-white-50">
            <p>&copy; noirUSA 2020 </p>
        </footer>

    </div>
    
    <script src="/js/bootstrap.bundle.min.js"></script>
    <script src="/js/validateForm.js"></script>
</body>
</html>