add background image and header
This commit is contained in:
BIN
images/bg.jpg
Normal file → Executable file
BIN
images/bg.jpg
Normal file → Executable file
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB After Width: | Height: | Size: 1.2 MiB |
916
index.html
916
index.html
@@ -1,458 +1,458 @@
|
|||||||
<!DOCTYPE HTML>
|
<!DOCTYPE HTML>
|
||||||
<!--
|
<!--
|
||||||
Highlights by HTML5 UP
|
Highlights by HTML5 UP
|
||||||
html5up.net | @ajlkn
|
html5up.net | @ajlkn
|
||||||
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
-->
|
-->
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>Highlights by HTML5 UP</title>
|
<title>Wolfang Torres's personal page</title>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
|
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
|
||||||
<link rel="stylesheet" href="assets/css/main.css" />
|
<link rel="stylesheet" href="assets/css/main.css" />
|
||||||
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
|
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
|
||||||
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
|
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<!-- Header -->
|
<!-- Header -->
|
||||||
<section id="header">
|
<section id="header">
|
||||||
<header class="major">
|
<header class="major">
|
||||||
<h1>Highlights</h1>
|
<h1>Wolfang Torres</h1>
|
||||||
<p>A fun little { responsive } single pager by <a href="http://html5up.net">HTML5 UP</a></p>
|
<p>Freelancer Programmer, Mechatronics Engineer, Cisco CCNA</p>
|
||||||
</header>
|
</header>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<ul class="actions">
|
<ul class="actions">
|
||||||
<li><a href="#one" class="button special scrolly">Begin</a></li>
|
<li><a href="#one" class="button special scrolly">Begin</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- One -->
|
<!-- One -->
|
||||||
<section id="one" class="main special">
|
<section id="one" class="main special">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<span class="image fit primary"><img src="images/pic01.jpg" alt="" /></span>
|
<span class="image fit primary"><img src="images/pic01.jpg" alt="" /></span>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<header class="major">
|
<header class="major">
|
||||||
<h2>Who I am</h2>
|
<h2>Who I am</h2>
|
||||||
</header>
|
</header>
|
||||||
<p>Aliquam ante ac id. Adipiscing interdum lorem praesent fusce pellentesque arcu feugiat. Consequat sed ultricies rutrum. Sed adipiscing eu amet interdum lorem blandit vis ac commodo aliquet integer vulputate phasellus lorem ipsum dolor lorem magna consequat sed etiam adipiscing interdum.</p>
|
<p>Aliquam ante ac id. Adipiscing interdum lorem praesent fusce pellentesque arcu feugiat. Consequat sed ultricies rutrum. Sed adipiscing eu amet interdum lorem blandit vis ac commodo aliquet integer vulputate phasellus lorem ipsum dolor lorem magna consequat sed etiam adipiscing interdum.</p>
|
||||||
</div>
|
</div>
|
||||||
<a href="#two" class="goto-next scrolly">Next</a>
|
<a href="#two" class="goto-next scrolly">Next</a>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Two -->
|
<!-- Two -->
|
||||||
<section id="two" class="main special">
|
<section id="two" class="main special">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<span class="image fit primary"><img src="images/pic02.jpg" alt="" /></span>
|
<span class="image fit primary"><img src="images/pic02.jpg" alt="" /></span>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<header class="major">
|
<header class="major">
|
||||||
<h2>Stuff I do</h2>
|
<h2>Stuff I do</h2>
|
||||||
</header>
|
</header>
|
||||||
<p>Consequat sed ultricies rutrum. Sed adipiscing eu amet interdum lorem blandit vis ac commodo aliquet vulputate.</p>
|
<p>Consequat sed ultricies rutrum. Sed adipiscing eu amet interdum lorem blandit vis ac commodo aliquet vulputate.</p>
|
||||||
<ul class="icons-grid">
|
<ul class="icons-grid">
|
||||||
<li>
|
<li>
|
||||||
<span class="icon major fa-camera-retro"></span>
|
<span class="icon major fa-camera-retro"></span>
|
||||||
<h3>Magna Etiam</h3>
|
<h3>Magna Etiam</h3>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<span class="icon major fa-pencil"></span>
|
<span class="icon major fa-pencil"></span>
|
||||||
<h3>Lorem Ipsum</h3>
|
<h3>Lorem Ipsum</h3>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<span class="icon major fa-code"></span>
|
<span class="icon major fa-code"></span>
|
||||||
<h3>Nulla Tempus</h3>
|
<h3>Nulla Tempus</h3>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<span class="icon major fa-coffee"></span>
|
<span class="icon major fa-coffee"></span>
|
||||||
<h3>Sed Feugiat</h3>
|
<h3>Sed Feugiat</h3>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<a href="#three" class="goto-next scrolly">Next</a>
|
<a href="#three" class="goto-next scrolly">Next</a>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Three -->
|
<!-- Three -->
|
||||||
<section id="three" class="main special">
|
<section id="three" class="main special">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<span class="image fit primary"><img src="images/pic03.jpg" alt="" /></span>
|
<span class="image fit primary"><img src="images/pic03.jpg" alt="" /></span>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<header class="major">
|
<header class="major">
|
||||||
<h2>One more thing</h2>
|
<h2>One more thing</h2>
|
||||||
</header>
|
</header>
|
||||||
<p>Aliquam ante ac id. Adipiscing interdum lorem praesent fusce pellentesque arcu feugiat. Consequat sed ultricies rutrum. Sed adipiscing eu amet interdum lorem blandit vis ac commodo aliquet integer vulputate phasellus lorem ipsum dolor lorem magna consequat sed etiam adipiscing interdum.</p>
|
<p>Aliquam ante ac id. Adipiscing interdum lorem praesent fusce pellentesque arcu feugiat. Consequat sed ultricies rutrum. Sed adipiscing eu amet interdum lorem blandit vis ac commodo aliquet integer vulputate phasellus lorem ipsum dolor lorem magna consequat sed etiam adipiscing interdum.</p>
|
||||||
</div>
|
</div>
|
||||||
<a href="#footer" class="goto-next scrolly">Next</a>
|
<a href="#footer" class="goto-next scrolly">Next</a>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Four -->
|
<!-- Four -->
|
||||||
<!--
|
<!--
|
||||||
<section id="four" class="main">
|
<section id="four" class="main">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<header class="major">
|
<header class="major">
|
||||||
<h2>Elements</h2>
|
<h2>Elements</h2>
|
||||||
</header>
|
</header>
|
||||||
<section>
|
<section>
|
||||||
<h4>Text</h4>
|
<h4>Text</h4>
|
||||||
<p>This is <b>bold</b> and this is <strong>strong</strong>. This is <i>italic</i> and this is <em>emphasized</em>.
|
<p>This is <b>bold</b> and this is <strong>strong</strong>. This is <i>italic</i> and this is <em>emphasized</em>.
|
||||||
This is <sup>superscript</sup> text and this is <sub>subscript</sub> text.
|
This is <sup>superscript</sup> text and this is <sub>subscript</sub> text.
|
||||||
This is <u>underlined</u> and this is code: <code>for (;;) { ... }</code>. Finally, <a href="#">this is a link</a>.</p>
|
This is <u>underlined</u> and this is code: <code>for (;;) { ... }</code>. Finally, <a href="#">this is a link</a>.</p>
|
||||||
<hr />
|
<hr />
|
||||||
<header>
|
<header>
|
||||||
<h4>Heading with a Subtitle</h4>
|
<h4>Heading with a Subtitle</h4>
|
||||||
<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
|
<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
|
||||||
</header>
|
</header>
|
||||||
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
|
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
|
||||||
<header>
|
<header>
|
||||||
<h5>Heading with a Subtitle</h5>
|
<h5>Heading with a Subtitle</h5>
|
||||||
<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
|
<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
|
||||||
</header>
|
</header>
|
||||||
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
|
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
|
||||||
<hr />
|
<hr />
|
||||||
<h2>Heading Level 2</h2>
|
<h2>Heading Level 2</h2>
|
||||||
<h3>Heading Level 3</h3>
|
<h3>Heading Level 3</h3>
|
||||||
<h4>Heading Level 4</h4>
|
<h4>Heading Level 4</h4>
|
||||||
<h5>Heading Level 5</h5>
|
<h5>Heading Level 5</h5>
|
||||||
<h6>Heading Level 6</h6>
|
<h6>Heading Level 6</h6>
|
||||||
<hr />
|
<hr />
|
||||||
<h5>Blockquote</h5>
|
<h5>Blockquote</h5>
|
||||||
<blockquote>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan faucibus. Vestibulum ante ipsum primis in faucibus lorem ipsum dolor sit amet nullam adipiscing eu felis.</blockquote>
|
<blockquote>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan faucibus. Vestibulum ante ipsum primis in faucibus lorem ipsum dolor sit amet nullam adipiscing eu felis.</blockquote>
|
||||||
<h5>Preformatted</h5>
|
<h5>Preformatted</h5>
|
||||||
<pre><code>i = 0;
|
<pre><code>i = 0;
|
||||||
|
|
||||||
while (!deck.isInOrder()) {
|
while (!deck.isInOrder()) {
|
||||||
print 'Iteration ' + i;
|
print 'Iteration ' + i;
|
||||||
deck.shuffle();
|
deck.shuffle();
|
||||||
i++;
|
i++;
|
||||||
}
|
}
|
||||||
|
|
||||||
print 'It took ' + i + ' iterations to sort the deck.';</code></pre>
|
print 'It took ' + i + ' iterations to sort the deck.';</code></pre>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<h4>Lists</h4>
|
<h4>Lists</h4>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="6u 12u$(medium)">
|
<div class="6u 12u$(medium)">
|
||||||
<h5>Unordered</h5>
|
<h5>Unordered</h5>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Dolor pulvinar etiam.</li>
|
<li>Dolor pulvinar etiam.</li>
|
||||||
<li>Sagittis adipiscing.</li>
|
<li>Sagittis adipiscing.</li>
|
||||||
<li>Felis enim feugiat.</li>
|
<li>Felis enim feugiat.</li>
|
||||||
</ul>
|
</ul>
|
||||||
<h5>Alternate</h5>
|
<h5>Alternate</h5>
|
||||||
<ul class="alt">
|
<ul class="alt">
|
||||||
<li>Dolor pulvinar etiam.</li>
|
<li>Dolor pulvinar etiam.</li>
|
||||||
<li>Sagittis adipiscing.</li>
|
<li>Sagittis adipiscing.</li>
|
||||||
<li>Felis enim feugiat.</li>
|
<li>Felis enim feugiat.</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="6u$ 12u(medium)">
|
<div class="6u$ 12u(medium)">
|
||||||
<h5>Ordered</h5>
|
<h5>Ordered</h5>
|
||||||
<ol>
|
<ol>
|
||||||
<li>Dolor pulvinar etiam.</li>
|
<li>Dolor pulvinar etiam.</li>
|
||||||
<li>Etiam vel felis viverra.</li>
|
<li>Etiam vel felis viverra.</li>
|
||||||
<li>Felis enim feugiat.</li>
|
<li>Felis enim feugiat.</li>
|
||||||
<li>Dolor pulvinar etiam.</li>
|
<li>Dolor pulvinar etiam.</li>
|
||||||
<li>Etiam vel felis lorem.</li>
|
<li>Etiam vel felis lorem.</li>
|
||||||
<li>Felis enim et feugiat.</li>
|
<li>Felis enim et feugiat.</li>
|
||||||
</ol>
|
</ol>
|
||||||
<h5>Icons</h5>
|
<h5>Icons</h5>
|
||||||
<ul class="icons">
|
<ul class="icons">
|
||||||
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
|
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
|
||||||
<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
|
<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
|
||||||
<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
|
<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
|
||||||
<li><a href="#" class="icon fa-github"><span class="label">Github</span></a></li>
|
<li><a href="#" class="icon fa-github"><span class="label">Github</span></a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<h5>Actions</h5>
|
<h5>Actions</h5>
|
||||||
<ul class="actions">
|
<ul class="actions">
|
||||||
<li><a href="#" class="button special">Default</a></li>
|
<li><a href="#" class="button special">Default</a></li>
|
||||||
<li><a href="#" class="button">Default</a></li>
|
<li><a href="#" class="button">Default</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="actions small">
|
<ul class="actions small">
|
||||||
<li><a href="#" class="button special small">Small</a></li>
|
<li><a href="#" class="button special small">Small</a></li>
|
||||||
<li><a href="#" class="button small">Small</a></li>
|
<li><a href="#" class="button small">Small</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="6u 12u$(small)">
|
<div class="6u 12u$(small)">
|
||||||
<ul class="actions vertical">
|
<ul class="actions vertical">
|
||||||
<li><a href="#" class="button special">Default</a></li>
|
<li><a href="#" class="button special">Default</a></li>
|
||||||
<li><a href="#" class="button">Default</a></li>
|
<li><a href="#" class="button">Default</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="6u$ 12u$(small)">
|
<div class="6u$ 12u$(small)">
|
||||||
<ul class="actions vertical small">
|
<ul class="actions vertical small">
|
||||||
<li><a href="#" class="button special small">Small</a></li>
|
<li><a href="#" class="button special small">Small</a></li>
|
||||||
<li><a href="#" class="button small">Small</a></li>
|
<li><a href="#" class="button small">Small</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="6u 12u$(small)">
|
<div class="6u 12u$(small)">
|
||||||
<ul class="actions vertical">
|
<ul class="actions vertical">
|
||||||
<li><a href="#" class="button special fit">Default</a></li>
|
<li><a href="#" class="button special fit">Default</a></li>
|
||||||
<li><a href="#" class="button fit">Default</a></li>
|
<li><a href="#" class="button fit">Default</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="6u$ 12u$(small)">
|
<div class="6u$ 12u$(small)">
|
||||||
<ul class="actions vertical small">
|
<ul class="actions vertical small">
|
||||||
<li><a href="#" class="button special small fit">Small</a></li>
|
<li><a href="#" class="button special small fit">Small</a></li>
|
||||||
<li><a href="#" class="button small fit">Small</a></li>
|
<li><a href="#" class="button small fit">Small</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<h4>Table</h4>
|
<h4>Table</h4>
|
||||||
<h5>Default</h5>
|
<h5>Default</h5>
|
||||||
<div class="table-wrapper">
|
<div class="table-wrapper">
|
||||||
<table>
|
<table>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Name</th>
|
<th>Name</th>
|
||||||
<th>Description</th>
|
<th>Description</th>
|
||||||
<th>Price</th>
|
<th>Price</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item One</td>
|
<td>Item One</td>
|
||||||
<td>Ante turpis integer aliquet porttitor.</td>
|
<td>Ante turpis integer aliquet porttitor.</td>
|
||||||
<td>29.99</td>
|
<td>29.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item Two</td>
|
<td>Item Two</td>
|
||||||
<td>Vis ac commodo adipiscing arcu aliquet.</td>
|
<td>Vis ac commodo adipiscing arcu aliquet.</td>
|
||||||
<td>19.99</td>
|
<td>19.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item Three</td>
|
<td>Item Three</td>
|
||||||
<td> Morbi faucibus arcu accumsan lorem.</td>
|
<td> Morbi faucibus arcu accumsan lorem.</td>
|
||||||
<td>29.99</td>
|
<td>29.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item Four</td>
|
<td>Item Four</td>
|
||||||
<td>Vitae integer tempus condimentum.</td>
|
<td>Vitae integer tempus condimentum.</td>
|
||||||
<td>19.99</td>
|
<td>19.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item Five</td>
|
<td>Item Five</td>
|
||||||
<td>Ante turpis integer aliquet porttitor.</td>
|
<td>Ante turpis integer aliquet porttitor.</td>
|
||||||
<td>29.99</td>
|
<td>29.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
<tfoot>
|
<tfoot>
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="2"></td>
|
<td colspan="2"></td>
|
||||||
<td>100.00</td>
|
<td>100.00</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tfoot>
|
</tfoot>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h5>Alternate</h5>
|
<h5>Alternate</h5>
|
||||||
<div class="table-wrapper">
|
<div class="table-wrapper">
|
||||||
<table class="alt">
|
<table class="alt">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Name</th>
|
<th>Name</th>
|
||||||
<th>Description</th>
|
<th>Description</th>
|
||||||
<th>Price</th>
|
<th>Price</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item One</td>
|
<td>Item One</td>
|
||||||
<td>Ante turpis integer aliquet porttitor.</td>
|
<td>Ante turpis integer aliquet porttitor.</td>
|
||||||
<td>29.99</td>
|
<td>29.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item Two</td>
|
<td>Item Two</td>
|
||||||
<td>Vis ac commodo adipiscing arcu aliquet.</td>
|
<td>Vis ac commodo adipiscing arcu aliquet.</td>
|
||||||
<td>19.99</td>
|
<td>19.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item Three</td>
|
<td>Item Three</td>
|
||||||
<td> Morbi faucibus arcu accumsan lorem.</td>
|
<td> Morbi faucibus arcu accumsan lorem.</td>
|
||||||
<td>29.99</td>
|
<td>29.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item Four</td>
|
<td>Item Four</td>
|
||||||
<td>Vitae integer tempus condimentum.</td>
|
<td>Vitae integer tempus condimentum.</td>
|
||||||
<td>19.99</td>
|
<td>19.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Item Five</td>
|
<td>Item Five</td>
|
||||||
<td>Ante turpis integer aliquet porttitor.</td>
|
<td>Ante turpis integer aliquet porttitor.</td>
|
||||||
<td>29.99</td>
|
<td>29.99</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
<tfoot>
|
<tfoot>
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="2"></td>
|
<td colspan="2"></td>
|
||||||
<td>100.00</td>
|
<td>100.00</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tfoot>
|
</tfoot>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<h4>Buttons</h4>
|
<h4>Buttons</h4>
|
||||||
<ul class="actions">
|
<ul class="actions">
|
||||||
<li><a href="#" class="button special">Special</a></li>
|
<li><a href="#" class="button special">Special</a></li>
|
||||||
<li><a href="#" class="button">Default</a></li>
|
<li><a href="#" class="button">Default</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="actions">
|
<ul class="actions">
|
||||||
<li><a href="#" class="button">Default</a></li>
|
<li><a href="#" class="button">Default</a></li>
|
||||||
<li><a href="#" class="button small">Small</a></li>
|
<li><a href="#" class="button small">Small</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="actions fit">
|
<ul class="actions fit">
|
||||||
<li><a href="#" class="button special fit">Fit</a></li>
|
<li><a href="#" class="button special fit">Fit</a></li>
|
||||||
<li><a href="#" class="button fit">Fit</a></li>
|
<li><a href="#" class="button fit">Fit</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="actions fit small">
|
<ul class="actions fit small">
|
||||||
<li><a href="#" class="button special fit small">Fit + Small</a></li>
|
<li><a href="#" class="button special fit small">Fit + Small</a></li>
|
||||||
<li><a href="#" class="button fit small">Fit + Small</a></li>
|
<li><a href="#" class="button fit small">Fit + Small</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="actions">
|
<ul class="actions">
|
||||||
<li><a href="#" class="button special icon fa-download">Icon</a></li>
|
<li><a href="#" class="button special icon fa-download">Icon</a></li>
|
||||||
<li><a href="#" class="button icon fa-download">Icon</a></li>
|
<li><a href="#" class="button icon fa-download">Icon</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="actions">
|
<ul class="actions">
|
||||||
<li><span class="button special disabled">Disabled</span></li>
|
<li><span class="button special disabled">Disabled</span></li>
|
||||||
<li><span class="button disabled">Disabled</span></li>
|
<li><span class="button disabled">Disabled</span></li>
|
||||||
</ul>
|
</ul>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<h4>Form</h4>
|
<h4>Form</h4>
|
||||||
<form method="post" action="#">
|
<form method="post" action="#">
|
||||||
<div class="row uniform">
|
<div class="row uniform">
|
||||||
<div class="6u 12u$(xsmall)">
|
<div class="6u 12u$(xsmall)">
|
||||||
<input type="text" name="demo-name" id="demo-name" value="" placeholder="Name" />
|
<input type="text" name="demo-name" id="demo-name" value="" placeholder="Name" />
|
||||||
</div>
|
</div>
|
||||||
<div class="6u$ 12u$(xsmall)">
|
<div class="6u$ 12u$(xsmall)">
|
||||||
<input type="email" name="demo-email" id="demo-email" value="" placeholder="Email" />
|
<input type="email" name="demo-email" id="demo-email" value="" placeholder="Email" />
|
||||||
</div>
|
</div>
|
||||||
<div class="12u$">
|
<div class="12u$">
|
||||||
<div class="select-wrapper">
|
<div class="select-wrapper">
|
||||||
<select name="demo-category" id="demo-category">
|
<select name="demo-category" id="demo-category">
|
||||||
<option value="">- Category -</option>
|
<option value="">- Category -</option>
|
||||||
<option value="1">Manufacturing</option>
|
<option value="1">Manufacturing</option>
|
||||||
<option value="1">Shipping</option>
|
<option value="1">Shipping</option>
|
||||||
<option value="1">Administration</option>
|
<option value="1">Administration</option>
|
||||||
<option value="1">Human Resources</option>
|
<option value="1">Human Resources</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="4u 12u$(small)">
|
<div class="4u 12u$(small)">
|
||||||
<input type="radio" id="demo-priority-low" name="demo-priority" checked>
|
<input type="radio" id="demo-priority-low" name="demo-priority" checked>
|
||||||
<label for="demo-priority-low">Low</label>
|
<label for="demo-priority-low">Low</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="4u 12u$(small)">
|
<div class="4u 12u$(small)">
|
||||||
<input type="radio" id="demo-priority-normal" name="demo-priority">
|
<input type="radio" id="demo-priority-normal" name="demo-priority">
|
||||||
<label for="demo-priority-normal">Normal</label>
|
<label for="demo-priority-normal">Normal</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="4u$ 12u$(small)">
|
<div class="4u$ 12u$(small)">
|
||||||
<input type="radio" id="demo-priority-high" name="demo-priority">
|
<input type="radio" id="demo-priority-high" name="demo-priority">
|
||||||
<label for="demo-priority-high">High</label>
|
<label for="demo-priority-high">High</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="6u 12u$(small)">
|
<div class="6u 12u$(small)">
|
||||||
<input type="checkbox" id="demo-copy" name="demo-copy">
|
<input type="checkbox" id="demo-copy" name="demo-copy">
|
||||||
<label for="demo-copy">Email me a copy</label>
|
<label for="demo-copy">Email me a copy</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="6u$ 12u$(small)">
|
<div class="6u$ 12u$(small)">
|
||||||
<input type="checkbox" id="demo-human" name="demo-human" checked>
|
<input type="checkbox" id="demo-human" name="demo-human" checked>
|
||||||
<label for="demo-human">Not a robot</label>
|
<label for="demo-human">Not a robot</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="12u$">
|
<div class="12u$">
|
||||||
<textarea name="demo-message" id="demo-message" placeholder="Enter your message" rows="6"></textarea>
|
<textarea name="demo-message" id="demo-message" placeholder="Enter your message" rows="6"></textarea>
|
||||||
</div>
|
</div>
|
||||||
<div class="12u$">
|
<div class="12u$">
|
||||||
<ul class="actions">
|
<ul class="actions">
|
||||||
<li><input type="submit" value="Send Message" class="special" /></li>
|
<li><input type="submit" value="Send Message" class="special" /></li>
|
||||||
<li><input type="reset" value="Reset" /></li>
|
<li><input type="reset" value="Reset" /></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<h4>Image</h4>
|
<h4>Image</h4>
|
||||||
<h5>Fit</h5>
|
<h5>Fit</h5>
|
||||||
<div class="box alt">
|
<div class="box alt">
|
||||||
<div class="row uniform 50%">
|
<div class="row uniform 50%">
|
||||||
<div class="12u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="12u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<h5>Left & Right</h5>
|
<h5>Left & Right</h5>
|
||||||
<p><span class="image left"><img src="images/pic05.jpg" alt="" /></span>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.</p>
|
<p><span class="image left"><img src="images/pic05.jpg" alt="" /></span>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.</p>
|
||||||
<p><span class="image right"><img src="images/pic05.jpg" alt="" /></span>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.</p>
|
<p><span class="image right"><img src="images/pic05.jpg" alt="" /></span>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<a href="#footer" class="goto-next scrolly">Next</a>
|
<a href="#footer" class="goto-next scrolly">Next</a>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<section id="footer">
|
<section id="footer">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<header class="major">
|
<header class="major">
|
||||||
<h2>Get in touch</h2>
|
<h2>Get in touch</h2>
|
||||||
</header>
|
</header>
|
||||||
<form method="post" action="#">
|
<form method="post" action="#">
|
||||||
<div class="row uniform">
|
<div class="row uniform">
|
||||||
<div class="6u 12u$(xsmall)"><input type="text" name="name" id="name" placeholder="Name" /></div>
|
<div class="6u 12u$(xsmall)"><input type="text" name="name" id="name" placeholder="Name" /></div>
|
||||||
<div class="6u$ 12u$(xsmall)"><input type="email" name="email" id="email" placeholder="Email" /></div>
|
<div class="6u$ 12u$(xsmall)"><input type="email" name="email" id="email" placeholder="Email" /></div>
|
||||||
<div class="12u$"><textarea name="message" id="message" placeholder="Message" rows="4"></textarea></div>
|
<div class="12u$"><textarea name="message" id="message" placeholder="Message" rows="4"></textarea></div>
|
||||||
<div class="12u$">
|
<div class="12u$">
|
||||||
<ul class="actions">
|
<ul class="actions">
|
||||||
<li><input type="submit" value="Send Message" class="special" /></li>
|
<li><input type="submit" value="Send Message" class="special" /></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<footer>
|
<footer>
|
||||||
<ul class="icons">
|
<ul class="icons">
|
||||||
<li><a href="#" class="icon alt fa-twitter"><span class="label">Twitter</span></a></li>
|
<li><a href="#" class="icon alt fa-twitter"><span class="label">Twitter</span></a></li>
|
||||||
<li><a href="#" class="icon alt fa-facebook"><span class="label">Facebook</span></a></li>
|
<li><a href="#" class="icon alt fa-facebook"><span class="label">Facebook</span></a></li>
|
||||||
<li><a href="#" class="icon alt fa-instagram"><span class="label">Instagram</span></a></li>
|
<li><a href="#" class="icon alt fa-instagram"><span class="label">Instagram</span></a></li>
|
||||||
<li><a href="#" class="icon alt fa-dribbble"><span class="label">Dribbble</span></a></li>
|
<li><a href="#" class="icon alt fa-dribbble"><span class="label">Dribbble</span></a></li>
|
||||||
<li><a href="#" class="icon alt fa-envelope"><span class="label">Email</span></a></li>
|
<li><a href="#" class="icon alt fa-envelope"><span class="label">Email</span></a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="copyright">
|
<ul class="copyright">
|
||||||
<li>© Untitled</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li><li>Demo Images: <a href="http://unsplash.com">Unsplash</a></li>
|
<li>© Untitled</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li><li>Demo Images: <a href="http://unsplash.com">Unsplash</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</footer>
|
</footer>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Scripts -->
|
<!-- Scripts -->
|
||||||
<script src="assets/js/jquery.min.js"></script>
|
<script src="assets/js/jquery.min.js"></script>
|
||||||
<script src="assets/js/jquery.scrollex.min.js"></script>
|
<script src="assets/js/jquery.scrollex.min.js"></script>
|
||||||
<script src="assets/js/jquery.scrolly.min.js"></script>
|
<script src="assets/js/jquery.scrolly.min.js"></script>
|
||||||
<script src="assets/js/skel.min.js"></script>
|
<script src="assets/js/skel.min.js"></script>
|
||||||
<script src="assets/js/util.js"></script>
|
<script src="assets/js/util.js"></script>
|
||||||
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
|
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
|
||||||
<script src="assets/js/main.js"></script>
|
<script src="assets/js/main.js"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user