Through the Monsoon

Designer's Comments

Look carefully for specific instructions

THIS LAYOUT WILL NOT COVER THE AD ON YOUR MYSPACE. IT ONLY DOES THIS IN THE PREVIEW.

REPLACE XXXXXX WITH YOUR FRIEND ID BEFORE YOU DO ANYTHING. AND DON'T FORGET TO REPLACE THE XXXXX IN THE COMMENT BOX OR IT WILL NOT WORK.

*** And I would not suggest using this layout unless you have experience with HTML. ***

Also available for xanga

Any questions, yell at me via pm or my xanga. Thanks for using this layout! ^.^

Using This Layout

For specific instructions read designer's comments

This is a div overlay layout, html knowledge required!
1. Log into myspace.com
2. Click on Edit Profile (Profile 1.0)
3. Copy (ctrl c) and paste (ctrl v) code to the specified fields

Update Friend ID

Input Friend ID to automagically update code

Layout Code

Copy and paste to About Me

Help

h1 {
font-family:arial narrow;
text-transform:none;
font-size:24px;
color:cfb147;
background-color:transparent;
text-align: right;
font-weight:normal;
padding-top:2px;
border:0px;
}

h2 {
font-family:georgia;
text-transform:none;
font-size:11px;
line-height:11px;
color:e6a58e;
background-color:transparent;
text-align: right;
font-weight:bold;
padding:0px;
border:0px;
}

.content {
font:normal 11px trebuchet ms;
line-height: 12px;
color: 6a6653;
text-align:left;
width:465px; 
height:auto;
overflow-x:hidden;
position : absolute; 
z-index:2; 
left: 0%; 
top: 0%;
margin-left: 295px;
margin-top: 705px;
}

.content a:link, .content a:active, .content a:visited {
color:6c8e35;
font:normal 11px trebuchet ms;
text-transform: none;
text-decoration:none;
}

.content a:hover {
color:9f9a51;
background-color:fafdf1;
border-bottom: 2px solid e6a58e;
text-decoration:none;
}

.sidebar {
position: absolute;
width: 260px;
height: auto;
left: 0%; 
top: 0%;
padding-bottom: 5px;
padding-right: 5px;
padding-left: 11px;
margin-left: 12px;
margin-top: 717px;
z-index: 3;
overflow-x: hidden;
background: eee3b1;
font-family:trebuchet ms;
color: 8c5d32;
font-size:11px;
line-height:13px;
text-align: left;
padding: 2px;
}

.menu a, .menu a:link, .menu a:active, .menu a:visited {
display: block;
height:20px;
width:130px;
padding: 2px 2px 2px 2px;
background-color: d1d197;
color: ffffff;
font: normal 11px trebuchet ms;
text-transform:none;
text-decoration: none;
text-align:center;
border-bottom:1px solid fff;
margin:1px;
}

.menu a:hover {
background-color: 99b56e;
color: e0e0ac;
text-transform:none;
text-align:center;
border-bottom:1px solid fff;
margin:1px;
}

b, strong {
color: 6fb9d4;
}

i, em {
color: ff8fb9;
font-family:georgia;
font-size:11px;
font-weight:normal;
text-transform:none;}
}

s, strike {
color: 8b7d5e;
}

a:link, a:active, a:visited {
font-family: trebuchet ms;
color: 0989D7;
font-weight:normal;
font-size:11px;
text-decoration: none;
text-transform:lowercase;
}
a:hover {
text-decoration: none;
color: F79FAE;
font-weight:normal;
background-color:ffffff;
border-bottom:2px solid F79FAE;
text-transform:lowercase;
}

.navi {
font-weight: bold;
width:258px;
font-family:courier new;
text-transform:none;
font-size:18px;
line-height:15px;
color:000000;
background-color:acd1c0;
text-align: right;
padding:4px;
letter-spacing:-2px;
border-bottom:7px solid e6a58e;
}

blockquote {
color: 6a5c38;
background: e0e1b9;
font:trebuchet ms;
font-size: 11px;
padding: 6px;
}

blockquote b, blockquote strong {
color:979c67;
}
.box textarea {
background-color:f7f7e1;
font:10px normal tahoma;
border:none;
padding:3px;
color:6a6653;
scrollbar-arrow-color:d1d197; 
scrollbar-track-color:f7f7e1; 
scrollbar-shadow-color:FFFEEF; 
scrollbar-face-color:f7f7e1; 
scrollbar-highlight-color:FFFEEF; 
scrollbar-darkshadow-color:496840; 
scrollbar-3dlight-color:E6E5C2;
}

.box input {
background-color:e6a58e;
margin-top:2px;
font-family:courier new, georgia, arial;
font-size:11px;
font-weight:bold;
line-height:12px;
padding:1px;
letter-spacing:2px;
text-transform:lowercase;
border: none;
color:000000;
width:245px;
text-align:center;
}

.contacttable,.whitetext12,.nametext,.lightbluetext8,.orangetext15,.blacktext12,.btext,.redtext,.redbtext{display:none;height:0px;!important;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
a.text,table div font a,table div div,.navbar font,tr td font{visibility:hidden;display:none;height:0px;!important;}
table table table table,table table table table td.text, td.text td.text table{display:none;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}
table.footer {display: none;}

div table a.navbar img {display:none;}
div table {visibility:hidden;}
div table div, div table table, div table.navigationBar, table div table, div table form {visibility:invisible}
div table {border-bottom:0px !important;  }
div table.navigationBar {margin-bottom:-30px;}

div table div div select {position:absolute !important;  top:-200px !important; left:0px !important; }
</style>

Layout Code

Copy and paste to I'd Like to Meet

Help

<div class="content">
<h1>about the layout</h1>
<h2>who is that?</h2>
This myspace layout features German pop/rock band Tokio Hotel. As this is an old layout of mine, it's nothing too special (haha ^^;) but some people asked me to convert the xanga version of this to myspace so yeah, here ya go! Hope you like :D.
<br><br>
Here, I experimented a lot with color and fonts. I actually layered fonts on top of one another to create that effect for the first letters in "Tokio" and "Hotel." One of the fonts is called Hawaii Killer (or it might be Chic Decay, I don't remember); you can get both fonts at <a href="http://www.dafont.com" target="_blank">dafont.com.</a>
<br><br>
As for color, I wanted a variety. I was a little irritated when I looked for Tokio Hotel layouts on createblog and all of them were mainly black and white. WHY. Tokio Hotel is too sexy for black and white :D.
<br><br>
Unfortunately, this layout might be misaligned in Firefox. I've only tested this layout in I.E. so...I'm sorry to all the firefox users out there. But for those who know how to handle div overlays, perhaps you can fix the misalignment issues on your own.

<h1>how to use</h1>
<h2>don't know what to do?</h2>
Simply copy and paste the codes into About me/I'd like to meet. I would not suggest using this layout unless you have basic understanding of html. ALSO. Keep all credits or I will [insert creative threat here]. Seriously, though. I will eat you like a cheap plastic happy meal toy if you mess with the credits. I have incisors and I'm not afraid to use them!

<h1>contact</h1>
<h2>yell at me!</h2>
The best way to get into contact with me is either through my <a href="http://www.xanga.com/momokuma" target="_blank">xanga</a> or createblog. I will try to respond asap, and I say 'try' because I do have a life other than layout design & illustration & whatever else tickles my fancy.

<h1>header</h1>
<h2>css elements</h2>
Normal. <b>Bold.</b> <i>Italics.</i> <s>Strike-through.</s>
<blockquote>
<b>December 21</b> - Uploaded new layout<br>
<b>December 19</b> - Last day of classes<br>
<b>December 18</b> - Took ARHS Final Exam
</blockquote>
</div>

<div class="sidebar">
<span class="navi">navigate</span>
<br>
<p class="menu">
<center><table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" width="100%" id="AutoNumber1">
<tr>
<td width="33%" valign="top">
<p class="menu">
<a href="http://home.myspace.com/index.cfm?fuseaction=user">home</a>
<a href="http://collect.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=XXXXXXXX">add me</a>
<a href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewPicture&friendID=XXXXXXXX">pics</a>
<a href="http://home.myspace.com/index.cfm?fuseaction=user.viewfriends&friendID=XXXXXXXX">friends</a>
</td>
<td width="34%" valign="top">
<p class="menu">
<a href="http://mail.myspace.com/index.cfm?fuseaction=mail.message&friendID=XXXXXXXX">message</a>
<a href="http://collect.myspace.com/index.cfm?fuseaction=block.blockUser&userID=XXXXXXXX">block me</a>
<a href="http://www.myspace.com/index.cfm?fuseaction=user.viewComments&friendID=XXXXXXXX">view all</a>
<a href="http://miyashu.createblog.com/layouts/" target="_blank">miyashu</a>
</tr></td></table>
</center>
</p>
<span class="navi">header</span><br><br>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec tempor rhoncus ipsum. In hac habitasse platea dictumst. Duis porta lacinia sapien. Suspendisse bibendum. In pretium sapien ac ante. Nunc iaculis velit ac ligula. Donec posuere aliquam lectus. Mauris urna dolor, ultricies a, bibendum quis, nonummy nec, risus. Nullam diam mauris, viverra id, gravida sit amet, sollicitudin ac, neque. Aliquam erat.
<br><br>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec tempor rhoncus ipsum. In hac habitasse platea dictumst. Duis porta lacinia sapien. Suspendisse bibendum. In pretium sapien ac ante.<br>
<span class="box">
<center>
<form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment"><input name="friendID" value="XXXXXXXX" type="hidden"> <textarea name="f_comments" cols="45" rows="8">I'll be with you soon, just me and you...</textarea>
<input type="submit" value="comment"></form></center></span>
<br>
<span class="navi">links</span><br><br>
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" width="100%">
<tr>
<td width="33%" valign="top">
» <a href="URL">link</a>
<br>» <a href="URL">link</a>
<br> » <a href="URL">link</a>
<br> » <a href="URL">link</a>
</td>
<td width="34%" valign="top">
» <a href="URL">link</a>
<br> » <a href="URL">link</a>
<br>» <a href="URL">link</a>
<br> » <a href="URL">link</a> 
</td>
<td width="33%" valign="top">
 » <a href="URL">link</a>
<br> » <a href="URL">link</a>
<br> » <a href="URL">link</a>
<br> » <a href="URL">link</a>
</td></tr>
</table>
<span class="navi">credits</span><br><br>
Brushes from <a href="http://papercuts.meoworks.com/" target="_blank">Papercuts</a> and <a href="http://ewanism.livejournal.com/" target="_blank">Ewanism</a>. Permanent credits go to <a href="http://miyashu.createblog.com/layouts/" target="_blank">Momo</a> and <a href="http://www.createblog.com" target="_blank">Createblog.com</a>.
</div>

Layout Comments

Showing latest 10 of 32 comments

the tables won't show in IE, Opera, or Firefox. ;o;

By laylaz on Aug 21, 2009 11:54 am

Ah, its not mispelled. Its the font that makes it look that way. Dont worry, Miyashu-
Gorgeous as ever!

By Absinthetic on Oct 24, 2008 11:57 pm

I absolutely love this layout.
And not to be a fart or anything, but Hotel was misspelled. It says Hptel. >w>;

By miszraytoro on Oct 21, 2008 10:58 pm

Ugh I mixed this layout up with another one. =[[ Sorry.

By TheExoticPeachFairy on Aug 18, 2008 5:28 pm

I love Tokio Hotel. But one thing too though. Even though most of your layouts are tested in IE they work well in Opera. =).

By TheExoticPeachFairy on Aug 18, 2008 5:27 pm

That's cute!!! I love this band.

By thatgurl16 on Aug 4, 2008 3:54 pm

i'm using it but making minor tweeks...
well just changing the order of the headlines really...
personalizing it...

well i've rambled enough...

love the layout!!!

By kayk47 on Jun 17, 2008 11:07 am

i'm totally using this
thanks for making it! :]

By thrainboez on May 18, 2008 9:13 pm

-gasp-
I love TH.
The layout is very awesome hun,
kudos

By SaturdayRiot on Apr 26, 2008 7:51 pm

ok,i like freakin love this layout!
butttt,
i can't get it to work!
DD:
can someone help me out here?!

By TomKaulitzloverr on Apr 21, 2008 6:04 pm

View all »

Layout Details

Designer	miyashu
Submitted on	Dec 31, 2007
Page views	24,154
Favorites	119
Comments	32
Reviewer	S-Majere
Approved on	Dec 31, 2007

Through the Monsoon

Designer's Comments

Using This Layout

Update Friend ID

Layout Code

Layout Code

Layout Comments

Layout Details

Layout Tags

Layout Tools

Layout Affiliates