1 ties and rails

<head>
<title>Ties and Rails</title>
<link rel="shortcut icon" href="ICON LINK">
</head>

<style type="text/css">
body {
margin: 0px
padding: 0;
background: #000;}

#content {
width: 800px;}

#main {
font:  12px/15px arial ;
color: #000000;
background-color: #fff;
width: 790px;
height: 400px;
overflow: scroll;
position: absolute;
padding:5px;
margin-left: 111px;}

h1 {
font:  italic normal 11px/15px trebuchet ms;
color: #000000;
text-decoration: none;
text-transform: uppercase;
text-align: center;
border-bottom: 5px solid #eaeaea;
border-top:1px solid#eaeaea;
margin: 7px ;
letter-spacing: 3px;
background-color: #efefef;}

h2 {
font-family:palatino linotype;
font-size: 9.5px;
color: #85583C;
border-left: 15px solid #85583C;
border-right: 5px solid #85583C;
text-transform: uppercase;
padding: 1px;
margin-bottom: 5px;
text-align: right;
background: #;
letter-spacing: 2px;}

#header {
background: url(http://onyxhotel.three-words.net/images/designs/Untitled-1.png) no-repeat;
padding:0;
margin-top: 0px;
margin-left: 111px;
height : 200px;
width : 800px;}

#background {
background:#fff;
margin-top:-300px;
margin-left:-300px;
position:fixed;
z-index: -1;
height : 300px;
width : 10000px;}

#main a, a:link, a:visited {
font: 12px arial;
color: #000;
text-decoration: none;
text-transform: lowercase;
background: none;
letter-spacing: 0px;}

#main a:hover {
font:10px trebuchet ms;
color: #C0B458;
text-decoration: none;
text-transform: lowercase;
letter-spacing: 0px;}

b {
color: #B85744;
letter-spacing: 0px;
font-weight: bold;
font-family: georgia;}

i
{font-style: italic;
font-family: georgia;
color: #AFDBD2;
letter-spacing: 2px;}

u {
color:#B88954;
letter-spacing: 1px;}

s {
color: #573F2E;
text-decoration: line-through;}

blockquote{
font: italic 10px/15px arial ;
padding: 5px;
width:500px;
color: fff;
background-color: #5d5d5d;
letter-spacing:2px;
font-weight:normal;}

a img, a:active img, menulink a:visited img { opacity: 0.8; -moz-opacity: 0.8; filter: alpha(opacity=80); }
a:hover img { opacity: 1.0; -moz-opacity: 1.0; filter: alpha(opacity=100); }

.change_position {
text-decoration: none;
padding: 5px 0px  2px  5px ;
font-family: 'Helvetica';
font-size: 15px;
font-weight: italic;
text-align:center;
text-transform: uppercase;
margin-left:-112px;
margin-bottom: 5px;
letter-spacing: 1px;
width:200px;
height:20px;
background: #fff;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition:all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;}

.change_position:hover {
margin-left: -25px;
color:#fff;
background: #000;
 -webkit-transform: translate(20px,0px);
 -moz-transform: translate(20px,0px);
 -o-transform: translate(20px,0px);
 -ms-transform: translate(20px,0px);
}


</style>
</head>
<body>


<div id="header">
<a  href="http://onyxhotel.three-words.net/" ><div class="change_position">link</div> </a>
<a  href="http://onyxhotel.three-words.net/" ><div class="change_position">link</div> </a>
<a  href="http://onyxhotel.three-words.net/" ><div class="change_position">link</div> </a>
<a  href="http://onyxhotel.three-words.net/" ><div class="change_position">link</div> </a>
<a  href="http://onyxhotel.three-words.net/" ><div class="change_position">link</div> </a>
<a  href="http://onyxhotel.three-words.net/" ><div class="change_position">Credit</div> </a>
 </div>
<div id="background"></div>


<div id="content">
<div id="main">
<h1>ties and rails, ties and rails.</h1>
This is your text! This layout that <i>floats</I> and <b>scrolls</b>. The height is 400px, but it can be changed.
<h2> Header 2</h2>
<b>bold </b><i>italic </i><u>underline</u> <s>strikethrough</s> <a href="http:///url">link</a><br>
You can edit and tweak the code, or change the header. You may also change the size of header and change the size of everything else.

<blockquote>
This is what the blockquote looks like
<li>Please keep credit on.</li>
<li>Do no steal code/header</li>
</blockquote>

</div>
</body>
</html>