<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 ---------->
<header>
<div class="container-fluid">
<div class="row zsx">
<div class="col-lg-12 animated lightSpeedIn">
<p class="vcenter">
<h1><i class="fa fa-bomb fa-lg"></i> TheBombWebsite</h1>
<h3>Everything explosion related</h3>
</p>
</div>
</div>
</div>
</header>
<nav class="navbar navbar-default navbar-static-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#zsxnavcollapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- <a class="navbar-brand" href="#top">TheBombHome</a> -->
</div>
<div class="collapse navbar-collapse pull-right" id="zsxnavcollapse">
<ul class="nav navbar-nav">
<li><a href="#">POW</a></li>
<li><a href="#">BOOM</a></li>
<li><a href="#">BANG</a></li>
<li><a href="mailto:mathieu@zeroserieux.com">CONTACT THE BOMB!</a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col-xs-12">
<h2 class="text-center">this snippet has nothing of value! (resize, maybe you'll like it...)</h2>
<div class="row">
<div class="col-xs-12">
<h4>JS to Fix:</h4>
<ul>- Adjust the numbers in reSize function to suit the resize ratio you need</ul>
<ul>- The javascript resize is very customizable.. Let your brain do some magic maybe</ul>
</div>
</div>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
/*
* Custom stylesheet for http://----.ca
* Initial version on 2016.02.22 intended for the website's temporary page.
* Modified on 2016.02.27 to share on bootsnipp.com
*
* Created by Mathieu Aubin (mathieu@zeroserieux.com)
*
* Contribute to have your name here, no matter how small of a change.
*
* Licenced under the WTFPL Version 2 (http://www.wtfpl.net/)
*
* This program is free software. It comes without any warranty, to
* the extent permitted by applicable law. You can redistribute it
* and/or modify it under the terms of the Do What The Fuck You Want
* To Public License, Version 2, as published by Sam Hocevar. See
* http://www.wtfpl.net/ for more details.
*
*/
/* Font-Awesome v4.5.0 - (http://fortawesome.github.io/Font-Awesome/) */
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css") all;
/* Google-Fonts */
@import url("https://fonts.googleapis.com/css?family=Buenard:700") all;
body {
#padding-top: 250px;
}
.zsx {
background-color: rgba(128, 0, 5, 0.85);
}
.zsx h1, .zsx h3{
text-align:center;
color:#fff;
}
.zsx h1{
font-size:110px;
font-family:'Buenard', serif;
font-weight:bold;
text-transform:inherit;
margin: 0px auto 0px;
text-shadow: 2px 2px 2px #000;
-webkit-text-shadow: 2px 2px 2px #000;
-moz-text-shadow: 2px 2px 2px #000;
}
.zsx h3{
font-size: 25px;
font-weight:lighter;
margin: 0px auto 15px;
}
/*
* Custom javascript for http://----.ca
* Initial version on 2016.02.22 intended for the website's temporary page.
* Modified on 2016.02.27 to share on bootsnipp.com
*
* Created by Mathieu Aubin (mathieu@zeroserieux.com)
*
* Contribute to have your name here, no matter how small of a change.
*
* Licenced under the WTFPL Version 2 (http://www.wtfpl.net/)
*
* This program is free software. It comes without any warranty, to
* the extent permitted by applicable law. You can redistribute it
* and/or modify it under the terms of the Do What The Fuck You Want
* To Public License, Version 2, as published by Sam Hocevar. See
* http://www.wtfpl.net/ for more details.
*
*/
/* Change the numbers to adjust your resize ratio */
function reSize() {
var n = $("body").width() / 15;
$("h1").css('fontSize', n + "pt");
$("h3").css('fontSize', (n/20) * 4.2 + "pt");
}
$(window).on("resize", reSize);
$(document).ready(reSize);
(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-70761127-6', 'auto'); ga('send', 'pageview');
