Sunset Simplicity;

Designer's Comments

Look carefully for specific instructions

I wanted to go for a simple kind of feel to this layout, so I doodled a sunset with pen, crayon, and colored pencil and added some dotted boxes. :)

You can do anything you want with this layout. I've left two forms of credit, so it shouldn't be too big of a deal. If you don't prefer either, at least link my site somewhere on your page. Replace all "http://yourlinkhere.com"'s with your links. Go ahead and remove the lyrics. Just figured it would be a nice filler. :)

I truly hope you enjoy the layout. It was fun to make. :)

TESTED IN IE AND FIREFOX! Feedback appreciated. :)

Layout Code

Copy and paste to Template HTML

Help

.innerbox {
overflow: auto;
border: 0px solid #333;
position: absolute;
}

#innerbox1 {
top: 439px;
left: 49px;
width: 175px;
height: 327px;
}

#innerbox2 {
top: 439px;
left: 266px;
width: 408px;
height: 545px;
background: none;
text-align: justify;
color: #000000;
font-family: century gothic;
font-size: 10pt;
padding: 2px;
}

#innerbox3 {
top: 851px;
left: 116px;
width: 130px;
height: 125px;
}

a img {
text-decoration: none;
border: 0 none;
}

a:link { 
text-decoration: none; 
color: #9E7BFF; 
letter-spacing: 2px; 
font-face: century gothic; 
font-size:6.5pt;
text-transform: lowercase;
background-color: none;}

a:visited { 
text-decoration:none; 
color: #38ACEC; 
letter-spacing: 2px; 
font-face: century gothic; 
font-size:6.5pt;
text-transform: lowercase;
background-color: none}

a.nav:link, a.nav:visited, a.nav:active  {
display:block; 
text-align: right;
background-color: #38ACEC; 
width:160px;
font-size: 7pt;
color: #FFFFFF;
letter-spacing: 0px;
font-family: small fonts;
text-transform: uppercase;
font-weight:normal;
text-decoration:none;
border-right: 8px solid #FFFF00;
cursor: normal;
height: 15px; 
padding-right: 3px; 
margin-top:0px;
margin-bottom:0px;
margin-left:1px;
margin-right:1px;}

a.nav:hover {
display:block; 
text-align: right; 
background-color: #FFFF00; 
width:160px;
font-size: 7pt;
color: #000000;
letter-spacing: 4px;
font-family: small fonts;
text-transform: uppercase;
border-right: 8px solid #38ACEC;
font-weight:normal;
cursor: normal;
height: 15px; 
padding-right: 3px; 
margin-top:0px;
margin-bottom:0px;
margin-left:1px;
margin-right:1px;}

a:hover { 
text-decoration:none; 
color: #F778A1; 
letter-spacing: 2px; 
font-face: century gothic; 
font-size:6.5pt;
text-transform: lowercase;
background-color: none}

td, p, body, a {
color: #000000;
font-family: century gothic;
font-size: 7pt;
letter-spacing: 0px;
align: justify;
scrollbar-face-color:38ACEC;
scrollbar-highlight-color:FFFF00;
scrollbar-3dlight-color:FFFF00;
scrollbar-darkshadow-color:FFFF00;
scrollbar-shadow-color:FFFF00;
scrollbar-arrow-color:FFFF00;
scrollbar-track-color:FFFF00;
cursor:crosshair
}

b {color: #38ACEC;
font-size: 15px;
font-family: times new roman;
font-variant: none;
letter-spacing: 0px;
text-decoration: none;
text-transform: none;}

s {color: #38ACEC;}
i {color: #777B88;}

u {color: #38ACEC;
border-bottom: #FFFF00 solid 2px ;}

tt {font-size: 6pt;
font-family: century gothic;
font-weight: normal;
font-variant: none;
letter-spacing: 0px;
text-decoration: none;
text-transform: uppercase;
text-align: right;
padding: 0px;
background-color: #none;
color: #8bb329;}

textarea {
background: #000000;
color: #000000;
border: 1px solid #38ACEC;
font-family: century gothic;
font-size: 7pt;
width:250px; 
height:25px;
overflow-x: hidden;}

h1 {
font-size: 12pt;
font-family: century gothic;
line-height: 12pt;
padding-left: 2px;
font-weight: normal;
font-variant: none;
letter-spacing: 0px;
text-decoration: none;
text-align: left;
text-transform: uppercase;
background-color: #FFFF00;
color: #38ACEC;}

h2 {
font-size: 12pt;
line-height: 12pt;
font-family: century gothic;
font-weight: normal;
font-variant: none;
padding-right: 2px;
letter-spacing: 0px;
text-decoration: none;
text-align: right;
text-transform: uppercase;
background-color: #FFFF00;
color: #38ACEC;}
</style>

<div class="overlay">
<div class="innerbox" id="innerbox1"><h2>About Me</h2><B>Name</b>: Name Here<BR><B>Age</b>: Age Here<br><B>Location</b>: Where You Live<br><B>Loves</b>: You<BR><B>Hates</b>: Mean People<BR><H1>Navigation</h1><center><a href="http://yourlinkhere.com" class="nav">Link 1</a><a href="http://yourlinkhere.com" class="nav">Link 2</a><a href="http://yourlinkhere.com" class="nav">Link 3</a><a href="http://yourlinkhere.com" class="nav">Link 4</a><a href="http://yourlinkhere.com" class="nav">Link 5</a><a href="http://yourlinkhere.com" class="nav">Link 6</a><a href="http://www.synysterangel.createblog.com" class="nav">Layout Credit</a><a href="http://www.createblog.com" class="nav">CreateBlog</a><I>Content (C) Your Site 2009<BR>Layout (C) Inconclusion Layouts</i></centeR></div>

<div class="innerbox" id="innerbox2"><h1>Title 1</h1><h2>Title 2</h2>
So, if you want to love me, then darling don't refrain or I'll just end up walking in the cold November rain. <b>Do you need some time on your own</b>? <i>Do you need some time all alone</i>? <u>Everybody needs some time on their own</u>. <s>Don't you know you need some time all alone</s>? <a href="www.yourmom.com">I know it's hard to keep an open heart when even friends seem out to harm you</a>. <a href="http://myspace.com">But, if you could heal a broken heart, wouldn't time be out to charm you</a>?<BR><BR>

<B>Guns 'n' Roses</b> - <U>November Rain</u></div>