the-mmozine
<!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>
<title>The MMOZine - About Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
* {
margin: 0; padding: 0;
}
body {
text-align: center;
font: 12px Verdana;
color: #565656;
background-color: #21262a;
}
a {
text-decoration: none;
color: #647380;
}
a:hover {
text-decoration: underline;
}
img {
border: 0;
}
.break {
font-size: 0;
width: 0; height: 0;
clear: both;
}
.alignleft {
float: left;
margin: 4px 10px 5px 0;
}
.alignright {
float: right;
margin: 4px 0 5px 10px;
}
.aligncenter {
text-align: center;
}
.hidden {
display: none;
}
/** BEGIN wrapper **/
#wrapper {
width: 980px;
margin: auto auto;
text-align: left;
padding: 0 0 20px;
}
/** END wrapper **/
/** BEGIN header **/
#header {
height: 105px;
}
#header h1 {
float: left;
text-indent: -9999px;
font-size: 0;
padding: 15px;
}
#header h1 a {
display: block;
background: url(the-mmozine-images/logo.gif) no-repeat 0 0;
width: 334px; height: 75px;
outline: none;
}
#header .ad {
float: right;
padding-top: 18px;
}
/** END header **/
/** BEGIN body **/
#body {
clear: both;
background: #ffffff url(the-mmozine-images/buffer.gif) repeat-y 680px 0;
}
#body .buffer {
background: url(the-mmozine-images/wrapper.gif) repeat-x 0 0;
}
#body .subscribe {
float: right;
font-size: 0.9em;
color: #ffffff;
padding: 11px;
}
#body .subscribe a {
color: #ffffff;
margin: 0 5px;
}
#body .subscribe a:hover {
color: #CED9E7;
text-decoration: underline;
}
#body .pages {
list-style-type: none;
height: 35px;
padding-left: 15px;
}
#body .pages li {
float: left;
text-transform: uppercase;
font-weight: bold;
font-size: 0.9em;
}
#body .pages li a {
color: #ffffff;
display: block;
padding: 11px 16px;
}
#body .pages li a:hover {
text-decoration: none;
background-color: #EFEFEF;
color: #637380;
}
#body .categories {
list-style-type: none;
height: 41px;
}
#body .categories li {
float: left;
font-size: 0.9em;
padding: 14px 14px 13px;
background: url(the-mmozine-images/divider.gif) no-repeat 0 16px;
}
#body .categories li.f {
background: none;
}
#body .categories li a {
color: #808080;
}
#body .categories li a:hover {
text-decoration: none;
color: #49535C;
}
/** END body **/
/** BEGIN content **/
#content {
width: 640px;
float: left;
padding: 15px 20px;
}
#content p {
line-height: 1.4em;
margin-bottom: 15px;
}
#content h3, #content h4, #content h5, #content h6 {
font-size: 1.2em;
margin-bottom: 5px;
}
#content ol, #content ul {
list-style-position: inside;
margin-bottom: 15px;
}
#content li {
padding: 2px 0;
line-height: 1.4em;
}
#content blockqoute {
padding: 10px 10px 5px;
background: #eeeeee;
border-width: 1px 0;
border-style: solid;
border-color: #e0e0e0;
margin-bottom: 15px;
}
#content h2 {
font-family: Georgia;
font-size: 1.7em;
margin-bottom: 2px;
}
#content .details {
font-size: 0.9em;
color: #CCCCCC;
margin-bottom: 15px;
}
#content .details a {
color: #CCCCCC;
}
#content .continue {
background-color: #637380;
color: #ffffff;
text-transform: uppercase;
display: block;
font-size: 0.9em;
padding: 7px 12px;
float: left;
}
#content .continue:hover {
background-color: #587992;
text-decoration: none;
}
#content .post {
width: 298px; height: 320px;
float: left;
padding: 10px;
}
#content .post img {
border: 3px solid #EFEFEF;
float: left;
margin: 4px 8px 8px 0;
width: 94px;
}
#content .post h2 {
font-weight: normal;
}
#content .latest {
width: 640px; height: auto;
}
#content .latest img {
border: 3px solid #EFEFEF;
float: left;
margin: 4px 8px 8px 0;
width: 94px;
}
#content .latest h2 {
font-size: 1.7em;
font-weight: bold;
}
#content .latest .continue {
float: right;
}
#content .latest .bottom {
clear: both;
border-top: 1px solid #E1E1E1;
}
#content .postnav {
clear: both;
padding: 40px 8px 20px;
}
#content .postnav ul {
list-style-type: none;
border: 0 !important;
}
#content .postnav ul li {
float: left;
}
#content .postnav ul li a {
display: block;
padding: 5px 8px;
color: #ffffff;
background-color: #637380;
font-weight: bold;
font-size: 0.9em;
margin: 2px;
border: 0 !important;
}
#content .postnav ul li a:hover {
background-color: #587992;
}
#content .postnav .page_info {
padding: 5px 8px;
color: #ffffff;
background-color: #637380;
font-weight: bold;
font-size: 0.9em;
margin: 0 2px 2px;
}
#content .single {
width: 640px; height: auto;
}
#content .single img {
border: 3px solid #EFEFEF;
width: auto;
}
#content .single h2 {
font-size: 1.7em;
font-weight: bold;
}
#content .single .continue {
float: right;
}
#content .single .bottom {
clear: both;
border-top: 1px solid #E1E1E1;
}
/** END content **/
/** BEGIN sidebar **/
#sidebar {
width: 300px;
float: right;
font-size: 0.9em;
}
#sidebar h2 {
font-size: 1em;
text-transform: uppercase;
padding: 10px;
color: #637380;
}
#sidebar ul {
list-style-type: none;
padding: 0 10px 10px;
}
#sidebar ul li {
border-bottom: 1px dotted #DEDCD4;
line-height: 1.4em;
padding: 6px 0;
}
#sidebar ul li a {
}
#sidebar .l {
float: left;
width: 50%;
}
#sidebar .r {
float: right;
width: 50%;
}
#sidebar .l ul li, #sidebar .r ul li {
padding: 6px 0;
border-bottom: 0;
}
#sidebar .l ul li a, #sidebar .r ul li a {
color: #565656;
}
#sidebar form {
padding: 0 9px;
border-bottom: 1px solid #E1E1E1;
background: url(the-mmozine-images/search.gif) no-repeat center center;
height: 65px;
}
#sidebar form input {
border: 0;
font-size: 1.4em;
font-family: Verdana;
width: 195px;
margin: 23px 5px;
float: left;
background-color: transparent;
}
#sidebar form button {
float: right;
border: 0;
width: 69px; height: 34px;
text-indent: -9999px;
margin-top: 15px;
background-color: transparent;
}
#sidebar .ads {
text-align: center;
padding: 10px;
border-bottom: 1px solid #E1E1E1;
}
#sidebar .ads img {
margin: 5px;
}
#sidebar .flickr {
padding: 0 10px 10px;
text-align: center;
}
#sidebar .flickr img {
margin: 5px;
}
#sidebar .video {
padding: 0 10px 10px;
text-align: center;
}
#sidebar .tags {
padding: 0 10px 10px;
border-bottom: 1px solid #E1E1E1;
}
#sidebar .tags a {
color: #565656;
}
#sidebar .tags a:hover {
color: #637380;
text-decoration: none;
}
/** END sidebar **/
/** BEGIN footer **/
#footer {
background: #ffffff url(the-mmozine-images/bottom.gif) repeat-x 0 0;
font-size: 0.9em;
}
#footer .box {
width: 340px;
float: left;
}
#footer .box h2 {
font-size: 1em;
text-transform: uppercase;
padding: 14px 20px;
}
#footer .box ul {
list-style-type: none;
padding: 10px 20px 25px;
}
#footer .box ul li {
padding: 8px 0;
border-bottom: 1px dotted #DEDCD4;
}
#footer .box ul li a {
color: #565656;
}
#footer .about {
width: 300px;
float: left;
}
#footer .about h2 {
font-size: 1em;
text-transform: uppercase;
padding: 14px 20px 20px;
}
#footer .about p {
padding: 0 20px;
margin-bottom: 10px;
line-height: 1.4em;
}
#footer .about img {
float: left;
margin: 14px 10px 5px 0;
}
#footer .links {
background-color: #647380;
color: #E1E1E1;
height: 35px;
clear: both;
}
#footer .links p {
padding: 10px;
}
#footer .links a {
color: #CED9E7;
text-decoration: underline;
}
#footer .links .l {
float: left;
}
#footer .links .r {
float: right;
}
/** END footer **/
/** BEGIN miscellaneous **/
#comments {
}
#comments h2 {
margin: 20px 0 5px;
font-size: 1.3em;
}
#comments p {
margin-bottom: 10px;
line-height: 1.6em;
}
#comments form {
padding-top: 20px;
}
#comments form p {
margin-bottom: 5px;
}
#comments form input {
margin-right: 5px;
}
#comments form input, textarea {
border: 1px solid #cccccc;
font-size: 0.9em;
font-family: Verdana;
padding: 4px;
background-position: 4px 4px;
background-repeat: no-repeat;
}
#comments form input {
width: 260px;
border: 1px solid #cccccc;
}
#comments form textarea {
width: 350px;
padding: 4px 4px !important;
border: 1px solid #cccccc;
}
#comments form button {
border: 1px solid #a0a0a0;
font-size: 1em;
font-family: Verdana;
padding: 2px 6px;
no-repeat 0 0;
width: 150px; height: 34px;
}
.commentdetails {
margin-top: 25px;
}
.commentauthor {
margin-bottom: 5px !important;
font-weight: bold;
}
.commentdate {
font-size: 0.8em;
margin-bottom: 5px;
color: #909090;
}
.required {
color: #ff0000;
}
h2.title {
font-size: 1em !important;
text-transform: uppercase;
padding: 10px;
color: #565656;
}
.notfound {
padding: 40px;
}
.notfound h2 {
font-size: 18px;
font-weight: normal;
margin-bottom: 10px;
}
/** END miscellaneous **/
/** BEGIN wordpress 2.7 comments **/
#comments ol {
list-style-type: none;
clear: both;
padding: 0;
margin: 0;
}
#comments ol li {
padding: 10px;
border: 1px solid #e0e0e0;
margin-bottom: 10px;
}
#comments ol li .avatar {
float: right;
}
#comments ol li .comment-author {
}
#comments ol li .comment-author .fn {
font-weight: bold;
font-size: 1.2em;
}
#comments ol li .comment-meta {
font-size: 0.9em;
color: #999999;
margin: 5px 0 10px;
}
#comments ol li .reply {
font-size: 0.9em;
font-weight: bold;
padding-bottom: 10px;
}
#comments .children {
list-style-type: none;
}
#comments .navigation {
padding: 10px 0 20px;
font-size: 0.9em;
}
#comments .navigation a {
color: #999999;
padding: 3px 8px;
border: 1px solid #cccccc;
}
#comments .navigation a:hover {
color: #000000;
border-color: #000000;
text-decoration: none;
}
#comments .says {
display: none;
}
/** END wordpress 2.7 comments **/
</style>
<!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="ie.css" /><![endif]-->
</head>
<body>
<!-- BEGIN wrapper -->
<div id="wrapper">
<!-- BEGIN header -->
<div id="header">
<h1><a href="http://www.free-css.com/">The MMOZine</a></h1>
<div class="ad"> <a href="http://www.free-css.com/"><img src="the-mmozine-images/ad468x60.gif" alt="" /></a> </div>
</div>
<!-- END header -->
<!-- BEGIN body -->
<div id="body">
<div class="buffer">
<!-- BEGIN subscribe -->
<p class="subscribe"> Subscribe: <a href="http://www.free-css.com/">Posts</a> | <a href="http://www.free-css.com/">Comments</a> | <a href="http://www.free-css.com/">Email</a> </p>
<!-- END subscribe -->
<!-- BEGIN pages -->
<ul class="pages">
<li><a href="http://www.free-css.com/">Home</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="page.html">Demo Page</a></li>
<li><a href="contact.html">Contact Page</a></li>
</ul>
<!-- END pages -->
<!-- BEGIN categories -->
<ul class="categories">
<li class="f"><a href="http://www.free-css.com/">Advertising</a></li>
<li><a href="http://www.free-css.com/">Google Adsense</a></li>
<li><a href="http://www.free-css.com/">Entertainment</a></li>
<li><a href="http://www.free-css.com/">Fashion</a></li>
<li><a href="http://www.free-css.com/">Marketing</a></li>
<li><a href="http://www.free-css.com/">Pictures</a></li>
<li><a href="http://www.free-css.com/">Videos</a></li>
</ul>
<!-- END categories -->
<!-- BEGIN content -->
<div id="content">
<!-- begin latest post -->
<div class="single post">
<h2>About Us</h2>
<p>This is an example of a WordPress page, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many pages like this one or sub-pages as you like and manage all of your content inside of WordPress.</p>
</div>
<!-- end latest post -->
</div>
<!-- END content -->
<!-- BEGIN sidebar -->
<div id="sidebar">
<!-- begin search -->
<form action="http://www.free-css.com/">
<input type="text" name="s" id="s" value="" />
<button type="submit">Search</button>
</form>
<!-- end search -->
<!-- begin ads -->
<p class="ads"> <a href="http://www.free-css.com/"><img src="the-mmozine-images/ad125x125.jpg" alt="" /></a> <a href="http://www.free-css.com/"><img src="the-mmozine-images/ad125x125.jpg" alt="" /></a> <a href="http://www.free-css.com/"><img src="the-mmozine-images/ad125x125.jpg" alt="" /></a> <a href="http://www.free-css.com/"><img src="the-mmozine-images/ad125x125.jpg" alt="" /></a> </p>
<!-- end ads -->
<!-- begin popular posts -->
<h2>Popular Posts</h2>
<ul>
<li><a href="http://www.free-css.com/">Eget vitae et convallis anetulsn iand.</a></li>
<li><a href="http://www.free-css.com/">Urna tristique semper rhoncus vel Morbi orci.</a></li>
<li><a href="http://www.free-css.com/">Consectetuer non eleifend ante cursus Suspendisse neque.</a></li>
<li><a href="http://www.free-css.com/">Euismod quam id dapibus elit et a dictum interdum fames.</a></li>
<li><a href="http://www.free-css.com/">Pellesque elit Curabitur ante libero adipiscing ante.</a></li>
<li><a href="http://www.free-css.com/">Id Vivamus sed. Vel tincidunt convallis Suspendisse.</a></li>
</ul>
<!-- end popular posts -->
<!-- begin recent comments -->
<h2>Recent Comments</h2>
<ul>
<li><strong><a href="http://www.free-css.com/">Jason</a></strong>: <a href="http://www.free-css.com/">Eget vitae et convallis anetulsn iand.</a></li>
<li><strong><a href="http://www.free-css.com/">Daniel</a></strong>: <a href="http://www.free-css.com/">Urna tristique semper rhoncus vel Morbi orci.</a></li>
<li><strong><a href="http://www.free-css.com/">Clark</a></strong>: <a href="http://www.free-css.com/">Consectetuer non eleifend ante cursus Suspendisse neque.</a></li>
</ul>
<!-- end recent comments -->
<!-- begin flickr photos -->
<h2>Flickr Photos</h2>
<div class="flickr"> <a href="http://www.free-css.com/"><img src="the-mmozine-images/_thumba.jpg" alt="" /></a> <a href="http://www.free-css.com/"><img src="the-mmozine-images/_thumbb.jpg" alt="" /></a> <a href="http://www.free-css.com/"><img src="the-mmozine-images/_thumbc.jpg" alt="" /></a> <a href="http://www.free-css.com/"><img src="the-mmozine-images/_thumbd.jpg" alt="" /></a> <a href="http://www.free-css.com/"><img src="the-mmozine-images/_thumbe.jpg" alt="" /></a> <a href="http://www.free-css.com/"><img src="the-mmozine-images/_thumbf.jpg" alt="" /></a> </div>
<!-- end flickr photos -->
<!-- begin featured video -->
<h2>Featured Video</h2>
<div class="video"> <img src="the-mmozine-images/_video.jpg" alt="" /> </div>
<!-- end featured video -->
<!-- begin tags -->
<h2>Tags</h2>
<div class="tags"> <a href="http://www.free-css.com/">Link</a> </div>
<!-- end tags -->
<!-- begin left -->
<div class="l">
<!-- begin pages -->
<h2>Pages</h2>
<ul>
<li><a href="http://www.free-css.com/">About</a></li>
<li><a href="http://www.free-css.com/">Links</a></li>
<li><a href="http://www.free-css.com/">Archives</a></li>
<li><a href="http://www.free-css.com/">Contact</a></li>
</ul>
<!-- end pages -->
<!-- begin archives -->
<h2>Archives</h2>
<ul>
<li><a href="http://www.free-css.com/">December 2008</a></li>
<li><a href="http://www.free-css.com/">November 2008</a></li>
<li><a href="http://www.free-css.com/">October 2008</a></li>
<li><a href="http://www.free-css.com/">September 2008</a></li>
<li><a href="http://www.free-css.com/">August 2008</a></li>
</ul>
<!-- end archives -->
<!-- begin blogroll -->
<h2>Blogroll</h2>
<ul>
<li><a href="http://www.free-css.com/">Dart's Photography</a></li>
<li><a href="http://www.free-css.com/">Entertainment Portal</a></li>
</ul>
<!-- end blogroll -->
</div>
<!-- end left -->
<!-- begin right -->
<div class="r">
<!-- begin categories -->
<h2>Categories</h2>
<ul>
<li><a href="http://www.free-css.com/">Advertising</a></li>
<li><a href="http://www.free-css.com/">Entertainment</a></li>
<li><a href="http://www.free-css.com/">Fashion</a></li>
<li><a href="http://www.free-css.com/">Google</a></li>
<li><a href="http://www.free-css.com/">Lifestyle</a></li>
<li><a href="http://www.free-css.com/">Photos</a></li>
<li><a href="http://www.free-css.com/">Resources</a></li>
<li><a href="http://www.free-css.com/">Videos</a></li>
<li><a href="http://www.free-css.com/">Wordpress Themes</a></li>
</ul>
<!-- end categories -->
<!-- begin meta -->
<h2>Meta</h2>
<ul>
<li><a href="http://www.free-css.com/">Login</a></li>
</ul>
<!-- end meta -->
</div>
<!-- end right -->
</div>
<!-- END sidebar -->
<div class="break"></div>
</div>
</div>
<!-- END body -->
<!-- BEGIN footer -->
<div id="footer">
<!-- begin recent posts -->
<div class="box">
<h2>Recent Posts</h2>
<ul>
<li><a href="http://www.free-css.com/">Eget vitae et convallis anetulsn iand.</a></li>
<li><a href="http://www.free-css.com/">Urna tristique semper rhoncus vel Morbi orci.</a></li>
<li><a href="http://www.free-css.com/">Consectetuer non eleifend ante cursus Suspendisse neque.</a></li>
<li><a href="http://www.free-css.com/">Euismod quam id dapibus elit et a dictum interdum fames.</a></li>
<li><a href="http://www.free-css.com/">Pellesque elit Curabitur ante libero adipiscing ante.</a></li>
<li><a href="http://www.free-css.com/">Id Vivamus sed. Vel tincidunt convallis Suspendisse.</a></li>
</ul>
</div>
<!-- end recent posts -->
<!-- begin recent comments -->
<div class="box">
<h2>Recent Comments</h2>
<ul>
<li><strong><a href="http://www.free-css.com/">Jason</a></strong>: <a href="http://www.free-css.com/">Eget vitae et convallis anetulsn iand.</a></li>
<li><strong><a href="http://www.free-css.com/">Daniel</a></strong>: <a href="http://www.free-css.com/">Urna tristique semper rhoncus vel Morbi orci.</a></li>
<li><strong><a href="http://www.free-css.com/">Clark</a></strong>: <a href="http://www.free-css.com/">Consectetuer non eleifend ante cursus Suspendisse neque.</a></li>
</ul>
</div>
<!-- end recent comments -->
<!-- begin about me -->
<div class="about">
<h2>About Me</h2>
<p><img src="the-mmozine-images/about.jpg" alt="" /></p>
<p><strong>Duis aute</strong> in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur non proident fugiat nulla pariatur.</p>
<p>Fugiat nulla pariatur Enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<!-- end about me -->
<!-- begin links -->
<div class="links">
<p class="l">Copyright © 2009 - <a href="http://www.free-css.com/">Website Name</a> · All Rights Reserved</p>
<p class="r">Template by: <a href="http://www.wpthemedesigner.com/">WordPress Designer</a> | Get More <a href="http://www.free-css.com/">Free CSS Templates</a></p>
</div>
<!-- end links -->
</div>
<!-- END footer -->
</div>
<!-- END -->
</body>
</html>
Related examples in the same category