travelagency : Travel « Templates « HTML / CSS






travelagency

  

<!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>Travel agency</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
body {
    font-family: tahoma, helvetica, arial, sans-serif;
    font-size: 10px;
    text-align: center;
    color: #787878;
}

html, body, #wrapper, h1 {
    margin: 0;
    padding: 0;
}

th, td {
    font-size: 10px;
}

img { border: 0; }

a {
    color: #525d8c;
}

#wrapper {
    margin: auto;
    text-align: left;
    width: 800px;
    position: relative;
}

h1, h2, h3 {
    font-size: 10px;
}


h1 {
    line-height: 1;
    position: absolute;
    top: 0;
    left: 0;
}

h2 {
    margin: 0 0 5px 0;
    padding: 0;
}

h3 {
    padding: 4px 0 0 0;
}

.block {
    display: block;
}

.clear {
    clear: both;
    height: 10px;
}

.left {
    float: left;
    margin: -1px 5px 0px 0px;
}

.readmore {
    text-align: right;
}

#nav {
  background: red;
  position: absolute;
  top: 48px;
  left: 448px;
  width: 106px;
}

#nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    background: #8dc445 url(travelagency-images/menu_bg.gif) repeat-y;
}

#nav li {
    list-style: none;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid white;
}

#nav a {
    color: #387009;
    text-decoration: none;
    display: block;
    padding: 6px 0 6px 30px;
}

* html #nav a {
    width: 100%;
    w\idth: 76px;
    padding: 5px 0 5px 30px;
    padd\ing: 6px 0 6px 30px;
}

#nav a:hover {
    background: #5b8c29;
    color: white;
}

#booking {
    position: absolute;
    top: 0;
    left: 555px;
    width: 245px;
    height: 172px;
    background: #1ab0e7;
    padding: 0;
}

#booking h2 {
    background: #27a2ce;
    color: #0c4366;
    border-bottom: 1px solid white;
    padding: 7px 15px;
}

#booking .jtype {
    text-align: center;
    padding: 0 0.7em 1em 0em;
}

#booking form {
    margin: 1.5em 0 0.5em 1.5em;
    padding: 0;
}

#booking th, #booking td {
    text-align: left;
    padding-right: 7px;
    padding-bottom: 10px;
    color: #0c4366;
}

#booking .text {
    width: 90px;
    border: 1px solid #0c8dbd;
}

#booking .submit {
    border: 1px solid #0a5f7e;
    background: #177da2;
    color: white;
    font-weight: bold;
    font-size: 11px;
}

#booking .advanced {
    margin-top: 3px;
    margin-left: 20px;
}

#booking,
#booking a {
    color: #0c4366;
    text-decoration: none;
    font-weight: bold;
}

#booking img {
    float: left;
    margin-right: 10px;
    margin-top: 1px;
}

#main {
    padding-top: 48px;
    width: 446px;
    position: relative;
}

#main .inner {
    position: relative;
    margin: 0 0 0 10px;
    padding-right: 10px;
    border-right: 1px solid #ccc;
}

#packagesheader {
    position: absolute;
    top: 113px;
    margin-top: 6em;
    left: 448px;
}

#packages {
    float: right;
    clear: both;
    width: 315px;
    padding-top: 143px;
    margin-top: 6em;
    margin-right: 18px;
    line-height: 1.6;
}

* html #packages {
    margin-right: 8px;
}

#packages h2 {
    margin-left: 0px;
}

#packages .golden {
    color: #ba9f35;
    background: url(travelagency-images/gold.gif) no-repeat;
    padding: 5px 0 3px 30px;
}

#packages .silveren {
    color: #b4b4b4;
    background: url(travelagency-images/silver.gif) no-repeat;
    padding: 5px 0 3px 30px;
}

#special {
    border-top: 1px solid #ccc;
    padding: 15px 0 0 0;
    text-align: center;
}

#footer {
    clear: both;
    background: #333;
    color: white;
    padding: 7px 15px;
}

.blue {
    color: #4165af;
}

.green {
    margin-top: 3em;
    color: #598e1e;
}

</style>


</head>
<body>
<div id="wrapper">
  <h1><a href="http://www.free-css.com/"><img src="travelagency-images/logo.gif" width="554" height="47" alt="Travel Agency" /></a></h1>
  <div id="booking">
    <h2>Bookings &amp; Reservations</h2>
    <form action="http://www.free-css.com/" method="get">
      <div class="jtype">
        <label for="flight">Flight</label>
        <input name="flight" id="flight" type="checkbox" value="flight" />
        &nbsp; &nbsp;
        <label for="hotel">Hotel</label>
        <input name="hotel" id="hotel" type="checkbox" value="hotel" />
        &nbsp; &nbsp;
        <label for="cruise">Cruise</label>
        <input name="cruise" id="cruise" type="checkbox" value="cruise" />
      </div>
      <!-- end .jtype -->
      <table summary="" cellspacing="0" cellpadding="0" border="0">
        <tr>
          <th>Check in</th>
          <td><input name="in" type="text" value="" class="text" />
            <input type="submit" value="submit" class="submit" /></td>
        </tr>
        <tr>
          <th>Check out</th>
          <td><input name="out" type="text" value="" class="text" />
            <input type="submit" value="submit" class="submit" /></td>
        </tr>
      </table>
      <p class="advanced"><a href="http://www.free-css.com/"><img src="travelagency-images/advanced.gif" width="11" height="11" alt="" /> Advanced Search</a></p>
    </form>
  </div>
  <!-- end booking -->
  <div id="nav">
    <ul>
      <li><a href="http://www.free-css.com/">Home</a></li>
      <li><a href="http://www.free-css.com/">Tours</a></li>
      <li><a href="http://www.free-css.com/">Bookings</a></li>
      <li><a href="http://www.free-css.com/">Services</a></li>
      <li><a href="http://www.free-css.com/">Contacts</a></li>
    </ul>
  </div>
  <!-- end nav -->
  <h2  id="packagesheader"><img src="travelagency-images/title_our_packages.gif" width="352" height="23" alt="our packages" /></h2>
  <div id="packages">
    <h3 class="golden">Golden Package</h3>
    <p>Don't forgot to check free website templates every day, because we add at least one free website template daily.</p>
    <p>This is a template designed by free website templates for you for free you can replace all the text by your own 
      text. This is just a place holder so you can see how the site would look like.</p>
    <p class="readmore"><a href="http://www.free-css.com/"><img src="travelagency-images/readmore.gif" width="68" height="15" alt="readmore" /></a></p>
    <h3 class="silveren">Silver Package</h3>
    <p>If you're having problems editing the template please don't hesitate to ask for help on the forum.</p>
    <p class="readmore"><a href="http://www.free-css.com/"><img src="travelagency-images/readmore.gif" width="68" height="15" alt="readmore" /></a></p>
    <div id="special"> <a href="http://www.free-css.com/"><img src="travelagency-images/ad_special_offer.gif" width="293" height="79" alt="special offer" /></a> </div>
    <!-- end special -->
  </div>
  <!-- end packages -->
  <div id="main"> <img src="travelagency-images/people.jpg" width="447" height="298" alt="two people having a walk" class="block" />
    <h2><img src="travelagency-images/title_hottest_locations.gif" width="447" height="24" alt="hottest locations" /></h2>
    <div class="inner">
      <h3 class="blue">Italy</h3>
      <img src="travelagency-images/photo_1.jpg" width="109" height="71" alt="stunning italian history" class="left" />
      <p>You can remove any link to our websites from this template you're  free to use the template without linking 
        back to us. Don't want your boss to know you used a free website template ;) .</p>
      <br />
      <br />
      <h3 class="green">Hawai</h3>
      <img src="travelagency-images/photo_2.jpg" width="109" height="71" alt="sea, the beaches" class="left" />
      <p>If you're looking for beautiful and professionally made templates you can find them at Template Beauty.com.</p>
      <p>To find great hosting providers visit Web Hosting Zoom.</p>
      <div class="clear"></div>
    </div>
    <div class="clear"></div>
  </div>
  <!-- end main -->
  <div id="footer"> &copy; Copyright Information here | designed by <a href="http://www.freewebsitetemplates.com">free website templates</a></div>
  <!-- end footer -->
</div>
<!-- end wrapper -->
</body>
</html>

   
    
  








Related examples in the same category

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