Files
demo_sites/templates/template_3/site/index-video.html
2026-05-17 18:29:30 -05:00

794 lines
49 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Home</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Abril+Fatface%7CLato:300i,400,900%7CMontserrat:100,300,400,500,600,700,900">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style-6.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="preloader loaded">
<div class="preloader-body">
<div class="cssload-container">
<div class="cssload-speeding-wheel"></div>
</div>
<p>Loading...</p>
</div>
</div>
<div class="page">
<!-- Page Header-->
<header class="section page-header">
<!-- RD Navbar-->
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-classic" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-fixed" data-lg-device-layout="rd-navbar-fixed" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-lg-stick-up-offset="50px" data-xl-stick-up-offset="50px" data-xxl-stick-up-offset="50px" data-lg-stick-up="true" data-xl-stick-up="true" data-xxl-stick-up="true">
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<!-- RD Navbar Panel-->
<div class="rd-navbar-panel">
<!-- RD Navbar Toggle-->
<button class="rd-navbar-toggle" data-rd-navbar-toggle=".rd-navbar-nav-wrap"><span></span></button>
<!-- RD Navbar Brand-->
<div class="rd-navbar-brand"><a class="brand" href="index.html"><img class="brand-logo-light" src="images/video/logo-inverse-140x37.png" alt="" width="140" height="37" srcset="images/video/logo-retina-inverse-280x74.png 2x"/></a></div>
</div>
<div class="rd-navbar-nav-wrap">
<!-- RD Navbar Nav-->
<ul class="rd-navbar-nav">
<li class="rd-nav-item"><a class="rd-nav-link" href="#about">About</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#projects">projects</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#services">services</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#portfolio">portfolio</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#testimonials">Testimonials</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#contacts">Contacts</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- hero header -->
<!-- Video-->
<section class="vide_bg video-bg-overlay" data-vide-bg="video/Keep_Running" data-vide-options="posterType: jpg">
<div class="section-xxl context-dark text-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-12 overflow-hidden">
<div class="group-md">
<p class="subtitle wow fadeInDown" data-wow-delay="800ms">movies</p>
<p class="subtitle wow fadeInDown" data-wow-delay="800ms">animations</p>
<p class="subtitle wow fadeInDown" data-wow-delay="800ms">videos</p>
</div>
<h1><span class="wow fadeInUp" data-wow-delay="200ms">Quality Videography Services</span></h1>
<h6 class="wow fadeInUp font-weight-medium" data-wow-delay="800ms">My studio delivers all kinds of videography services to clients throughout the US.</h6>
<div class="group-sm"><a class="button button-primary button-nina fadeInUp wow" data-wow-delay="800ms" href="#" data-custom-scroll-to="services">my services</a><a class="button button-default-outline button-icon button-icon-right fadeInUp wow" data-wow-delay="800ms" href="#" data-toggle="modal" data-target="#modalvideo"><span class="icon mdi mdi-play"></span>play</a></div>
</div>
</div>
</div>
</div>
</section>
<section class="section bg-default text-left section-lg" id="about" data-type="anchor">
<div class="container">
<div class="row row-50 flex-md-row-reverse justify-content-between align-items-center">
<div class="col-md-6">
<div class="pr-xl-5">
<h4 class="font-weight-bold">Hi! Im Jane Smith, an experienced videographer</h4>
<div class="divider divider-sm"></div>
<p class="heading-5 font-weight-light font-italic">I am a creative film and photo production expert hungry for quality.</p>
<ul class="list-marked-2">
<li>Every project I work on is built on details and combines unique approach with modern technologies.</li>
<li>I strive for the highest quality and perfection while maintaining affordable pricing for all my services.</li>
</ul>
</div>
</div>
<div class="col-md-5 col-xl-5">
<figure class="about-decoration about-decoration-mod-1"><img src="images/video/about-01-442x403.jpg" alt="" width="442" height="403"/>
</figure>
</div>
</div>
</div>
</section>
<section class="section section-md context-dark bg-image text-center" id="projects" data-type="anchor" style="background-image: url(images/video/pattern-bg.jpg)">
<div class="container">
<p class="subtitle">latest projects</p>
<h2>Award-Winning Videos & Photos</h2>
</div>
<!-- Owl Carousel-->
<div class="owl-carousel carousel-project" data-owl='{"dots":true,"nav":true,"center":true,"navText":["prev","next"]}' data-items="1" data-md-items="1" data-stage-padding="15" data-md-stage-padding="150" data-xl-stage-padding="200" data-xxl-stage-padding="250" data-loop="true" data-autoplay="true" data-margin="30" data-xl-margin="0" data-xxl-margin="0" data-mouse-drag="false">
<div class="box-project">
<div class="box-project-image"><img src="images/video/project-1-632x375.jpg" alt="" width="632" height="375"/>
</div>
<div class="box-project-body">
<div class="box-project-inner">
<h5 class="box-project-title"><a href="#">Jane Williams</a></h5>
<div class="box-project-subtitle">music videography</div>
</div>
<div class="box-project-social"> <span class="icon icon-lg linearicons-share2" data-project-toggle></span>
<ul class="list-inline-sm box-project-icon-list">
<li><a class="icon-sm mdi mdi-facebook novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-twitter novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-google-plus novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-vimeo novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-youtube-play novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-pinterest novi-icon icon" href="#"></a></li>
</ul>
</div>
</div>
</div>
<div class="box-project">
<div class="box-project-image"><img src="images/video/project-2-632x375.jpg" alt="" width="632" height="375"/>
</div>
<div class="box-project-body">
<div class="box-project-inner">
<h5 class="box-project-title"><a href="#">Type One Ltd.</a></h5>
<div class="box-project-subtitle">commercial Videography</div>
</div>
<div class="box-project-social"><span class="icon icon-lg linearicons-share2" data-project-toggle></span>
<ul class="list-inline-sm box-project-icon-list">
<li><a class="icon-sm mdi mdi-facebook novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-twitter novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-google-plus novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-vimeo novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-youtube-play novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-pinterest novi-icon icon" href="#"></a></li>
</ul>
</div>
</div>
</div>
<div class="box-project">
<div class="box-project-image"><img src="images/video/project-3-632x375.jpg" alt="" width="632" height="375"/>
</div>
<div class="box-project-body">
<div class="box-project-inner">
<h5 class="box-project-title"><a href="#">Agnivex Studio</a></h5>
<div class="box-project-subtitle">Fine art photography</div>
</div>
<div class="box-project-social"><span class="icon icon-lg linearicons-share2" data-project-toggle></span>
<ul class="list-inline-sm box-project-icon-list">
<li><a class="icon-sm mdi mdi-facebook novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-twitter novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-google-plus novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-vimeo novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-youtube-play novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-pinterest novi-icon icon" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- process-->
<section class="section section-md bg-gray-100 text-center" id="services" data-type="anchor">
<div class="container">
<p class="subtitle"><span>my services</span></p>
<h2>Professional Video & Photo Services</h2>
<p>Capture the brightest life moments with my help! I offer professional <br class="d-none d-md-inline-block"> video production & photography for all US residents.</p>
<div class="row row-30 justify-content-center">
<div class="col-md-6 col-xl-4">
<div class="box-process">
<div class="box-process-header"><span class="icon icon-circle icon-primary icon-md icon-effect-4 icon-effect-4--mod-4 linearicons-camera2"></span>
<h5>Photography Services</h5>
</div>
<div class="box-process-body">
<p>I provide creative and dynamic photography services for everyone.</p>
<ul class="list-marked">
<li>Portrait Photography</li>
<li>Event Photography</li>
<li>Commercial Photography</li>
<li>Fine Art Photography</li>
</ul>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4">
<div class="box-process">
<div class="box-process-header"><span class="icon icon-circle icon-primary icon-md icon-effect-4 icon-effect-4--mod-4 linearicons-camera"></span>
<h5>Video Production</h5>
</div>
<div class="box-process-body">
<p>Professional video production services for personal or corporate needs.</p>
<ul class="list-marked">
<li>Advertising Video</li>
<li>Event Video</li>
<li>3D Animation</li>
<li>Music Video</li>
</ul>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4">
<div class="box-process">
<div class="box-process-header"><span class="icon icon-circle icon-primary icon-md icon-effect-4 icon-effect-4--mod-4 linearicons-film-play"></span>
<h5>Professional Editing</h5>
</div>
<div class="box-process-body">
<p>If you need to edit a prepared footage, my editing services are a perfect pick. </p>
<ul class="list-marked">
<li>Non-linear editing</li>
<li>Offline editing</li>
<li>Online editing</li>
<li>Vision mixing</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<!--cta-->
<section class="section parallax-container context-dark" data-parallax-img="images/video/cta-bg.jpg">
<div class="parallax-content section-md">
<div class="container section-cta text-center">
<div class="row justify-content-center">
<div class="col-lg-8 col-xl-6">
<p class="subtitle">make an appointment</p>
<h2>Shoot Your First Video</h2>
<p>Lets create an unforgettable and memorable video for you. Book an appointment to make the first step.</p><a class="button button-primary button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
</div>
</div>
</section>
<!--portfolio-->
<section class="section section-md bg-default text-center" id="portfolio" data-type="anchor">
<div class="container">
<p class="subtitle"><span>my portfolio</span></p>
<h2>Take a Look at My Latest Works</h2>
<div class="isotope-wrap">
<ul class="list-nav isotope-filters-responsive">
<li>
<p>Choose your category:</p>
</li>
<li class="block-top-level">
<!-- Isotope Filters-->
<button class="isotope-filters-toggle button button-sm button-primary" data-custom-toggle="#isotope-1" data-custom-toggle-hide-on-blur="true">Filter<span class="caret"></span></button>
<div class="isotope-filters" id="isotope-1">
<ul class="inline-list">
<li><a class="active" data-isotope-filter="*" data-isotope-group="gallery" href="#">All</a></li>
<li><a data-isotope-filter="Category 1" data-isotope-group="gallery" href="#">videography</a></li>
<li><a data-isotope-filter="Category 2" data-isotope-group="gallery" href="#">photography</a></li>
<li><a data-isotope-filter="Category 3" data-isotope-group="gallery" href="#">editing</a></li>
</ul>
</div>
</li>
</ul>
<div class="isotope row row-30" data-isotope-layout="fitRows" data-isotope-group="gallery">
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 1"><a class="box-portfolio" href="#">
<figure><img src="images/video/portfolio-1-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">Ann McMillan</h5>
<p class="portfolio-subtitle">fashion photography</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 1"><a class="box-portfolio" href="#">
<figure><img src="images/video/portfolio-2-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">iStep Co.</h5>
<p class="portfolio-subtitle">commercial videography</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 1"><a class="box-portfolio" href="#">
<figure><img src="images/video/portfolio-3-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">World FM</h5>
<p class="portfolio-subtitle">event videography</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 2"><a class="box-portfolio" href="#">
<figure><img src="images/video/portfolio-4-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">Hot Coffee</h5>
<p class="portfolio-subtitle">Advertising videography</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="*">
<div class="portfolio-centered"><span class="icon icon-lg linearicons-quote-open"></span>
<h5><span class="font-weight-normal">Lets Discuss</span> <span class="font-family-cursive">Your </span><span class="font-weight-normal">Project</span>
</h5><a class="button button-default-outline button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 2"><a class="box-portfolio" href="#">
<figure><img src="images/video/portfolio-5-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">VR-Tex Headset</h5>
<p class="portfolio-subtitle">promotional videography</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 3"><a class="box-portfolio" href="#">
<figure><img src="images/video/portfolio-6-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">INT Tour Agency</h5>
<p class="portfolio-subtitle">non-linear editing</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 3"><a class="box-portfolio" href="#">
<figure><img src="images/video/portfolio-7-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">Emma Universe</h5>
<p class="portfolio-subtitle">music videography</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 3"><a class="box-portfolio" href="#">
<figure><img src="images/video/portfolio-8-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">US Balloon Contest</h5>
<p class="portfolio-subtitle">Event videography</p>
</div></a>
</div>
</div>
</div>
</div>
</section>
<!-- Services-->
<section class="section section-md bg-gray-100">
<div class="container">
<div class="row row-50 justify-content-center services-container">
<div class="col-12">
<div class="box-strategy">
<div class="box-strategy-inner box-strategy-title">
<h4>My Process</h4>
</div>
<div class="box-strategy-inner box-strategy-body">
<p>Every video I work on undergoes three different stages that <br class="d-none d-xl-inline-block"> make the final experience of the video a lot more enjoyable.</p><a class="button button-primary-outline button-icon button-icon-right" href="#" data-toggle="modal" data-target="#appointment">free consultation</a>
</div>
</div>
<hr>
</div>
<div class="col-sm-6 col-lg-4">
<div class="box-service">
<div class="box-service-heading"><span class="icon icon-circle icon-primary icon-md icon-effect-7 linearicons-binoculars"></span>
<h5>Video Shooting</h5>
</div>
<div class="box-service-body">
<p>After an initial consultation, I carry out the footage shooting at the selected location.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="box-service">
<div class="box-service-heading"><span class="icon icon-circle icon-primary icon-md icon-effect-7 linearicons-feather3"></span>
<h5>Editing Process</h5>
</div>
<div class="box-service-body">
<p>After the first stage, I edit the footage to present a preliminary result to my client.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="box-service">
<div class="box-service-heading"><span class="icon icon-circle icon-primary icon-md icon-effect-7 linearicons-umbrella"></span>
<h5>Final Result</h5>
</div>
<div class="box-service-body">
<p>After making certain changes and post-production, I present the video to the client.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!--testimonials-->
<section class="section section-md context-dark bg-image text-center" id="testimonials" data-type="anchor" style="background-image: url(images/video/pattern-bg.jpg)">
<div class="container">
<p class="subtitle">testimonials</p>
<h2>What People Say</h2>
<div class="owl-carousel carousel-testimonials" data-owl='{"dots":true}' data-items="1" data-md-items="2" data-stage-padding="15" data-loop="true" data-autoplay="true" data-margin="60">
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/video/testimonials-1-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Working with Jane was an amazing experience! Our wedding video is beautiful and so heartfelt. I hope to work with you more in the future!</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Alice Parker</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/video/testimonials-2-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Thank you for a great advertising video you shot for us. Working with you was a great experience and I hope that our cooperation will continue soon.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Steve Thomas</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/video/testimonials-1-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Working with Jane was an amazing experience! Our wedding video is beautiful and so heartfelt. I hope to work with you more in the future!</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Alice Parker</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/video/testimonials-2-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Thank you for a great advertising video you shot for us. Working with you was a great experience and I hope that our cooperation will continue soon.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Steve Thomas</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/video/testimonials-1-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Working with Jane was an amazing experience! Our wedding video is beautiful and so heartfelt. I hope to work with you more in the future!</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Alice Parker</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/video/testimonials-2-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Thank you for a great advertising video you shot for us. Working with you was a great experience and I hope that our cooperation will continue soon.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Steve Thomas</cite><span>Customer</span>
</p>
</div>
</div>
</div>
</div>
</section>
<!-- location-->
<section class="section section-md bg-default" id="location" data-type="anchor">
<div class="container text-center">
<p class="subtitle"> <span>my pricing</span></p>
<h2>Affordable Price for Everyone</h2>
<p>I believe that reasonable pricing is as important as the final product quality.<br class="d-none d-md-inline-block"> Thats why I offer an affordable pricing range for my clients.</p>
<div class="row row-30">
<div class="col">
<div class="box-pricing">
<div class="box-pricing-header">
<h5 class="title">Startup</h5><span class="icon icon-circle linearicons-camera2"></span>
</div>
<div class="box-pricing-body">
<div class="price-box"><span>25</span><span>/ hour</span></div>
<ul class="pricing-list">
<li>Wedding Photography</li>
<li>Event Photography</li>
<li>Single Camera</li>
<li>Footage Shooting</li>
</ul><a class="button button-default-outline button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
</div>
<div class="col">
<div class="box-pricing"><span class="label label-popular">popular</span>
<div class="box-pricing-header">
<h5 class="title">Standard</h5><span class="icon icon-circle linearicons-film-play"></span>
</div>
<div class="box-pricing-body">
<div class="price-box"><span>59</span><span>/ hour</span></div>
<ul class="pricing-list">
<li>Event Videography</li>
<li>Commercial Photography</li>
<li>2 and More Cameras</li>
<li>Non-Linear Editing</li>
</ul><a class="button button-default-outline button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
</div>
<div class="col">
<div class="box-pricing">
<div class="box-pricing-header">
<h5 class="title">Premium</h5><span class="icon icon-circle linearicons-panorama"></span>
</div>
<div class="box-pricing-body">
<div class="price-box"><span>90</span><span>/ hour</span></div>
<ul class="pricing-list">
<li>Commercial Videography</li>
<li>Promotional Photography</li>
<li>Multiple Cameras</li>
<li>Vision Mixing</li>
</ul><a class="button button-default-outline button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- blog-->
<section class="section section-md bg-gray-100" id="blog" data-type="anchor">
<div class="container text-center">
<p class="subtitle"><span>latest news</span></p>
<h2>My Blog</h2>
<div class="row row-30">
<div class="col-md-6 col-lg-5">
<div class="box-post-classic">
<div class="box-post-classic-body">
<time class="box-post-meta" datetime="2018">December 3, 2020</time>
<h6 class="box-post-title"><a href="#">Best Shooting Locations</a></h6>
<p class="box-post-text">When you prepare for shooting a video, choosing a proper location is crucial. Today, we...</p>
</div>
</div>
<div class="box-post-classic"><a class="box-post-classic-image" href="#"><img src="images/video/blog-1-470x256.jpg" alt="" width="470" height="256"/></a>
<div class="box-post-classic-body">
<time class="box-post-meta" datetime="2018">December 3, 2020</time>
<h5 class="box-post-title"><a href="#">How to Ensure Your Video Wont be Forgotten</a></h5>
<p class="box-post-text">Today Ill tell you about some key moments that can make almost any...</p>
</div>
</div>
</div>
<div class="col-md-6 col-lg-7">
<div class="row row-30">
<div class="col-12">
<div class="box-post-modern"><a class="box-post-modern-image" href="#"><img src="images/video/blog-2-666x485.jpg" alt="" width="666" height="485"/></a>
<div class="box-post-modern-body">
<time class="box-post-meta" datetime="2018">December 17, 2020</time>
<h5 class="box-post-title"><a href="#">Top 5 Reasons you Should Upload Your Video to Facebook</a></h5>
<p class="box-post-text">Its plain to see that Facebook is out to promote itself as the go to place to find an engaging...</p><a class="button button-primary button-nina" href="#">read more</a>
</div>
</div>
</div>
<div class="col-lg-7"><a class="box-post-quote" href="#">
<p class="box-post-quote-inner">Get inspired checking the best and coolest advertising videos</p><span class="box-post-cite">Steve Smith</span></a></div>
<div class="col-lg-5">
<div class="box-post-instagram instafeed" data-instafeed-get="tagged" data-instafeed-tagname="tm_62006" data-instafeed-sort="most-recent" data-lightgallery="group">
<div class="thumbnail-instafeed"><a class="instagram-link" data-lightgallery="item" href="images/lawyer/blog-3-640x640.jpg"><img class="instagram-image" src="images/lawyer/blog-3-640x640.jpg" alt=""/></a>
<div class="caption">
<ul class="list-inline inline-list-xxs">
<li><span class="novi-icon icon mdi mdi-magnify-plus"></span></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--subscribe-->
<section class="section parallax-container context-dark" data-parallax-img="images/video/subscribe-bg.jpg">
<div class="parallax-content section-md">
<div class="container text-center">
<div class="row justify-content-center">
<div class="col-lg-8 col-xl-6">
<p class="subtitle">newsletter</p>
<h2>Get the Latest News</h2>
<p>Subscribe below to receive video production news.</p>
<!-- RD Mailform-->
<form class="rd-form rd-mailform rd-form-inline" data-form-output="form-output-global" data-form-type="subscribe" method="post" action="bat/rd-mailform.php">
<div class="form-wrap">
<input class="form-input" id="subscribe-form-0-email" type="email" name="email" data-constraints="@Email @Required"/>
<label class="form-label" for="subscribe-form-0-email">Your E-mail</label>
</div>
<div class="form-button">
<button class="button button-primary button-nina" type="submit">Subscribe</button>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<!--contact-->
<section class="section section-md bg-default" id="contacts" data-type="anchor">
<div class="container text-center">
<p class="subtitle"><span>contact us</span></p>
<h2>Get in Touch</h2>
<p>Have any questions or suggestions for me? Feel free to send <br class="d-none d-md-inline-block"> me a message using the contact form below.</p>
<!-- RD Mailform-->
<form class="rd-form rd-mailform" data-form-output="form-output-global" data-form-type="contact" method="post" action="bat/rd-mailform.php">
<div class="row row-20">
<div class="col-md-4">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-name" type="text" name="name" data-constraints="@Required">
<label class="form-label mdi mdi-account-outline input__label--nao" for="contact-name">Your Name</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-md-4">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-email" type="email" name="email" data-constraints="@Email @Required">
<label class="form-label input__label--nao mdi mdi-email-outline" for="contact-email">E-mail</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-md-4">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-phone" type="text" name="phone" data-constraints="@Numeric">
<label class="form-label input__label--nao mdi mdi-tablet-android" for="contact-phone">Phone</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<textarea class="form-input input__field--nao" id="contact-message" name="message" data-constraints="@Required"></textarea>
<label class="form-label input__label--nao mdi mdi-message-text-outline" for="contact-message">Your Message</label>
<svg class="graphic graphic--nao" width="300%" height="50%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12 text-center form-button">
<button class="button button-primary button-nina" type="submit">Send Message</button>
</div>
</div>
</form>
</div>
</section>
<section class="google-map-container" data-center="6036 Richmond hwy., Alexandria, VA, 2230" data-styles="[{&quot;featureType&quot;:&quot;administrative&quot;,&quot;elementType&quot;:&quot;labels.text.fill&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#444444&quot;}]},{&quot;featureType&quot;:&quot;landscape&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#f2f2f2&quot;}]},{&quot;featureType&quot;:&quot;poi&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;off&quot;}]},{&quot;featureType&quot;:&quot;poi.business&quot;,&quot;elementType&quot;:&quot;geometry.fill&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;on&quot;}]},{&quot;featureType&quot;:&quot;road&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;saturation&quot;:-100},{&quot;lightness&quot;:45}]},{&quot;featureType&quot;:&quot;road.highway&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;simplified&quot;}]},{&quot;featureType&quot;:&quot;road.arterial&quot;,&quot;elementType&quot;:&quot;labels.icon&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;off&quot;}]},{&quot;featureType&quot;:&quot;transit&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;off&quot;}]},{&quot;featureType&quot;:&quot;water&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#b4d4e1&quot;},{&quot;visibility&quot;:&quot;on&quot;}]}]">
<div class="google-map"></div>
<ul class="google-map-markers">
<li data-location="6036 Richmond hwy., Alexandria, VA, 2230" data-description="6036 Richmond hwy., Alexandria, VA, 2230" data-icon="images/video/gmap_marker.png" data-icon-active="images/video/gmap_marker_active.png"></li>
</ul>
</section>
<!-- Page Footer -->
<footer class="section footer-classic context-dark bg-image" style="background-image: url(images/video/pattern-bg.jpg)">
<div class="container">
<div class="row row-30">
<div class="col-md-4 col-xl-5">
<div class="pr-xl-4"><a class="brand" href="index.html"><img class="brand-logo-light" src="images/video/logo-inverse-140x37.png" alt="" width="140" height="37" srcset="images/video/logo-retina-inverse-280x74.png 2x"/></a>
<p>Im a professional videographer &amp; photographer dedicated to producing high-quality material and delivering the best experience to the viewer.</p>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp; </span><span class="copyright-year"></span><span>&nbsp;</span><span>Waves</span><span>.&nbsp;</span><span>All Rights Reserved.</span></p>
</div>
</div>
<div class="col-md-4">
<h5>Contacts</h5>
<dl class="contact-list">
<dt>Address:</dt>
<dd>795 South Park Avenue, Melbourne, Australia</dd>
</dl>
<dl class="contact-list">
<dt>email:</dt>
<dd><a href="mailto:#">mail@demolink.org</a></dd>
</dl>
<dl class="contact-list">
<dt>phones:</dt>
<dd><a href="tel:#">8 800 56789011</a> <span>or</span> <a href="tel:#">8 800 99789077</a>
</dd>
</dl>
</div>
<div class="col-md-4 col-xl-3">
<h5>Links</h5>
<ul class="nav-list">
<li><a href="#">About</a></li>
<li><a href="#">Projects</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contacts</a></li>
<li><a href="#">Pricing</a></li>
</ul>
</div>
</div>
</div>
<div class="row no-gutters social-container">
<div class="col"><a class="social-inner" href="#"><span class="icon mdi mdi-facebook"></span><span>Facebook</span></a></div>
<div class="col"><a class="social-inner" href="#"><span class="icon mdi mdi-instagram"></span><span>instagram</span></a></div>
<div class="col"><a class="social-inner" href="#"><span class="icon mdi mdi-twitter"></span><span>twitter</span></a></div>
<div class="col"><a class="social-inner" href="#"><span class="icon mdi mdi-youtube-play"></span><span>google</span></a></div>
</div>
</footer>
<div class="modal fade" id="appointment" role="dialog">
<div class="modal-dialog modal-dialog_custom">
<!-- Modal content-->
<div class="modal-dialog__inner">
<button class="close" type="button" data-dismiss="modal"></button>
<div class="modal-dialog__content">
<h4>Make an Appointment</h4>
<!-- RD Mailform-->
<form class="rd-form rd-mailform" data-form-output="form-output-global" data-form-type="contact" method="post" action="bat/rd-mailform.php">
<div class="row row-20">
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-name-modal" type="text" name="name" data-constraints="@Required">
<label class="form-label mdi mdi-account-outline input__label--nao" for="contact-name-modal">Your Name</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-email-modal" type="email" name="email" data-constraints="@Email @Required">
<label class="form-label input__label--nao mdi mdi-email-outline" for="contact-email-modal">E-mail</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-phone-modal" type="text" name="phone" data-constraints="@Numeric">
<label class="form-label input__label--nao mdi mdi-tablet-android" for="contact-phone-modal">Phone</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<textarea class="form-input input__field--nao" id="contact-message-modal" name="message" data-constraints="@Required"></textarea>
<label class="form-label input__label--nao mdi mdi-message-text-outline" for="contact-message-modal">Your Message</label>
<svg class="graphic graphic--nao" width="300%" height="50%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12 text-center form-button">
<button class="button button-primary button-nina" type="submit">Send Message</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="modal fade" id="modalvideo" role="dialog">
<div class="modal-dialog modal-dialog_custom modal-dialog_custom-details">
<!-- Modal content-->
<div class="modal-dialog__inner">
<button class="close" type="button" data-dismiss="modal"></button>
<div class="modal-dialog__content">
<div class="modal-dialog__content-inner">
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" id="video" width="560" height="315" src="https://www.youtube.com/embed/-AhmuMqZB0s" allowfullscreen></iframe>
</div>
</div>
<div class="modal-dialog__content-inner">
<h4>Reliable Solutions</h4>
<p>Waves offers a vast set of services and solutions that help you achieve the desired result.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>