AWS-Static-Web-Page

I created a Static Web Page Using AWS Cloud Services <!DOCTYPE html>

<!--[if IE]> <![endif]--> My Static Website <!--REQUIRED STYLE SHEETS--> <!-- BOOTSTRAP CORE STYLE CSS --> <!-- FONTAWESOME STYLE CSS --> <!-- CUSTOM STYLE CSS --> <!-- GOOGLE FONT --> <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> <!--[if lt IE 9]> <![endif]-->

<!--Header section -->

Static Website

Created By Shubhangam Jha

<!--End Header section -->

<!-- Navigation -->
<nav class="navbar-inverse" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="https://aws.amazon.com/partners/">APN Network </a>
        </div>
        <!-- Collect the nav links for toggling -->
        <div class="collapse navbar-collapse navbar-ex1-collapse">
            <ul class="nav navbar-nav">
                <li><a href="#home"><i class="fas fa-home"></i></a>
                </li>
                <li><a href="#about">About</a>
                </li>
                <li><a href="#work-sec">Transformation</a>
                </li>
                <li><a href="#contact-sec">Contact</a>
                </li>
                <li><a href="#map-sec">Location</a>
                </li>
            </ul>
        </div>
        <!-- /.navbar-collapse -->
    </div>
    <!-- /.container -->
</nav>
<!--End Navigation -->

<!--About Section-->
<section class="color-white " id="about">
    <div class="container">
        <div class="row text-center">
            <div class="col-md-8 col-md-offset-2 ">
                <h2 style="padding-top:50px;">About Us</h2>
                <h4>
                    <strong>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    </strong>
                </h4>
            </div>
        </div>
    </div>
</section>

<section class=" color-light">
    <div class="container">
        <div class="row text-center">
            <div class="col-md-12">
                <h2> Our exclusive services</h2>
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                </p>
            </div>
        </div>
    </div>
</section>
<!--End About Section-->

<!-- Transformation Section -->
<section class="color-white " id="work-sec">
    <div class="container">
        <div class="row text-center">
            <div class="col-md-8 col-md-offset-2 ">
                <h2>Transformation</h2>
                <h4>
                    <strong>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    </strong>
                </h4>
            </div>
        </div>

        <div class="row text-center g-pad-bottom">
            <div class="col-md-4">
                <div class="work-div">
                    <i class="fas fa-box-open fa-5x"></i>
                    <h3>Package </h3>
                </div>
            </div>

            <div class="col-md-4 ">
                <div class="work-div">
                    <i class="fas fa-arrows-alt-h fa-5x"></i>
                </div>
            </div>

            <div class="col-md-4 ">
                <div class="work-div">
                    <i class="fas fa-cloud fa-5x"></i>
                    <h3>The Cloud</h3>
                </div>
            </div>

        </div>
    </div>
</section>
<!--End Transformation Section -->
<!-- Contact Section -->
<section class="color-light " id="contact-sec">
    <div class="container">
        <div class="row text-center">
            <div class="col-md-8 col-md-offset-2 ">
                <h2>Locate Us here</h2>
                <h4>
                    <strong>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Curabitur nec nisl odio. Mauris vehicula at nunc id posuere.
                    </strong>
                </h4>
            </div>
        </div>

        <div class="row">
            <div class="col-md-5 contact-cls">
                <h3>Our Address</h3>
                <div>
                    <span><i class="fa fa-home"> </i> Address: 123/56, Your City, USA </span>
                    <br />
                    <span><i class="fa fa-phone"> </i> Phone: 82-230-555-8899</span>
                </div>

            </div>
            <div class="col-md-7">
                <br />
                <div id="social-icon">
                    <a href="#"><i class="fab fa-facebook fa-2x"></i></a>
                    <a href="#"><i class="fab fa-twitter fa-2x"></i></a>
                    <a href="#"><i class="fab fa-linkedin fa-2x"></i></a>
                    <a href="#"><i class="fab fa-google-plus fa-2x"></i></a>
                    <a href="#"><i class="fab fa-pinterest fa-2x"></i></a>
                </div>
            </div>
        </div>
    </div>
</section>
<!--End Contact Section -->

<!--Map Section -->
<section class="color-light " id="map-sec">
    <iframe class="cnt" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2999841.293321206!2d-75.80920404999999!3d42.75594204999997!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4ccc4bf0f123a5a9%3A0xddcfc6c1de189567!2sNew+York!5e0!3m2!1sen!2s!4v1395313088825"></iframe>
</section>
<!--End Map Section -->
<!--footer Section -->
<div class="for-full-back " id="footer">
    CSS Template from <a href="https://www.free-css.com/free-css-templates/page203/image-less">Free CSS</a>
</div>
<!--End footer Section -->
<!-- JAVASCRIPT FILES PLACED AT THE BOTTOM TO REDUCE THE LOADING TIME  -->
<!-- CORE JQUERY  -->
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<!-- BOOTSTRAP CORE SCRIPT   -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<!-- CUSTOM SCRIPTS -->
<script src="script.js"></script>

Share this project:

Updates