<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Panelo - Free Admin Template</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<link href='http://fonts.googleapis.com/css?family=Belgrano' rel='stylesheet' type='text/css'>
<!-- jQuery file -->
<script src="js/jquery.min.js"></script>
<script src="js/jquery.tabify.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var $ = jQuery.noConflict();
$(function() {
$('#tabsmenu').tabify();
$(".toggle_container").hide();
$(".trigger").click(function(){
$(this).toggleClass("active").next().slideToggle("slow");
return false;
});
});
</script>
</head>
<body>
<div id="panelwrap">
<div class="header">
<div class="title"><a href="#">Panelo Admin</a></div>
<div class="header_right">Welcome Admin, <a href="#" class="settings">Settings</a> <a href="#" class="logout">Logout</a> </div>
<div class="menu">
<ul>
<li><a href="#" class="selected">Main page</a></li>
<li><a href="#">Settings</a></li>
<li><a href="#">Add a category</a></li>
<li><a href="#">Edit categories</a></li>
<li><a href="#">Categories</a></li>
<li><a href="#">Options</a></li>
<li><a href="#">Admin settings</a></li>
<li><a href="#">Help</a></li>
</ul>
</div>
</div>
<div class="submenu">
<ul>
<li><a href="#" class="selected">settings</a></li>
<li><a href="#">users</a></li>
<li><a href="#">categories</a></li>
<li><a href="#">edit section</a></li>
<li><a href="#">templates</a></li>
</ul>
</div>
<div class="center_content">
<div id="right_wrap">
<div id="right_content">
<h2>Tables section</h2>
<table id="rounded-corner">
<thead>
<tr>
<th></th>
<th>Product</th>
<th>Details</th>
<th>Price</th>
<th>Date</th>
<th>Category</th>
<th>User</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="12">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut.</td>
</tr>
</tfoot>
<tbody>
<tr class="odd">
<td><input type="checkbox" name="" /></td>
<td>Box Software</td>
<td>Lorem ipsum dolor sit amet consectetur</td>
<td>45$</td>
<td>10/04/2011</td>
<td>web design</td>
<td>Alex</td>
<td><a href="#"><img src="images/edit.png" alt="" title="" border="0" /></a></td>
<td><a href="#"><img src="images/trash.gif" alt="" title="" border="0" /></a></td>
</tr>
<tr class="even">
<td><input type="checkbox" name="" /></td>
<td>Trial Software</td>
<td>Lorem ipsum dolor sit amet consectetur</td>
<td>155$</td>
<td>12/04/2011</td>
<td>web design</td>
<td>Carrina</td>
<td><a href="#"><img src="images/edit.png" alt="" title="" border="0" /></a></td>
<td><a href="#"><img src="images/trash.gif" alt="" title="" border="0" /></a></td>
</tr>
<tr class="odd">
<td><input type="checkbox" name="" /></td>
<td>Hosting Pack</td>
<td>Lorem ipsum dolor sit amet consectetur</td>
<td>45$</td>
<td>10/04/2011</td>
<td>web design</td>
<td>Alex</td>
<td><a href="#"><img src="images/edit.png" alt="" title="" border="0" /></a></td>
<td><a href="#"><img src="images/trash.gif" alt="" title="" border="0" /></a></td
></tr>
<tr class="even">
<td><input type="checkbox" name="" /></td>
<td>Duo Software</td>
<td>Lorem ipsum dolor sit amet consectetur</td>
<td>745$</td>
<td>10/04/2011</td>
<td>web design</td>
<td>Alex</td>
<td><a href="#"><img src="images/edit.png" alt="" title="" border="0" /></a></td>
<td><a href="#"><img src="images/trash.gif" alt="" title="" border="0" /></a></td
></tr>
<tr class="odd">
<td><input type="checkbox" name="" /></td>
<td>Alavasti Software</td>
<td>Lorem ipsum dolor sit amet consectetur</td>
<td>45$</td>
<td>10/04/2011</td>
<td>web design</td>
<td>John</td>
<td><a href="#"><img src="images/edit.png" alt="" title="" border="0" /></a></td>
<td><a href="#"><img src="images/trash.gif" alt="" title="" border="0" /></a></td
></tr>
<tr class="even">
<td><input type="checkbox" name="" /></td>
<td>Box Software</td>
<td>Lorem ipsum dolor sit amet consectetur</td>
<td>45$</td>
<td>10/04/2011</td>
<td>web design</td>
<td>Doe</td>
<td><a href="#"><img src="images/edit.png" alt="" title="" border="0" /></a></td>
<td><a href="#"><img src="images/trash.gif" alt="" title="" border="0" /></a></td
></tr>
</tbody>
</table>
<div class="form_sub_buttons">
<a href="#" class="button green">Edit selected</a>
<a href="#" class="button red">Delete selected</a>
</div>
<ul id="tabsmenu" class="tabsmenu">
<li class="active"><a href="#tab1">Form Design Structure</a></li>
<li><a href="#tab2">Tab two</a></li>
<li><a href="#tab3">Tab three</a></li>
<li><a href="#tab4">Tab four</a></li>
</ul>
<div id="tab1" class="tabcontent">
<h3>Tab one title</h3>
<div class="form">
<div class="form_row">
<label>Name:</label>
<input type="text" class="form_input" name="" />
</div>
<div class="form_row">
<label>Email:</label>
<input type="text" class="form_input" name="" />
</div>
<div class="form_row">
<label>Subject:</label>
<select class="form_select" name="">
<option>Select one</option>
</select>
</div>
<div class="form_row">
<label>Message:</label>
<textarea class="form_textarea" name=""></textarea>
</div>
<div class="form_row">
<input type="submit" class="form_submit" value="Submit" />
</div>
<div class="clear"></div>
</div>
</div>
<div id="tab2" class="tabcontent">
<h3>Tab two title</h3>
<ul class="lists">
<li>Consectetur adipisicing elit error sit voluptatem accusantium doloremqu sed</li>
<li>Sed do eiusmod tempor incididunt</li>
<li>Ut enim ad minim veniam is iste natus error sit</li>
<li>Consectetur adipisicing elit sed</li>
<li>Sed do eiusmod tempor error sit voluptatem accus antium dolor emqu incididunt</li>
<li>Ut enim ad minim veniam</li>
<li>Consectetur adipisi error sit voluptatem accusantium doloremqu cing elit sed</li>
<li>Sed do eiusmod tempor in is iste natus error sit cididunt</li>
<li>Ut enim ad minim ve is iste natus error sitniam</li>
</ul>
</div>
<div id="tab3" class="tabcontent">
<h3>Tab three title</h3>
<p>
Lorem ipsum <a href="#">dolor sit amet</a>, consectetur adipisicing elit