alexx-c
<!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>Alexx C</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<style type='text/css'>
body
{
background:url(alexx-c-images/bg.jpg) repeat-x top #fff;
font-family:Arial, Helvetica, sans-serif;
padding:0;
font-size:12px;
margin:0px auto auto auto;
color:#656565;
}
a{
color:#a37654;
text-decoration:none;
}
.clear{
clear:both;
}
h1{
color:#a37654;
font-size:30px;
font-weight:normal;
padding:5px 0 5px 0;
margin:0px;
clear:both;
}
h2{
color:#b15e23;
font-size:18px;
font-weight:normal;
padding:5px 0 5px 0;
margin:0px;
clear:both;
}
h3{
color:#3c1f0a;
font-size:14px;
font-weight:bold;
padding:0px 0 2px 0;
margin:0px;
clear:both;
border-bottom:1px dotted #BF8153;
}
h4{
color:#3c1f0a;
font-size:14px;
font-weight:bold;
padding:0px 0 0px 0;
margin:0px;
clear:both;
}
h4 a{
color:#3c1f0a;
font-size:14px;
font-weight:bold;
padding:0px 0 0px 0;
margin:0px;
clear:both;
}
p{
padding:5px 0 5px 0;
margin:0px;
text-align:justify;
line-height:20px;
}
.wrap{
width:960px;
margin:auto;
background:url(alexx-c-images/top_bg.jpg) no-repeat center top;
}
.logo{
padding:27px 0 0 25px;
float:left;
}
/*-----------------------------menu-------------------*/
#menu{
width:550px;
clear:both;
float:left;
padding:69px 0 0 30px;
margin:0px;
}
#menu ul{
display:block;
list-style:none;
margin:0px;
padding:0px;
}
#menu ul li{
display:inline;
padding:0px;
margin:0px;
}
#menu ul li a{
display:block;
padding:0px 0 15px 0;
margin:0px 22px 0 0;
float:left;
text-decoration:none;
color:#fff;
font-size:12px;
}
#menu ul li.selected a{
display:block;
padding:0px 0 15px 0;
margin:0px 22px 0 0;
float:left;
text-decoration:none;
color:#fff;
font-size:12px;
background:url(alexx-c-images/menu_bullet.gif) no-repeat center bottom;
}
#menu ul li a:hover{
background:url(alexx-c-images/menu_bullet.gif) no-repeat center bottom;
}
/*--------------welcome_block-----------------*/
.welcome_block{
width:550px;
height:256px;
padding:10px 0 0 30px;
float:left;
}
img.request_quote{
float:right;
padding:10px 0 0 0;
}
img.read_more{
float:right;
padding:10px 0 0 0;
}
.user_icon{
float:right;
padding:20px 35px 0 0;
_padding:100px 35px 0 0;
}
/*--------------main_content-----------------*/
.main_content{
width:960px;
clear:both;
background:url(alexx-c-images/center_bg.gif) repeat-y center;
padding:10px 0 30px 0;
}
.left_content{
width:550px;
float:left;
padding:0px 0 0 30px;
}
.services_block{
width:255px;
float:left;
padding:20px 15px 0 0;
}
.icon_left{
float:left;
width:57px;
}
.services_details{
float:left;
width:185px;
padding:0 0 0 10px;
}
.about{
width:520px;
float:left;
padding:0px 0px 0 0px;
}
img.thumb{
float:left;
padding:10px 20px 0 0;
}
.right_content{
width:340px;
float:right;
padding:0 30px 0 0;
}
.news_block{
width:340px;
clear:both;
padding:15px 0 3px 0;
border-bottom:1px dotted #BF8153;
}
img.project{
float:left;
border:1px solid #BF8153;
margin:10px 10px 0 0;
}
/*--------------------footer-------------*/
.footer{
width:100%;
height:170px;
color:#FFFFFF;
background:url(alexx-c-images/footer_bg.gif) repeat;
}
span.brown{
color:#d5a17c;
}
.footer h2{
color:#FFFFFF;
}
.footer_content{
width:960px;
margin:auto;
padding:10px 0px 0 0px;
}
.left_footer_content{
width:315px;
float:left;
padding:0 0 0 30px;
}
.footer_links{
width:195px;
float:left;
padding:0 0 0 30px;
}
.footer_links ul {
list-style:none;
padding:0px 0 0 10px;
margin:0px;
}
.footer_links ul li{
padding:4px 0 4px 0;
margin:0px;
}
.footer_links ul li a{
text-decoration:none;
padding:0 0 0 20px;
font-size:12px;
margin:0px;
color:#d5a17c;
background:url(alexx-c-images/footer_list_bullet.gif) no-repeat left;
}
.footer_links ul li a:hover{
text-decoration:underline;
}
.footer_network{
width:355px;
float:right;
}
.footer_network a{
padding:0 5px 0 0px;
}
img.csstemplatesmarket{
float:left;
clear:both;
padding:30px 0 0 0;
}
</style>
<!--[if IE 6]><script type="text/javascript" src="unitpngfix.js"></script><![endif]-->
</head>
<body>
<div class="wrap">
<div class="logo"><a href="http://www.free-css.com/"><img src="alexx-c-images/logo.gif" alt="" border="0" /></a></div>
<div id="menu">
<ul>
<li class="selected"><a href="http://www.free-css.com/">home</a></li>
<li><a href="http://www.free-css.com/">about us</a></li>
<li><a href="http://www.free-css.com/">my services</a></li>
<li><a href="http://www.free-css.com/">my work</a></li>
<li><a href="http://www.free-css.com/">featured clients</a></li>
<li><a href="http://www.free-css.com/">get in touch</a></li>
</ul>
</div>
<div class="user_icon"><img src="alexx-c-images/user.png" alt="" border="0"/></div>
<div class="welcome_block">
<h1>Lorem ipsum dolor sit amet consectetur adipisicing elit sed</h1>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </p>
<a href="http://www.free-css.com/"><img src="alexx-c-images/request_quote.gif" alt="" border="0" class="request_quote" /></a> </div>
<!--End of welcome_block-->
<div class="main_content">
<div class="left_content">
<h2>My services</h2>
<div class="services_block"> <img src="alexx-c-images/icon1.gif" alt="" border="0" class="icon_left" />
<div class="services_details">
<h3>Service name</h3>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt . </p>
</div>
</div>
<div class="services_block"> <img src="alexx-c-images/icon2.gif" alt="" border="0" class="icon_left" />
<div class="services_details">
<h3>Service name</h3>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt. </p>
</div>
</div>
<div class="services_block"> <img src="alexx-c-images/icon3.gif" alt="" border="0" class="icon_left" />
<div class="services_details">
<h3>Service name</h3>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt. </p>
</div>
</div>
<div class="services_block"> <img src="alexx-c-images/icon4.gif" alt="" border="0" class="icon_left" />
<div class="services_details">
<h3>Service name</h3>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut. </p>
</div>
</div>
<h2>About me</h2>
<div class="about"> <img src="alexx-c-images/thumb.gif" alt="" border="0" class="thumb" />
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet, consectetur adipisicing elit. <br />
<br />
Sed do eiusmod tempor incididunt ut Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>
<a href="http://www.free-css.com/"><img src="alexx-c-images/read_more.gif" alt="" border="0" class="read_more" /></a> </div>
</div>
<div class="right_content">
<h2>Latest blog news</h2>
<div class="news_block">
<h4><a href="http://www.free-css.com/">News title here</a></h4>
<p> <img src="alexx-c-images/news_icon.gif" alt="" border="0" class="thumb" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut Lorem ipsum dolor sit amet </p>
</div>
<div class="news_block">
<h4><a href="http://www.free-css.com/">News title here</a></h4>
<p> <img src="alexx-c-images/news_icon.gif" alt="" border="0" class="thumb" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut Lorem ipsum dolor sit amet </p>
</div>
<h2>Featured projects</h2>
<a href="http://www.free-css.com/"><img src="alexx-c-images/project1.jpg" alt="" border="0" class="project" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/project2.jpg" alt="" border="0" class="project" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/project3.jpg" alt="" border="0" class="project" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/project2.jpg" alt="" border="0" class="project" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/project1.jpg" alt="" border="0" class="project" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/project3.jpg" alt="" border="0" class="project" /></a> </div>
<div class="clear"></div>
</div>
<!--End of main_content-->
</div>
<!--End of wrap-->
<div class="footer">
<div class="footer_content">
<div class="left_footer_content">
<h2>Get in touch</h2>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut Lorem ipsum dolor sit amet <br />
Email : <span class="brown">yourname@yoursite.com</span><br />
<span class="brown">All Rights Reserved 2009 yoursite.com</span> </p>
</div>
<div class="footer_links">
<h2>Friends</h2>
<ul>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet</a></li>
</ul>
</div>
<div class="footer_network">
<h2>Network</h2>
<a href="http://www.free-css.com/"><img src="alexx-c-images/rss_48.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/digg_48.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/sumbleupon_48.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/reddit_48.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/technorati_48.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/delicious_48.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/"><img src="alexx-c-images/twitter_boxed_48.gif" alt="" border="0" /></a> <a href="http://csstemplatesmarket.com"><img src="alexx-c-images/csstemplatesmarket.gif" alt="" border="0" class="csstemplatesmarket" /></a> </div>
</div>
</div>
<!--End of footer-->
</body>
</html>
Related examples in the same category