nightcity : Day Night « Templates « HTML / CSS






nightcity

  

<!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>Night City business</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
body{ font-family: Arial, Helvetica, sans-serif; color: Black; background-color: White; font-size: 10pt; background-image: url(bg_body.gif); background-repeat: repeat-x; margin: 0;  padding: 0;  }
p{  font-size : 10pt; }
a{  font-family : Arial, Helvetica, sans-serif;  color : #B90000;  font-size : 10pt;}
a:hover{  text-decoration : underline;  color: #FF2424; }
form{  margin: 0px;}
input{ font-family: Tahoma;  font-size: 12px;  }

/* HEADER
-------------------------------------------------------------------------*/
#HEADER{ display: block; height: 117px; padding:0; margin:0;  background-position: top right;  background-repeat: no-repeat;  background-image: url(bg_header.jpg);   }
  #HEADER h1{ width: 471px; position: absolute;  top: 0;  left: 0;     height: 112px;  background-image: url(bg_logo_deep.gif); background-repeat: no-repeat; padding: 0 0 0 23px; margin: 0;  display: inline;              }
  #HEADER h1 a{ display: block;  padding: 0 22px 0 22px;  width: 130px;   line-height: 52px; border-top: 3px solid #9E0000; background-color: #CD0000; height: 52px; color: White; font-family: "Times New Roman", Times, serif; font-size: 20px; margin: 0; text-decoration: none;  display: block;  font-weight: normal;    }
  #HEADER h1 a:hover{  background-color: #E60000;}
  #HEADER p.NextPage{ margin: 32px 0 0 0; display: inline; width: 20px; float: right;    }
  #HEADER p.NextPage a{ width: 20px; height: 19px; background-color: #CD0000; background-image: url(next_page.gif); background-repeat: no-repeat; display: block; color: #CD0000; }
  #HEADER p.NextPage a:hover{ background-color: #E60000; background-image: url(next_page.gif); background-repeat: no-repeat; color: #E60000; }
  #HEADER ul{ list-style: none; margin: 87px 0 0 0; padding: 0; display: inline; float: right; display: block;  border-bottom: 5px solid #004278;  position: relative;  left: 20px;       }
  #HEADER li{ float:left; margin: 0;  padding: 0 27px 0 5px; list-style: none; display: inline;  background-image: url(bg_topnav_li.gif);  background-repeat: repeat-y;    height: 25px;  line-height: 7px;      }
  #HEADER li a{  color: White; text-decoration: none;  font-size: 11px;  font-family: Tahoma, Arial, Helvetica, sans-serif;         }
  #HEADER li a:hover{ text-decoration: none; position: relative; top: -1px; }

/* NAV LINE
--------------------------------------------------------------------------*/
#PATH{ display: block; height:48px;  padding-left: 220px; margin:0; }
  #PATH p{ padding: 29px 0 0 0; margin: 0; font-size: 8pt; color: #B90000; font-weight: bold; }
  #PATH a{ text-decoration: none; color: Black; font-size: 8pt;  font-weight: normal;  }
  #PATH a:hover{ text-decoration: none; position: relative; top: -1px; }
  #PATH .Arrow{ color: Black; position: relative; top: -1px;  margin: 0 2px 0 2px;  }
  
/* CONTENT
--------------------------------------------------------------------------*/
#CONTENT{ display: block; margin: 27px 27px 27px 220px; }
  #CONTENT h1{ margin:0 0 0.5em 0; padding:0; line-height: 14pt; font-family: Arial, Helvetica, sans-serif;  font-weight: normal;  font-size: 14pt;  color: #225680;    }
  #CONTENT p{ text-align: justify; text-indent: 25px;  margin: 0 0 10px 0;  padding: 0;  }

#SIDEBAR{ width:151px; display: table-cell; margin-top: 27px; padding: 0px 23px 0 23px;  background-image: url(bg_vline.gif);  background-repeat: repeat-y;  background-position: right;  float: left;  margin-bottom: 20px;     }
  #SIDEBAR h1{ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 11px; color: White;  background-color: #004278;  text-align: center;  font-weight: bold;  padding: 3px 0 3px 0;  margin: 0 0 17px 0;         }
  #SIDEBAR p{ text-align: justify;  margin: 0;  font-family: Arial, Helvetica, sans-serif;  font-size: 9pt;  padding-bottom: 3px;     }
  #SIDEBAR p.Date{ text-align: left;  font-size: 8pt; color: #B90000;  font-weight: bold;  line-height: 8pt;  margin: 0 0 3px 0;       }
  #SIDEBAR p.More{ text-align:right;  margin-top: 3px;  margin-bottom: 18px;   }
  #SIDEBAR p.More a{font-size: 8pt; color: #B90000;  text-decoration: none;  font-weight: bold;     }
  #SIDEBAR p.More a:hover{ text-decoration: underline; }

/* FOOTER
--------------------------------------------------------------------------*/
#FOOTER{ display: block; margin: 27px 27px 0 220px; padding: 0 0 20px 0; clear: both;  background-image: url(bg_footer.gif);  background-repeat: no-repeat;  background-position: right bottom;             }
  #FOOTER ul{  background-image: url(bg_hline.gif);  background-repeat: repeat-x;  list-style: none; margin: 0; padding: 5px 0 0 0;   display: block;              }
  #FOOTER li{  margin: 0;  padding: 0; list-style: none;  display: inline;                  }
  #FOOTER li a{ color: #004278; text-decoration: none; font-size: 9pt; font-family: "MS Sans Serif", Geneva, sans-serif;  margin-left: 6px;  margin-right: 6px;   }
  #FOOTER li a.First{ margin-left:0;}
  #FOOTER li a:hover{ text-decoration: underline; }
  #FOOTER p{ margin: 5px 0 0 0; font-family: "MS Sans Serif", Geneva, sans-serif; font-size: 9pt; }
  #FOOTER a{font-family: "MS Sans Serif", Geneva, sans-serif;  font-size: 9pt;     color: Black;  text-decoration: none;    }
  #FOOTER a:hover{ text-decoration: underline; }


</style>


</head>
<body>
<div id="HEADER">
  <h1> <a href="http://www.free-css.com/">Company&nbsp;Name</a></h1>
  <p class="NextPage"> <a href="http://www.free-css.com/">></a></p>
  <ul>
    <li><a href="http://www.free-css.com/">Home</a></li>
    <li><a href="http://www.free-css.com/">Projects</a></li>
    <li><a href="http://www.free-css.com/">About Us</a></li>
    <li><a href="http://www.free-css.com/">Contacts</a></li>
    <li><a href="http://www.free-css.com/">Sitemap</a></li>
  </ul>
</div>
<!-- header -->
<div id="PATH">
  <p><a href="http://www.free-css.com/">Home</a> <span class="Arrow">&raquo;</span> About Company</p>
</div>
<!-- PATH -->
<div id="SIDEBAR">
  <h1>RECENT NEWS</h1>
  <p class="Date">April 31, 2006</p>
  <p>Curabitur arcu tellus, suscipit in, aliquam eget, ultricies id, sapien. Nam est. Donec neque risus, tempor vitae, blandit in, porttitor a, sapien. Fusce sollicitudin quam ac neque.</p>
  <p class="More"> <a href="http://www.free-css.com/">Read More</a></p>
  <p class="Date">April 31, 2006</p>
  <p>Curabitur arcu tellus, suscipit in, aliquam eget, ultricies id, sapien. Nam est. Donec neque risus, tempor vitae, blandit in, porttitor a, sapien. Fusce sollicitudin quam ac neque.</p>
  <p class="More"> <a href="http://www.free-css.com/">Read More</a></p>
  <h1>LINKS</h1>
  <p> <a href="http://www.free-css.com/">www.gettemplate.com</a></p>
  <p> <a href="http://www.free-css.com/">www.wisepixel.com</a></p>
  <p> <a href="http://www.free-css.com/">www.funnyball2.com</a></p>
</div>
<!-- sidebar -->
<div id="CONTENT">
  <h1>Text Header</h1>
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam auctor semper libero. Vestibulum at erat eget arcu sagittis adipiscing. Vestibulum odio nisi, scelerisque et, tempus et, adipiscing vitae, augue. Fusce consectetuer, elit sit amet viverra ornare, odio eros luctus nisl, vel tempus felis quam et arcu. Proin id elit. Fusce rutrum mauris sit amet nibh viverra porttitor. Phasellus eu lorem vitae augue aliquet aliquam. Integer vestibulum viverra tellus. Aliquam est arcu, ullamcorper nec, molestie vitae, rutrum vitae, ligula. Vivamus vitae augue at dui consequat tempor.</p>
  <p>Ut porttitor aliquam ligula. Quisque ultrices. Proin massa lectus, molestie sed, porta consequat, ornare ac, leo. Etiam pellentesque, nibh at interdum interdum, mauris nisl aliquet lorem, at sodales elit dolor id velit. Phasellus iaculis velit viverra magna. Nullam tincidunt molestie erat. Pellentesque justo. Ut elementum auctor dolor. Nam sagittis tempor purus. Morbi a sem non mi tempus feugiat. Integer tempor dolor non tortor. Ut ullamcorper sapien ut quam. Fusce posuere porttitor felis. Cras volutpat dignissim massa.</p>
  <p>Aliquam sit amet augue in dui porttitor consectetuer. Nulla facilisi. Nunc suscipit, diam et dignissim consequat, sapien ante sodales orci, et lobortis tellus tortor imperdiet dui. Donec volutpat nonummy dui. In hac habitasse platea dictumst. Suspendisse potenti. Vestibulum ultrices pharetra ligula. Nulla facilisi. In accumsan congue turpis. <a href="http://www.free-css.com/">Integer lorem</a>. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas dui. Etiam sit amet dolor vitae nunc fermentum blandit. Donec tincidunt. Suspendisse odio diam, sagittis vitae, consectetuer vel, cursus sed, enim. Phasellus ac lacus. Ut luctus, sapien ut sagittis cursus, tellus justo aliquam purus, vel consequat massa ligula sit amet magna.</p>
  <h1>Second Header</h1>
  <p>In velit. In convallis, libero at suscipit tempus, nunc tortor tempus augue, in tincidunt urna dui eget purus. Nunc leo sem, pulvinar non, euismod eu, condimentum sed, massa. Vivamus lorem arcu, consequat nec, ornare id, porttitor non, felis. Nullam nec dolor. Quisque sed urna. Nam libero. Praesent vel orci non nulla adipiscing aliquam. Sed enim dolor, hendrerit quis, rutrum sed, tincidunt a, mi. Donec fermentum metus vel ligula tempor condimentum. Aliquam erat volutpat. Cras fringilla faucibus erat. Aenean congue.</p>
  <p>Curabitur arcu tellus, suscipit in, aliquam eget, ultricies id, sapien. Nam est. Donec neque risus, tempor vitae, blandit in, porttitor a, sapien. Fusce sollicitudin quam ac neque. Proin ac nulla id nisi dapibus commodo. Cras nulla purus, malesuada eu, pretium id, imperdiet vitae, odio. Phasellus congue ultrices lorem. Quisque sodales. Aliquam erat volutpat. Donec at mauris ut nisl aliquet convallis. Vivamus quam urna, suscipit at, porttitor sed, cursus quis, lorem.</p>
</div>
<!-- content -->
<div id="FOOTER">
  <ul>
    <li><a href="http://www.free-css.com/" class="First">Home</a> |</li>
    <li><a href="http://www.free-css.com/">Projects</a> |</li>
    <li><a href="http://www.free-css.com/">About Us</a> |</li>
    <li><a href="http://www.free-css.com/">Contacts</a> |</li>
    <li><a href="http://www.free-css.com/">Sitemap</a></li>
  </ul>
  <p>&copy; 2005, Company Name. All rights reserved.</p>
  <p>Designed by <a href="http://www.gettemplate.com/">GetTemplate</a></p>
</div>
<!-- footer -->
</body>
</html>

   
    
  








Related examples in the same category

1.morningdew
2.Morningswim
3.morning_swim
4.moonlight
5.nebula
6.nightclub
7.nightlights
8.nightly
9.nightscene
10.nightvision