<% layout('layouts/boilerplate') %>
<section class="container-fluid top-section">
    <div class="row align-items-center">
        <div class="col-lg-6">
            <div id="heading-group" class="text-white text-center d-none d-lg-block mt-5">
                <% for(let i=0; i < 3; i++) {%> 
                <p class="h1">noir<span class="purple">//</span>USA</p>
                <% } %> 
            </div>
        </div>
        <div class="col-lg-6">
            <img src="/img/love.jpg" class="main-img" alt="Hand holding a donut" />
        </div>
    </div>
</section>

<section class="container-fluid">
    <div class="row align-items-center content">
        <div class="col-md-6 order-2 order-md-1">
            <img src="/img/blabbit.png" class="main-img" alt="blabbit preview image">
        </div>
        <div class="col-md-6 text-center order-1 order-md-2">
            <div class="row justify-content-center">
                <div class="col-10  col-lg-8 blurb">
                    <h2 >blabbit</h2>
                    <hr />
                    <img src="/img/speaking.png" class="d-none d-lg-inline preview-icon" alt="speaking icon">
                    <p class="lead">
                        Quite possibly the most radical social app ever invented! Remember Mr. Apology? We've brought the concept to the 21st century. Post anything you want and rest assured with our AES256-GCM ultra encryption technology that whatever you blab will never be known. So long guilty conscience! <br>
                        <a href="#" class="btn btn-lg btn-secondary font-weight-bold text-white">Check it out!</a>
                    </p>
                </div>
            </div>
        </div>
    </div>

    <div class="row align-items-center content">
        <div class="col-md-6 text-center">
            <div class="row justify-content-center">
                <div class="col-10  col-lg-8 blurb mb-5 mb-md-0">
                    <h2 >Xtreme Super Shoppe</h2>
                    <hr />
                    <img src="/img/online-shopping.png" class="d-none d-lg-inline preview-icon" alt="online shopping icon">
                    <p class="lead">
                        Tired of supporting the cooperate overlords? Do you want to support local businesses selling xtreme super awesome stuff? Come on over to the Xtreme Super Shoppe. Purchase your favorite products at deeply discounted prices, leave reviews and more! <br>
                        <a href="#" class="btn btn-lg btn-secondary font-weight-bold text-white">Check it out!</a>
                    </p>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <img src="img/shoppe.png" class="main-img" alt="shop preview image">
        </div>
    </div>

    <div class="row align-items-center content">
        <div class="col-md-6">
            <img src="/img/dvna.png" class="main-img" alt="Glass of sprinles">
        </div>
        <div class="col-md-6 text-center">
            <div class="row justify-content-center">
                <div class="col-10  col-lg-8 blurb mb-5 mb-md-0">
                    <h2>Damn Vulnerable Node App</h2>
                    <hr />
                    <img src="/img/hacker.png" class="d-none d-lg-inline preview-icon" alt="hacker icon">
                    <p class="lead">
                        IT Helpdesk got you down? Do you think you have what it takes to be a NoirUSA penetration tester? Come check out our proving grounds! Here you will go from zero to hero in weeks. Start your journey to becoming high speed, low drag today and possibly a penny tester here at NoirUSA! <br>
                        <a href="#" class="btn btn-lg btn-secondary font-weight-bold text-white">Check it out!</a>
                    </p>
                </div>
            </div>
        </div>
    </div>
</section>