cover
<!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" dir="ltr" lang="en-US">
<head>
<title>Cover Theme | Examples</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
@charset "utf-8";
*
{
margin:0;
padding:0;
}
body
{
background-color:#1a1c1d;
background-image:url(cover-images/bg.png);
background-position:top center;
margin:0;
padding:0;
font-family:Arial, Helvetica, sans-serif;
color:#333333;
}
#topbar
{
height:10px;
width:974px;
background-color:#373b3d;
border-bottom:#444647 1px solid;
font-size:0;
}
#feeds
{
float:right;
padding:0 8px;
background-image:url(cover-images/feeds.gif);
background-position:top left;
background-repeat:no-repeat;
width:162px;
margin-right:160px;
position:absolute;
margin-left:636px;
}
#feeds p
{
padding:0 8px 3px 8px;
text-align:center;
height:17px;
}
#feeds a:link, #feeds a:visited
{
color:#999999;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
text-decoration:none;
background-image:url(cover-images/feed.png);
background-position:left;
background-repeat:no-repeat;
padding-left:14px;
margin:0 2px;
}
#feeds a:hover, #feeds a:active
{
text-decoration:underline;
}
#wrapper
{
background-color:#ffffff;
width:974px;
margin:0 auto;
position:relative;
}
#header
{
background-color:#505050;
font-family:Verdana, Arial, Helvetica, sans-serif;
display:block;
}
#header h1 a, #header h2
{
color:#eaeaea;
}
#header h1
{
font-weight:normal;
padding-top:20px;
margin-left:40px;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin-top:0;
margin-bottom:0;
}
#header h1 a:hover, #header h1 a:active
{
text-decoration:none;
border-bottom:#eaeaea 1px dotted;
}
#header h2
{
font-weight:normal;
font-size:14px;
padding:0 0 20px 80px;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin-top:0;
margin-bottom:0;
}
#searchform
{
position:absolute;
left:699px;
margin-top:5px;
}
#searchform input#s
{
color:#a0a0a0;
border:#a0a0a0 1px solid;
padding:3px 2px;
font-family:Georgia, "Times New Roman", Times, serif;
width:225px;
background-color:#f4f1e9;
margin-right:0;
}
#searchform input#searchsubmit
{
margin-right:10px;
border:#a0a0a0 1px solid;
padding:2px;
width:30px;
text-align:center;
background-color:#d5c6a6;
color:#333333;
font-weight:bold;
background-image:url(cover-images/go.png);
}
ul#menu, .menu ul
{
width:974px;
height:33px;
background-color:#d5c6a6;
background-image:url(cover-images/menu.png);
list-style-type:none;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:18px;
}
ul#menu li, .menu ul li
{
float:left;
margin-top:7px;
padding:0 5px;
border-right:#333333 1px dotted;
margin-left:0;
}
ul#menu li a:link, ul#menu li a:visited, .menu ul li a:link, .menu ul li a:visited
{
display:block;
text-align:center;
padding:0 15px;
text-decoration:none;
color:#333333;
}
ul#menu li a:hover, ul#menu li a:active, .menu ul li a:hover, .menu ul li a:active, ul#menu li.current_page_item a, .menu ul li.current_page_item a:link, .menu ul li.current_page_item a:visited, .menu ul li.current_page_item a:hover, .menu ul .current_page_item a:active
{
background-color:#ffffff;
text-decoration:none;
color:#cc3300;
}
ul#menu li li
{
border-right:none;
margin:0;
margin-top:1px;
width:120px;
padding:0;
}
ul#menu li li li
{
padding-left:1px;
}
ul#menu li li a, ul#menu li li a:link, ul#menu li li a:visited
{
background:#d5c6a6 url(cover-images/submenu.png) bottom;
width:120px;
color:#333333;
font-size:16px;
font-family:Georgia, "Times New Roman", Times, serif;
margin:0;
line-height:25px;
text-align:left;
}
ul#menu li li a:hover, ul#menu li li a:active
{
background:#FFFFFF;
color:#cc3300;
}
ul#menu li ul
{
z-index:9999;
position:absolute;
left:-999em;
height:auto;
width:150px;
margin:0;
padding:0;
list-style-type:none;
}
ul#menu li ul a
{
width:120px;
}
ul#menu li ul ul
{
margin:-26px 0 0 150px;
}
ul#menu li:hover ul ul, ul#menu li:hover ul ul ul
{
left:-999em;
}
ul#menu li:hover ul, ul#menu li.sfhover ul, ul#menu li li:hover ul, ul#menu li li.sfhover ul, ul#menu li li li:hover ul, ul#menu li li li.sfhover ul
{
left: auto;
}
ul#menu li:hover, ul#menu li.sfhover
{
position: static;
}
#content
{
clear:both;
}
#center
{
float:left;
width:620px;
margin-bottom:5px;
}
#headline, #latest, #the_loop, #comments_template
{
width:590px;
margin:10px;
padding:10px;
border:#daccb0 1px solid;
background-color:#f4f1e9;
background-image:url(cover-images/featured.png);
background-position:top;
background-repeat:no-repeat;
overflow:hidden;
}
#headline p, #featured p, #popular p, #latest p, #the_loop p, #comments_template p
{
overflow:hidden;
}
#headline img, #featured img, #popular img, #latest img, #the_loop img.thumb
{
float:left;
margin:5px 10px 10px 0;
padding:1px;
border:#c9bba0 1px solid;
}
#headline img, #latest img, #the_loop img, #comments_template img
{
max-width:586px;
}
#featured img, #popular img
{
float:left;
margin:5px 5px 5px 0;
padding:1px;
border:#c9bba0 1px solid;
max-width:276px;
}
#latest img
{
float:left;
margin:5px 7px 7px 0;
padding:1px;
border:#c9bba0 1px solid;
}
#headline h3, #featured h3, #popular h3, #latest h3, .sitem h3, #top h3
{
background-color:#d5c6a6;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#333333;
padding:3px 7px;
text-transform:uppercase;
border:#cbbb9a 1px solid;
margin-top:0;
margin-bottom:3px;
}
#headline h2 a, #the_loop h2 a
{
display:block;
font-family:Arial, Helvetica, sans-serif;
margin-top:7px;
padding-bottom:2px;
font-size:20px;
color:#333333;
border-bottom:#333333 1px dotted;
}
#headline h2 a:link, #headline h2 a:visited, #featured h2 a:link, #featured h2 a:visited, #popular h2 a:link, #popular h2 a:visited, #latest h2 a:link, #latest h2 a:visited, #the_loop h2 a:link, #the_loop h2 a:visited
{
color:#333333;
text-decoration:none;
}
#headline h2 a:hover, #headline h2 a:active, #featured h2 a:hover, #featured h2 a:active, #popular h2 a:hover, #popular h2 a:active, #latest h2 a:hover, #latest h2 a:active, #the_loop h2 a:hover, #the_loop h2 a:active
{
color:#333333;
text-decoration:underline;
}
p.postmeta
{
line-height:25px;
}
#headline p, #featured p, #popular p, #latest p
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
line-height:20px;
color:#333333;
}
#headline p, #latest p
{
text-align:justify;
}
#headline p a:link, #headline p a:visited, #featured p a:link, #featured p a:visited, #popular p a:link, #popular p a:visited, #latest p a:link, #latest p a:visited
{
color:#cc3300;
text-decoration:none;
}
#headline p a:hover, #headline p a:active, #featured p a:hover, #featured p a:active, #popular p a:hover, #popular p a:active, #latest p a:hover, #latest p a:active
{
text-decoration:underline;
}
#featured
{
float:left;
width:280px;
margin:0 0 10px 10px;
padding:10px;
border:#daccb0 1px solid;
background-color:#f4f1e9;
background-image:url(cover-images/list.png);
background-position:top;
background-repeat:no-repeat;
overflow:hidden;
}
#featured h2, #popular h2, #latest h2
{
font-family:Arial, Helvetica, sans-serif;
margin-top:7px;
font-size:16px;
color:#333333;
}
.spost
{
clear:both;
padding-bottom:5px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
#featured .spost, #popular .spost
{
min-height:123px;
}
.spbottom
{
clear:both;
border-bottom:#333333 1px dotted;
}
p.read
{
margin-top:5px;
}
#popular
{
float:right;
width:280px;
padding:10px;
border:#daccb0 1px solid;
background-color:#f4f1e9;
background-image:url(cover-images/list.png);
background-position:top;
background-repeat:no-repeat;
margin-bottom:10px;
overflow:hidden;
}
#latest, #bottom
{
clear:both;
}
#sidebar
{
float:right;
width:334px;
margin:10px;
}
.sitem, .topitem
{
padding:10px;
border:#daccb0 1px solid;
background-color:#f4f1e9;
margin-bottom:10px;
font-family:Arial, Helvetica, sans-serif;
color:#333333;
overflow:hidden;
}
.sitem form, .topitem form, .sitem input, .topitem input, .sitem textarea, .topitem textarea, .sitem select, .topitem select
{
max-width:306px;
}
#left .sitem form, #right .sitem form, .sitem input, #right .sitem input, .sitem textarea, #right .sitem textarea, .sitem select, #right .sitem select
{
max-width:135px;
}
.sitem img, .topitem img
{
max-width:308px;
}
#left .sitem img, #right .sitem img
{
max-width:137px;
}
.sitem h3, #top h3
{
margin-bottom:3px;
}
ul#categories, .topitem ul
{
list-style-type:none;
font-family:Georgia, "Times New Roman", Times, serif;
overflow:hidden;
}
ul#categories li, .topitem ul li
{
margin-left:0;
min-height:20px;
padding:5px 0 2px 0;
font-size:18px;
color:#333333;
}
ul#categories li ul, .topitem li ul
{
margin-left:15px;
}
ul#categories li a:link, ul#categories li a:visited, .topitem ul li a:link, .topitem ul li a:visited
{
color:#cc3300;
text-decoration:none;
padding-top:2px;
}
ul#categories li a:hover, ul#categories li a:active, .topitem ul li a:hover, .topitem ul li a:active
{
color:#cc3300;
text-decoration:underline;
}
#left
{
float:left;
width:163px;
}
#right
{
float:right;
width:163px;
}
.sitem, .widget
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
.sitem ul
{
list-style-type:square;
margin-left:14px;
}
.sitem ul li
{
padding-left:0;
margin-left:0;
margin-bottom:2px;
}
.linkcat h2
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#333333;
}
.sitem ul li a:link, .sitem ul li a:visited, .topitem ul li a:link, .topitem ul li a:visited
{
display:block;
color:#cc3300;
text-decoration:none;
padding-top:2px;
padding-bottom:1px;
border-bottom:#cc3300 1px dotted;
}
.sitem ul li a:hover, .sitem ul li a:active, .topitem ul li a:hover, .topitem ul li a:active
{
text-decoration:underline;
}
.recentcomments a
{
display:inline !important;
padding:0 !important;
margin:0 !important;
}
#footer
{
clear:both;
background-color:#d5c6a6;
padding-top:15px;
background-image:url(cover-images/flinks.png);
background-position:top;
background-repeat:repeat-x;
}
#fbar
{
margin-left:20px;
}
.flinks
{
float:left;
width:270px;
margin:0 20px;
margin-bottom:10px;
font-family:Georgia, "Times New Roman", Times, serif;
color:#333333;
}
.flinks h3
{
font-family:Georgia, "Times New Roman", Times, serif;
font-size:16px;
color:#333333;
margin-bottom:8px;
}
.flinks ul
{
list-style-type:none;
font-family:Georgia, "Times New Roman", Times, serif;
}
.flinks ul li
{
border-bottom:#cc3300 1px dotted;
margin-left:0;
margin-bottom:5px;
min-height:20px;
padding:0px 0 2px 0;
font-size:16px;
color:#333333;
}
.flinks a:link, .flinks a:visited
{
color:#cc3300;
text-decoration:none;
}
.flinks a:hover, .flinks a:active
{
text-decoration:underline;
}
#copyright
{
clear:both;
padding:0 0 7px 10px;
background-color:#505050;
color:#eaeaea;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
background-image:url(cover-images/footer.png);
height:28px;
}
#copyright p
{
padding-top:8px;
color:#eaeaea;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}
#copyright a:link, #copyright a:visited
{
color:#ffffff;
text-decoration:none;
}
#copyright a:hover, #copyright a:active
{
text-decoration:underline;
}
.post
{
padding-bottom:5px;
background-image:url(cover-images/separator.gif);
background-position:bottom;
background-repeat:repeat-x;
margin-bottom:10px;
}
.the_content p
{
margin-bottom:5px;
text-align:justify;
}
p.address
{
background-image:url(cover-images/separator.gif);
background-position:bottom;
background-repeat:repeat-x;
padding-bottom:3px;
}
p.details
{
clear:both;
border-top:#333333 1px dotted;
margin-top:5px;
line-height:25px;
}
a:link, a:visited
{
color:#cc3300;
text-decoration:none;
}
a:hover, a:active
{
text-decoration:underline;
}
p
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
line-height:20px;
color:#333333;
text-align:justify;
margin:0;
}
img
{
padding:1px;
border:#c9bba0 1px solid;
}
.alignleft
{
float:left;
margin-right:10px;
}
.alignright
{
float:right;
margin-left:10px;
}
.aligncenter, div.aligncenter
{
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignleft
{
float:left;
margin:5px 10px 10px 0;
}
img.alignright
{
float:right;
margin:5px 0 10px 10px;
}
img.aligncenter, img.centered
{
display: block;
margin:10px auto;
}
.wp-caption, .wp-caption-text
{
background-color:#c9bba0;
margin-bottom:5px;
}
.wp-caption img
{
padding:5px;
border:none;
}
.wp-caption p
{
text-align:center;
padding-bottom:5px;
}
hr
{
border:none;
height:3px;
background-image:url(cover-images/separator.gif);
background-repeat:repeat-x;
padding:3px 0;
}
h1, h2, h3, h4, h5, h6
{
font-family:Arial, Helvetica, sans-serif;
color:#333333;
margin-bottom:0;
margin-top:5px;
}
h1, h2
{
margin-top:5px;
margin-bottom:3px;
}
dt
{
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
}
dd
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
ol, ul
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
padding:0;
margin:0;
}
ul
{
list-style-type:square;
}
ol li, ul li
{
margin-left:20px;
color:#333333;
line-height:20px;
}
fieldset
{
border:none;
}
form
{
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#333333;
}
legend
{
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
font-style:italic;
line-height:20px;
color:#333333;
margin:0 0 10px 10px;
}
label
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#333333;
line-height:20px;
}
input, textarea
{
color:#333333;
border:#a0a0a0 1px inset;
padding:2px;
margin:0 5px 5px 0;
}
input#submit, input[type=submit], input[type=button], input[type=reset]
{
border:#a0a0a0 1px outset;
}
input[type=radio]
{
border:none!important;
}
textarea
{
font-family:Arial, Helvetica, sans-serif;
}
select
{
font-family:Arial, Helvetica, sans-serif;
color:#333333;
margin:0 5px 5px 0;
}
table
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#333333;
border-collapse:collapse;
}
table caption
{
margin-bottom:5px;
}
table tfoot td
{
border:none;
text-align:left;
padding-top:5px;
}
table tfoot td#prev
{
text-align:left;
}
table tfoot td#next
{
text-align:right;
}
table th
{
background-color:#e6d7b7;
}
table th, td
{
border:#c9bba0 1px solid;
padding:3px 5px;
}
#wp-calendar th, #wp-calendar td
{
text-align:center;
}
#right #wp-calendar th, #right #wp-calendar td, #left #wp-calendar th, #left #wp-calendar td
{
padding:2px 2px 2px 3px;
}
blockquote
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
line-height:20px;
font-style:italic;
background-image:url(cover-images/quotes.png);
background-position:top left;
background-repeat:no-repeat;
padding:0 45px 5px 45px;
margin-top:10px;
}
code, code p, .code
{
font-family:"Courier New", Courier, monospace;
font-size:12px;
background-image:url(cover-images/code.png);
background-position:top left;
background-repeat:no-repeat;
padding:0 45px;
margin-top:10px;
display:block;
}
.code p
{
font-family:"Courier New", Courier, monospace;
}
.wp-pagenavi
{
font-family:Georgia, "Times New Roman", Times, serif;
font-size:14px;
color:#333333;
margin:0 0 5px 0;
background-color:#f4f1e9;
}
.wp-pagenavi a, .wp-pagenavi a:link {
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #cc3300;
color: #cc3300;
background-color: #f4f1e9;
}
.wp-pagenavi a:visited {
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #cc3300;
color: #cc3300;
background-color: #f4f1e9;
}
.wp-pagenavi a:hover {
border: 1px solid #333333;
color: #333333;
background-color: #f4f1e9;
}
.wp-pagenavi a:active {
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #cc3300;
color: #cc3300;
background-color: #f4f1e9;
}
.wp-pagenavi span.pages {
padding: 2px 4px 2px 4px;
margin: 2px 2px 2px 2px;
color: #333333;
border: 1px solid #333333;
background-color: #f4f1e9;
}
.wp-pagenavi span.current {
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #333333;
color: #333333;
background-color: #f4f1e9;
}
.wp-pagenavi span.extend {
padding: 2px 4px 2px 4px;
margin: 2px;
border: 1px solid #333333;
color: #333333;
background-color: #f4f1e9;
}
#comments_template h3
{
display:block;
font-family:Arial, Helvetica, sans-serif;
margin-top:7px;
padding-bottom:2px;
color:#333333;
border-bottom:#333333 1px dotted;
border-bottom:none;
margin-bottom:10px;
}
#comments_template ol li
{
list-style-type:none;
margin-left:0;
}
#comments_template ol li.bypostauthor, #comments_template ol li.comment-author-admin
{
background-color:#e7ddcb;
}
.comment
{
border:#daccb0 1px solid;
margin-bottom:10px;
padding:5px;
}
.comment-author img
{
float:right;
}
.comment-meta
{
margin-bottom:10px;
}
#commentform
{
padding-top:10px;
}
#commentform small
{
font-size:12px;
}
#commentform textarea
{
width:583px;
}
#commentform input#submit
{
color:#333333;
padding:2px 6px;
background-color:#e7ddcb;
background-image:url(cover-images/submit.png);
}
p#page-links
{
font-family:Georgia, "Times New Roman", Times, serif;
font-size:14px;
text-align:right;
margin-bottom:10px;
float:right;
}
.navigation
{
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
text-align:center;
padding-top:15px;
}
.navigation .left, .navigation .right
{
display:inline;
margin:0 5px;
}
.addtoany_share_save_container
{
clear:both;
float:left;
}
.the_author
{
clear:both;
border:#daccb0 1px solid;
margin-bottom:20px;
padding:10px;
background-color:#e7ddcb;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#333333;
padding-bottom:25px;
min-height:74px;
}
.the_author p
{
line-height:16px;
}
.the_author img
{
float:left;
margin-right:10px;
}
.the_author h3 a
{
color:#333333;
}
.the_author h3 span
{
color:#a0a0a0;
}
#author_meta
{
width:490px;
float:right;
clear:both;
}
#author_website
{
float:left;
width:50%;
}
#author_twitter
{
float:right;
width:50%;
}
#author_website p, #author_twitter p
{
text-align:center;
}
.share_save_container
{
clear:both;
float:left;
margin:16px 0;
}
ul.share_save_list
{
display:inline;
list-style-type:none;
margin:0 !important;
padding:0 !important;
}
ul.share_save_list li
{
background:none !important;
border:0;
display:inline !important;
line-height:32px;
list-style-type:none;
margin:0 !important;
padding:0 !important;
}
ul.share_save_list li:before
{
content:"";
}
ul.share_save_list li a
{
padding:0 9px;
}
ul.share_save_list img
{
float:none;
width:16px;
height:16px;
border:0;
margin:0;
padding:0;
vertical-align:middle;
}
ul.share_save_list a img
{
opacity:.6;
-moz-opacity:.6;
filter:alpha(opacity=60);
}
ul.share_save_list a:hover img, ul.share_save_list a.share_save_list img
{
opacity:1;
-moz-opacity:1;
filter:alpha(opacity=100);
}
a.share_save_list img
{
border:0;
width:auto;
height:auto;
}
#related
{
margin-bottom:5px;
}
#related h3
{
margin-top:10px;
margin-bottom:5px;
font-size:14px;
}
img.wp-smiley
{
border:none;
}
#wordpress
{
float:right;
background-image:url(cover-images/wordpress.png);
width:78px;
height:35px;
}
#wordpress a
{
display:block;
width:78px;
height:35px;
}
#feedburner
{
padding:3px;
margin-top:10px;
}
</style>
<!--[if IE 6]><script src="scripts/suckerfish.js" type="text/javascript"></script><link href="ie6.css" type="text/css" rel="stylesheet" media="screen" /><![endif]-->
<!--[if IE 7]><style>ul#menu li li li {padding-left:0;}</style><![endif]-->
<!--[if IE]><style>#searchform input#searchsubmit {height:24px;}#feeds p { padding-top:1px;}</style><![endif]-->
</head>
<body>
<div id="wrapper">
<div id="feeds">
<p><a class="rsslink" href="#">Articles</a> <a class="rsslink" href="#">Comments</a></p>
</div>
<!-- /feeds -->
<div id="topbar"> </div>
<!-- /topbar -->
<div id="header">
<h1><a href="#">Cover Theme</a></h1>
<h2>Just another Weblog Theme</h2>
</div>
<!-- /header -->
<form method="get" id="searchform" action="#" >
<input type="text" value="Search this website..." onfocus="if (this.value == 'Search this website...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search this website...';}" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Go" />
</form>
<div id="nav">
<ul id="menu">
<li><a href="#">Home</a></li>
<li class="current_page_item"><a href="examples.html">Examples</a></li>
<li><a href="single.html">Single</a></li>
<li><a href="#">Drop-down</a>
<ul>
<li><a href="#">Level 1</a></li>
<li><a href="#">Level 1</a>
<ul>
<li><a href="#">Level 2</a></li>
<li><a href="#">Level 2</a>
<ul>
<li><a href="#">Level 3</a></li>
<li><a href="#">Level 3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Blog</a></li>
<li><a href="#">About</a></li>
</ul>
<!-- /menu -->
</div>
<!-- /nav -->
<div id="content">
<div id="center">
<div id="the_loop">
<p class="address"><a href="#">Cover Theme</a> » Archive</p>
<div class="post">
<h2><a href="#">Nunc velit massa</a></h2>
<p class="postmeta">November 14th, 2009 | <a href="#">Add a Comment</a></p>
<div class="the_content"> <img class="alignleft" src="cover-images/latest1.jpg" alt="" width="95" height="80" border="0" />
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet odio ullamcorper odio aliquam porta vel a est. Nunc velit massa, congue interdum tempor eu, dapibus sit amet elit. Morbi at nunc augue, in accumsan dui. Nulla urna mi, mattis id scelerisque id, dignissim eu mi. Ut vestibulum egestas congue. Ut convallis nisl commodo magna faucibus commodo. Aenean nibh massa, vestibulum eget ullamcorper.</p>
<img class="aligncenter" src="cover-images/latest2.jpg" alt="" width="95" height="80" border="0" /> <img class="alignright" src="cover-images/latest3.jpg" alt="" width="95" height="80" border="0" />
<p>Aenean eros enim, pellentesque ut bibendum interdum, scelerisque sit amet massa. Ut vestibulum egestas congue. Ut convallis nisl commodo magna faucibus commodo. Aenean nibh massa, vestibulum eget ullamcorper. Sed sit amet odio ullamcorper odio aliquam porta vel a est. Nunc velit massa, congue interdum tempor eu, dapibus sit amet elit. Aenean nibh massa, vestibulum eget ullamcorper.</p>
</div>
<!-- /the_content -->
<p class="details">Filed under: <a href="#">Travel and Leisure</a></p>
</div>
<!-- /post -->
<div class="post">
<h2><a href="#">Donec lacinia</a></h2>
<p class="postmeta">November 14th, 2009 | <a href="#">Add a Comment</a></p>
<div class="the_content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<blockquote>Nulla urna mi, mattis id scelerisque id, dignissim eu mi. Aenean eros enim, pellentesque ut bibendum interdum, scelerisque sit amet massa. Ut vestibulum egestas congue.</blockquote>
<p> Morbi at nunc augue, in accumsan dui.</p>
<code> Sed sit amet odio ullamcorper odio aliquam porta vel a est. Nunc velit massa, congue interdum tempor eu, dapibus sit amet elit.</code>
<p>Ut convallis nisl commodo magna faucibus commodo. Aenean nibh massa, vestibulum eget ullamcorper.</p>
</div>
<!-- /the_content -->
<p class="details">Filed under: <a href="#">Food and Drinks</a></p>
</div>
<!-- /post -->
<div class="post">
<h2><a href="#">Donec nec lacus</a></h2>
<p class="postmeta">November 14th, 2009 | <a href="#">Add a Comment</a></p>
<div class="the_content">
<p>Donec nec lacus ligula, ac fringilla nisl. Donec a neque metus, id cursus nibh. Fusce ullamcorper commodo magna at eleifend. Phasellus posuere tristique enim, at placerat mauris sollicitudin at.</p>
<ul>
<li>unordered list item</li>
<li>unordered list item</li>
<li>unordered list item</li>
<li>unordered list item</li>
</ul>
<p>Duis aliquam lacinia orci vel pharetra. Nulla facilisi. Nunc et quam mi. Nullam fringilla mauris sollicitudin leo facilisis hendrerit. Maecenas non metus et ligula adipiscing volutpat.</p>
<ol>
<li>ordered list item</li>
<li>ordered list item</li>
<li>ordered list item</li>
<li>ordered list item</li>
</ol>
<p>Aenean in leo diam, in laoreet erat. Duis magna elit, placerat sed tincidunt eget, sollicitudin sit amet erat. Sed quis.</p>
</div>
<!-- /the_content -->
<p class="details">Filed under: <a href="#">Health and Medicine</a></p>
</div>
<!-- /post -->
<div class="post">
<h2><a href="#">Vivamus sit</a></h2>
<p class="postmeta">November 14th, 2009 | <a href="#">3 Comments</a></p>
<div class="the_content">
<p>
<fieldset>
<br />
<legend>Legend</legend>
</p>
<form>
<p>
<label for="text_field">Text Field:</label>
</p>
<input type="text" id="text_field" />
<p>
<label for="text_area">Text Area:</label>
<br />
<textarea id="text_area"></textarea>
</p>
<p>
<label for="select_element">Select Element:</label>
</p>
<select name="select_element">
<optgroup label="Option Group 1">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</optgroup>
<optgroup label="Option Group 2">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</optgroup>
</p>
</select>
<p>
<label for="radio_buttons">Radio Buttons:</label>
</p>
<input type="radio" class="radio" name="radio_button" value="radio_1" />
Radio 1<br/>
<input type="radio" class="radio" name="radio_button" value="radio_2" />
Radio 2<br/>
<input type="radio" class="radio" name="radio_button" value="radio_3" />
Radio 3<br/>
<p>
<label for="checkboxes">Checkboxes:</label>
</p>
<input type="checkbox" class="checkbox" name="checkboxes" value="check_1" />
Radio 1<br/>
<input type="checkbox" class="checkbox" name="checkboxes" value="check_2" />
Radio 2<br/>
<input type="checkbox" class="checkbox" name="checkboxes" value="check_3" />
Radio 3<br/>
<p>
<label for="password">Password:</label>
</p>
<input type="password" class="password" name="password" />
<p>
<label for="file">File Input:</label>
</p>
<input type="file" class="file" name="file" />
<br />
<input class="button" type="reset" value="Clear" />
<input class="button" type="submit" value="Submit" />
</form>
</fieldset>
</div>
<!-- /the_content -->
<p class="details">Filed under: <a href="#">Politics and Relations</a></p>
</div>
<!-- /post -->
<div class="post">
<h2><a href="#">Donec nec lacus</a></h2>
<p class="postmeta">November 14th, 2009 | <a href="#">Add a Comment</a></p>
<div class="the_content">
<p>Donec nec lacus ligula, ac fringilla nisl. Donec a neque metus, id cursus nibh. Fusce ullamcorper commodo magna at eleifend. Phasellus posuere tristique enim, at placerat mauris sollicitudin at.</p>
<table cellspacing="0" cellpadding="0">
<tr>
<th>Table Header 1</th>
<th>Table Header 2</th>
<th>Table Header 3</th>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr class="even">
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
</table>
<p>Aenean in leo diam, in laoreet erat. Duis magna elit, placerat sed tincidunt eget, sollicitudin sit amet erat. Sed quis.</p>
</div>
<!-- /the_content -->
<p class="details">Filed under: <a href="#">Health and Medicine</a></p>
</div>
<!-- /post -->
<div class="navigation">
<div class="wp-pagenavi"> <span class="pages">Page 2 of 3</span><a href="#">«</a><a href="#" class="page">1</a><span class="current">2</span><a href="#" class="page">3</a><a href="#">»</a> </div>
<!-- /navigation -->
</div>
<!-- /wp-pagenavi -->
</div>
<!-- /the_loop -->
</div>
<!-- /center -->
<div id="sidebar">
<div id="top">
<div class="topitem">
<h3>Categories</h3>
<ul id="categories">
<li class="cat-item"><a href="#">Culture and Community</a></li>
<li class="cat-item"><a href="#">Featured</a></li>
<li class="cat-item"><a href="#">Food and Drinks</a></li>
<li class="cat-item"><a href="#">Health and Medicine</a></li>
<li class="cat-item"><a href="#">Politics and Relations</a></li>
<li class="cat-item"><a href="#">Travel and Leisure</a></li>
</ul>
<!-- /categories -->
</div>
<!-- /topitem -->
</div>
<!-- /top -->
<div id="left">
<div class="sitem">
<h3>Archives</h3>
<ul class="links">
<li><a href="#">November 2009</a></li>
<li><a href="#">October 2009</a></li>
<li><a href="#">September 2009</a></li>
<li><a href="#">August 2009</a></li>
<li><a href="#">July 2009</a></li>
<li><a href="#">June 2009</a></li>
<li><a href="#">May 2009</a></li>
</ul>
<!-- /links -->
</div>
<!-- /sitem -->
</div>
<!-- /left -->
<div id="right">
<div class="sitem">
<h3>Blogroll</h3>
<ul class="links">
<li><a href="#">Development Blog</a></li>
<li><a href="#">Documentation</a></li>
<li><a href="#">Plugins</a></li>
<li><a href="#">Suggest Ideas</a></li>
<li><a href="#">Support Forum</a></li>
<li><a href="#">Themes</a></li>
<li><a href="#">WordPress Planet</a></li>
</ul>
<!-- /links -->
</div>
<!-- /sitem -->
</div>
<!-- /right -->
<div id="bottom">
<div class="sitem">
<h3>Recent Comments</h3>
<ul>
<li class="recentcomments"><a href="#">Lucy</a> on <a href="#">Nam vestibulum ultrices</a><br/>
<em>"Vivamus vitae risus sed dolor porta tincidunt ut gravida est. Nam viverra ullamc…"</em></li>
<li class="recentcomments"><a href="#">Michael</a> on <a href="#">Nam vestibulum ultrices</a><br/>
<em>"Sed purus justo, sagittis eu posuere ac, rutrum non mi. Nunc nibh lacus, tincidu…"</em></li>
<li class="recentcomments"><a href="#">Dora</a> on <a href="#">Lorem ipsum dolor</a><br/>
<em>"Aliquam id diam purus. Vestibulum mattis accumsan quam in gravida. Duis elementu…"</em></li>
<li class="recentcomments"><a href="#">Brian</a> on <a href="#">Vivamus sit</a><br/>
<em>"Ut convallis nisl commodo magna faucibus commodo. Aenean nibh massa, vestibulum …"</em></li>
<li class="recentcomments"><a href="#">Alec</a> on <a href="#">Vivamus sit</a><br/>
<em>"Morbi at nunc augue, in accumsan dui. Nulla urna mi, mattis id scelerisque id, d…"</em></li>
</ul>
</div>
<!-- /sitem -->
</div>
<!-- /bottom -->
</div>
<!-- /sidebar -->
<div id="footer">
<div id="fbar">
<div class="flinks">
<h3>Most commented</h3>
<ul>
<li><a href="#">Vivamus sit</a></li>
<li><a href="#">Nam vestibulum ultrices</a></li>
<li><a href="#">Lorem ipsum dolor</a></li>
<li><a href="#">Donec nec lacus</a></li>
<li><a href="#">Donec lacinia</a></li>
<li><a href="#">Nunc velit massa</a></li>
</ul>
</div>
<!-- /flinks -->
<div class="flinks">
<h3>Recent Articles</h3>
<ul>
<li><a href="#">Aenean nisl elit</a></li>
<li><a href="#">Phasellus accumsan</a></li>
<li><a href="#">Integer blandit</a></li>
<li><a href="#">Aenean eros enim</a></li>
<li><a href="#">Nunc velit massa</a></li>
<li><a href="#">Donec lacinia</a></li>
</ul>
</div>
<!-- /flinks -->
<div class="flinks">
<h3>Tag Cloud</h3>
<a href="#" style='font-size: 14pt;'>culture</a> <a href="#" style='font-size: 10pt;'>fashion</a> <a href="#" style='font-size: 12pt;'>food</a> <a href="#" style='font-size: 12pt;'>gadget</a> <a href="#" style='font-size: 12pt;'>health</a> <a href="#" style='font-size: 10pt;'>history</a> <a href="#" style='font-size: 8pt;'>language</a> <a href="#" style='font-size: 10pt;'>philosophy</a> <a href="#" style='font-size: 14pt;'>politics</a> <a href="#" style='font-size: 10pt;'>technology</a> <a href="#" style='font-size: 16pt;'>travel</a> <a href="#" style='font-size: 22pt;'>wordpress</a></div>
<!-- /flinks -->
</div>
<!-- /fbar -->
<div id="copyright">
<p>© 2009 Cover Theme · <a href="http://www.onedesigns.ro/designs/wordpress/cover/">Cover Theme</a> by <a href="http://www.onedesigns.ro">One Designs</a></p>
</div>
<!-- /copyright -->
</div>
<!-- /footer -->
</div>
<!-- /content -->
</div>
<!-- /wrapper -->
</body>
</html>
Related examples in the same category