Dark Geometrics

Website Templates / 1 Column

Designer's Comments

Look carefully for specific instructions

Simple, yet cool looking, I think. Hope you like it!

Any questions? Leave a comment.
Enjoy!

Layout Code

Copy and paste to Template HTML

Help

<title>Replace This With The Name of Your Site</title>

.title
 {font-family:impact;
 font-size:55px; color:#ffffff; text-align:center;}

.subtitle
 {font-family:impact;
 font-size:10px; color:#cccccc; text-align:center;}

.text
 {font-family:century gothic;
 font-size:10px; line-height:11px; color:#333333;}

.header
 {font-family:century gothic;
 font-size:14px; color:#666666;
 border-bottom:2px solid; border-color:#999999;
 padding-left:5px; padding-right:5px;}

a:link, a:visited, a:active
 {font-family:century gothic; color:#999999;
 text-decoration:none;}
  a:hover
 {font-family:century gothic; color:#000000;
 text-decoration:none; letter-spacing:1px;}

.creditlink, .creditlink:active, .creditlink:visited
 {font-family:small fonts !important;
 text-transform:uppercase;
 font-size:8px; color:#666666 !important;
 border:none; text-decoration:none;}
  .creditlink:hover
    {font-family:small fonts;
    text-transform:uppercase;
    font-size:8px; color:#ffffff !important;
    border:none; text-decoration:none;}

.navilink, .navilink:active, .navilink:visited
 {font-family:impact !important;
 text-transform:uppercase;
 font-size:11px; line-height:20px;
 color:#000000 !important;
 border:none; text-decoration:none;}
  .navilink:hover
    {font-family:impact; text-transform:uppercase;
    font-size:11px; line-height:20px;
    color:#666666 !important;
    border:none; text-decoration:none;
    letter-spacing:-1px;}

#basebg
{position:absolute; width:600px; height:600px;
z-index:1; left:50%; margin-left:-375px; top:0px; overflow:hidden;}

#title
{position:absolute; width:600px; height:200px;
z-index:2; left: 50%; margin-left:-300px; top: 166px; text-align:center;}

#subtitle
{position:absolute; width:300; height:40px;
z-index:2; left: 50%; margin-left:-150px; top: 223px; overflow:hidden; text-align:center;}

#content
{position:absolute; width:334px; height:290px;
z-index:2; left: 50%; margin-left:-175px; top: 255px; overflow-y:auto;}

#navigation
{position:absolute; border:none; width:131px; height:200px;
z-index:2; left: 50%; margin-left:-255px; top: 441px;}

#creditlink
{position:absolute; border:none; width:130px; height:20px;
z-index:2; left: 6px; top: 0px;}
</style>
</head>

<body>

<div id="title">
<span class="title">
Title?
</span>
</div>

<div id="subtitle">
<div align="center">
<span class="subtitle">
Subtitle? Subtitle? Subtitle? Subtitle?
</span>
</div>
</div>

<span class="header">
This Is a Header
</span><br><br>

<span class="text">
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br> 
<br><br>

<span class="header">
This Is a Header
</span><br><br>

This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content.

</span>
</div>

<div id="creditlink">
<a href="http://www.myspace.com/crotchettheleper" class="creditlink">Crotchet The Leper</a>
</div>

</body>
</html>