Rothko
<!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>Rothko</title>
<style type='text/css'>
/* CSS RESET */
html{color:#000;background:#222222;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}legend{color:#000;}
body {font:13px/1.231 arial,helvetica,clean,sans-serif;}table{font-size:inherit;font-size:100%;}pre,code,kbd,samp,tt{font-family:monospace;line-height:100%;}
/* CSS RESET */
body {
text-align:center;
color:#000;
}
a {
text-decoration:none;
color:#D8D800
}
a:hover {
text-decoration: underline;
color: #CC0000
}
#bg {background: url(Rothko-images/bg.jpg) no-repeat 5px; width:1028px; margin:0px auto;}
#wrap {
width:710px;
text-align:left;
margin:35px auto;
background:#fff
}
.fl{ float:left}
.fr{ float:right}
.clearfix{ clear:both}
#header {margin:10px auto; margin-bottom:35px}
/* header */
#header { position:relative;height:60px; background:url(Rothko-images/hd.gif) repeat-x bottom; width:690px }
#nav { position:absolute; top:5px; right:10px; width:421px;height:55px; line-height:55px; }
#nav li {float:left; font-weight:700;width:100px }
#nav a {text-decoration:none; display:block; text-align:center;}
#nav a:hover {color:#000000; background:#D8D800 }
/* content */
#content {
margin:0 auto;
}
.main {width:440px; font-family:Verdana, Arial, Helvetica, sans-serif; background:url(Rothko-images/box.gif); color:#000; margin-left:40px}
.text { margin-bottom:20px}
.text p {margin:0 auto; width:420px; }
.text h2 {font-size:20px; padding:8px 0 20px 5px; background:url(Rothko-images/t.gif) repeat-x; color:#bf8b38}
.text img {margin:50px 0 0 65px}
#col {margin:0 0 10px 0 ;width:300px; background:url(Rothko-images/m.jpg); width: 879px; height:104px ; }
#col div {width: 220px; margin: 20px 0 0 70px; display:inline}
#col .first {margin: 20px 0 0 50px }
#col li{line-height:20px;}
.side { width:170px;display: inline; margin-right:30px}
.side h2 {font-size:22px}
.side li {line-height:24px; color:#000; padding:0 0 0 5px }
li.grey {background: url(Rothko-images/s.gif)}
.side ul {margin:20px 0 30px 0px}
.side li a {color:#d0aa6d}
/* footer */
#footer { height:65px; position:relative; background:url(Rothko-images/ft.gif) repeat-x; width:690px ; margin:0px auto; color:#D8D800}
#ftinner{ position:absolute; bottom:20px; margin-left:20px; }
.ftlink {width:500px;}
</style>
</head>
<body>
<div id="bg">
<div id="wrap">
<div id="header">
<ul id="nav">
<li class="h"><a href="#">HOME</a></li>
<li class="a"><a href="#">PORTOFOLIO</a></li>
<li class="p"><a href="#">BLOG</a></li>
<li class="c"><a href="#">CONTACT</a></li>
</ul>
</div>
<!-- /header -->
<div id="content">
<div class="side fr">
<div id="top">
<h2><img src="Rothko-images/wtisthis.gif" alt="What is this" /></h2>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mattis porttitor odio. Etiam lacinia viverra ante. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. </p>
</div>
<div id="bm">
<h2><img src="Rothko-images/tag.gif" alt="Tag" /></h2>
<ul class="meun">
<li class="grey"><a href="#">Vestibulum bibendum</a></li>
<li><a href="#">Maecenas egestas</a></li>
<li class="grey"><a href="#">volutpat ante</a></li>
<li><a href="#">Curabitur rhoncus</a></li>
<li class="grey"><a href="#">Nulla fringilla</a></li>
<li><a href="#">Integer euismod</a></li>
<li class="grey"><a href="#">Aenean viverra</a></li>
</ul>
</div>
</div>
<div class="main fl">
<div class="text">
<h2>Free CSS Templates</h2>
<p> Rothko is a CSS template that is free and fully standards compliant. Free CSS Templates designed this template. <br/>
<br/>
This template is allowed for all uses, including commercial use, as it is released under the Creative Commons Attributions 2.5 license. The only stipulation to the use of this free template is that the links appearing in the footer remain intact. Beyond that, simply enjoy and have fun with it!</p>
</div>
<div class="text">
<h2>What are the new options</h2>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mattis porttitor odio. Etiam lacinia viverra ante. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin tincidunt. Aliquam eros eros, imperdiet vitae, volutpat id, semper sed, lorem. Praesent ullamcorper quam eget dolor. Suspendisse potenti. Proin et nunc ac metus adipiscing pretium. Phasellus eu erat. Curabitur nisl tortor, ornare nec, dictum at, vehicula eu, arcu. Ut nec est. Sed rutrum lacinia nisl. Duis at tellus. Quisque dignissim sodales odio. Quisque quam. Pellentesque tortor. Proin dictum. <br/>
<br/>
Phasellus eu enim sit amet est vulputate auctor. Donec suscipit volutpat velit. Etiam leo arcu, commodo eget, porttitor id, dignissim in, elit. Suspendisse sodales pede. Nullam pulvinar luctus tortor. Ut facilisis, ante id tempus auctor, augue lacus tempor risus, tempor rhoncus tellus leo eu turpis. Nullam scelerisque mauris. Aenean dignissim leo at elit. Pellentesque dictum mauris in erat vehicula cursus. Suspendisse eget odio. Vestibulum congue iaculis enim. Vestibulum ac lorem vitae nulla ultricies rhoncus. Suspendisse id ipsum. Duis euismod cursus nunc. Curabitur fringilla, ipsum vel varius auctor, massa sapien pretium ante, vel tincidunt arcu odio quis eros. </p>
</div>
</div>
<!-- /content -->
</div>
<div class="clearfix"></div>
<div id="footer">
<div id="ftinner">
<div class="ftlink fl">
<p id="copyright"> 2008. All Rights Reserved. <br/>
<a href="http://www.templatesold.com/" target="_blank">Website Templates</a> by <a href="http://www.free-css-templates.com/" target="_blank">Free CSS Templates</a></p>
</div>
</div>
</div>
<!-- /footer -->
</div>
</div>
</body>
</html>
Related examples in the same category