team.html

<!DOCTYPE html>
<html lang="es">
<head>
    <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700%7CMerriweather:400,300%7CRaleway:800,600,500,400,300%7CLibre+Baskerville:400,400italic%7CMontserrat%7CRoboto:300%7COpen+Sans:300' rel='stylesheet' type='text/css'>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>EPIC - HTML Template</title>
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <meta name="robots" content="index, follow" />
    <link rel="stylesheet" href="css/bootstrap.min.css" />
    <link rel="stylesheet" href="css/font-awesome.min.css" />
    <link rel="stylesheet" href="css/isotope.css" />
    <link rel="stylesheet" href="css/epic.css" />
    <link href="js/owl-carousel/owl.carousel.css" rel="stylesheet">
    <link href="js/owl-carousel/owl.theme.css" rel="stylesheet">
    <link href="js/owl-carousel/owl.transitions.css" rel="stylesheet">
    <link href="css/YTPlayer.css" rel="stylesheet">
   
    <!--[if lt IE 9]>
        <script src="./js/html5shiv.js"></script>
        <script src="./js/respond.js"></script>
    <![endif]-->
</head>
<body>
    <div id="ip-container" class="single ip-container">
        <header class="ip-header">
            <div class="ip-logo">
                <img src="images/logointro01.png" alt=""/>
            </div>
            <div class="ip-loader">
                <svg class="ip-inner" width="60px" height="60px" viewBox="0 0 80 80">
                    <path class="ip-loader-circlebg" d="M40,10C57.351,10,71,23.649,71,40.5S57.351,71,40.5,71 S10,57.351,10,40.5S23.649,10,40.5,10z"/>
                    <path id="ip-loader-circle" class="ip-loader-circle" d="M40,10C57.351,10,71,23.649,71,40.5S57.351,71,40.5,71 S10,57.351,10,40.5S23.649,10,40.5,10z"/>
                </svg>
            </div>
        </header>
        <header id="header" class="fixed overflow">
            <div class="jt_row container">
                <div class="navbar-header page-scroll">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
                    <i class="fa fa-bars"></i>
                    </button>
                    <a class="navbar-brand normal" href="#home"><img src="images/logo.png" alt="EPIC Theme"/></a>
                    <a class="navbar-brand mini" href="#home"><img src="images/epic_mini.png" alt="EPIC Theme"/></a>
<a class="navbar-brand mini darker" href="#home"><img src="images/logo-dark.png" alt="EPIC Theme"/></a>
                </div>
                <nav class="collapse navbar-collapse navbar-right navbar-main-collapse">
                    <ul id="nav" class="nav navbar-nav navigation">
                        <li class="page-scroll menu-item"><a href="index-multipage.html">Home</a></li>
                        <li class="page-scroll menu-item"><a href="about.html">About</a></li>
                        <li class="page-scroll menu-item"><a href="services.html">Services</a></li>
                        <li class="page-scroll menu-item current"><a href="team.html">Team</a></li>
                        <li class="page-scroll menu-item"><a href="works.html">Works</a></li>
                        <li class="page-scroll menu-item"><a href="clients.html">Clients</a></li>
                        <li class="page-scroll menu-item"><a href="contact.html">Contact</a></li>
                    </ul>
                </nav>
            </div>
        </header>
        <section id="team" class="section">
            <div class="container">
                <div class="jt_row jt_row-fluid row">
                    <div class="col-md-3 jt_col column_container">
                        <div class="ball"><img src="demo/about.png" alt="Our team"></div>
                    </div>
                    <div class="col-md-9 jt_col column_container">
                        <div class="text presentation">
                            <span>We are <strong>creative agency</strong> from California, lorem ipsum dolor sit amet, consectetur <strong>adipiscing</strong> elit. Quisque rutrum pellentesque imperdiet.</span>
                        </div>
                    </div> 
                </div>
                <div class="jt_row jt_row-fluid row">
                    <div class="col-md-3 jt_col column_container">
                        <h2 class="title">Our Team</h2>
                    </div>
                    <div class="col-md-9 jt_col column_container">
                        <div class="text">Our multifaceted team of designers, marketers, and developers share one mission: to deliver stunning <strong>results that impact, ignite, and inspire</strong>. Our work is saturated in strategy and incepted through a lens of deep experience.</div>
                    </div> 
                </div>
            </div> <!-- End .container -->
        </section>
        <section id="team-members" class="section child">
            <div class="container full-width">
                <div class="jt_row jt_row-fluid row">
                    <div class="col-md-12 jt_col column_container">
                        <div class="team-wrapper clearfix">
                            <div class="team-member">
                                <img src="demo/team/team01.jpg" class="main" alt="Britney Doe">
                                <div class="hover">
                                    <div class="blur"><img src="demo/team/team01_blur.jpg" alt="Britney Doe"></div>
                                    <div class="hover-border"></div>
                                    <h2 class="name">Britney Doe</h2>
                                    <h3 class="position">Creative Director</h3>
                                    <div class="social">
                                        <a href="#" class="fb icon">Facebook</a>
                                        <a href="#" class="tw icon">Twitter</a>
                                        <a href="#" class="di icon">Dribbble</a>
                                    </div>
                                </div>
                            </div>
                            <div class="team-member">
                                <img src="demo/team/team02.jpg" class="main" alt="Carl Paxon">
                                <div class="hover">
                                    <div class="blur"><img src="demo/team/team02_blur.jpg" alt="Carl Paxon"></div>
                                    <div class="hover-border"></div>
                                    <h2 class="name">Carl Paxon</h2>
                                    <h3 class="position">CEO</h3>
                                    <div class="social">
                                        <a href="#" class="fb icon">Facebook</a>
                                        <a href="#" class="tw icon">Twitter</a>
                                        <a href="#" class="di icon">Dribbble</a>
                                    </div>
                                </div>
                            </div>
                            <div class="team-member">
                                <img src="demo/team/team03.jpg" class="main" alt="Bryan Fick">
                                <div class="hover">
                                    <div class="blur"><img src="demo/team/team03_blur.jpg" alt="Bryan Fick"></div>
                                    <div class="hover-border"></div>
                                    <h2 class="name">Bryan Fick</h2>
                                    <h3 class="position">Product Manager</h3>
                                    <div class="social">
                                        <a href="#" class="fb icon">Facebook</a>
                                        <a href="#" class="tw icon">Twitter</a>
                                        <a href="#" class="di icon">Dribbble</a>
                                    </div>
                                </div>
                            </div>
                            <div class="team-member">
                                <img src="demo/team/team04.jpg" class="main" alt="Lisa Stamp">
                                <div class="hover">
                                    <div class="blur"><img src="demo/team/team04_blur.jpg" alt="Lisa Stamp"></div>
                                    <div class="hover-border"></div>
                                    <h2 class="name">Lisa Stamp</h2>
                                    <h3 class="position">Developer</h3>
                                    <div class="social">
                                        <a href="#" class="fb icon">Facebook</a>
                                        <a href="#" class="tw icon">Twitter</a>
                                        <a href="#" class="di icon">Dribbble</a>
                                    </div>
                                </div>
                            </div>
                            <div class="team-member">
                                <img src="demo/team/team05.jpg" class="main" alt="Richard Grey">
                                <div class="hover">
                                    <div class="blur"><img src="demo/team/team05_blur.jpg" alt="Richard Grey"></div>
                                    <div class="hover-border"></div>

                                    <h2 class="name">Richard Grey</h2>
                                    <h3 class="position">Support Staff</h3>
                                    <div class="social">
                                        <a href="#" class="fb icon">Facebook</a>
                                        <a href="#" class="tw icon">Twitter</a>
                                        <a href="#" class="di icon">Dribbble</a>
                                    </div>
                                </div>
                            </div>
                            <div class="team-member">
                                <img src="demo/team/team06.jpg" class="main" alt="Harry Drago">
                                <div class="hover">
                                    <div class="blur"><img src="demo/team/team06_blur.jpg" alt="Harry Drago"></div>
                                    <div class="hover-border"></div>
                                    <h2 class="name">Harry Drago</h2>
                                    <h3 class="position">Developer</h3>
                                    <div class="social">
                                        <a href="#" class="fb icon">Facebook</a>
                                        <a href="#" class="tw icon">Twitter</a>
                                        <a href="#" class="di icon">Dribbble</a>
                                    </div>
                                </div>
                            </div>


        <div class="team-member">
                                <img src="demo/team/team07.jpg" class="main" alt="Harry Drago">
                                <div class="hover">
                                    <div class="blur"><img src="demo/team/team07_blur.jpg" alt="Harry Drago"></div>
                                    <div class="hover-border"></div>
                                    <h2 class="name">Kevin Strait</h2>
                                    <h3 class="position">Developer</h3>
                                    <div class="social">
                                        <a href="#" class="fb icon">Facebook</a>
                                        <a href="#" class="tw icon">Twitter</a>
                                        <a href="#" class="di icon">Dribbble</a>
                                    </div>
                                </div>
                            </div>


        <div class="team-member">
                                <img src="demo/team/team08.jpg" class="main" alt="Harry Drago">
                                <div class="hover">
                                    <div class="blur"><img src="demo/team/team08_blur.jpg" alt="Harry Drago"></div>
                                    <div class="hover-border"></div>
                                    <h2 class="name">Elena Bergman</h2>
                                    <h3 class="position">Marketing</h3>
                                    <div class="social">
                                        <a href="#" class="fb icon">Facebook</a>
                                        <a href="#" class="tw icon">Twitter</a>
                                        <a href="#" class="di icon">Dribbble</a>
                                    </div>
                                </div>
                            </div>
                            
                        </div> <!-- End Team wrapper -->
                        <a href="#" class="pag-more team">View more</a>
                    </div> <!-- End jt_col -->
                </div> <!-- End jt_row -->
            </div> <!-- End .container -->
        </section>
        <section id="our-reel" class="player section" data-property="{videoURL:'kn-1D5z3-Cs',containment:'self',autoPlay:true, mute:true, startAt:0,opacity:1,ratio:'4/3', addRaster:true}">
            <div class="overlay"></div>
            <img class="video-img" src="demo/png_video.png" alt="video">
        </section>
        <footer id="footer" class="section">
            <a href="#home-slider" class="scrollup">Back to top</a>
            <div class="container">
                <h3 class="thanks">Thanks for watching</h3>
                <h4 class="social-title2">Did you like it?</h4>
    			<h4 class="social-title">Please <b>share it</b> clicking on social buttons below!</h4>
                <ul class="social">
                    <li><a href="#" class="icon tw"><i class="fa fa-twitter"></i></a></li>
                    <li><a href="#" class="icon fb"><i class="fa fa-facebook"></i></a></li>
                    <li><a href="#" class="icon in"><i class="fa fa-dribbble"></i></a></li>
                    <li><a href="#" class="icon go"><i class="fa fa-google-plus"></i></a></li>
                </ul>
            </div>
        </footer>
        <div class="md-overlay"></div>
        <div class="modal-form">
            <span class="title mini">Start a project</span>
            <span class="subtitle">Want to work with us?</span>
            <span class="subtitle strong">Let' Get Started</span>
            <form action="mail.php" method="post" id="contact-project" class="contact-form">
               <p class="col"><input type="text" placeholder="Full Name" name="name" class="text required name"></p>
               <p class="col col2"><input type="email" placeholder="Your Email" name="email" class="text required email"></p>
               <p><textarea name="message" class="text required area" placeholder="Type Message"></textarea></p>
               <p class="clearfix"><input type="submit" value="Say Hello" class="button submit inverse next"></p>
               <div class="formSent"><strong>Your Message Has Been Sent!</strong> Thank you for contacting us.</div>
           </form>
        </div>
    </div>
    <!-- BEGIN Scripts-->
    <script src="js/modernizr.custom.js"></script>
    <script src="js/jquery.js"></script>
    <script src="js/classie.js"></script>
    <script src="js/pathLoader.js"></script>
    <script src="js/owl-carousel/owl.carousel.min.js"></script>
    <script src="js/isotope.pkgd.min.js"></script>
    <script src="js/jquery.inview.js"></script>
    <script src="js/jquery.nav.js"></script>
    <script src="js/jquery.mb.YTPlayer.js"></script>
    <script src="js/jquery.form.js"></script>
    <script src="js/jquery.validate.js"></script>
    <script src="js/bootstrap.min.js"></script>
    
    <script src="js/default.js"></script>
    <!-- END Scripts -->

    
</body>
</html>