"Bootstrap 4 business website template"
Bootstrap 4.1.1 Snippet by grafreez

Post to Facebook Tweet this

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/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!-- Top navigation -->
<nav class="navbar navbar-expand-md fixed-top top-nav">
<div class="container">
<a class="navbar-brand" href="#"><strong>Grafreez</strong></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="navbar-toggler-icon"><i class="fa fa-bars" aria-hidden="true"></i></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="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Team</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Prices</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">FAQ's</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
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
/*Google Fonts*/
@import url('https://fonts.googleapis.com/css?family=Montserrat:500,600,700');
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700');
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
body, html{
height: 100%;
width:100%;
}
body{
font-size: 1rem;
font-family: 'Source Sans Pro', sans-serif;
}
/* ========== Universal Stylings ========== */
h1,h2,h3,h4,h5{
position: relative;
font-family: 'Montserrat', sans-serif;
}
h6{
position: relative;
text-transform: uppercase;
}
.bg-primary{
background-color: #35CBDF!important;
}
.text-inverse{
color: #074052;
}
.text-primary{
color: #35CBDF!important;
}
.btn{
font-family: 'Montserrat', sans-serif;
font-size: 1rem;
font-weight: 600;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// Sticky Header
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= 100) {
$(".top-nav").addClass("light-header");
} else {
$(".top-nav").removeClass("light-header");
}
});
// Year for copy content
$(function(){
var theYear = new Date().getFullYear();
$('#year').html(theYear);
});
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Paper Kit Pro
Responsive Invoice template
BS4 clean & simple invoice template
Elegant Bootstrap 4 message chat box template

Questions / Comments: