<?php require 'inc/_global/config.php'; ?>
<?php require 'inc/backend/config.php'; ?>
<?php require 'inc/_global/views/head_start.php'; ?>
<?php require 'inc/_global/views/head_end.php'; ?>
<?php require 'inc/_global/views/page_start.php'; ?>

<!-- Hero Content -->
<div class="bg-image" style="background-image: url('<?php echo $one->assets_folder; ?>/media/photos/photo25@2x.jpg');">
    <div class="bg-black-50">
        <div class="content content-full overflow-hidden">
            <div class="mt-7 mb-5 text-center">
                <h1 class="h2 text-white mb-2 invisible" data-toggle="appear" data-class="animated fadeInDown">Learn new creative skills today.</h1>
                <h2 class="h4 font-w400 text-white-75 invisible" data-toggle="appear" data-class="animated fadeInDown">Join our community and get access to over 10.000 online courses.</h2>
                <a class="btn btn-rounded btn-success px-4 py-2 invisible" data-toggle="appear" data-class="animated zoomIn" href="javascript:void(0)">Subscribe from $9/month</a>
            </div>
        </div>
    </div>
</div>
<!-- END Hero Content -->

<!-- Page Content -->
<div class="content content-boxed">
    <div class="row row-deck py-4">
        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-city">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="fab fa-html5 fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>10 lessons</em> &bull; <em>3 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Learn HTML5 in 10 simple and easy to follow steps</h4>
                    <div class="font-size-sm text-muted">November 5, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-flat">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="fab fa-css3 fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>12 lessons</em> &bull; <em>5 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Be a pro with CSS3 in only two weeks</h4>
                    <div class="font-size-sm text-muted">November 1, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-amethyst">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-vector fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>4 lessons</em> &bull; <em>2 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Using SVG is easier than ever</h4>
                    <div class="font-size-sm text-muted">October 27, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-smooth">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-rocket fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>18 lessons</em> &bull; <em>25 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Build a modern web application from scratch</h4>
                    <div class="font-size-sm text-muted">October 25, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-default">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <span class="font-size-lg font-w700 text-white-75">PS</span>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>5 lessons</em> &bull; <em>19 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">UI Design in Photoshop: Tips  &amp; Tricks</h4>
                    <div class="font-size-sm text-muted">October 10, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-modern">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-user-following fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>9 lessons</em> &bull; <em>10 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Marketing 101: All the basics</h4>
                    <div class="font-size-sm text-muted">October 1, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-warning">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-target fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>5 lessons</em> &bull; <em>8 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">How to make your page convert in 5 steps</h4>
                    <div class="font-size-sm text-muted">September 19, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-success">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-support fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>21 lessons</em> &bull; <em>29 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">How to provide rock star support</h4>
                    <div class="font-size-sm text-muted">September 15, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-info">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-social-twitter fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>7 lessons</em> &bull; <em>6 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Social marketing the right way</h4>
                    <div class="font-size-sm text-muted">September 7, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-danger">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-briefcase fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>5 lessons</em> &bull; <em>4 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Project management in 5 simple steps</h4>
                    <div class="font-size-sm text-muted">August 28, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-gray-dark">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-camcorder fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>7 lessons</em> &bull; <em>9 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Learn how to create better screencasts</h4>
                    <div class="font-size-sm text-muted">August 19, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->

        <!-- Course -->
        <div class="col-md-6 col-lg-4 col-xl-3">
            <a class="block block-rounded block-link-pop" href="be_pages_elearning_course.php">
                <div class="block-content block-content-full text-center bg-primary">
                    <div class="item item-2x item-circle bg-white-10 py-3 my-3 mx-auto invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                        <i class="si si-chemistry fa-2x text-white-75"></i>
                    </div>
                    <div class="font-size-sm text-white-75">
                        <em>12 lessons</em> &bull; <em>7 hours</em>
                    </div>
                </div>
                <div class="block-content block-content-full">
                    <h4 class="mb-1">Learn how to create jQuery plugins</h4>
                    <div class="font-size-sm text-muted">August 5, 2015</div>
                </div>
            </a>
        </div>
        <!-- END Course -->
    </div>
</div>
<!-- END Page Content -->

<!-- Instructors -->
<div class="bg-image" style="background-image: url('<?php echo $one->assets_folder; ?>/media/photos/photo27@2x.jpg');">
    <div class="bg-primary-dark-op py-5">
        <div class="content content-full content-boxed text-center">
            <h2 class="font-w400 text-white mb-2 invisible" data-toggle="appear" data-offset="50" data-class="animated fadeInDown">Learn from the best instructors worldwide.</h2>
            <h3 class="h4 font-w400 text-white-75 invisible" data-toggle="appear" data-timeout="300" data-class="animated fadeInDown">Improve your skills and find the perfect job the right way.</h3>
            <div class="row items-push mt-5">
                <div class="col-md-4 invisible" data-toggle="appear" data-offset="-150" data-timeout="150" data-class="animated fadeInRight">
                    <?php $one->get_avatar(0, 'female', 64, true); ?>
                    <div class="font-size-lg text-white mt-3"><?php $one->get_name('female'); ?></div>
                    <div class="font-size-sm text-white-50">Web Designer</div>
                </div>
                <div class="col-md-4 invisible" data-toggle="appear" data-offset="-150" data-class="animated zoomIn">
                    <?php $one->get_avatar(0, 'male', 64, true); ?>
                    <div class="font-size-lg text-white mt-3"><?php $one->get_name('male'); ?></div>
                    <div class="font-size-sm text-white-50">Web Developer</div>
                </div>
                <div class="col-md-4 invisible" data-toggle="appear" data-offset="-150" data-timeout="150" data-class="animated fadeInLeft">
                    <?php $one->get_avatar(0, 'female', 64, true); ?>
                    <div class="font-size-lg text-white mt-3"><?php $one->get_name('female'); ?></div>
                    <div class="font-size-sm text-white-50">Photographer</div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- END Instructors -->

<!-- Get Started -->
<div class="bg-body-dark">
    <div class="content content-full">
        <div class="my-5 text-center">
            <h3 class="h4 mb-4 invisible" data-toggle="appear">Are you ready to get started? Join today.</h3>
            <a class="btn btn-rounded btn-success px-4 py-2 invisible" data-toggle="appear" data-class="animated bounceIn" href="javascript:void(0)">Subscribe from $9/month</a>
        </div>
    </div>
</div>
<!-- END Get Started -->

<?php require 'inc/_global/views/page_end.php'; ?>
<?php require 'inc/_global/views/footer_start.php'; ?>
<?php require 'inc/_global/views/footer_end.php'; ?>
