whatsyoursolution
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>What's your solution?</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
/* template: What's your solution?
author: luka cvrk (www.solucija.com) */
body {
margin: 0;
padding: 0;
font: 70% Tahoma, Arial, Helvetica, sans-serif;
color: #7e7e7e;
background: #FFFFFF url(bg.gif) repeat-x;
line-height: 16px;
}
a {
color: #33ADDB;
background-color: inherit;
}
a:hover {
color: #575757;
background-color: inherit;
}
h1 {
font: bold 1.8em Arial, Sans-Serif;
letter-spacing: -1px;
margin: 0;
padding: 0;
}
h1 a {
text-decoration: none;
}
h2 {
margin: 0;
padding: 3px 0 6px 0;
font: 130% Arial, Sans-Serif;
font-weight: bold;
color: #808080;
text-transform: uppercase;
background-color: inherit;
}
h2 a {
color: #6AC65D;
background-color: inherit;
text-decoration: none;
}
p {
padding: 2px 0 5px;
margin: 0;
}
#content {
margin: 0px auto;
width: 780px;
}
.header {
height: 45px;
margin: 0px 0 2px 0;
padding: 20px 0 0 5px;
border-top: 4px solid #000;
background: #FFF url(headerbg.gif) repeat-x bottom left;
color: #808080;
}
.searchform {
float: right;
padding: 2px 5px 0 0;
}
.subheader {
clear: both;
height: 23px;
margin: 0 0 10px 0;
}
.subheader_left {
line-height: 28px;
width: 193px;
background: #33ADDB url(hmleftbg.gif) repeat-x;
color: #FFFFFF;
padding: 0 5px 0 5px;
}
.subheader_left a {
color: #FFF;
text-decoration: none;
font-weight: bold;
background-color: inherit;
}
.subheader_right {
background: #F6F6F6 url(hmrightbg.gif) repeat-x;
color: #626262;
line-height: 28px;
float: right;
width: 574px;
}
.subheader_right a {
margin: 0px 2px 0 0;
padding: 7px 10px 8px 10px;
color: #626262;
background: inherit;
font-weight: bold;
text-decoration: none;
}
.subheader_right a:hover {
background: #33ADDB url(hmleftbg.gif) repeat-x;
border-top: 1px solid #1A83AC;
color: #FFFFFF;
}
.left {
float: left;
padding: 5px 0 0 5px;
width: 190px;
}
.right {
float: right;
width: 560px;
margin: 0 0 20px 0;
padding: 5px 0 0 15px;
color: #000;
background-color: #FFFFFF;
border-left: 1px solid #e6e6e6;
}
a.info {
font: bold 1.3em Arial, Sans-Serif;
text-decoration:none;
position:relative;
}
a.info span {
display:none;
}
a.info:hover {
cursor:default;
}
a.info:hover .infobox {
font-weight: normal;
display:block;
position:absolute;
top:20px;;
left:0;;
width:205px;
height:70px;
border: 1px solid #ccc;
background:#f4f4f4 url(question.gif) no-repeat bottom right;
color:#000;
text-align:left;
font-size:0.7em;
padding-left:10px;
padding-top:10px;
}
.line {
height: 2px;
margin: 10px 0 10px 0;
}
.right_left {
float: left;
width: 260px;
padding: 13px;
background: #f2f2f2 url(corner.gif) no-repeat bottom right;
color: #626262;
}
.right_right {
float: right;
width: 240px;
padding: 13px;
background: #f2f2f2 url(corner.gif) no-repeat bottom right;
color: #626262;
}
.footer {
clear: both;
color: #999999;
background-color: #FFFFFF;
padding: 10px 0 10px 0;
border-top: 1px solid #e6e6e6;
text-align: center;
line-height: 13px;
}
.footer a {
text-decoration: underline;
}
form.search {
padding: 0;
margin: 0;
}
input.text {
margin: 0;
width: 95px;
border: 1px solid #ccc;
background: #FFF;
color: #000;
}
input.text:hover {
border: 1px solid #808080;
}
input.searchbutton {
margin: 0;
font-size: 100%;
font-family: Arial, Sans-serif;
border: none;
background: #FFFFFF;
color: #808080;
padding: 1px;
font-weight: bold;
}
.date {
color: #ccc;
background: #FFFFFF;
text-align: right;
margin: 4px 0 3px 0;
padding: 0;
}
</style>
</head>
<body>
<div id="content">
<div class="header">
<div class="searchform">
<form method="post" class="search" action="http://www.free-css.com/" />
<p>
<input name="search_query" class="text" type="text" />
<input name="search" class="searchbutton" value="Search" type="submit" />
</p>
</div>
<h1><a href="http://www.free-css.com/">What's your solution?</a></h1>
</div>
<div class="subheader">
<div class="subheader_right"> <a href="http://www.free-css.com/">Home</a><a href="http://www.free-css.com/">Archives</a><a href="http://www.free-css.com/">CMS solutions</a><a href="http://www.free-css.com/">Statistics</a><a href="http://www.free-css.com/">Optimization</a><a href="http://www.free-css.com/">Portfolio</a><a href="http://www.free-css.com/">About us</a> </div>
<div class="subheader_left"> <a href="http://www.free-css.com/">Are we the best? Find out!</a> </div>
</div>
<div class="right">
<div class="info"> <a class="info" href="#nogo">PROVIDING THE BEST CMS SOLUTONS<span class="infobox">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat.</span></a> </div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
<p class="date"><img src="whatsyoursolution-images/comment.gif" alt="" /> <a href="http://www.free-css.com/">Comments(9)</a> <img src="whatsyoursolution-images/timeicon.gif" alt="" /> 23.12.</p>
<div class="info"> <a class="info" href="#nogo">COMPILING STATISTICS<span class="infobox">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat.</span></a> </div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
<p class="date"><img src="whatsyoursolution-images/comment.gif" alt="" /> <a href="http://www.free-css.com/">Comments(24)</a> <img src="whatsyoursolution-images/timeicon.gif" alt="" /> 23.12.</p>
<div class="line"></div>
<div class="right_left">
<h2>WHAT's NEW?</h2>
<p><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet</a>, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis <a href="http://www.free-css.com/">nostrud exerci tation</a>.</p>
</div>
<div class="right_right">
<h2>Important links</h2>
<p><a href="http://www.free-css.com/">sNews</a> <img src="whatsyoursolution-images/arrow.gif" alt="" /> Single file CMS</p>
<p><a href="http://www.free-css.com/">Solucija</a> <img src="whatsyoursolution-images/arrow.gif" alt="" /> Information Architecture, CSS</p>
<p><a href="http://www.free-css.com/">360 Web Design</a> <img src="whatsyoursolution-images/arrow.gif" alt="" /> Accessible Web Design</p>
</div>
</div>
<div class="left">
<h2>About <a href="http://www.free-css.com/">web 2.0</a></h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. <a href="http://www.free-css.com/">Ut wisi enim ad minim veniam</a>, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure <a href="http://www.free-css.com/">dolor in hendrerit</a> in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
<p><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet</a>, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis <a href="http://www.free-css.com/">nostrud exerci tation</a> ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. </p>
</div>
<div class="footer">
<p><a href="http://www.free-css.com/">Home</a> | <a href="http://www.free-css.com/">Contact</a></p>
<p> Copyright 2005, <a href="http://www.free-css.com/">YourSite</a> | Design: Luka Cvrk - <a href="http://www.solucija.com/" title="What's your solution?">Solucija</a> | Valid <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> and <a href="http://validator.w3.org/check?uri=referer">XHTML</a></p>
</div>
</div>
</body>
</html>
Related examples in the same category