<!DOCTYPE html>
<html  ng-app="vpModule" ng-controller="VPController">
<head>
   <meta charset="utf-8"/>
   <meta name="viewport" content="width=1200">
   <meta name="msvalidate.01" content="AF86D6C94D0294C6DCFF4C02777B9787" />
   
   <link rel="stylesheet" href="/st/css/main.css">
   <link rel="stylesheet" href="/st/css/common.css">
   
   <link rel="stylesheet" href="https://vjs.zencdn.net/4.5/video-js.css">
   
   <script  src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
   <script  src="/st/js/o/easing.js"></script>
   
   <link rel="apple-touch-icon" sizes="57x57" href="/st/fav/apple-touch-icon-57x57.png">
   <link rel="apple-touch-icon" sizes="114x114" href="/st/fav/apple-touch-icon-114x114.png">
   <link rel="apple-touch-icon" sizes="72x72" href="/st/fav/apple-touch-icon-72x72.png">
   <link rel="apple-touch-icon" sizes="144x144" href="/st/fav/apple-touch-icon-144x144.png">
   <link rel="apple-touch-icon" sizes="60x60" href="/st/fav/apple-touch-icon-60x60.png">
   <link rel="apple-touch-icon" sizes="120x120" href="/st/fav/apple-touch-icon-120x120.png">
   <link rel="apple-touch-icon" sizes="76x76" href="/st/fav/apple-touch-icon-76x76.png">
   <link rel="apple-touch-icon" sizes="152x152" href="/st/fav/apple-touch-icon-152x152.png">
   <meta name="apple-mobile-web-app-title" content="Videopixie">
   <link rel="icon" type="image/png" href="/st/fav/favicon-196x196.png" sizes="196x196">
   <link rel="icon" type="image/png" href="/st/fav/favicon-160x160.png" sizes="160x160">
   <link rel="icon" type="image/png" href="/st/fav/favicon-96x96.png" sizes="96x96">
   <link rel="icon" type="image/png" href="/st/fav/favicon-16x16.png" sizes="16x16">
   <link rel="icon" type="image/png" href="/st/fav/favicon-32x32.png" sizes="32x32">
   <meta name="msapplication-TileColor" content="#ffffff">
   <meta name="msapplication-TileImage" content="/st/fav/mstile-144x144.png">
   <meta name="application-name" content="Videopixie">
   
   
   
   <title>Using stock footage in explainer videos</title>
   <meta name="description" content="Using stock footage in explainer, promotional, and other types of videos.">   
   <meta name="viewport" content="width=1060">
   
   <style>
   
      h1, h2, h3, h4, h5, h6 {
         color: rgb(50,50,50);
      } 
      #landing-page {
         padding: 100px 0;
         overflow-hidden;
      }
      #body {background-color: #F0F0F0;}
      
      #header .container {background-color:#363847; height: 60px;}
      
      .container {width: 1060px; overflow: hidden;}
      
      .button{
         color: rgb(255,255,255);
         text-align: center;
      }
      
      .vp-button.landing-page{
         font-size: 16px;
         padding: 0.5em 1em;
         text-align: center;
         line-height: 120%;
      }
      
      .side-bar .landing-page .vp-button  {
         position: absolute;
         bottom: 32px;
         left: 17px;
      }
      
      .example-wrapper h3 {color: #363847; float: left;}
      
      #landing-page a{
         color: rgb(10,175,214);
      }

      h1 {font-size: 30px; margin: 0px 0px 25px 0px; text-align: left;}
      h2 {font-size: 20px;}
      
      h3 {font-size: 22px; margin:30px 0 10px 0;}
      h4 {font-size: 100%;color: #999;}
      
      #joinus.section {margin-top: 100px;}
      
      div.p, p {color:#777; font-size: 18px; line-height:150%; float: left; clear: left;}
      
      
      .sub-title {font-size: 20px;}
      
      .top-right-deco {position:absolute;top:-25px;right:0;width:500px;z-index:1;}
      .top-right-deco h3 {color: #999;}
      .caption {text-align:left; font-size: 14px; margin: 3px 0 0 0;}
      .body-lower {margin: 20px 0 30px 0;}

      
      
      .questions {margin-top: 30px;}
      .questions h3, .social h3 {color: #999; font-size: 18px; margin-top: 20px;}
      .questions span {font-size: 16px;}
      .questions .link {color: #C78819; cursor:pointer;}
      .questions .link:hover {color: #FFA502;}
      .questions div {margin: 0 0 0 20px;}
     
      .social a {text-decoration:none;border:1px solid #999; text-align:center; float:left;
         margin: 0 10px 0 20px;}
      .social a:hover {border-color:rgb(247,168,30);}
      .social a:hover h2 {color:rgb(247,168,30);}
      
      .request-coupon h2, .request-coupon h4, .vp-button h4 {color: #f3f3f3;}
      .request-coupon:hover h2, .request-coupon:hover h4 {color: #fff;}
      
      .vp-blurb {line-height:140%; margin-bottom:5px;}
      .vp-blurb p {font-size: 20px; line-height:125%}
      
      .get-started {color: #D69D36; text-decoration: underline;}
      .get-started:hover {color: #FFA502;}
      
      .grey-link {color: #777;text-decoration: underline;}
      .grey-link:hover {color: #333;}
      
      
      .lower-section .get-started {margin: 3px 0 0 20px;
         font-size: 18px; font-weight: 400;
         color: #D69D36;   text-decoration: underline;}
         
      .lower-section .get-started:hover {color: #FFA502;}
      .lower-section ul {margin-left: 20px; float: left;}
      .lower-section li {list-style-type: square; margin: 0 0 5px 0;}
      .successMessage .thanks {font-size: 14px; margin: 25px 0 10px 0; color: white;}
      
      .successMessage .get-started { text-decoration: underline; color: #f8f8f8; font-size: 22px;}
      .successMessage .get-started:hover {color: #fff;}
      
      
      .side-bar .landing-page  p {line-height:130%; margin:0px 0px 10px 0px; font-size: 16px;}
      
      #landing-page .left-col {width:700px; float: left;}
      #landing-page .title {margin:50px 0 30px 0;}
      #landing-page .examples {padding-bottom:70px;}
      #landing-page .example-wrapper {margin:0px;width:650px;cursor:default;}
      #landing-page .top-right-deco h3{margin:-3px 0 0 0;line-height:25px; float: right;}
      #landing-page .top-right-deco h4{margin:0px;line-height:25px;}

      #landing-page .example-wrapper .thumbnail-wrapper {
         position:relative;
         margin-top:50px;
         cursor:pointer;
         float: left;
      }
      
      #landing-page .example img.arrow {
         position: absolute;
         opacity: 0.7;
         transition: opacity 0.2s;
      }
      
      #landing-page .example img.arrow:hover {
         opacity: 1.0;
      }
         
      #landing-page .example-wrapper .thumbnail {width:650px;height:365px;}
      #landing-page .example-wrapper img.arrow {
         left:288px;
         top:150px;
      }
      #landing-page .profile-pic {width:60px;height:60px;margin:-17px 10px 0px 10px;}
      #landing-page .subtitle h4{margin:5px 0px;}
      
      
      #landing-page .right-col {float: left; width:280px; color: #999; font-size:100%;margin: 58px 0 0 75px;}
      #landing-page .right-col p {margin:10px 0px 10px 0px;}
      #landing-page .request-coupon,#landing-page .post-project {border:1px solid #999;text-align:center;margin-bottom:10px;cursor:pointer;min-height:53px; padding: 7px 0 9px 0;}
      #landing-page .request-coupon {border: 1px solid #fff; background-color: rgb(247,168,30);}
      
      /*#landing-page .request-coupon:hover,#landing-page .post-project:hover {border-color:rgb(247,168,30);}*/
      #landing-page .request-coupon input {display:block;margin:10px auto; width: 220px; padding: 5px;}
      #landing-page .request-coupon .successMessage {margin:10px auto;}
      
      
      #landing-page .request-form .vp-button {width:auto;padding:5px 11px;margin: 10px 0px 20px 33px;cursor:pointer;}
      #landing-page .request-form .vp-button h4 {font-size:15px;}
      #landing-page .request-form .spinner-holder {display:inline-block;margin:0 0 0 5px;}
      #landing-page .post-project {padding-top:10px;}

      #landing-page .right-col .lower-section {float: left;}
      #landing-page .call {margin-bottom:50px;line-height:150%;}
      #landing-page .orange {color:rgb(247,168,30);}
      
      
      #landing-page .social h2 {width:40px;line-height:40px;font-size:25px;float:left;}
      #landing-page .social h4 {width:85px;float:left;}
      #landing-page .social>p {width:100%;}
      #landing-page .social p+a {margin-left:40px;}
   
      .cta .vp-button {width: auto; font-size: 18px; color: #fff; margin: 0 0 20px 0;font-weight:700;} 
      
      .example {margin: 0 24px 20px 0;} /* this overrides css from main.css - todo: change class name */
   
   </style>
   
   

      
   <link href='//fonts.googleapis.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
   <link href='//fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'>
   
   <script  src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
   <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular-animate.min.js"></script>
   
   <script>
      window.SES={};
      SES.is_dev_enviro = false;
      SES.coupon_unavailable = false;

      var vpModule = angular.module('vpModule', ['ngAnimate',]);
       
   </script>
   
  
   
   <script src="/st/build/vjs.4.5.min.js"></script>
   
   <!--
      <script type="text/javascript" src="/st/build/vjs-extra.concat.js"></script>
   -->
   <script  src="/st/build/vjs-extra.min.js"></script>
   
   <script  src="/st/js/o/common.js"></script>
   <script  src="/st/js/c/VPController.js"></script>
   <script  src="/st/js/c/DirectivesCommon.js"></script>
   <script  src="/st/js/c/MediaModalController.js"></script>
   <script  src="/st/js/c/EditorProfileController.js"></script>
   <script>
      
   var log = VPL('HomePageController');
      
   
   vpModule.controller('HomePageController', ['$scope', 'comm', '$http', 
      function($scope, comm, $http){
      
         $scope.mediaClick = function(id, evt, _options, size){
         
            log.d('mediaClick', _options);

            var content = $(evt.currentTarget).children('.about').eq(0).html()
            var options = _options || {}
            
            comm.broadcast(VP.SHOW_MEDIA,{
               mode: (content ? VP.SIDEBAR_MODES.HTML_MODE : VP.SIDEBAR_MODES.ASSET_MODE),
               htmlSidebarContent: content,
               mediaData: {
                  bucket: options.bucket || "our.s3.videopixie.com/examples/",
                  provider: options.provider || "",
                  provider_id: id,
                  file_extension: 'mp4', 
                  hasWebm: true,
                  overlays: options.overlays || null,
                  format: options.format || null
               },
               size: size
            });
         };
         
         $scope.homepageVideo = function(id,evt){
         
            $scope.mediaClick(id, evt, {
               bucket: 'our.s3.videopixie.com/video/',
               format: '704p'
            },
            {
               width: 1024,
               height: 576,
               media_width: 1024,
               media_height: 576
            });
         }
         
         
         $scope.$watch('MediaModal',function(isPlaying){
         
            window.isPlayingVideo = !!isPlaying;
         });
         
         
         $scope.registerNew = function(){
         
            var path = '/register/new';
            
            if (!$scope.registerNewEmailAddress || $scope.registerNewEmailAddress.length < 3){
               return;
            }
            
            var data = {
               email_address: $scope.registerNewEmailAddress,
               type_context: SES.type_context || ''
            };
            
            $scope.registerNewPending = true;
            $scope.registerNewErrorMsg = null;
           
            $http.post(path, data).then(
               function registerNewSuccess(response){
                  log.d('SUCCESS', path);
                  $scope.registerNewComplete = true;
                  $scope.registerNewPending = false;
               },
               function registerNewError(response){
                  log.d('ERROR', path, response);
                  $scope.registerNewErrorMsg = response.data.error.human;
                  $scope.registerNewPending = false;
               }
            );
            
         
         }

         
         
      }]);
      
      
      
      $(document).ready(function(){
         $('.click-proxy').click(function(evt){
         
            var id = $(evt.currentTarget).attr('click-proxy');
            //console.log('click-proxy', id);
            $('#'+id).triggerHandler('click');
            
         });
         
         (function(d, s, id) {
           var js, fjs = d.getElementsByTagName(s)[0];
           if (d.getElementById(id)) return;
           js = d.createElement(s); js.id = id;
           js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=257876044244230";
           fjs.parentNode.insertBefore(js, fjs);
         }(document, 'script', 'facebook-jssdk'));
      
      });

   </script>

   
   <!-- start Mixpanel -->
   <script type="text/javascript">
    (function(c,a){window.mixpanel=a;var b,d,h,e;b=c.createElement("script");
    b.type="text/javascript";b.async=!0;b.src=("https:"===c.location.protocol?"https:":"http:")+
    '//cdn.mxpnl.com/libs/mixpanel-2.2.min.js';d=c.getElementsByTagName("script")[0];
    d.parentNode.insertBefore(b,d);a._i=[];a.init=function(b,c,f){function d(a,b){
    var c=b.split(".");2==c.length&&(a=a[c[0]],b=c[1]);a[b]=function(){a.push([b].concat(
    Array.prototype.slice.call(arguments,0)))}}var g=a;"undefined"!==typeof f?g=a[f]=[]:
    f="mixpanel";g.people=g.people||[];h=['disable','track','track_pageview','track_links',
    'track_forms','register','register_once','unregister','identify','alias','name_tag',
    'set_config','people.set','people.increment','people.track_charge','people.append'];
    for(e=0;e<h.length;e++)d(g,h[e]);a._i.push([b,c,f])};a.__SV=1.2;})(document,window.mixpanel||[]);
    mixpanel.init("5f3d14b1f63c57b8546c6c7f095ae4b2");
   </script>
   <!-- end Mixpanel -->
   
   
   <script type="text/javascript" src="/st/js/v/ses_mixpanel.js"></script>
   
   <!--[if lt IE 7.]>
      <script defer type="text/javascript" src="st/pngfix.js"></script>
   <![endif]-->
   
   <script>
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

      ga('create', 'UA-42918769-1', 'videopixie.com');
      ga('require', 'displayfeatures');
      ga('send', 'pageview');
      
      var referrerCookieName = 'vpFirstReferrer';
      if (!readCookie(referrerCookieName)){
         var ref = document.referrer || 'empty';
         createCookie(referrerCookieName , ref ,365*2);
      }
   </script>
  
   
    
   
  
</head>
<body class="VP"  ng-controller="HomePageController">
   
   <div id="header">
      <a href="/"><img id="logo" src="/st/images/logo_text_and_pixie.png" alt="Videopixie"></a>
      <a id="phone" href="tel:1 800 510 6570">1 (800) 510-6570</a>
      
      
      
         
         <a href="/sign-in"><div class="button blue">Sign in</div></a>
         
         
      
      
      
      <a class="right-link" href="/pricing">Pricing</a>
      <a class="right-link" href="/video-school">Video School</a>
      <a class="right-link browse-link browse-link-first" href="/videographers">Videographers</a>
      <span class="link-spacer">|</span>
      <a class="right-link browse-link" href="/video-animators">Animators</a>
      <span class="link-spacer">|</span>
      <a class="right-link browse-link" href="/video-editors">Browse:&nbsp; Video editors</a>
      
   </div>
   
   
    

<div class="content" id="landing-page">
   <div class="container">
      <div class="left-col">
         <div class="title">
            <h1>Using stock footage in explainer videos</h1>
            <p class="sub-title"></p>
         </div>
         <div class="examples" >
         
            
            
               <div class="example-wrapper" >
                  <h3 class=""></h3>
                  <div class="p">Today, everyone has an explainer video for their product or business. Online audiences expect to find a concise video on home pages. Whether it is a video for a new style of shoe to the latest CRM integration platform, companies are investing in great video to sell their vision. So in this sea of media content, how do you set your explainer video apart?</div>
                  
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class=""></h3>
                  <div class="p"><img src="https://s3.amazonaws.com/our.s3.videopixie.com/landing/BlogPost_illustrationIsolated_1.jpg" style="float:left" height="200" width="200"/>
High quality, relevant stock footage, that's how.

Stock footage, when used tastefully, can be your biggest asset for keeping the viewers engaged and interested from intro to outro. However, be wary that it is very easy to slip into a cheesy infomercial when using stock footage. So easy in fact, that we at Videopixie decided to give you the 5 best tips for great results using stock footage.</div>
                  
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class="">1. General concepts</h3>
                  <div class="p">Choose clips that are relevant to your story but not exactly what the narration is explaining. Matching the voice over with imagery too closely leads to an A to A, B to B effect that is too simplistic, almost childish. Not to mention, it is difficult to find highly specified clips on stock sites that match your mood or style exactly. General concepts, instead, give you a large variety of clips.</div>
                  
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class="">2. High quality</h3>
                  <div class="p">Only download HD high bitrate footage. This may cost you more, but the increased quality from Standard Definition will keep your video professional and more attractive.</div>
                  
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class="">3. Rough cut</h3>
                  <div class="p">Download all of the clips that you think you will use as a preview. Then make a rough cut with the watermarked videos to see if you have chosen correctly. Alternatively, you can take screenshots of each clip and line them up in the order you desire. You can match these images with the script in a text document, creating a quick storyboard.</div>
                  
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class="">4. Quick cuts</h3>
                  <div class="p">Do not linger on one stock clip for very long. The sequences themselves are usually no more than 20 seconds, though there is no need to play out an entire clip. The joy of stock is that you can have a diverse collection of footage at low cost right at your fingertips. Use this to your advantage!</div>
                  
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class="">5. Custom animation</h3>
                  <div class="p">To take your explainer video to the next level, add custom animation over the stock footage. Really great videos make the royalty-free imagery their own without buying the exclusive license by layering cool 2D or 3D animation over the clips. The animation can go as far as being your product's app deck or online interface or being as simple as doodles referencing the voice over.</div>
                  
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class="">Now the question is, where do you find this stock footage?</h3>
                  <div class="p">We at Videopixie are a huge fan of Dissolve. Dissolve is newer to the stock game and boasts a full library of beautiful footage. Though smaller than Getty Images or Shutterstock, it has a more design oriented feel, keeping true creatives in mind with its curation.</div>
                  
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class="">Here are two excellent stock footage video product video made through Videopixie:</h3>
                  <div class="p"></div>
                  
                  
                  <div class="example thumbnail-wrapper"> 
                     
                     <div vp-poster="{provider: '', bucket: 's3.sellstage.com/', provider_id: '3e797585-2ae1-4ef1-af68-e11b56dcecbf', provider_thumbnail_id: ''}" ng-click="mediaClick('3e797585-2ae1-4ef1-af68-e11b56dcecbf',
                        $event,{
                           provider:'',
                           bucket: 's3.sellstage.com/'
                           
                        },{
                           media_width:960,
                           media_height:540,
                           width:960,
                           height:540
                        })">
                        <div class="thumbnail"></div>
                        <img class="arrow" src="/st/images/white-arrow.png">
                        <div class="dn about"></div>
                     </div>
                     
                     <p class="caption">Medicx Investor Pitch Video</p>
                     
                  </div>
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
            
               <div class="example-wrapper" >
                  <h3 class=""></h3>
                  <div class="p"></div>
                  
                  
                  <div class="example thumbnail-wrapper"> 
                     
                     <div vp-poster="{provider: '', bucket: 's3.sellstage.com/', provider_id: '7521271d-4e30-4800-a91f-f6671df66b7b', provider_thumbnail_id: ''}" ng-click="mediaClick('7521271d-4e30-4800-a91f-f6671df66b7b',
                        $event,{
                           provider:'',
                           bucket: 's3.sellstage.com/'
                           
                        },{
                           media_width:960,
                           media_height:540,
                           width:960,
                           height:540
                        })">
                        <div class="thumbnail"></div>
                        <img class="arrow" src="/st/images/white-arrow.png">
                        <div class="dn about"></div>
                     </div>
                     
                     <p class="caption">Ignite Event</p>
                     
                  </div>
                  
                  
                  <p class="body-lower"></p>
                  
               </div>
            
            
            
         </div>
      </div>
      <div class="right-col" ng-controller="RightColController">
         <div class="upper-section">
            
            
            
               <a class="cta" 
               
               href="/start?preset_type=EXPLAINER_FULLY_CUSTOM"
               
               class="">
                  <div class="button">Get Started</div>
               </a>
           
         </div>
         <div class="lower-section">
            <div class="vp-blurb">
               <p>Videopixie is a marketplace for video production</p>
               <ul>
                  <li>Choose from 700+ videographers, editors, animators & script-writers</li>
                  <li>Get bids, teasers and reels</li>
                  <li>Collaborate online</li>
               </ul>
            </div>
            
            
            <a class="get-started fl" href="/start">Take a tour</a>
            
            <div class="questions fl">
               <h3>Questions?</h3>
               <div>
                  <span>Call us: &nbsp; <a href="tel:1 800 510 6570">1 800 510 6570</a> or<span/><br/>
                  <span>Email: &nbsp;<a class="link" href="mailto:human@videopixie.com" target="VP_new_page">human@videopixie.com</a></span>
               </div>
            </div>
            <!--<div class="social">
               <h3>Follow-us:</h3>
               <a href="http://www.facebook.com/videopixie"><h2>f</h2></a>
               <a href="http://www.twitter.com/videopixie"><h2>t</h2></a>
               <a href="http://plus.google.com/117702735095411943777"><h2>g</h2></a>
            </div>-->
            
            
            <div class="social fl">
               <h3>Share:</h3>

               <a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.videopixie.com%2Fstock-footage-explainer-video" onclick="javascript:window.open(this.href,'','width=626,height=436'); return false;"><h2>f</h2></a>

               <a href="https://twitter.com/intent/tweet?text=Using%20stock%20footage%20in%20explainer%20videos&url=https%3A%2F%2Fwww.videopixie.com%2Fstock-footage-explainer-video&via=videopixie"><h2>t</h2></a>
               
               <a href="https://plus.google.com/share?url=https%3A%2F%2Fwww.videopixie.com%2Fstock-footage-explainer-video" onclick="javascript:window.open(this.href,'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><h2>g</h2></a>
            </div>
            
            
         </div>
      </div>
   </div>
</div>
<script>
           
try {
   var pageName = 'stock-footage-explainer-video';
   var pageVersion = 1;
   var propertiesForMixpanel = {};
   propertiesForMixpanel[pageName + "_version"] = pageVersion;
            
   SES.track( {event_name:'learn'} );
            
   SES.track({
      event_name:"viewed_"+pageName,
      p:propertiesForMixpanel,
      internal_event_name:"viewed_content_page",
      details: 'viewed_page='+pageName+';',
      should_not_post_event_to_internal:true
   });

} catch (e) {
   log.d("error logging to mixpanel");
}

try{
   createCookie('vp_coupon', '', 180);
} catch(e){

}
   
   
vpModule.controller('RightColController', ['$scope','$http', function ($scope,$http){

   $scope.sendCouponRequest = function(valid){
      
      log.d('sendCouponRequest() ',$scope.emailAddress,$scope.siteUrl);
      var url = '/collect_email';
      var requestNote = "50 percent off first project for wedding pro";
      
      
      $scope.sendingCouponRequest = true;
      
      if(!valid){
         $scope.sendingCouponRequest = false;
         return false;
      }
      
      $http.post(url,{
         emailAddress: $scope.emailAddress,
         siteUrl: $scope.siteUrl,
         requestNote: requestNote
      }).success(function(response){
         log.d('success: ',response);
         
         SES.track({event_name:'success collecting email'});
         
         if(response.success){
            $scope.sendingCouponRequest = false;
            $scope.couponRequestReceived = true; 
         }else {
            handleError(response);
         }
      }).error(function(err){
         log.d('error: ',err);
         handleError(err);
      });
      
      function handleError (info){
         SES.track({event_name:'error collecting email'});
         
         $scope.sendingCouponRequest = false;
         if (info.error){
            $scope.errorMsg = info.error.message;
         }
      }
   };
}]);

/*
(function(){
   try{
      var params = window.location.search.substring(1).split("&")
      for (var i=0; i<params.length; i++) {
         var param = params[i].split("=");
         if (param[0] === 'cta_url'){
            $('a.cta').attr('href', '/'+decodeURIComponent(param[1]));
         }         
      }   
   }catch(err){
      log.d('error ', err);
   }
   
})();*/

   

         
</script>

   
   <div id="footer">
      
      <div class="content">
         <img id="footer-logo" src="/st/images/logo_text_and_pixie.png" alt="videopixie logo">
         
         <div id="footer-left">
            <a href="/im_a_pro">Sign-up as a Professional</a>
            <a href="/video-production">Browse Video Producers</a>
            <a href="/learn-more">Learn More</a>
            <a href="/pricing">Pricing</a>
         </div>
         
         <div id="footer-left">
            <a href="/video-school">Video School</a>
            <a href="/about">Our Team</a>
            <a href="/jobs">Jobs</a>
            <a href="/faq">FAQ</a>
         </div>
      
         <div id="social-links">
            <a target="vp_facebook" href="//www.facebook.com/videopixie" class="facebook social-box">f</a>
            <a target="vp_twitter" href="//www.twitter.com/videopixie" class="twitter social-box">t</a>
            <a target="vp_google" href="//www.google.com/+videopixie" class="google social-box">g+</a>
            <a target="vp_linkedin" href="//www.linkedin.com/company/videopixie" class="linkedin social-box">in</a>
         </div>
         
         <div id="footer-bottom">
            <span>Copyright 2015 TT Labs Inc.</span>
            <a href="/st/privacy.html">Privacy Policy</a>
            <a href="/st/dmca.html">DMCA</a>
         </div>
      
      </div>
      
      
      
   </div>
  
   
   
   <div id="media-modal" class="modal modal-wrapper video-modal dn" vp-size="size" vp-fade="[[MediaModal]]" vp-closeable="MediaModal"  ng-controller="MediaModalController">
<!--vp-fade-but-leave-in-display="MediaModal" -->

   <div id="media-background" vp-width-by-aspect="[[aspectRatio]]"></div>
   <div id="image-wrapper"
      ng-class="{ontop: imageViewerMode, small_hide: !imageViewerMode}"
      vp-img-child="src: '[[imageSrc]]', valid: true">
      <!--img is inserted by vp-img-child -->
   </div>
   <div id="player-wrapper" ng-class="{small_hide: imageViewerMode}">
      <video id="video-element" class="video-js vjs-default-skin" controls ng-controller = "VideoPlayerController"></video>
      <div id="video-overlay" ng-bind-html="overlayHtml">
         
      </div>
   </div>
   
   <div id="sidebar-wrapper">
      
      <div ng-show="mode.design_mode" ng-controller="DesignSideBarController" class="side-bar designSideBar"><!-- Design Mode -->
         
         <div class="font-14-999 fr">[[currentQuestion.name]]</div>
         <div class="currentOptionWrapper clearfix">
         
            <div class="option clearfix"
               ng-click="onCurrentOptionClick()"
               ng-class="{selected:currentOption.selected}"
               vp-hover-exclusion="not-hot">
               <div class="mainRow fl">
                  <div class="thumbnailWrapper fl" 
                     vp-img-child="src: '[[AWS + mediaData.bucket + currentOption.video.provider_id]]' + '_120h.jpg', valid: [[!!currentOption.video.provider_id]]">
                     <!--img is inserted by vp-img-child -->
                     
                  </div>
                  <div class="font-16-666-b optionName fl">[[currentOption.name]]</div>
                  <div class="ok"></div>
               </div>
               <div class="font3 details fl">[[currentOption.details]]</div>
            </div>
            
         </div>
         
         <div class = "otherOptionsWrapper">
            
            <div class="bar"></div>
            <div class="font4 subtitle">Other [[currentQuestion.name]] options:</div>
            <div class="vp-scroll-bar vp-scroll-shadows scroll-wrapper">
               <div class="option clearfix" 
                  ng-repeat="(optionIdx,option) in currentQuestion.options" 
                  ng-hide='optionIdx == currentOptionIdx || option.hidden || option.renderer == "lengthInput"'
                  ng-class="{clickable:option.video.provider_id}"
                  ng-click="onOtherOptionClick(optionIdx)">
                  
                  <div class="thumbnailWrapper fl"
                     vp-img-child="src: '[[AWS + mediaData.bucket + option.video.provider_id]]' + '_120h.jpg', valid: [[!!option.video.provider_id]]">
                     <!--img is inserted by vp-img-child -->
                     
                     <div class="no-example" ng-hide="option.video.provider_id">No example</div>
                  </div>
                  <div class="font3 optionName">[[option.name]]</div>               
               </div>
            </div>
         </div>
         
      </div>
      
      <div ng-show="mode.html_mode" class="html-side-bar side-bar">
      
         <div ng-bind-html="htmlSidebarContent"></div>
      
      </div>
         
      
   </div>
   <div class="x close"></div>
</div>

   
   <div class="dimmer dn" vp-fade="[[Dimmer]]" vp-match-document-height></div>
   
   <div id="fb-root"></div>
      
   
   <!-- begin olark code -->
   <script data-cfasync="false" type='text/javascript'>
   /*<![CDATA[*/
   if(!SES.is_dev_enviro){
      window.olark||(function(c){var f=window,d=document,l=f.location.protocol=="https:"?"https:":"http:",z=c.name,r="load";var nt=function(){
      f[z]=function(){
      (a.s=a.s||[]).push(arguments)};var a=f[z]._={
      },q=c.methods.length;while(q--){(function(n){f[z][n]=function(){
      f[z]("call",n,arguments)}})(c.methods[q])}a.l=c.loader;a.i=nt;a.p={
      0:+new Date};a.P=function(u){
      a.p[u]=new Date-a.p[0]};function s(){
      a.P(r);f[z](r)}f.addEventListener?f.addEventListener(r,s,false):f.attachEvent("on"+r,s);var ld=function(){function p(hd){
      hd="head";return["<",hd,"></",hd,"><",i,' onl' + 'oad="var d=',g,";d.getElementsByTagName('head')[0].",j,"(d.",h,"('script')).",k,"='",l,"//",a.l,"'",'"',"></",i,">"].join("")}var i="body",m=d[i];if(!m){
      return setTimeout(ld,100)}a.P(1);var j="appendChild",h="createElement",k="src",n=d[h]("div"),v=n[j](d[h](z)),b=d[h]("iframe"),g="document",e="domain",o;n.style.display="none";m.insertBefore(n,m.firstChild).id=z;b.frameBorder="0";b.id=z+"-loader";if(/MSIE[ ]+6/.test(navigator.userAgent)){
      b.src="javascript:false"}b.allowTransparency="true";v[j](b);try{
      b.contentWindow[g].open()}catch(w){
      c[e]=d[e];o="javascript:var d="+g+".open();d.domain='"+d.domain+"';";b[k]=o+"void(0);"}try{
      var t=b.contentWindow[g];t.write(p());t.close()}catch(x){
      b[k]=o+'d.write("'+p().replace(/"/g,String.fromCharCode(92)+'"')+'");d.close();'}a.P(2)};ld()};nt()})({
      loader: "static.olark.com/jsclient/loader0.js",name:"olark",methods:["configure","extend","declare","identify"]});
      /* custom configuration goes here (www.olark.com/documentation) */
      olark.identify('3567-618-10-4944');
   }/*]]>*/
   </script>
   <noscript><a href="https://www.olark.com/site/3567-618-10-4944/contact" title="Contact us" target="_blank">Questions? Feedback?</a> powered by <a href="http://www.olark.com?welcome" title="Olark live chat software">Olark live chat software</a></noscript>
   <!-- end olark code -->
   
  
   
   <!-- Google Code for Remarketing Tag -->
   <!--------------------------------------------------
   Remarketing tags may not be associated with personally identifiable information or placed on pages related to sensitive categories. See more information and instructions on how to setup the tag on: http://google.com/ads/remarketingsetup
   --------------------------------------------------->
   <script type="text/javascript">
   /* <![CDATA[ */
   var google_conversion_id = 993449120;
   var google_custom_params = window.google_tag_params;
   var google_remarketing_only = true;
   /* ]]> */
   </script>
   <script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
   </script>
   <noscript>
      <div style="display:inline;">
         <img height="1" width="1" style="border-style:none;" alt="" src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/993449120/?value=0&amp;guid=ON&amp;script=0"/>
      </div>
   </noscript>

   
   <script type="text/javascript">
      (function() {
         window._pa = window._pa || {};
         // _pa.orderId = "myOrderId"; // OPTIONAL: attach unique conversion identifier to conversions
         // _pa.revenue = "19.99"; // OPTIONAL: attach dynamic purchase values to conversions
         // _pa.productId = "myProductId"; // OPTIONAL: Include product ID for use with dynamic ads
         var pa = document.createElement('script'); pa.type = 'text/javascript'; pa.async = true;
         pa.src = ('https:' == document.location.protocol ? 'https:' : 'http:') + "//tag.perfectaudience.com/serve/53dac13adc92cfda2d000130.js";
         var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(pa, s);
      })();
   </script>
   
</body>
</html>
