packages.html

<!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="/style.css">
    <link rel="stylesheet" href="index.html">
    <link rel="stylesheet" href="gallery.html">
    <link rel="stylesheet" href="contact.html">
    <!-- font awesome link -->
    <script src="https://kit.fontawesome.com/c59c349346.js" crossorigin="anonymous"></script>
    <title>MiaDi Photography</title>
</head>
<body>

    <!-- header -->
    <header class="parallax">
        <!-- nav bar -->
        <div class="nav-section">
            <div class="brand-and-navBtn">
                <span class="brand-name" id="cursive">
                    Mia Di Photography
                </span>
                <span class="navBtn flex">
                    <i class="fa fa-bars"></i>
                </span>
            </div>
            <nav class="top-nav">
                <ul>
                    <li><a href="index.html">Home</a></li>
                    <li><a href="gallery.html">Gallery</a></li>
                    <li><a href="packages.html" class="active">Packages</a></li>
                    <li><a href="contact.html">Contact</a></li>
                </ul>
            </nav>
        </div>

        <!-- large photo section -->
        <div class="about container">

            <div class="about-content">
                    <div class="about-img flex">
                        <img src="/images/logo.jpg" alt="img">
                    </div>
                        <h3 id="cursive">Ohio Photographer & Videographer</h3>
                        <blockquote>Weddings | Couples | Families | Maternity <br>
                        </blockquote>
                <div class="social-icons">
                    <ul>
                        <li>
                            <a href="https://www.instagram.com/mia.di.photography/"><i class="fab fa-instagram"></i></a>
                        </li>
                        <li>
                            <a href="https://www.facebook.com/miadiphotography/"><i class="fab fa-facebook"></i></a>
                        </li>
                </ul>
                </div>
            </div>

    </div>
    </header>
    <!-- end of header -->

    <!-- main -->

    <!--******************************************* packages section *******************************************-->

    <section class="packages-section">

        <!-- <h1 class="title" id="cursive">My Packages</h1>
        <hr> -->
        
        <div class="holdingcontainer1">

            <div class="internalcontainer">
                <img src="images/package2.jpg" alt="" class="dasimages" width="100%">
                <div class="container-text">
                    <h1 id="cursive" class="package-name">couples/engagements</h1>
                    <h5>
                        <span>$250</span><br>
                        1 HOUR SESSION <br>
                        50+ FULLY EDITED IMAGES <br>
                        2 OUTFITS <br>
                    </h5>
                </div>
            </div>

            <div class="internalcontainer">
                <img src="images/package3.jpg" alt="" class="dasimages" width="100%">
                <div class="container-text">
                    <h1 id="cursive" class="package-name">boudoir</h1>
                    <h5>
                        <span>$350+</span><br>
                        CUSTOMIZABLE <br>
                        1+ HOUR SESSION <br>
                        STUDIO OPTION <br>
                        CLIENT CLOSET <br>
                        50+ FULLY EDITED IMAGES
                    </h5>
                </div>
            </div>

            <div class="internalcontainer">
                <img src="images/package1.jpg" alt="" class="dasimages" width="100%">
                <div class="container-text">
                    <h1 id="cursive" class="package-name">family/maternity</h1>
                    <h5>
                        <span>$250</span><br>
                        1 HOUR SESSION <br>
                        50+ FULLY EDITED IMAGES <br>
                        2 OUTFITS <br>
                    </h5>
                </div>
            </div>

        </div>
        
        <!-- wedding packages -->

        <h1 class="title" id="cursive">Wedding Packages</h1>
        <hr>

        <div class="holdingcontainer2">

            <div class="internalcontainer">
                <img src="images/package4.jpg" alt="" class="dasimages" width="100%">
                <div class="container-text">
                    <h1 id="cursive" class="package-name">silver</h1>
                    <h5>
                        <span>$1,200</span><br>
                        5 HOURS OF COVERAGE <br>
                        1 PHOTOGRAPHERS <br>
                        100+ FULLY EDITED IMAGES <br>
                    </h5>
                </div>
            </div>

            <div class="internalcontainer">
                <img src="images/package6.jpg" alt="" class="dasimages" width="100%">
                <div class="container-text">
                <h1 id="cursive" class="package-name">gold</h1>
                <h5>
                    <span>$2,000</span><br>
                   8 HOURS OF COVERAGE<br>
                    2 PHOTOGRAPHERS <br>
                    200+ FULLY EDITED IMAGES <br>
                    ENGAGEMENT SESSION
                <h5>
                </div>
            </div>

            <div class="internalcontainer">
                <img src="images/package5.jpg" alt="" class="dasimages" width="100%">
                <div class="container-text">
                    <h1 id="cursive" class="package-name">diamond</h1>
                    <h5>
                        <span>$3200</span><br>
                        12 HOURS OF COVERAGE <br>
                        2 PHOTOGRAPHERS <br>
                        350+ FULLY EDITED IMAGES <br>
                        ENGAGEMENT SESSION
                    </h5>
                </div>
            </div>

            <div class="internalcontainer">
                <img src="images/package7.jpg" alt="" class="dasimages" width="100%">
                <div class="container-text">
                    <h1 id="cursive" class="package-name">elopement</h1>
                    <h5>
                        <span>$5,000+</span><br>
                        12 HOURS OF COVERAGE <br>
                        350+ FULLY EDITED IMAGES <br>
                        ENGAGEMENT SESSION<br>
                        CUSTOMIZABLE
                    </h5>
                </div>
            </div>
        </div>
        
        <div>
            <p id="cursive" class="ala-carte">*a la carte options available for all wedding packages</p>
        </div>


    </section>

    <!-- end of main -->

      <!-- footer -->
      <footer class="footer">
        <div class="footer-container container">
            <div>
                <h2 id="cursive">Mia Di Photography <br>
                    <img class="footer-img" src="images//logo.jpg" alt="">
                </h2>
            </div>
            <div>
                <div class="contacts-foot">
                    <p>
                        LGBTQ-friendly | BIPOC Inclusive | All skin colors & body sizes are welcomed <br>
                        Mia Di Photography | Wedding + Couples + Family + Maternity <br>
                        Massillon, OH + Worldwide
                </p>
                </div>                
            </div>
        </div>
        <p>&copy;2021 Mia Di Photography | All Rights Reserved</p>
    </footer>
    <!-- end of footer -->


    
    <script src="app.js"></script>
</body>
</html>