"Fleenor"
Bootstrap 3.3.0 Snippet by rogerwillis

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
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link href="https://fonts.googleapis.com/css?family=Abel|Crimson+Text|Playfair+Display+SC" rel="stylesheet">
<nav class="navbar navbar-trans navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-collapse collapse" id="navbar-collapsible">
<ul class="nav navbar-nav navbar-left">
<li><a href="#section1">MAN</a></li>
<li><a href="#section2">MIND</a></li>
<li><a href="#section3">MISSION</a></li>
<li><a href="#section4">VENUES</a></li>
<li><a href="#section5">CULTIVATE</a></li>
<li>·</li>
</ul>
</div>
</div>
</nav>
<section class="container-fluid" id="section1">
<h1 class="text-center v-center">THE MAN</h1>
<div class="container">
<div class="row">
<div class="col-sm-12 text-center">
<div class="row">
<div class="col-sm-10 col-sm-offset-1 text-center">
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://player.vimeo.com/video/220189667" width="960" height="540" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
/*
A custom Bootstrap 3.1 template
from http://bootply.com
This CSS code should follow the 'bootstrap.css'
in your HTML file.
license: MIT
author: bootply.com
*/
html,body {
height:100%;
background:center no-repeat fixed url('http://devinfleenor.com/wp-content/uploads/2017/04/devin-bg-darker.jpg');
background-size: cover;
color:#ddd;
font-family: 'Abel', sans-serif;
font-size: 18px;
}
h1,h2 {font-size:35px; letter-spacing: .5rem;}
h3 {
font-size: 1.1rem;
line-height: 1.5;
letter-spacing: .5rem;
margin-bottom:25px;
}
.icon-bar {
background-color:#fff;
}
.navbar-trans {
background-color:#279ddd;
color:#fff;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
/* activate scrollspy menu */
$('body').scrollspy({
target: '#navbar-collapsible',
offset: 100
});
/* smooth scrolling sections */
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top - 50
}, 1000);
return false;
}
}
});
var df = document.getElementsByClassName("joinus");
var i;
function click_action(){
$('.joinus').removeClass('active');
$('.panel').removeClass('show');
this.classList.toggle("active");
this.nextElementSibling.classList.toggle("show");
$('html, body').animate({
scrollTop: $(this).offset().top
}, 100);
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: