Skip to main content

A fully responsive Code HTML & CSS

 


A fully responsive Code HTML & CSS

<html>

<head>

<title>JNBCS TEMPLATED</title>

<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />

<link rel="stylesheet" href="assets/css/main.css" />

</head>

<body>


<!-- Header -->

<header id="header">

<div class="inner">

<a href="index.html" class="logo">JNBCS</a>

<nav id="nav">

<a href="index.html">Home</a>

<a href="generic.html">Generic</a>

<a href="elements.html">Elements</a>

</nav>

</div>

</header>

<a href="#menu" class="navPanelToggle"><span class="fa fa-bars"></span></a>


<!-- Banner -->

<section id="banner">

<div class="inner">

<h1>JNBCS<span>A fully responsive<br />

site template by JNBCS</span></h1>

<ul class="actions">

<li><a href="#" class="button alt">Get Started</a></li>

</ul>

</div>

</section>


<!-- One -->

<section id="one">

<div class="inner">

<header>

<h2>Magna Etiam Lorem</h2>

</header>

<p>Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula. Integer adipiscin sem. Nullam quis massa sit amet nibh viverra malesuada. Nunc sem lacus, accumsan quis, faucibus non, congue vel, arcu, erisque hendrerit tellus. Integer sagittis. Vivamus a mauris eget arcu gravida tristique. Nunc iaculis mi in ante.</p>

<ul class="actions">

<li><a href="#" class="button alt">Learn More</a></li>

</ul>

</div>

</section>


<!-- Two -->

<section id="two">

<div class="inner">

<article>

<div class="content">

<header>

<h3>Pellentesque adipis</h3>

</header>

<div class="image fit">

<img src="images/pic01.jpg" alt="" />

</div>

<p>Cumsan mollis eros. Pellentesque a diam sit amet mi magna ullamcorper vehicula. Integer adipiscin sem. Nullam quis massa sit amet lorem ipsum feugiat tempus.</p>

</div>

</article>

<article class="alt">

<div class="content">

<header>

<h3>Morbi interdum mol</h3>

</header>

<div class="image fit">

<img src="images/pic02.jpg" alt="" />

</div>

<p>Cumsan mollis eros. Pellentesque a diam sit amet mi magna ullamcorper vehicula. Integer adipiscin sem. Nullam quis massa sit amet lorem ipsum feugiat tempus.</p>

</div>

</article>

</div>

</section>


<!-- Three -->

<section id="three">

<div class="inner">

<article>

<div class="content">

<span class="icon fa-laptop"></span>

<header>

<h3>Tempus Feugiat</h3>

</header>

<p>Morbi interdum mollis sapien. Sed ac risus. Phasellus lacinia, magna lorem ullamcorper laoreet, lectus arcu.</p>

<ul class="actions">

<li><a href="#" class="button alt">Learn More</a></li>

</ul>

</div>

</article>

<article>

<div class="content">

<span class="icon fa-diamond"></span>

<header>

<h3>Aliquam Nulla</h3>

</header>

<p>Ut convallis, sem sit amet interdum consectetuer, odio augue aliquam leo, nec dapibus tortor nibh sed.</p>

<ul class="actions">

<li><a href="#" class="button alt">Learn More</a></li>

</ul>

</div>

</article>

<article>

<div class="content">

<span class="icon fa-laptop"></span>

<header>

<h3>Sed Magna</h3>

</header>

<p>Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula.</p>

<ul class="actions">

<li><a href="#" class="button alt">Learn More</a></li>

</ul>

</div>

</article>

</div>

</section>


<!-- Footer -->

<section id="footer">

<div class="inner">

<header>

<h2>Get in Touch</h2>

</header>

<form method="post" action="#">

<div class="field half first">

<label for="name">Name</label>

<input type="text" name="name" id="name" />

</div>

<div class="field half">

<label for="email">Email</label>

<input type="text" name="email" id="email" />

</div>

<div class="field">

<label for="message">Message</label>

<textarea name="message" id="message" rows="6"></textarea>

</div>

<ul class="actions">

<li><input type="submit" value="Send Message" class="alt" /></li>

</ul>

</form>

<div class="copyright">

&copy; Untitled Design: <a href="">JNBCS</a>. Images <a href="https://unsplash.com/">Unsplash</a>

</div>

</div>

</section>


<!-- Scripts -->

<script src="assets/js/jquery.min.js"></script>

<script src="assets/js/skel.min.js"></script>

<script src="assets/js/util.js"></script>

<script src="assets/js/main.js"></script>


</body>

</html>



Labels:

Comments

Post a Comment

Popular posts from this blog

From the Colorado section of the Mountain Directory West

  The descent on the westbound side of Vail Pass is about 10 miles in length and begins at milepost 189 on I-70. One half mile west of the summit there are warning signs for westbound traffic--"Speed limit 45 mph for vehicles over 30,000 lbs." and "Steep grade next 8 miles--trucks stay in lower gear."  The next mile is rolling hills.  Then there is a sign--"7% grade next 7 miles." The descent is steady at 7% and there are 3 advisory signs for the first runaway truck ramp which is about milepost 185 or 4 miles down from the summit.  The escape ramp is upsloping on the right.  The second runaway truck ramp is about milepost 182, which is 3¼ miles after the first escape ramp, or about 7¼ miles down from the summit.   There are several advisory signs before reaching it and it is an upsloping ramp on the right.  Don't be fooled when the grade eases after the second escape ramp.  It soon goes back to 7% and doesn't bottom out until 2½ miles after t...
Post a Comment
Read more

5 Superb Anniversary Gifts for Husband

F or a wife, one of the special days in her life is that of her anniversary when she celebrates her being married to her husband and showers him with lots of gifts and love to show her affection towards him. If your anniversary is around the corner and you just do not know what you should gift your husband, then we can help suggest some superb gifts for the special man in your life to show your love for him and make him feel special on this special day! Watch A nice branded watch which is in your husband’s favorite color would be an ideal gift for him as it would be quite useful for him and attractive too. You can ask his friend or family member to help you with the same so that you choose nothing but the best for your man. Just keep in mind that you buy a watch which has the specifications that your husband might look for in his watch like the seconds stick and date along with showing the time. Massage and spa Your husband puts in hours of hard work to keep you and your children happy...
2 comments
Read more

What is affiliate marketing and how we earn from affiliate marketing ?

  Before we start, we must discuss the question of affiliate marketing first. What is affiliate marketing? Essentially, an affiliate program involves increasing the effectiveness of the business by earning revenue from affiliate sales to more buyers by directing them to the business. One way to look at affiliates is to define them as a small business which stands up on a market and who receives revenue from affiliate purchases. If you are familiar with affiliate marketing in the SEO realm, you have likely seen multiple affiliate programs that allow you to generate lots of money and earn cash from them. These programs allow you to take advantage of the experience that a certain user may have had searching, or even by placing an advertisement in the right point of view. More importantly, affiliate marketing gives businesses an opportunity to make money from affiliate purchases in a way that more closely resembles any other ad company as well as giving the user the feeling of brand af...
Post a Comment
Read more