Untitled diff

Created Diff never expires
19 removals
361 lines
76 additions
417 lines


<!DOCTYPE HTML>
<!DOCTYPE HTML>
<!--
<!--
Dimension by HTML5 UP
Dimension 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>Dimension by HTML5 UP</title>
<title>MapleToast </title>
<meta charset="utf-8" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
<link rel="icon" type="image/png" href="Favicon.png">
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
</head>
</head>
<body>
<body>
<!-- Wrapper -->
<!-- Wrapper -->
<div id="wrapper">
<div id="wrapper">


<!-- Header -->
<!-- Header -->
<header id="header">
<header id="header">
<div class="logo">
<span class="icon fa-diamond"></span>
</div>
<div class="content">
<div class="content">
<div class="inner">
<div class="inner">
<h1>Dimension</h1>
<h1> Toast is TOasted</h1><p><br>MapleToast will be merging with Elliniel ms. <br> All MapleToast's services will terminate on 27 August 2017.</p>
<p>A fully responsive site template designed by <a href="https://html5up.net">HTML5 UP</a> and released<br />
for free under the <a href="https://html5up.net/license">Creative Commons</a> license.</p>
</div>
</div>
</div>
</div>
<nav>
<nav><br>
<ul>
<ul>
<li><a href="#intro">Intro</a></li>
<li><a href="#work">Work</a></li>
<li><a href="https://maple.ellinel.life/?base=main&page=register" class="button special">► Join EllinielMS!</a></li> <li>&nbsp;&nbsp; </li> <li><a href="#about">About</a></li>
<li><a href="#about">About</a></li>
<li><a href="#refund">Refund</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#faq">FAQ</a></li>
<!--<li><a href="#elements">Elements</a></li>-->

<!--<li><a href="#elements">Elements</a></li>-->
</ul>
</ul>
</nav>
</nav>
</header>
</header>


<!-- Main -->
<!-- Main -->
<div id="main">
<div id="main">


<!-- Intro -->
<!-- Intro -->
<article id="intro">
<article id="intro">
<h2 class="major">Intro</h2>
<h2 class="major">Intro</h2>
<span class="image main"><img src="images/pic01.jpg" alt="" /></span>
<span class="image main"><img src="images/pic01.jpg" alt="" /></span>
<p>Aenean ornare velit lacus, ac varius enim ullamcorper eu. Proin aliquam facilisis ante interdum congue. Integer mollis, nisl amet convallis, porttitor magna ullamcorper, amet egestas mauris. Ut magna finibus nisi nec lacinia. Nam maximus erat id euismod egestas. By the way, check out my <a href="#work">awesome work</a>.</p>
<p>Aenean ornare velit lacus, ac varius enim ullamcorper eu. Proin aliquam facilisis ante interdum congue. Integer mollis, nisl amet convallis, porttitor magna ullamcorper, amet egestas mauris. Ut magna finibus nisi nec lacinia. Nam maximus erat id euismod egestas. By the way, check out my <a href="#work">awesome work</a>.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis dapibus rutrum facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam tristique libero eu nibh porttitor fermentum. Nullam venenatis erat id vehicula viverra. Nunc ultrices eros ut ultricies condimentum. Mauris risus lacus, blandit sit amet venenatis non, bibendum vitae dolor. Nunc lorem mauris, fringilla in aliquam at, euismod in lectus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In non lorem sit amet elit placerat maximus. Pellentesque aliquam maximus risus, vel sed vehicula.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis dapibus rutrum facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam tristique libero eu nibh porttitor fermentum. Nullam venenatis erat id vehicula viverra. Nunc ultrices eros ut ultricies condimentum. Mauris risus lacus, blandit sit amet venenatis non, bibendum vitae dolor. Nunc lorem mauris, fringilla in aliquam at, euismod in lectus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In non lorem sit amet elit placerat maximus. Pellentesque aliquam maximus risus, vel sed vehicula.</p>
</article>
</article>


<!-- Work -->
<!-- Work -->
<article id="work">
<article id="work">
<h2 class="major">Work</h2>
<h2 class="major">Work</h2>
<span class="image main"><img src="images/pic02.jpg" alt="" /></span>
<span class="image main"><img src="images/pic02.jpg" alt="" /></span>
<p>Adipiscing magna sed dolor elit. Praesent eleifend dignissim arcu, at eleifend sapien imperdiet ac. Aliquam erat volutpat. Praesent urna nisi, fringila lorem et vehicula lacinia quam. Integer sollicitudin mauris nec lorem luctus ultrices.</p>
<p>Adipiscing magna sed dolor elit. Praesent eleifend dignissim arcu, at eleifend sapien imperdiet ac. Aliquam erat volutpat. Praesent urna nisi, fringila lorem et vehicula lacinia quam. Integer sollicitudin mauris nec lorem luctus ultrices.</p>
<p>Nullam et orci eu lorem consequat tincidunt vivamus et sagittis libero. Mauris aliquet magna magna sed nunc rhoncus pharetra. Pellentesque condimentum sem. In efficitur ligula tate urna. Maecenas laoreet massa vel lacinia pellentesque lorem ipsum dolor. Nullam et orci eu lorem consequat tincidunt. Vivamus et sagittis libero. Mauris aliquet magna magna sed nunc rhoncus amet feugiat tempus.</p>
<p>Nullam et orci eu lorem consequat tincidunt vivamus et sagittis libero. Mauris aliquet magna magna sed nunc rhoncus pharetra. Pellentesque condimentum sem. In efficitur ligula tate urna. Maecenas laoreet massa vel lacinia pellentesque lorem ipsum dolor. Nullam et orci eu lorem consequat tincidunt. Vivamus et sagittis libero. Mauris aliquet magna magna sed nunc rhoncus amet feugiat tempus.</p>
</article>
</article>


<!-- About -->
<!-- About -->
<article id="about">
<article id="about">
<h2 class="major">About</h2>
<h2 class="major">About</h2>
<span class="image main"><img src="images/pic03.jpg" alt="" /></span>
<span class="image main"><img src="https://image.ibb.co/igfkz5/newbanner.png" alt="" /></span>
<p>Lorem ipsum dolor sit amet, consectetur et adipiscing elit. Praesent eleifend dignissim arcu, at eleifend sapien imperdiet ac. Aliquam erat volutpat. Praesent urna nisi, fringila lorem et vehicula lacinia quam. Integer sollicitudin mauris nec lorem luctus ultrices. Aliquam libero et malesuada fames ac ante ipsum primis in faucibus. Cras viverra ligula sit amet ex mollis mattis lorem ipsum dolor sit amet.</p>
<p>EllinielMS is a revolutionary v83 high-rate server. The server is customised to ensure a velvety gameplay. We combine the magic of modern high-rate rebirthing with classic MapleStory's sense of exploration. Elliniel will remodel your experience in a high-rate server with a whole new leveling system, together with custom innovative ideas and features. Come on! Join us, in this wonderful journey of contemporary nostalgic. </p>
</article>

<!-- Refund -->
<article id="refund">
<h2 class="major">Refund</h2>
The following section will guide you on the procedure for refund.<br><br>
<p>
Elliniel MS will be providing refunds for the players of MapleToast. You may proceed to Elliniel's website by clicking <a href="https://maple.ellinel.life/?base=main&page=news&id=46">here</a> to learn more. The following will state the summary.<br><br>
<b>Conditions of Refund:</b><br>
1. You must have a registered account and character.<br>
2. Your last-login must be after 1 August 2017.<br>
3. Your account must not be banned.<br><br>
<b>Required Information:</b><br>
1. Your MapleToast Username<br>
2. Your MapleToast Password<br>
3. Your MapleToast Registered Email<br><br>
<b>Refund Procedure:</b><br>
1. Register an Elliniel MS account at <a href= "https://maple.ellinel.life/?base=main&page=register"> Elliniel Registration Page</a><br>
2. After keying in your credential, Tick "I come from MapleToast!"<br>
3. Key in your MapleToast account details<br>
4. Click Register!<br>
5. Proceed to <a href="https://maple.ellinel.life/?base=main&page=download">Elliniel Downloads</a> to download Elliniel<br>
6. After Installation, login and complete the tutorial.<br>
7. Upon, the completion of the tutorial, an NPC will be prompted for you to select and acknowledge your refund.<br>
8. Play Elliniel MS!<br><br>
<b>Important Notes:</b><br> Please note that the refund period will end on 11 September 2017. The refund will act on your account's condition on 24 August 2017. Anything that happened after 24 August 2017 will not be recorded nor refunded. The refund is only available for NEW REGISTERED accounts in Elliniel MS. If you already had an account in Elliniel MS, you will be required to create a new account.<br>
</p>
</article>

<!-- FAQ-->
<article id="faq">
<h2 class="major">F.A.Q</h2>
The following are some frequently asked questions about the merger with Elliniel MS. These faq will help answer some of your questions.<br><br>
<p>
<b>Q. Why is MapleToast merging with Elliniel MS? </b><br>
&nbsp;&nbsp; As MapleToast has been experiencing several unforeseen difficulties and issues in developing the server further, we felt that MapleToast has reached it's time. MapleToast has been trying very hard to prolong the server's gameplay to the best of our capabilities. As we have reached our limit, we were unable to provide for our honourable players any further. Hence, we have decided to merge with Elliniel MS - to another management that has the capability to do better. <br><br>
<b>Q. How does the merger work?</b><br>
&nbsp;&nbsp; MapleToast has provided Elliniel MS with the resources needed for refunds. Several of MapleToast's features and events will also be added into Elliniel MS in future.<br><br>
<b>Q. What will happen to my account/character? </b><br>
&nbsp;&nbsp; Elliniel MS has been very kind to offer advance-standing in their gameplay for MapleToast's users. You may learn more about Elliniel's procedure for the refund in the <a href="#refund">Refund Tab</a>. <br><br>
<b>Q. Will I still be able to keep in contact with my toasty friends?</b><br>
&nbsp;&nbsp; Unfortunately, MapleToast will be removing the forum, discord and website services very soon. You will no longer be able to communicate with your toasty friends through MapleToast's medium. However, you may join Elliniel MS to meet the players of MapleToast and new friends.<br><br>
<b>Q. Where can I get Orange Mushroom Cap?</b><br>
&nbsp;&nbsp; You may type @go henesys, go to the bottom right portal. You'll reach 'The Hill East of Henesys'. Then, go to the top right portal to reach 'Nefarious Hill'. You can hunt Orange Mushrooms for Orange Mushroom Cap.<br><br>
<b>Q. What do you call the parents of transformer?</b><br>
&nbsp;&nbsp; Transparent.<br><br>
<b>Q. TOAST IS?</b><br>
&nbsp;&nbsp; TOASTED.<br><br>
</p>
</article>
</article>


<!-- Contact -->
<!-- Contact -->
<article id="contact">
<article id="contact">
<h2 class="major">Contact</h2>
<h2 class="major">Contact</h2>
<form method="post" action="#">
<form method="post" action="#">
<div class="field half first">
<div class="field half first">
<label for="name">Name</label>
<label for="name">Name</label>
<input type="text" name="name" id="name" />
<input type="text" name="name" id="name" />
</div>
</div>
<div class="field half">
<div class="field half">
<label for="email">Email</label>
<label for="email">Email</label>
<input type="text" name="email" id="email" />
<input type="text" name="email" id="email" />
</div>
</div>
<div class="field">
<div class="field">
<label for="message">Message</label>
<label for="message">Message</label>
<textarea name="message" id="message" rows="4"></textarea>
<textarea name="message" id="message" rows="4"></textarea>
</div>
</div>
<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>
</form>
</form>
<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>
</article>
</article>


<!-- Elements -->
<!-- Elements -->
<article id="elements">
<article id="elements">
<h2 class="major">Elements</h2>
<h2 class="major">Elements</h2>


<section>
<section>
<h3 class="major">Text</h3>
<h3 class="major">Text</h3>
<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 />
<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 />
<h4>Blockquote</h4>
<h4>Blockquote</h4>
<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>
<h4>Preformatted</h4>
<h4>Preformatted</h4>
<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>
<h3 class="major">Lists</h3>
<h3 class="major">Lists</h3>


<h4>Unordered</h4>
<h4>Unordered</h4>
<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>


<h4>Alternate</h4>
<h4>Alternate</h4>
<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>


<h4>Ordered</h4>
<h4>Ordered</h4>
<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>
<h4>Icons</h4>
<h4>Icons</h4>
<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>


<h4>Actions</h4>
<h4>Actions</h4>
<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 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>
</section>
</section>


<section>
<section>
<h3 class="major">Table</h3>
<h3 class="major">Table</h3>
<h4>Default</h4>
<h4>Default</h4>
<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>


<h4>Alternate</h4>
<h4>Alternate</h4>
<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>
<h3 class="major">Buttons</h3>
<h3 class="major">Buttons</h3>
<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">
<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>
<h3 class="major">Form</h3>
<h3 class="major">Form</h3>
<form method="post" action="#">
<form method="post" action="#">
<div class="field half first">
<div class="field half first">
<label for="demo-name">Name</label>
<label for="demo-name">Name</label>
<input type="text" name="demo-name" id="demo-name" value="" placeholder="Jane Doe" />
<input type="text" name="demo-name" id="demo-name" value="" placeholder="Jane Doe" />
</div>
</div>
<div class="field half">
<div class="field half">
<label for="demo-email">Email</label>
<label for="demo-email">Email</label>
<input type="email" name="demo-email" id="demo-email" value="" placeholder="jane@untitled.tld" />
<input type="email" name="demo-email" id="demo-email" value="" placeholder="jane@untitled.tld" />
</div>
</div>
<div class="field">
<div class="field">
<label for="demo-category">Category</label>
<label for="demo-category">Category</label>
<div class="select-wrapper">
<div class="select-wrapper">
<select name="demo-category" id="demo-category">
<select name="demo-category" id="demo-category">
<option value="">-</option>
<option value="">-</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="field half first">
<div class="field half first">
<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="field half">
<div class="field half">
<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="field half first">
<div class="field half first">
<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="field half">
<div class="field half">
<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="field">
<div class="field">
<label for="demo-message">Message</label>
<label for="demo-message">Message</label>
<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>
<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>
</form>
</form>
</section>
</section>


</article>
</article>


</div>
</div>


<!-- Footer -->
<!-- Footer -->
<footer id="footer">
<footer id="footer"><br>
<p class="copyright">&copy; Untitled. Design: <a href="https://html5up.net">HTML5 UP</a>. Images: <a href="https://unsplash.com">Unsplash</a>.</p>
<p class="copyright">&copy; 2017 MapleToast <br> All images and other content related to MapleStory are owned by the Nexon Corporation. </p>
</footer>
</footer>


</div>
</div>


<!-- BG -->
<!-- BG -->
<div id="bg"></div>
<div id="bg"></div>


<!-- Scripts -->
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.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>
<script src="assets/js/main.js"></script>
<script src="assets/js/main.js"></script>


</body>
</body>
</html>
</html>