The Opened Way-Shadow of the Colossus

Designer's Comments

Look carefully for specific instructions

Shadow of the Colossus

Everything you need to edit is in your About Me section.
1. Replace XXXXXXXX with your ID#.
2. Use [h2 with class title] to create the header text as seen here as "Shadow of the Colossus".
3. Use [div] to create content area.
4. The Navigation area can be extended.
5. PLEASE do NOT remove credits or any links associated with it.
6. The Banner is meant to be humongous to fit the theme of the world in Shadow of the Colossus. Also, the preview will make the banner appear to be CUT OFF at the top. However, upon placing this on your myspace, it will be fixed since the preview does not represent the layout accurately.

Everything in the "I'd Like To Meet" section are CSS codes. Do Not Mess With Them.

Enjoy! Creator's Myspace: myspace.com/ancientwhisper

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

<div style="margin-left: 265px; margin-top: 0px; width: 230px; padding: 10px; position: absolute;">
<a href="http://www.myspace.com/" class="elinks">Dormin</a> <br />
<a href="http://www.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=XXXXXXXX" class="elinks">Add</a> <br />
<a href="http://www.myspace.com/index.cfm?fuseaction=user.viewProfile_commentForm&friendID=XXXXXXXX" class="elinks">Speak</a> <br />
<a href="http://www.myspace.com/index.cfm?fuseaction=mail.message&friendID=XXXXXXXX" class="elinks">Messenger</a> <br />
<a href="http://friends.myspace.com/index.cfm?fuseaction=block.blockuser&userID=XXXXXXXX" class="elinks">Guard</a> <br />
<a href="http://www.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=XXXXXXXX" class="elinks">Pictures</a> <br />
<a href="http://friends.myspace.com/index.cfm?fuseaction=user.viewfriends&friendID=XXXXXXXX" class="elinks"> Worshippers</a> <br />
<a href="http://www.myspace.com/index.cfm?fuseaction=blog.ListAllCustom&friendId=XXXXXXXX&swapped=true" class="elinks">Secret Garden</a> <br />
<a href="http://www.createblog.com" class="elinks">Createblog</a> <br />
<a href="http://www.myspace.com/AncientWhisper" class="elinks">Ancientwhisper</a>
<br />

<h2 class="title">Shadow of the Colossus</h2>

<div>
Shadow of the Colossus is a tale of a young man who sets out on a journey to revive the life of the heroine, Mono. Its setting is located in the distant lands of a fictional land with its own set of religion and language. The young man, whose title is known as <i>Wander</i> was told to uncover a temple in a forbidden land. In it, he will encounter an entity known as Dormin who promises the gift of life for those who had passed away. Wander accepts his deed to overcome sixteen colossus roaming within the borders of the land in order to revive Mono. In return, Dormin asks for a heavy price at the end of Wander's journey.</div> <br />

<div>
...And so Wander continued onwards into the forbidden lands with sword in one hand and bow and arrows on the other. He travels with his horse, Agro, who is the only other living being not native to the forbidden land. Yet, he was determined to endure the hardships of nature to see his one last wish realized. 
</div> <br /> <br />

<h2 class="title">Gaius (Terrestris Veritas)</h2>

<div>
Shadow the Colossus is definitely one of the few games I deeply respect. Its gameplay and the story presented is amazingly artistic and moving. Throughout the game, there are only sixteen different types of enemies--- and there are only sixteen enemies. So you can guess that the whole game is a massive boss fight one after another. But unlike any stereotypical game, these boss fights are not simple. They are puzzles within themselves as the bosses Wander faces are at least four times as big as him with the average being over a hundred times bigger. With only the default ability to grip, climb, leap, stab, and the use the bow and arrows, Wander must defeat these enormous colossus in order for Mono to come back to life.</div> <br /> <br />

<h2 class="title">Liberated Guardian</h2>
<div>
This layout features the most popular colossi of the bunch, Gaius (Colossi #3). Although he is not personally my favorite Colossi, everyone loves him. He is extremely tall, humungous, and you must fight him thousands of feet above ground. You practically face him in a large platforms in the skies. Yet, he still towers over you with his broad and mighty sword. This specific screenshot is epic on its original resolution. It depicts Wander running across the surface of the Gaius's sword-arm in preparation to launch himself onto Gaius to take him down. "The Opened Way", which is the title of this layout, is also a fan favorite orchestrated piece composed for the game. Because Wander had discovered Gaius's weakness, he had always found an <i>opened way</i>, hence the fitting title. </div> <br />
<div>
The banner was mostly cloned to complete the figure of the colossi, and the skies. As for the fixed normal background, it is the symbol on Wander's cloth and I believe the weakspots of the colossus in the game (correct me if I'm wrong). For this particular layout, I've planned for the banner to be humongous! And in order to demonstrate how striking and isolated the world in Shadow of the Colossus is, I decided to make the banner infinitely expanded. In the case of the  fixed background, the bird and the symbol belongs to the art of Shadow of the Colossus. As for the navigation, a variety of them are references to the game. Two of them are based on the music pulled from the soundtrack, <b>"Liberated Guardian"</b> and <b>"Messenger from Behind</b>. The title of the contents contain references as well. The first section reads "Shadow of the Colossus", while the next one is the name of the third colossi --- the same one used on the layout. The last two titles <b>"Liberated Guardian"</b> and <b>"The Farthest Land"</b> are based from the soundtrack as well. </div> <br /> <br />

<h2 class="title">The Farthest Land</h2>

<blockquote> Will you look at a challenge, and see past its size? See its weakness? Exploit it? Will you summon courage, great enough to conquer a living, breathing mountain? Will you find yourself the victor over the colossus? Will you ride across the vast and perilous land, confronting death and your own limitations? Will you ignore your fear? Uncertainty? Your size? Will you arm yourself with almost nothing... yet fight as though your armory included everything? <br /> <br /><br />

<div>
<a href="http://www.myspace.com/ancientwhisper">Link</a>, <b> Bold</b>, <i> Italic</i>, <u>Underline</u>, <s>Strike-out</s>
<br /> <br />

</div>
</div>
</div>
</div>

Layout Code

Copy and paste to I'd Like to Meet

Help

.redlink, .orangetext15, .btext {
COLOR: 393939;
FONT-SIZE: 1;
}

table div div p a{visibility:hidden;}

div div table td td font {visibility: hidden;}

b, strong, .btext {
  font: 9pt Trebuchet MS; 
  color: 565656; 
  text-align: justify;
  font-weight: bold;
  }
i, em, .itext  {
  font: 9pt Trebuchet MS; 
  color: 5C6A6B;
  text-align: justify;
  }

u{
  font: 9pt Trebuchet MS; 
  color: 8F8F8F;
  text-align: justify;
  }

s, .stext, .sbtext, .swtext {
  font: 9pt Trebuchet MS; 
  color: 272727;
  text-align: justify;
  }
a, a:link {  
  font: 9pt Times new Roman, Arial; 
COLOR:8F8F8F; 
TEXT-DECORATION: none
Letter-spacing: 0px;
font-weight: bold;
text-transform: uppercase;

}

a:active {
font: 11pt Times new Roman, Arial; 
COLOR:8F8F8F; 
TEXT-DECORATION: none
Letter-spacing: 0px;
font-weight: bold;
text-transform: uppercase;
}

a:visited{
font: 11pt Times new Roman, Arial; 
COLOR:8F8F8F; 
TEXT-DECORATION: none;
Letter-spacing: 0px;
text-transform: uppercase;
}

a:hover {
font: 11pt Times new Roman, Arial; 
COLOR: FCFCFC; 
Letter-spacing: 0px;
text-transform: uppercase;
}

a:hover.pic img {filter:alpha(opacity=80);}
a:link img { filter: Gray; }
a:hover img {filter: none; }

img {filter: progid:DXImageTransform.Microsoft.BasicImage(color=1); border: 1;}

li, h1, .redtext, font, .navbar, .lightbluetext8, .blacktext12, .label, .whitetext12, .orangetext12, .nametext{font: 0px arial; letter-spacing: 0px; text-align: justify; display: none; }

.blacktext10 {FONT: 11px arial; color:393939; letter-spacing: 0px; text-align: justify; display:block;}

.header {
font-weight: normal; font-size: 9; padding-bottom: 2pt; padding-top: 0pt; COLOR: 393939; border-bottom:000000 0px solid; font-family: arial; text-decoration: none;  text-align: center; letter-spacing: 0.0em;
z-index: 3;
}

.nametext {display: none !important;}

.blurbs td td .orangetext15, td.text td.text table table table, td.text td.text table br, td.text td.text table .orangetext15, td.text td.text .redlink, td.text td.text span.btext, text {display:none !important; color: transparent;}

.footwarpper {display: none;}

.profileInfo { display:none; }

td div a.text{left: 50%; margin-left: -460px; visibility:visible; font-size:5px;  a.hover-size:5px; font-spacing:-2px;}

table, tr, td {background-color: transparent;}
.contactTable {display:none;}
table.userProfileURL{display:none;}
.extendedNetwork {display:none;}
.userProfileDetail {display:none;}
.latestBlogEntry {display: none;}
.friendsComments {display:none;}
.footwrapper (display: none; visibility: none; }
.interestsAndDetails { display: none; }

table.navigationBar {color: 000000;}

</style>

blockquote {
overflow:visible;
padding: 5px 5px 5px 5px;
text-align:center;
background-color:1C1C1C;
border: 5px double; 
border-color:000000;
FONT: 10pt Times New Roman; 
color: 5C6A6B;
line-height: 20px;
letter-spacing: 1px;
text-transform: uppercase;
}

a.elinks{font: 12pt Times new Roman, Arial;  height: 35px; width: 200px; overflow: hidden; display: table-cell; color: 818181; letter-spacing: 1px; text-align: center; background: 
url(http://i46.tinypic.com/2899ai1.jpg) no-repeat; text-align: right; padding: 5px; text-decoration: none;}

a.elinks:visited{ font: 12pt Times new Roman, Arial; color: 8F8F8F; letter-spacing: 1px; text-decoration: none;}

a.elinks:hover{ font: 13pt Times new Roman, Arial; color: FCFCFC; background-position: bottom left; text-transform: uppercase; letter-spacing: 2px; border-left: 10px inset; border-left-color:  555555;text-decoration: none;}

h2.title
{
font-family: Trebuchet MS;
font-size: 25pt;
color: A1AD95;
position: relative;
width: 100%;
text-align: left;
font-weight: normal;
}

div.add
{
font-family: courier new;
color: BBBBBB;
position: relative;
font-weight: bold;
text-transform: lowercase;
line-height: 18px;
width: 100%;
letter-spacing: 2px;
text-align: center;
display:table-cell;
}

div.content
{
 font-family: Tahoma; 
font-size: 8pt; 
color:0B172D; 
display:block; 
overflow:auto; 
text-align:justify; 
}
table, tr, td, th, div{
border: 0px;
FONT: 9pt Trebuchet MS; 
COLOR: 393939; 
LETTER-SPACING: 0px; 
TEXT-ALIGN: justify;
}

p {
visibility:hidden;
}

table,td,tr,{padding:0px; width:; background-color:transparent; color: transparent;}

</style>

Layout Comments

Showing latest 10 of 19 comments

Ah wow, I really enjoy the scrolling of your layout its really fun seeing the art in it take place. Also the font you choose to use for the headers are the perfect size, and hey as a "layout code" it actually works. The top banner also is pretty amazing even though it leaves a really bold statement but I guess since the title is "The Opened Way-Shadow of the Colossus" I guess it plays and important role, but other then that its really good, keep it up ohh and this would be an amazing 2.0 layout

By Breon on Dec 16, 2009 1:34 pm