<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>The HTML5 Herald</title>
<meta name="description" content="The HTML5 Herald" />
<meta name="author" content="SitePoint" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.1.8/semantic.min.css" />
<style>
@media only screen and (max-width: 767px) {
.mobile.hidden,
.tablet.only,
.small.monitor.only,
.large.monitor.only {
display: none !important;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.mobile.only,
.tablet.hidden,
.small.monitor.only,
.large.monitor.only {
display: none !important;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.mobile.only,
.tablet.only,
.small.monitor.hidden,
.large.monitor.only {
display: none !important;
}
}
@media only screen and (min-width: 1200px) {
.mobile.only,
.tablet.only,
.small.monitor.only,
.large.monitor.hidden {
display: none !important;
}
}
</style>
</head>
<body>
<br />
<br />
<header>
<div class="mobile hidden">
<div class="ui container">
<div class="ui grid">
<div class="eight column">
<div class="ui secondary menu">
<a class="active item">
Home
</a>
<a class="item">
Messages
</a>
<a class="item">
Friends
</a>
<div class="right menu">
<div class="item">
<div class="ui icon input">
<input type="text" placeholder="Search..." />
<i class="search link icon"></i>
</div>
</div>
<a class="ui item">
Logout
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<div class="clearing"></div>
<div class="ui container">
<div class="mobile hidden">
<div class="ui grid row">
<aside class="three column red"></aside>
<section class="thirteen column olive">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab doloremque illum quas? Dolore dolorem dolorum ipsum? Commodi error excepturi laboriosam magnam nobis odio suscipit unde! Alias atque dicta reiciendis sapiente!
</section>
</div>
</div>
</div>
<!--<div class="ui grid container">-->
<!--<div class="four wide column olive"></div>-->
<!--<div class="four wide column olive"></div>-->
<!--<div class="four wide column olive"></div>-->
<!--<div class="four wide column olive"></div>-->
<!--</div>-->
</body>
</html>
// Code goes here
/* Styles go here */