business_maritime
<!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>FREE CSS TEMPLATE FROM GET CSS TEMPLATES</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type='text/css'>
* {
padding : 0;
margin : 0;
}
body {
font-family : Arial, Helvetica, sans-serif;
color : #666666;
font-size : 12px;
}
img {
padding : 3px;
border : 1px solid #bce296;
}
#header img {
padding : 3px;
border : 0;
}
img.floatTL {
float : left;
margin-right : 1em;
margin-bottom : 0.5em;
margin-top : 0.5em;
margin-left : 1em;
}
img.floatTLT {
float : left;
margin-right : 0.3em;
margin-bottom : 0.5em;
margin-top : 0;
}
#wrapper {
width : 770px;
margin : 0 auto;
}
#navbartop {
margin-top : 10px;
padding : 4px;
background-color : #fff;
text-align : right;
color : #999a01;
}
#navbartop a {
color : #999a02;
text-decoration : none;
}
#navcontainer {
background : #888800;
padding : 1px 0 0;
font-family : verdana;
text-transform : uppercase;
}
#navcontainer:after {
content : ".";
display : block;
line-height : 1px;
font-size : 1px;
clear : both;
}
ul#navlist {
list-style : none;
padding : 0;
margin : 0 auto;
width : 99.5%;
font-size : 1em;
}
ul#navlist li {
display : block;
float : left;
width : 15%;
margin : 0;
padding : 0;
}
ul#navlist li a {
display : block;
width : 100%;
padding : 0.6em;
border-color : #565b00 #7d8400 #ccc #fff;
border-style : solid;
color : #3d3d3d;
text-decoration : none;
background : #999a01;
border : 1px solid #8f9600;
}
#navcontainer > ul#navlist li a {
width : auto;
}
ul#navlist li#active a {
background : #787800;
color : #daea70;
}
ul#navlist li a:hover, ul#navlist li#active a:hover {
color : #800000;
background : transparent;
border-color : #565b00 #7d8400 #bec050 #cbc97c;
}
#header {
height : 70px;
padding-bottom : 13px;
background-color : #c9c9be;
background-image : url(business_maritime-images/header.jpg);
background-repeat : repeat-x;
margin-bottom : 2px;
}
#header h1 {
font-size : 1.7em;
color : #0099ff;
padding-top : 15px;
}
#header p {
color : #b2b2b2;
}
#header a {
color : #b2b2b2;
text-decoration : none;
}
#centercolumn {
border : 1px solid #ccc;
display : inline;
margin-top : 2px;
width : 513px;
float : left;
min-height : 200px;
background-image : url(business_maritime-images/side.jpg);
}
* html #centercolumn {
height : 200px;
}
#rightcolumn {
display : inline;
margin-top : 2px;
width : 253px;
float : left;
border : 1px solid #ccc;
background-color : #fff;
min-height : 200px;
}
* html #rightcolumn {
height : 200px;
}
#rightcolumn h2 {
color : #f2f2f2;
font-family : verdana;
font-size : 1em;
background-color : #54c7ff;
margin-left : 10px;
margin-right : 10px;
margin-top : 4px;
padding-top : 5px;
padding-bottom : 5px;
padding-left : 5px;
border-bottom : 2px solid #1f829d;
border-right : 2px solid #75a8db;
text-transform : uppercase;
}
#rightcolumn h3 {
font-family : verdana;
font-size : 0.9em;
padding-top : 10px;
padding-left : 15px;
padding-bottom : 5px;
color : #a06314;
background-image : url(business_maritime-images/news.gif);
background-repeat : no-repeat;
background-position : left 10px;
margin-left : 10px;
}
#rightcolumn p {
font-family : verdana;
font-size : 0.75em;
padding-left : 15px;
padding-bottom : 5px;
margin-left : 10px;
margin-right : 10px;
text-align : justify;
padding-right : 20px;
background-color : #eff6ff;
}
#rightcolumn a {
float : right;
color : #48b033;
font-size : 0.8em;
font-weight : bold;
padding-right : 5px;
}
#leftcolumnbottom {
display : inline;
width : 253px;
float : left;
min-height : 250px;
border : 1px solid #ccc;
background-color : #ffffff;
background-image : url(business_maritime-images/bgl.jpg);
background-repeat : repeat-x;
}
* html #leftcolumnbottom {
height : 250px;
}
#leftcolumnbottom h2 {
color : #f2f2f2;
font-family : verdana;
font-size : 1em;
background-color : #54c7ff;
margin-left : 10px;
margin-right : 10px;
margin-top : 4px;
padding-top : 5px;
padding-bottom : 5px;
padding-left : 5px;
border-bottom : 2px solid #1f829d;
border-right : 2px solid #75a8db;
text-transform : uppercase;
}
#leftcolumnbottom p {
padding-top : 5px;
font-family : verdana;
font-size : 0.8em;
padding-right : 10px;
}
#leftcolumnbottom a {
float : right;
color : #48b033;
font-size : 0.8em;
font-weight : bold;
padding-right : 5px;
}
#centercolumnbottom {
border : 1px solid #ccc;
display : inline;
width : 258px;
float : left;
background-image : url(business_maritime-images/bgc.jpg);
background-repeat : repeat-x;
min-height : 250px;
}
* html #centercolumnbottom {
height : 250px;
}
#centercolumnbottom h2 {
color : #f2f2f2;
font-family : verdana;
font-size : 1em;
background-color : #54c7ff;
margin-left : 10px;
margin-right : 10px;
margin-top : 4px;
padding-top : 5px;
padding-bottom : 5px;
padding-left : 5px;
border-bottom : 2px solid #1f829d;
border-right : 2px solid #75a8db;
text-transform : uppercase;
}
#centercolumnbottom img {
margin-top : 2px;
margin-left : 10px;
}
#centercolumnbottom ul {
margin-left : 40px;
margin-top : 5px;
color : #667dff;
}
#centercolumnbottom li {
padding-top : 5px;
padding-left : 10px;
}
#centercolumnbottom a {
color : #667dff;
font-weight : bold;
text-decoration : underline;
font-size : 0.8em;
}
#rightcolumnbottom {
display : inline;
width : 253px;
float : left;
border : 1px solid #ccc;
background-color : #fff;
background-image : url(business_maritime-images/bgl.jpg);
background-repeat : repeat-x;
min-height : 250px;
}
* html #rightcolumnbottom {
height : 250px;
}
#rightcolumnbottom h2 {
color : #f2f2f2;
font-family : verdana;
font-size : 1em;
background-color : #54c7ff;
margin-left : 10px;
margin-right : 10px;
margin-top : 4px;
padding-top : 5px;
padding-bottom : 5px;
padding-left : 5px;
border-bottom : 2px solid #1f829d;
border-right : 2px solid #75a8db;
text-transform : uppercase;
}
#rightcolumnbottom img {
margin-top : 2px;
margin-left : 10px;
}
#rightcolumnbottom p {
font-family : verdana;
font-size : 0.8em;
margin-top : 10px;
margin-left : 10px;
margin-right : 10px;
text-align : justify;
padding-right : 20px;
background-color : #eff6ff;
}
#rightcolumnbottom a {
float : right;
color : #48b033;
font-size : 0.8em;
font-weight : bold;
padding-right : 5px;
}
#payOff {
background-color : #83bffc;
display : inline;
float : left;
width : 100%;
text-align : center;
border-top : 1px solid #84bbff;
padding-top : 5px;
padding-bottom : 5px;
}
#payOff a {
text-decoration : underline;
color : #50739b;
padding-left : 10px;
padding-right : 10px;
}
#payOff a:hover {
text-decoration : none;
color : #50739b;
padding-left : 10px;
padding-right : 10px;
}
#footer {
background-color : #fff;
display : inline;
float : left;
width : 100%;
}
#footer p {
font-size : 0.88em;
padding-top : 10px;
text-align : center;
}
#footer a {
color : #50739b;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="navbartop">
<a href="http://www.getcsstemplates.com" title="Free CSS Templates">Home</a> | <a href="#">Sitemap</a> | <a href="#">Contact</a>
</div>
<div id="header">
<img src="business_maritime-images/logopic2.gif" class="floatTLT" alt="nice template" /><h1>Free Business CSS Template</h1><p>by: <a href="#">Get CSS Templates For Free</a></p>
</div>
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="http://www.getcsstemplates.com" id="current">Templates</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
<div id="centercolumn">
</div>
<div id="rightcolumn">
<h2>Lorem Ipsum </h2>
<h3>Jan.17.07.</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec rutrum neque eu nisl. Morbi eget ... </p>
<a href="#">read more</a>
<h3>Jan.11.07.</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec rutrum neque eu nisl. Morbi eget ... </p>
<a href="#">read more</a>
</div>
<div id="leftcolumnbottom">
<h2>Lorem Ipsum </h2>
<img src="business_maritime-images/img2.jpg" class="floatTL" alt="nice template" />
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec rutrum neque eu nisl...</p>
<a href="#">more</a>
<p> </p>
<img src="business_maritime-images/img3.jpg" class="floatTL" alt="nice template" />
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec rutrum neque eu nisl...</p>
<a href="#">more</a>
</div>
<div id="centercolumnbottom">
<h2>Lorem Ipsum </h2>
<img src="business_maritime-images/img4.jpg"alt="nice template" />
<ul>
<li><a href="#">Lorem ipsum dolor sit amet</a></li>
<li><a href="#">Lorem ipsum dolor sit amet</a></li>
<li><a href="#">Lorem ipsum dolor sit amet</a></li>
<li><a href="#">Lorem ipsum dolor sit amet</a></li>
<li><a href="#">Lorem ipsum dolor sit amet</a></li>
</ul>
</div>
<div id="rightcolumnbottom">
<h2>Lorem Ipsum </h2>
<img src="business_maritime-images/img5.jpg"alt="nice template" />
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec rutrum neque eu nisl. Morbi eget ... </p>
<a href="#">read more</a>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec rutrum neque eu nisl. Morbi eget ... </p>
<a href="#">read more</a>
</div>
<div id="payOff">
<a href="http://www.getcsstemplates.com/"> Free Templates </a> ::
<a href="#"> Link Two </a> ::
<a href="#"> Link Three </a> ::
<a href="#"> Link Four </a> ::
<a href="#"> Link Five </a>
</div>
<div id="footer"> <p><a href="http://validator.w3.org/">Valid CSS</a> :: <a href="http://validator.w3.org/">Valid XHTML</a> Copyright © 2007 by Free CSS Templates and Layouts :: Designed by: <a href="http://www.getcsstemplates.com"title="free css templates and layouts">GET CSS TEMPLATES</a> </p> </div>
</div>
</body>
</html>
Related examples in the same category