internetservices : Business « Templates « HTML / CSS

internetservices

   

<!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>Internet Services</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<style type='text/css'>
/* project: internet services template
   author: luka cvrk (www.solucija.com) */

   
/* default styles
   -------------- */
   
body { 
  padding: 0; 
  margin: 0; 
  font: 0.7em Tahoma, sans-serif; 
  line-height: 1.5em;
  background: #fff; 
  color: #454545; 
}

a {  color: #E0691A;  background: inherit;}
a:hover { color: #6C757A; background: inherit; }

h1 { font: normal 2.1em Arial, Sans-Serif; letter-spacing: -1px; padding: 7px 0 0 8px; margin: 0; }
.dark  { color: #737373; background: inherit; font-weight: bold; }
h1 a, h2 a { text-decoration: none; }
h1 a:hover, h2 a:hover { color: #FF6600; background: inherit; }
h2 { margin: 0; padding: 0; font: bold 1.7em Arial, Sans-Serif; letter-spacing: -1px; }
h2 { font-size: 1.5em; margin-bottom: 5px; color: #000; background: inherit; }

p {  margin: 0 0 5px 0; }

ul { margin: 0; padding : 0; list-style : none; }

form {   margin: 0; }

input.search { 
  width: 292px; 
  border: 0;
  background: #FFF url(input.gif) no-repeat;
  padding: 4px; 
  color: #E0691A;
  font-weight: bold;
}

input.submit {
  background: #E0691A url(submit.gif) no-repeat;
  border: 0;
  padding: 4px 0;
  width: 65px;
  margin: 0 15px 1px 0;
  color: #FFF;
  font: bold 1em Arial, Sans-Serif;
}

input.login { 
  width: 150px;
  border: none; 
  
  padding: 4px; 
}

/* layout
   ------ */

.content { 
  margin: 0 auto;
  width: 780px;
  padding: 10px; 
}

.header { 
  height: 55px;
  background: #eee;
  color: #808080;
  margin: 3px 0;
  padding: 10px 0 0 0;
  border-bottom: 1px solid #ccc;
}

.top_info {
  float: right;
  width: 555px;
  padding: 5px 0 4px 0;
  border-bottom: 1px solid #eee;
  background: #eee;
  color: #808080;
}

  .top_info_left {
    width: 200px;
    float: left;
  }

  .top_info_right {
    float: right;
    width: 290px;
    padding: 0 0 0 35px;
    border-left: 1px solid #eee;
  }

.browse_category  {
  font-size: 0.9em;
  width: 190px;
  color: #FFF;
  background: inherit;
}

.bar { 
  clear: both;
  font-size: 1.1em;
  height: 30px; 
  color: #FFF;
  margin: 0 0 0 0px; 
  background: #FF9148;
}

  .bar li { 
    margin: 0; 
    padding: 7px 12px 5px 12px;
    color: #FFEADC;
    background: #FF9148;
    float: left; 
  }
  
  .bar li.active { 
    background: #E0691A url(bar.gif) no-repeat center top; 
    color: #fff;
    font-weight: bold; 
    padding: 7px 10px 6px 10px;
  }
  
  .bar li a { 
    font-weight: bold;
    color: #FFF; 
    background: inherit;
    text-decoration: none;
  } 
  
  .bar li a:hover { 
    color: #E0691A; 
    background: inherit;
  } 

.search_field { 
  background: #fff url(searchbg.gif) no-repeat right; 
  color: #808080;
  clear: both;
  font-weight: bold;
  padding: 7px 25px 10px 10px;
  margin: 5px 0;
}

.grey {
  color: #808080;
  background: inherit;
  font-weight: normal;
}

.search_form { float: right; }

.subheader {
  margin: 0px 0 10px 0;
  border-bottom: 1px solid #eee;
  padding: 5px 0 5px 0;
  background: #A4A4A4;
  color: #fff;
}

/* left side
   --------- */

.left {
  float: left;
  width: 65%;
  margin: 0 0 10px 0;
}

.left h3 {
  clear: both;
  background: #A9C0CE url(corner.gif) no-repeat top right;
  color: #FFF;
  padding: 7px 0 7px 5px;
  font: bold 1em Tahoma, Arial, Sans-Serif;
  margin: 0 0 0px 0;
}
  .left_side {
    float: left;
    width: 180px;
    padding: 0 0 0 10px;
    margin: 10px 0;
  }
    
  .left_side a, .right_side a { color: #414141; background: #FFF; }
    
  .right_side {
    float: right;
    width: 220px;
    background: #FFF url(dotted.gif) repeat-y;
    color: #414141;
    padding: 0 0 0 40px;
    margin: 10px 0;
  }
    
  .left_box { margin: 0 0 10px 0; color: #000; background: #FFF; padding: 3px 0; }
  
    
/* right side
   ---------- */
    
.right {
  float: right;
  width: 34.6%;
  margin: 0 0 10px 0;
}

.right h3 {
  background: #6C757A  url(corner.gif) no-repeat top right;;
  color: #FFF;
  padding: 7px 0 7px 5px;
  font: bold 1em Tahoma, Arial, Sans-Serif;
  margin: 0 0 3px 0;
}

  .right_articles {
    background: #f5f5f5;
    color: #414141;
    padding: 8px;  
    margin: 0 0 3px 0;
  }
  
.image {
  float: left;
  margin: 0 9px 3px 0;
}

/* footer
   ------ */

.footer { 
  clear: both;
  text-align: center;
  padding: 10px 0 10px 0;
  margin: 0;
  border-top: 1px solid #ccc;
  line-height: 1.8em;
}

.footer a { color: #808080; background: #fff; }


</style>


</head>
<body>
<div class="content">
  <div class="header">
    <div class="top_info">
      <div class="top_info_right">
        <p><b>You are not Logged in!</b> <a href="http://www.free-css.com/">Log in</a> to check your messages.<br />
          Do you want to <a href="http://www.free-css.com/">Log in</a> or <a href="http://www.free-css.com/">register</a>?</p>
      </div>
      <div class="top_info_left">
        <p><b>28. March, 2006</b> - Tuesday<br />
          Check todays <a href="http://www.free-css.com/">hot topics</a> or <a href="http://www.free-css.com/">new products</a></p>
      </div>
    </div>
    <div class="logo">
      <h1><a href="http://www.free-css.com/"><span class="dark">Internet</span>Services</a></h1>
    </div>
  </div>
  <div class="bar">
    <ul>
      <li class="browse_category">Select Search Category:</li>
      <li><a href="http://www.free-css.com/" accesskey="i">Home</a></li>
      <li class="active">People</li>
      <li><a href="http://www.free-css.com/" accesskey="m">Music</a></li>
      <li><a href="http://www.free-css.com/" accesskey="p">Pictures</a></li>
      <li><a href="http://www.free-css.com/" accesskey="s">Services</a></li>
      <li><a href="http://www.free-css.com/" accesskey="r">Products</a></li>
    </ul>
  </div>
  <div class="search_field">
    <form method="post" action="http://www.free-css.com/">
      <div class="search_form">
        <p>Search the Web:
          <input type="text" name="search" class="search" />
          <input type="submit" value="Search" class="submit" />
          <a class="grey" href="http://www.free-css.com/">Advanced</a></p>
      </div>
    </form>
    <p>Please <a href="http://www.free-css.com/">Sign in</a> or <a href="http://www.free-css.com/">Register</a></p>
  </div>
  <div class="left">
    <h3>Fresh News:</h3>
    <div class="left_box"> <img src="internetservices-images/bigimage.gif" class="image" alt="Big Image" />
      <h2>Expanding Internet Services</h2>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi <a href="http://www.free-css.com/">enim ad minim</a> veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. <a href="http://www.free-css.com/">Duis autem</a> vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu.</p>
    </div>
    <h3>Web Directory</h3>
    <div class="left_side">
      <p><b><img src="internetservices-images/arrow.gif" alt=">" /><a class="title" href="http://www.free-css.com/">Arts</a></b><br />
        <a href="http://www.free-css.com/">Music</a>, <a href="http://www.free-css.com/">Television</a>, <a href="http://www.free-css.com/">Movies</a>...</p>
      <p><b><img src="internetservices-images/arrow.gif" alt=">" /><a class="title" href="http://www.free-css.com/">Computers</a></b><br />
        <a href="http://www.free-css.com/">Internet</a>, <a href="http://www.free-css.com/">Software</a>, <a href="http://www.free-css.com/">Hardware</a>...</p>
      <p><b><img src="internetservices-images/arrow.gif" alt=">" /><a class="title" href="http://www.free-css.com/">Shopping</a></b><br />
        <a href="http://www.free-css.com/">Autos</a>, <a href="http://www.free-css.com/">Clothing</a>, <a href="http://www.free-css.com/">Gifts</a>...</p>
    </div>
    <div class="right_side">
      <p><b><img src="internetservices-images/arrow.gif" alt=">" /><a class="title" href="http://www.free-css.com/">Business</a></b><br />
        <a href="http://www.free-css.com/">Jobs</a>, <a href="http://www.free-css.com/">Real Estate</a>, <a href="http://www.free-css.com/">Investing</a>...</p>
      <p><b><img src="internetservices-images/arrow.gif" alt=">" /><a class="title" href="http://www.free-css.com/">Health</a></b><br />
        <a href="http://www.free-css.com/">Fitness</a>, <a href="http://www.free-css.com/">Medicine</a>, <a href="http://www.free-css.com/">Alternative</a>...</p>
      <p><b><img src="internetservices-images/arrow.gif" alt=">" /><a class="title" href="http://www.free-css.com/">Sports</a></b><br />
        <a href="http://www.free-css.com/">Baseball</a>, <a href="http://www.free-css.com/">Basketball</a>, <a href="http://www.free-css.com/">Soccer</a>...</p>
    </div>
    <h3>Colaboration:</h3>
    <div class="left_box"> <img src="internetservices-images/ad.gif" class="image" alt="Big Image" />
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi <a href="http://www.free-css.com/">enim ad minim</a> veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. <a href="http://www.free-css.com/">Duis autem</a> vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu.<a href="http://www.free-css.com/">Duis autem</a> vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu.</p>
    </div>
  </div>
  <div class="right">
    <h3>Top Articles:</h3>
    <div class="right_articles">
      <p><img src="internetservices-images/image.gif" alt="Image" title="Image" class="image" /><b>Lorem ipsum dolor sit amet</b><br />
        consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.</p>
    </div>
    <div class="right_articles">
      <p><img src="internetservices-images/image.gif" alt="Image" title="Image" class="image" /><b>Lorem ipsum dolor sit amet</b><br />
        consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.</p>
    </div>
    <h3>Related Readings:</h3>
    <div class="right_articles">
      <p><img src="internetservices-images/image.gif" alt="Image" title="Image" class="image" /><b>Lorem ipsum dolor sit amet</b><br />
        consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.</p>
    </div>
    <div class="right_articles">
      <p><img src="internetservices-images/image.gif" alt="Image" title="Image" class="image" /><b>Lorem ipsum dolor sit amet</b><br />
        consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.</p>
    </div>
    <div class="right_articles">
      <p><img src="internetservices-images/image.gif" alt="Image" title="Image" class="image" /><b>Lorem ipsum dolor sit amet</b><br />
        consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.</p>
    </div>
    <div class="right_articles">
      <p><img src="internetservices-images/image.gif" alt="Image" title="Image" class="image" /><b>Lorem ipsum dolor sit amet</b><br />
        consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.</p>
    </div>
  </div>
  <div class="footer">
    <p><a href="http://www.free-css.com/">Homepage</a> | <a href="http://www.free-css.com/">Contact</a> | <a href="http://www.free-css.com/">Accessibility</a> | <a href="http://www.free-css.com/">Products</a> | <a href="http://www.free-css.com/">Disclaimer</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> and <a href="http://validator.w3.org/check?uri=referer">XHTML</a><br />
&copy; Copyright 2006 Internet Services, Design: Luka Cvrk - <a href="http://www.solucija.com/" title="What's your solution?">Solucija</a></p>
  </div>
</div>
</body>
</html>

Related examples in the same category

1.	metamorph_disco
2.	businesdesign2007
3.	businesportal
4.	business template
5.	business web design
6.	business web template 38
7.	business-1
8.	business-2
9.	business-box
10.	business-center
11.	business-co
12.	business-company
13.	business-consultants
14.	Business-Design
15.	business-elegance
16.	business-llc
17.	business-online
18.	business-solution
19.	business-strategy
20.	business-time
21.	business-way
22.	business-world
23.	businessblog
24.	businessdesign
25.	businesshighway
26.	businesslike
27.	BusinessName
28.	BusinessSolution
29.	businesssolutions01
30.	businesstheme
31.	businessweb
32.	Business_Elegance
33.	business_events
34.	business_maritime
35.	busineswebdesign
36.	CarCar
37.	car-club
38.	car-dealer
39.	cars-website
40.	bloodybusiness
41.	Bloody_Business
42.	biz-company
43.	biz-solution
44.	biz-watch
45.	bizbox
46.	bizgroup
47.	metamorph_autosalon
48.	metamorph_business
49.	metamorph_casino
50.	alouette-agency
51.	advertising
52.	financial-services
53.	financial-website
54.	five-star-hotel
55.	metamorph_advice
56.	bloom
57.	blooming
58.	clubcard
59.	clubhouse
60.	bed-and-breakfast
61.	construction-company
62.	construction-group
63.	constructional-company
64.	consulting-services
65.	Consulting
66.	corporate-2.0
67.	corporate-blue
68.	corporate
69.	CorporateBlack
70.	corporateblue
71.	CorporateBlue2
72.	corporategreen
73.	CorporateGrey
74.	corporateluxe
75.	corporateprofiles
76.	CorporateRedGrey
77.	Corporate_Design
78.	corporation-ltd
79.	design-company
80.	metamorph_shopping
81.	metamorph_spasaloon
82.	metamorph_restaurant
83.	metamorph_photostudio
84.	abc-company
85.	ad-agency
86.	foo_shooting_club
87.	firming
88.	financialco
89.	abstract-studio
90.	carpet-cleaning
91.	architect-company
92.	architect-group
93.	architect
94.	architectural-company
95.	architectural-group
96.	architecture-bureau
97.	architecture
98.	computer-business
99.	computer-store
100.	djclub
101.	dally_studio
102.	future-business
103.	global-business
104.	global-hosting
105.	global
106.	globalhouse
107.	globalpress
108.	enterprise
109.	corpplus
110.	corpwire-magazine
111.	funkycorporate
112.	simply_business
113.	Small_Corporation
114.	your-business
115.	voip-company
116.	economics
117.	educational-site
118.	ec-mania
119.	furniture-collections
120.	mobileshop
121.	political-party
122.	pizza-factory
123.	pizzaparlor
124.	plainoffice
125.	plantshop
126.	play-school
127.	office
128.	online-casino
129.	online-radio
130.	online_education
131.	outsource-inc
132.	software-co
133.	software-company
134.	simplyBusiness
135.	smallstudio
136.	small-corporation
137.	rainbow_consultant
138.	Professional
139.	professional-web2
140.	premium-business
141.	premiumtemplateshop
142.	radio-station
143.	real-estate-agency
144.	real-estate-co
145.	real-estate
146.	realestate-company
147.	realestate
148.	sample-resume
149.	sample_business_site
150.	resume
151.	shop-around
152.	shop-online
153.	social-community-management
154.	workshyfop
155.	workspacer
156.	whirlpool
157.	WebStore
158.	weblogo
159.	strategicbusinessdesigns
160.	thebluecompany
161.	thebookstore
162.	TheCorporation
163.	total_management
164.	thepinkcompany
165.	theme-marketplace
166.	transportcompany
167.	internetmarket
168.	internetjobs
169.	market-leader
170.	Market
171.	marketing-company
172.	lawyer-and-attorney
173.	lawyer-marketing
174.	Job-Portal
175.	happy-print-shop
176.	health-care
177.	inbusiness
178.	industrial-company
179.	industrial-construction
180.	industrial
181.	industry
182.	internethosting
183.	luxury-hotel
184.	luxury-restaurant
185.	military-school
186.	headquarters
187.	hosting-co
188.	incorporated
189.	interior-design
190.	internetcorporation
191.	internetmanagement
192.	internet-studio
193.	TWO COLUMN CSS BUSINESS WEBSITE TEMPLATE
194.	Business template 2