mirror of
https://github.com/storytold/artcraft.git
synced 2026-11-04 01:18:34 +00:00
452 lines
18 KiB
HTML
452 lines
18 KiB
HTML
<!DOCTYPE html>
|
||
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
|
||
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
|
||
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
|
||
<!--[if gt IE 8]><!-->
|
||
<html class="no-js"> <!--<![endif]-->
|
||
<head>
|
||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||
<meta name="description" content="Storyteller">
|
||
|
||
<meta name="author" content="The Storyteller Company">
|
||
|
||
<title>Storyteller | Hollywood Studio </title>
|
||
|
||
<!-- Mobile Specific Meta
|
||
================================================== -->
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
|
||
<!-- Favicon -->
|
||
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.png" />
|
||
|
||
<!-- CSS
|
||
================================================== -->
|
||
<!-- Themefisher Icon font -->
|
||
<link rel="stylesheet" href="plugins/themefisher-font/style.css">
|
||
<!-- bootstrap.min css -->
|
||
<link rel="stylesheet" href="plugins/bootstrap/dist/css/bootstrap.min.css">
|
||
<!-- Lightbox.min css -->
|
||
<link rel="stylesheet" href="plugins/lightbox2/dist/css/lightbox.min.css">
|
||
<!-- Slick Carousel -->
|
||
<link rel="stylesheet" href="plugins/slick-carousel/slick/slick.css">
|
||
<link rel="stylesheet" href="plugins/slick-carousel/slick/slick-theme.css">
|
||
<!-- Main Stylesheet -->
|
||
<link rel="stylesheet" href="css/style.css">
|
||
|
||
|
||
<!-- Colors -->
|
||
<!-- <link rel="stylesheet" type="text/css" href="css/colors/green.css" title="green">
|
||
<link rel="stylesheet" type="text/css" href="css/colors/red.css" title="light-red">
|
||
<link rel="stylesheet" type="text/css" href="css/colors/light-blue.css" title="light-blue">
|
||
<link rel="stylesheet" type="text/css" href="css/colors/yellow.css" title="yellow">
|
||
<link rel="stylesheet" type="text/css" href="css/colors/light-green.css" title="light-green">
|
||
<link rel="stylesheet" type="text/css" href="css/colors/blue.css" title="blue"> -->
|
||
|
||
|
||
</head>
|
||
|
||
<body id="body">
|
||
|
||
<!--
|
||
Start Preloader
|
||
==================================== -->
|
||
<div id="preloader">
|
||
<div class="preloader">
|
||
<div class="sk-circle1 sk-child"></div>
|
||
<div class="sk-circle2 sk-child"></div>
|
||
<div class="sk-circle3 sk-child"></div>
|
||
<div class="sk-circle4 sk-child"></div>
|
||
<div class="sk-circle5 sk-child"></div>
|
||
<div class="sk-circle6 sk-child"></div>
|
||
<div class="sk-circle7 sk-child"></div>
|
||
<div class="sk-circle8 sk-child"></div>
|
||
<div class="sk-circle9 sk-child"></div>
|
||
<div class="sk-circle10 sk-child"></div>
|
||
<div class="sk-circle11 sk-child"></div>
|
||
<div class="sk-circle12 sk-child"></div>
|
||
</div>
|
||
</div>
|
||
<!--
|
||
End Preloader
|
||
==================================== -->
|
||
|
||
|
||
|
||
|
||
<!--
|
||
Fixed Navigation
|
||
==================================== -->
|
||
<section class="header navigation">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
<nav class="navbar navbar-expand-md">
|
||
<a class="navbar-brand" href="index.html">
|
||
<img src="images/storyteller-logo.png" alt="logo" class="logo-image">
|
||
</a>
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="tf-ion-android-menu"></span>
|
||
</button>
|
||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||
<ul class="navbar-nav ml-auto">
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="index.html">Home <span class="sr-only">(current)</span></a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="about.html">About</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="service.html">Service</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="portfolio.html">Portfolio</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="contact.html">Contact</a>
|
||
</li>
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||
Pages
|
||
</a>
|
||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||
<a class="dropdown-item" href="404.html">404 Page</a>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</nav>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="single-page-header">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
<h2>About Us</h2>
|
||
<nav aria-label="breadcrumb mx-auto" role="navigation">
|
||
<ol class="breadcrumb">
|
||
<li class="breadcrumb-item"><a href="index.html">Home</a></li>
|
||
<li class="breadcrumb-item active" aria-current="page">About Us</li>
|
||
</ol>
|
||
</nav>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--
|
||
Start About Section
|
||
==================================== -->
|
||
<section class="about-2 section bg-gray" id="about">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-12 col-md-5">
|
||
<h2>We have explored the digital landscape with passion for a long time</h2>
|
||
</div>
|
||
<div class="col-12 col-md-7">
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quae deleniti ipsa labore necessitatibus culpa veritatis quo accusantium, neque enim ea ad eaque iure, quas tempore velit, quibusdam dolor illo! Explicabo.</p>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid quisquam maiores iste soluta, nihil dolorem?</p>
|
||
</div>
|
||
|
||
</div> <!-- End row -->
|
||
</div> <!-- End container -->
|
||
</section> <!-- End section -->
|
||
|
||
<section class="about-mission-vision section">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col">
|
||
<div class="title">
|
||
<h4>Little more brief</h4>
|
||
<h2>About Us.</h2>
|
||
<span class="border"></span>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum reiciendis quasi itaque, obcaecati atque sit!</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
<div class="commonTab">
|
||
<ul class="nav nav-tabs justify-content-center" id="myTab" role="tablist">
|
||
<li class="nav-item">
|
||
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#philosophy" role="tab" aria-controls="philosophy" aria-selected="true">Our Philosophy</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#mission" role="tab" aria-controls="mission" aria-selected="false">mission</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" id="contact-tab" data-toggle="tab" href="#vision" role="tab" aria-controls="vision" aria-selected="false">vision</a>
|
||
</li>
|
||
</ul>
|
||
<div class="tab-content" id="myTabContent">
|
||
<div class="tab-pane fade show active" id="philosophy" role="tabpanel" aria-labelledby="home-tab">
|
||
<div class="row">
|
||
<div class="col-md-6 align-self-center">
|
||
<h2>We Create Designs<br> and technology</h2>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat voluptate molestias, quaerat quo natus dolor harum voluptatibus modi dicta ducimus.</p>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quae officia earum dolore est quaerat cupiditate voluptatibus id, magni alias veniam voluptate, libero explicabo, distinctio atque!</p>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<img class="img-fluid rounded shadow " src="images/company/company-image.jpg" alt="">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade" id="mission" role="tabpanel" aria-labelledby="profile-tab">
|
||
<div class="row">
|
||
<div class="col-md-6 align-self-center">
|
||
<h2>Our Mission</h2>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat voluptate molestias, quaerat quo natus dolor harum voluptatibus modi dicta ducimus.</p>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quae officia earum dolore est quaerat cupiditate voluptatibus id, magni alias veniam voluptate, libero explicabo, distinctio atque!</p>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<img class="img-fluid rounded shadow mt-20" src="images/company/company-image-2.jpg" alt="">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade" id="vision" role="tabpanel" aria-labelledby="contact-tab">
|
||
<div class="row">
|
||
<div class="col-md-6 align-self-center">
|
||
<h2>Our Vision</h2>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat voluptate molestias, quaerat quo natus dolor harum voluptatibus modi dicta ducimus.</p>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quae officia earum dolore est quaerat cupiditate voluptatibus id, magni alias veniam voluptate, libero explicabo, distinctio atque!</p>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<img class="img-fluid rounded shadow mt-20" src="images/company/company-image-3.jpg" alt="">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<!-- Start Our Team
|
||
=========================================== -->
|
||
<section class="team section bg-gray" id="team">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col">
|
||
<div class="title text-center">
|
||
<h4>TEAM MEMBER</h4>
|
||
<h2>Our Team.</h2>
|
||
<span class="border"></span>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum reiciendis quasi itaque, obcaecati atque sit!</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<!-- team member -->
|
||
<div class="col-12 col-md-3 col-sm-6" >
|
||
<div class="team-member text-center">
|
||
<div class="member-photo">
|
||
<!-- member photo -->
|
||
<img class="img-fluid" src="images/team/member-1.jpg" alt="team people">
|
||
<!-- /member photo -->
|
||
</div>
|
||
|
||
<!-- member name & designation -->
|
||
<div class="member-content">
|
||
<h3>Shawshank Redemption</h3>
|
||
<span>Head Of Marketing</span>
|
||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aspernatur necessitatibus ullam, culpa odio.</p>
|
||
<ul class="list-inline">
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-facebook"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-twitter"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-google-outline"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-dribbble"></i></a></li>
|
||
</ul>
|
||
</div>
|
||
<!-- /member name & designation -->
|
||
|
||
</div>
|
||
</div>
|
||
<!-- end team member -->
|
||
|
||
<!-- team member -->
|
||
<div class="col-12 col-md-3 col-sm-6" >
|
||
<div class="team-member text-center">
|
||
<div class="member-photo">
|
||
<!-- member photo -->
|
||
<img class="img-fluid" src="images/team/member-2.jpg" alt="team people">
|
||
<!-- /member photo -->
|
||
</div>
|
||
|
||
<!-- member name & designation -->
|
||
<div class="member-content">
|
||
<h3>Luis Anthon</h3>
|
||
<span>Web Developer</span>
|
||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aspernatur necessitatibus ullam, culpa odio.</p>
|
||
<ul class="list-inline">
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-facebook"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-twitter"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-google-outline"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-dribbble"></i></a></li>
|
||
</ul>
|
||
</div>
|
||
<!-- /member name & designation -->
|
||
</div>
|
||
</div>
|
||
<!-- end team member -->
|
||
|
||
<!-- team member -->
|
||
<div class="col-12 col-md-3 col-sm-6">
|
||
<div class="team-member text-center">
|
||
<div class="member-photo">
|
||
<!-- member photo -->
|
||
<img class="img-fluid" src="images/team/member-3.jpg" alt="team people">
|
||
<!-- /member photo -->
|
||
|
||
</div>
|
||
|
||
<!-- member name & designation -->
|
||
<div class="member-content">
|
||
<h3>Jonathon Andrew</h3>
|
||
<span>Head Of Management</span>
|
||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aspernatur necessitatibus ullam, culpa odio.</p>
|
||
<ul class="list-inline">
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-facebook"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-twitter"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-google-outline"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-dribbble"></i></a></li>
|
||
</ul>
|
||
</div>
|
||
<!-- /member name & designation -->
|
||
|
||
</div>
|
||
</div>
|
||
<!-- end team member -->
|
||
<!-- team member -->
|
||
<div class="col-12 col-md-3 col-sm-6">
|
||
<div class="team-member text-center">
|
||
<div class="member-photo">
|
||
<!-- member photo -->
|
||
<img class="img-fluid" src="images/team/member-4.jpg" alt="team people">
|
||
<!-- /member photo -->
|
||
|
||
</div>
|
||
|
||
<!-- member name & designation -->
|
||
<div class="member-content">
|
||
<h3>Michael Jonson</h3>
|
||
<span>Head Of Management</span>
|
||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aspernatur necessitatibus ullam, culpa odio.</p>
|
||
<ul class="list-inline">
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-facebook"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-twitter"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-google-outline"></i></a></li>
|
||
<li class="list-inline-item"><a href="#"><i class="tf-ion-social-dribbble"></i></a></li>
|
||
</ul>
|
||
</div>
|
||
<!-- /member name & designation -->
|
||
|
||
</div>
|
||
</div>
|
||
<!-- end team member -->
|
||
</div> <!-- End row -->
|
||
</div> <!-- End container -->
|
||
</section> <!-- End section -->
|
||
|
||
<!--
|
||
Start Call To Action
|
||
==================================== -->
|
||
<section class="call-to-action section">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-12 text-center">
|
||
<h2>Let's Create Something Together</h2>
|
||
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicudin bibendum auctor, <br> nisi elit consequat ipsum, nesagittis sem nid elit. Duis sed odio sitain elit.</p>
|
||
<a href="" class="btn btn-main">Contact Us</a>
|
||
</div>
|
||
</div> <!-- End row -->
|
||
</div> <!-- End container -->
|
||
</section> <!-- End section -->
|
||
|
||
<footer id="footer" class="bg-one">
|
||
<div class="top-footer">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-sm-3 col-md-3 col-lg-3">
|
||
<h3>About</h3>
|
||
<p>Integer posuere erat a ante venenati dapibus posuere velit aliquet. Fusce dapibus, tellus cursus commodo, tortor mauris sed posuere.</p>
|
||
</div>
|
||
<!-- End of .col-sm-3 -->
|
||
|
||
<div class="col-sm-3 col-md-3 col-lg-3">
|
||
<h3>Our Services</h3>
|
||
<ul>
|
||
<li><a href="#">Graphic Design</a></li>
|
||
<li><a href="#">Web Design</a></li>
|
||
<li><a href="#">Web Development</a></li>
|
||
</ul>
|
||
</div>
|
||
<!-- End of .col-sm-3 -->
|
||
|
||
<div class="col-sm-3 col-md-3 col-lg-3">
|
||
<h3>Quick Links</h3>
|
||
<ul>
|
||
<li><a href="#">Partners</a></li>
|
||
<li><a href="#">About</a></li>
|
||
<li><a href="#">FAQ’s</a></li>
|
||
<li><a href="#">Badges</a></li>
|
||
</ul>
|
||
</div>
|
||
<!-- End of .col-sm-3 -->
|
||
|
||
<div class="col-sm-3 col-md-3 col-lg-3">
|
||
<h3>Subscribe Now</h3>
|
||
<form class="subscribe-form">
|
||
<div class="form-group">
|
||
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
|
||
</div>
|
||
<button type="submit" class="btn btn-main-sm">Subscribe Now</button>
|
||
</form>
|
||
</div>
|
||
<!-- End of .col-sm-3 -->
|
||
|
||
</div>
|
||
</div> <!-- end container -->
|
||
</div>
|
||
<div class="footer-bottom">
|
||
<h5>Copyright 2021. The Storyteller Company<br>(formally registered as Learning Machines, LLC.)</h5>
|
||
<h6>Read more content and stuff<br>A Link <a href="https://vo.codes" target="_blank">DeepFake TTS</a></h6>
|
||
</div>
|
||
</footer> <!-- end footer -->
|
||
|
||
|
||
<!-- end Footer Area
|
||
========================================== -->
|
||
|
||
|
||
|
||
<!--
|
||
Essential Scripts
|
||
=====================================-->
|
||
|
||
<!-- Main jQuery -->
|
||
<script src="plugins/jquery/dist/jquery.min.js"></script>
|
||
<!-- Bootstrap 3.7 -->
|
||
<script src="plugins/bootstrap/dist/js/popper.min.js"></script>
|
||
<script src="plugins/bootstrap/dist/js/bootstrap.min.js"></script>
|
||
<!-- Parallax -->
|
||
<script src="plugins/parallax/jquery.parallax-1.1.3.js"></script>
|
||
<!-- lightbox -->
|
||
<script src="plugins/lightbox2/dist/js/lightbox.min.js"></script>
|
||
<!-- Owl Carousel -->
|
||
<script src="plugins/slick-carousel/slick/slick.min.js"></script>
|
||
<!-- Portfolio Filtering -->
|
||
<script src="plugins/mixitup/dist/mixitup.min.js"></script>
|
||
<!-- Smooth Scroll js -->
|
||
<script src="plugins/smooth-scroll/dist/js/smooth-scroll.min.js"></script>
|
||
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCC72vZw-6tGqFyRhhg5CkF2fqfILn2Tsw"></script>
|
||
|
||
<!-- Custom js -->
|
||
<script src="js/script.js"></script>
|
||
|
||
</body>
|
||
</html> |