-
Notifications
You must be signed in to change notification settings - Fork 0
/
commercials.html
117 lines (114 loc) · 5.13 KB
/
commercials.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bangarang Films</title>
<link href="https://fonts.googleapis.com/css?family=BenchNine:400,700" rel="stylesheet" type="text/css" />
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link href="css/animate.css" rel="stylesheet">
<link href="src/less/styles.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<!-- bars in toggle button -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><span class="text-logo"></span></a>
</div> <!-- .navbar-header -->
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right text-center">
<li><a href="who_we_are.html">WHO WE ARE</a></li>
<li><a href="what_we_do.html">WHAT WE DO</a></li>
<li><a href="our_work.html">OUR WORK</a></li>
<li><a href="contact.html">CONTACT</a></li>
<li class="social">
<a href="http://facebook.com/bangarangfilms" target="_blank">
<i class="fa fa-spacebook"></i>
</a>
<a href="http://twitter.com/bangarangfilms" target="_blank">
<i class="fa fa-tweeter"></i>
</a>
<a href="http://youtube.com/bangarangfilms" target="_blank">
<i class="fa fa-utuuuubeeee"></i>
</a>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="blue-stripe stripe"></div>
<div class="green-stripe stripe"></div>
<div class="container-fluid animated fadeIn">
<div class="title text-center">
<h1><span class="text-secondary">COMMERCIALS</span></h1>
</div>
<div class="main_blurb">
<h4>
Effective advertising can play a huge role in a company's growth and success. We strive to produce commercials that truly break from the mold and give your company the competitive advantage that it needs. With backgrounds in marketing and communications, we're in a great position to connect with your target market and deliver a commercial that will launch your business to new heights.
</h4>
</div>
<div class="row">
<div class="video_info_pane">
<div class="embed-responsive embed-responsive-16by9" id="video_window">
<iframe class="embed-responsive-item" src="https://player.vimeo.com/video/51732943?color=4cff24&title=0&byline=0&portrait=0" allowfullscreen></iframe>
</div>
</div>
<div class="video_list">
<ul>
<li class="video_link active" data-video="ecomagination">
<a href="#">Ecomagination</a>
</li>
<li class="video_link link_blue" data-video="apollo">
<a href="#">Apollo 543</a>
</li>
<li class="video_link" data-video="vegas">
<a href="#">More Money For You</a>
</li>
<li class="video_link link_blue" data-video="qwest">
<a href="#">QWEST</a>
</li>
<li class="video_link" data-video="sniagrab">
<a href="#">SNIAGRAB</a>
</li>
<li class="video_link link_blue" data-video="ripp_harris">
<a href="#">RIPP Charles Harris - Dead Men's Tales</a>
</li>
<li class="video_link " data-video="ripp_tew">
<a href="#">RIPP Thomas Tew - Dead Men's Tales</a>
</li>
<li class="video_link link_blue" data-video="ripp_wall">
<a href="#">RIPP Rachel Wall - Dead Men's Tales</a>
</li>
</ul>
</div>
<div class="col-sm-2"></div>
</div>
<div class="row" id="details_window">
<div class="video_details" data-count="0">
<h2 class="text-primary">Ecomagination Contest Entry</h2>
<h3>
A commercial contest entry for a company's environmental initiative, filmed on the Canon 60D at Portsmouth Abbey School in Portsmouth, RI.
</h3>
</div>
</div>
</div> <!-- container -->
<div class="footer text-center">
<h4>VIDEO PRODUCTION IN BOSTON, MA</h4>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<script src="js/video_categories.js" type="text/javascript"></script>
</body>
</html>