ilove-cocktail
<!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>I Love Cocktail</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
/*
CSS Credit: http://www.templatemo.com/
*/
body {
margin:0;
padding:0;
line-height: 1.5em;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12px;
color: #FFFFFF;
background: #1a1f19;
}
a:link, a:visited { color: #cccc66; text-decoration: none}
a:active, a:hover { color: #cccc66; text-decoration: underline}
#templatemo_container_wrapper {
background: url(ilove-cocktail-images/mainbackground.gif) repeat-x;
}
#templatemo_container {
width: 800px;
margin: auto;
border: 1px solid #ffffff;
}
/*------------ Header --------------- */
#templatemo_header {
height: 251px;
background: #000000 url(ilove-cocktail-images/banner.gif) no-repeat;
}
#templatemo_site_title {
padding-top: 160px;
padding-left: 50px;
font-size: 50px;
color:#a8a8b4;
}
#templatemo_site_title span{
font-weight: 200;
color:#cccc33;
}
#templatemo_site_slogan {
padding-top: 20px;
padding-left: 200px;
font-size: 1.1em;
color:#5a5c51;
}
/* ---------------------------------- */
/*------------- Menu ------------------*/
.templatemo_menu{
float: left;
width: 800px;
height: 45px;
margin: 0px;
padding: 0px;
background: #434343 url(ilove-cocktail-images/menubackground.gif) repeat-x;
}
.templatemo_menu ul {
margin: 0px;
padding: 0px;
list-style: none;
text-align: center;
}
.templatemo_menu li{
display: inline;
}
.templatemo_menu li a{
float: left;
padding: 10px 0px;
font: 1.2em arial;
text-align: center;
text-decoration: none;
color: #c6c6c6;
width: 160px;
}
.templatemo_menu li a:hover, .templatemo_menu li .current{
color: #ffffff;
background: url(ilove-cocktail-images/menuhover.gif) center center no-repeat;
}
/* ----------------- end of menu----------------*/
/* ----------------- Content ----------------------- */
#templatemo_content {
width: 800px;
}
#templatemo_top {
float: left;
padding: 20px;
width: 760px;
background: #383a2f;
}
#templatemo_bottom {
float: left;
width: 800px;
color: #999966;
padding: 0px;
background: #1e1f19;
}
#templatemo_bottom a{
line-height: 25px;
color: #999966;
}
#templatemo_bottom .section {
float: left;
width: 205px;
padding: 20px 10px 0px 30px;
height: 200px;
}
#templatemo_bottom .section a{
padding-left: 25px;
color: #999966;
line-height: 25px;
text-decoration: none;
background: url(ilove-cocktail-images/list_icon.gif) no-repeat center left;
}
#templatemo_bottom .section a:hover {
color: #cccc66;
}
#templatemo_bottom .middle {
float: left;
padding: 20px 40px;
width: 210px;
height: 200px;
background: url(ilove-cocktail-images/sectionleftborder.gif) left no-repeat;
}
#templatemo_bottom .middlerightborder {
float: left;
padding: 20px 0px;
width: 16px;
height: 200px;
background: url(ilove-cocktail-images/sectionrightborder.gif) left no-repeat;
}
.text_area {
color: #999966;
margin: 10px;
}
.publish_date {
clear: both;
color: #999966;
padding-bottom: 5px;
font-weight: bold;
}
.title {
height: 37px;
margin-left: 10px;
padding-top: 18px;
padding-left: 30px;
font-size: 1.8em;
color:#ffff66;
background: url(ilove-cocktail-images/cup.gif) left center no-repeat;
}
.subtitle{
padding-bottom: 10px;
font-size: 1.4em;
color: #cccc33;
}
.text_area img{
float: left;
margin: 0px 10px;
}
/*--------- End of Content -------------*/
/* -------- Footer --------- */
#templatemo_footer {
clear: left;
padding-top: 15px;
padding-right: 10px;
width: 790px;
height: 62px;
color: #999966;
line-height: 24px;
text-align:right;
background: #212121 url(ilove-cocktail-images/footerbackground.gif) repeat-x;
}
#templatemo_footer a {
color: #999966;
text-decoration: none;
}
#templatemo_footer a:hover {
color: #cccc66;
}
/* --------- end of footer --------------*/
</style>
</head>
<body>
<div id="templatemo_container_wrapper">
<div id="templatemo_container">
<div id="templatemo_header">
<div id="templatemo_site_title">I Love <span>Cocktail</span></div>
<div id="templatemo_site_slogan">Your slogan text goes here</div>
</div>
<div class="templatemo_menu">
<ul>
<li><a href="http://www.free-css.com/" class="current">Home</a></li>
<li><a href="http://www.free-css.com/">About Us</a></li>
<li><a href="http://www.free-css.com/">Prices</a></li>
<li><a href="http://www.free-css.com/">Member</a></li>
<li><a href="http://www.free-css.com/">Contact Us</a></li>
</ul>
</div>
<div id="templatemo_content">
<div id="templatemo_top">
<div class="title">Free CSS Website Template</div>
<div class="text_area" align="justify"> <img src="ilove-cocktail-images/image.gif" alt="" />This is a free CSS website template created by <b>Saw Htoo</b> for templatemo.com. You may download, modify and apply this CSS layout for your websites. Credit goes to mihail from stockvault.net for the photo. <br />
<br />
<a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" width="88" height="31" vspace="8" border="0" /></a><a href="http://jigsaw.w3.org/css-validator/"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/ilove-cocktail-images/vcss-blue" alt="Valid CSS!" vspace="8" border="0" /></a> <br />
<br />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc quis sem nec tellus blandit tincidunt. Duis vitae velit sed dui malesuada dignissim. Donec mollis aliquet ligula. Maecenas adipiscing elementum ipsum. Pellentesque vitae magna. Sed nec est.<br />
<br />
Mauris convallis. Proin vel libero id erat venenatis accumsan. Nunc blandit orci sit amet risus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut iaculis lacinia purus. Duis pulvinar scelerisque ante. Morbi tristique, risus quis congue pulvinar, nisl nisi commodo diam, a porta nisi ligula ac massa. Vestibulum blandit lacus sed sapien. </div>
</div>
<div id="templatemo_bottom">
<div class="section">
<div class="subtitle">Special Thanks</div>
<a href="http://www.free-css.com/">Text Link One</a><br />
<a href="http://www.free-css.com/">Web Link Two</a><br />
<a href="http://www.free-css.com/">Cool Link Three</a><br />
<a href="http://www.free-css.com/">Website Link Four</a><br />
<a href="http://www.free-css.com/">Free CSS Templates</a><br />
</div>
<div class="middle" align="justify">
<div class="subtitle">News</div>
<div class="publish_date">Date: 21-10-2020</div>
In hac habitasse platea dictumst. Aenean cursus. Maecenas aliquam, ligula id egestas suscipit, nisi sapien dignissim nibh, ac vestibulum lorem urna in neque....<br />
<a href="http://www.free-css.com/">Read More</a></div>
<div class="middlerightborder"></div>
<div class="section" align="justify">
<div class="subtitle">Quick Contact</div>
Tel: 000-000-0000<br />
Fax: 001-001-0011<br />
Email: info[at]templatemo.com<br />
</div>
</div>
</div>
<div id="templatemo_footer"> <a href="http://www.free-css.com/">Home</a> <a href="http://www.free-css.com/">About Us</a> <a href="http://www.free-css.com/">Prices</a> <a href="http://www.free-css.com/">Member</a> <a href="http://www.free-css.com/">Contact Us</a><br />
Copyright <a href="http://www.free-css.com/">Your Company Name</a> Designed by <a href="http://www.templatemo.com">templatemo.com</a> </div>
</div>
</div>
</body>
</html>
Related examples in the same category