travel-portal : Travel « Templates « HTML / CSS






travel-portal

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License

Title      : Travel Portal
Version    : 1.0
Released   : 20070618
Description: A two-column, fixed-width template.

-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Travel Portal by Free Css Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type='text/css'>
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

body {
  margin: 0;
  padding: 0;
  background: #E5E5E5;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 13px;
  color: #666666;
}

blockquote {
  font-style: italic;
}

a {
  color: #135293;
}

a:hover {
  text-decoration: none;
}

.title1 {
  margin: 0;
  padding: 10px 0;
  background: url(travel-portal-images/img07.gif) repeat-x left bottom;
  font-weight: normal;
  font-size: 129%;
  color: #FFFFFF;
}

.title2 {
  margin: 0;
  padding: 10px 0;
  background: url(travel-portal-images/img09.gif) repeat-x left bottom;
  font-size: 227%;
  font-weight: normal;
  color: #135293;
}

.title3 {
  margin: 0;
  padding: 10px 0;
  background: url(travel-portal-images/img11.gif) repeat-x left bottom;
  font-size: 129%;
  font-weight: normal;
  color: #FFFFFF;
}

.boxed {
  padding: 5px 30px 20px 30px;
}

.boxed p, .boxed ul, .boxed ol {
  line-height: 180%;
}

.orange {
  margin: 20px 30px;
  background: #FF9523 url(travel-portal-images/img10.gif) repeat-x;
  color: #FFFFFF;
}

.orange a {
  color: #FFFFFF;
}

.col-one {
  float: left;
  width: 300px;
}

.col-two {
  float: right;
  width: 300px;
}

/* Page */

#page {
  width: 980px;
  margin: 0 auto;
  background: #FFFFFF url(travel-portal-images/img01.gif) repeat-y;
}

/* Sidebar */

#sidebar {
  float: left;
  width: 240px;
}

/* Logo */

#logo {
  height: 220px;
  background: #FFFFFF url(travel-portal-images/img02.gif) repeat-y right top;
}

#logo h1, #logo h2 {
  margin: 0;
  text-transform: lowercase;
  text-align: center;
  font-weight: normal;
  font-style: italic;
  color: #9C9C9C;
}

#logo h1 {
  padding: 100px 0 0 0;
  background: url(travel-portal-images/img03.gif) no-repeat center center;
  font-size: 36px;
}

#logo h2 {
  font-size: 14px;
}

#logo a {
  color: #9C9C9C;
  text-decoration: none;
}

/* Menu */

#menu {
  padding: 20px;
  background: #85C329 url(travel-portal-images/img04.gif) repeat-x;
}

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

#menu li {
  padding: 10px 0;
  background: url(travel-portal-images/img05.gif) repeat-x;
}

#menu li.first {
  background: none;
}

#menu a {
  text-decoration: none;
  font-size: 129%;
  color: #FFFFFF;
}

#menu a:hover {
  text-decoration: underline;
}

/* Login */

#login {
  padding: 20px;
  background: url(travel-portal-images/img06.gif) repeat-x;
}

#login form {
  margin: 0;
  padding: 20px 0 0 0;
}

#login fieldset {
  margin: 0;
  padding: 0;
  border: none;
}

#login label {
  color: #FFFFFF;
}

#inputtext1, #inputtext2 {
  width: 194px;
  margin-bottom: .5em;
  font: bold 100% Georgia, "Times New Roman", Times, serif;
  color: #666666;
}

#inputsubmit1 {
  margin-bottom: .5em;
  font: bold 100% Georgia, "Times New Roman", Times, serif;
  color: #666666;
}

#login a {
  color: #FFFFFF;
}

/* Content */

#content {
  float: right;
  width: 740px;
}

/* Footer */

#footer {
  width: 980px;
  height: 120px;
  margin: 0 auto;
  background: url(travel-portal-images/img12.gif) repeat-x;
}

#footer p {
  margin: 0;
  font-size: 85%;
}

#links {
  float: left;
  width: 220px;
  height: 45px;
  padding: 35px 0 0 20px;
  background: url(travel-portal-images/img13.gif) repeat-x;
}

#links a {
  color: #FFFFFF;
}

#legal {
  float: right;
  width: 720px;
  height: 45px;
  padding: 35px 0 0 20px;
}

</style>


</head>
<body>
<div id="page">
  <div id="sidebar">
    <div id="logo">
      <h1><a href="http://www.free-css.com/">Travel Portal</a></h1>
      <h2><a href="http://www.freecsstemplates.org/">By Free CSS Templates</a></h2>
    </div>
    <!-- end header -->
    <div id="menu">
      <ul>
        <li class="first"><a href="http://www.free-css.com/">Home</a></li>
        <li><a href="http://www.free-css.com/">Destinations</a></li>
        <li><a href="http://www.free-css.com/">Travel Packages</a></li>
        <li><a href="http://www.free-css.com/">Customer Support</a></li>
        <li><a href="http://www.free-css.com/">About Us</a></li>
        <li><a href="http://www.free-css.com/">Contact Us</a></li>
      </ul>
    </div>
    <!-- end menu -->
    <div id="login">
      <h2 class="title1">Customer Login</h2>
      <form id="form1" method="post" action="http://www.free-css.com/">
        <fieldset>
        <label for="inputtext1">Username:</label>
        <input id="inputtext1" type="text" name="inputtext1" value="" />
        <label for="inputtext2">Password:</label>
        <input id="inputtext2" type="password" name="inputtext2" value="" />
        <input id="inputsubmit1" type="submit" name="inputsubmit1" value="Sign In" />
        <p><a href="http://www.free-css.com/">Forgot your password?</a><br />
          <a href="http://www.free-css.com/">Register for Free!</a></p>
        </fieldset>
      </form>
    </div>
  </div>
  <!-- end sidebar -->
  <div id="content">
    <div><img src="travel-portal-images/img08.jpg" alt="" width="740" height="220" /></div>
    <div class="boxed">
      <h1 class="title2">Welcome to Our Website!</h1>
      <p><strong>Travel Portal</strong> is a free template from <a href="http://www.freecsstemplates.org/">Free CSS Templates</a> released under a <a href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attribution 2.5 License</a>. The header photo is from <a href="http://www.pdphoto.org/">PDPhoto.org</a>. You're free to use it for both commercial or personal use. I only ask that you link back to my site in some way. <em>Enjoy :)</em></p>
      <h3>Curabitur Sem Urna</h3>
      <p>Vel consequat, suscipit in, mattis placerat, nulla. Sed ac leo. Pellentesque imperdie:</p>
      <blockquote>
        <p>&ldquo;In posuere eleifend odio quisque semper augue mattis wisi maecenas ligula.Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum. Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh.&rdquo;</p>
      </blockquote>
    </div>
    <div class="boxed orange">
      <div class="col-one">
        <h2 class="title3">Lorem Ipsum Dolorem</h2>
        <ul>
          <li><a href="http://www.free-css.com/">Semper vestibulum</a></li>
          <li><a href="http://www.free-css.com/">Vestibulum luctus</a></li>
          <li><a href="http://www.free-css.com/">Integer rutrum</a></li>
          <li><a href="http://www.free-css.com/">Etiam malesuada</a></li>
          <li><a href="http://www.free-css.com/">Elementum facilisis</a></li>
          <li><a href="http://www.free-css.com/">Ut tincidunt</a></li>
          <li><a href="http://www.free-css.com/">Odio sagittis</a></li>
        </ul>
      </div>
      <div class="col-two">
        <h2 class="title3">Lorem Ipsum Dolorem</h2>
        <ul>
          <li><a href="http://www.free-css.com/">Semper vestibulum</a></li>
          <li><a href="http://www.free-css.com/">Vestibulum luctus</a></li>
          <li><a href="http://www.free-css.com/">Integer rutrum</a></li>
          <li><a href="http://www.free-css.com/">Etiam malesuada</a></li>
          <li><a href="http://www.free-css.com/">Elementum facilisis</a></li>
          <li><a href="http://www.free-css.com/">Ut tincidunt</a></li>
          <li><a href="http://www.free-css.com/">Odio sagittis</a></li>
        </ul>
      </div>
      <div style="clear: both;">&nbsp;</div>
    </div>
  </div>
  <!-- end content -->
  <div style="clear: both;">&nbsp;</div>
</div>
<!-- end page -->
<div id="footer">
  <p id="legal">Copyright &copy; 2007 Travel Portal. All Rights Reserved. Designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>.</p>
  <p id="links"><a href="http://www.free-css.com/">Privacy Policy</a> | <a href="http://www.free-css.com/">Terms of Use</a></p>
</div>
</body>
</html>

   
    
  








Related examples in the same category

1.metamorph_travelling
2.travel-and-tour
3.travel-company
4.travelagency
5.travelcity
6.travelling-train
7.SouthTravel
8.travel 2