The Executioner - Pyramid Head

Designer's Comments

Look carefully for specific instructions

Silent Hill 2 - Pyramid Head

NOTE: Layout is good for use in Halloween! Use this layout to creep your friends out with the animated background which kicks in within 10 seconds of opening the page. THIS LAYOUT IS HEAVILY ANIMATED! People with slower internet connections may find this layout to be virtually unusable. The About Me will take a bit to show up depending on your browsers, as will your background or banner.

Everything you need to edit is in your About Me section.
1. Replace XXXXXXXX with your ID#.
2. Use [h2 with class ctitle1] to create the header text as seen here as "MEMO #058". Use [h2 with class ctitle2] to create the header text as seen here as "PROMISE". Use [h2 with class ctitle3] to create the header text as seen here as "THEME OF LAURA".
3. The Banner is animated, the background has an animated clip, and the Main Content is animated. If you do not like the fact that the Main Content is animated (due to loading times), copy this code into your ABOUT ME instead of the one given below. Click Here for Alternative "I'd Like To Meet" Code
4. The Nine Red Squares are the navigation.
5. The Title "Misty Days..." may be editted in the [div with class title] near the beginning of your About Me.
6. PLEASE do NOT remove the credits or any links associated with it.

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 class="title" style="width: 255px; height: 119px; margin-top: -375px; margin-left: 275px; position: absolute; filter:alpha(opacity=75)">
MISTY DAYS;<br />
REMAINS OF THE JUDGMENT <br />
<span style="font-size:25pt;">EXECUTIONER</span>
</div>

<div style="width: 700px; display:block;">
<div style="position: relative; left: 390px; _left: 360px;top: 0px; width: 475px; _width: 500px; height: 200px; overflow: none; overflow-x: none;">
<h2 class="title">Betrayal</h2>
<p class="intro">
Welcome to Silent Hill! To navigate this town, use the nine red squares to the left in order to <a href="http://www.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=XXXXXXXX">ADD ME</a>, <a href="http://www.myspace.com/index.cfm?fuseaction=user.viewProfile_commentForm&friendID=XXXXXXXX">COMMENT ME</a>, or <a href="http://www.myspace.com/index.cfm?fuseaction=mail.message&friendID=XXXXXXXX">MESSAGE ME</a> and whatnot. This is a little area for your introduction paragraph. Do not make it too short for a better effect, but don't forget to keep it simple too! Try to avoid inserting too much text and try to level it with the navigation! I hope you enjoy your stay!
</p>
</div>

<h2 class="ctitle1" style="left: 55%;"> MEMO #058</h2>
<p class="content1"> 
This layout is based on the game Silent Hill 2. In that game, Pyramid Head was essentially a villain, although one can argue who the real antagonist was, it's safe to say that Pyramid Head was not a saint. This layout of Pyramid Head features many animations so for those who have dial-up or slower computers, be aware of the disadvantages. Note that the Pyramid Head on this layout was <u>NOT</u> based on the one in the movie, Silent Hill. It was specifically extracted from Silent Hill 2.</p>

<h2 class="ctitle2" style="left:30%;"> PROMISE</h2>
<p class="content2"> 
The entire layout took a very long time to complete. I originally discovered an image of Pyramid Head standing in a foggy background filled with corpse hanging in "box-like" frames. I carefully extracted the image and animated it to make him appear as if he's breathing. If you look at him carefully, you would be able to see that on the banner. Next, I watched the entire FuKuRo video (which is a very explicit video of Pyramid Head... doing his business), and cut off a segment of it to put on the background. I wanted a scare factor to creep out viewers, so I've let a still image sit for ten seconds before animating the background which reveals Pyramid Head's entrance. I combined that footage with another of Pyramid Head skewering an offscreen character. On the banner, the "Misty Days" text could be edited. The text with "There Was a Hole Here" and "It's Gone Now" refers to an optional part of Silent Hill 2 where the message was written on the interior of a building. You can see it at imabearmeaw.com. You're probably wondering, "Why are there nine blank squares the navigation? It's annoying!" and I apologize if it is. It is also a huge reference to Silent Hill 2. Before going into battle with the twin Pyramid Heads, you will encounter nine save spots all perfectly aligned as shown on this layout.
</p>

<h2 class="ctitle3"> THEME OF LAURA</h2>
<p class="content3"> 
Silent Hill 2 is an amazing game which I basically worship for its unique and brilliant story. The scare factor is there as well, and I have grown to love Pyramid Head. Through my eyes, the individual is more of an "executioner" who obeys what "God" or his master tells him. Of course, in Silent Hill, he could be a god as well. In other words, he is neutral to me. He is neither good nor bad; only exists as a punisher. My plans were to release this layout before Halloween to boost its popularity among those who do not like Silent Hill (afterall, it IS a creepy layout!).
</p>

<blockquote>
Your Name<br /> 
Your Birth Date <br />
Your Status <br />
Your Hobbies <br />
Your Interests<br />
<s>Forms of Contact</s>
</blockquote>
</div>
</div>

Layout Code

Copy and paste to I'd Like to Meet

Help

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

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

b, strong, .btext {
  font: Courier New;  
  color: 000000; 
  text-align: justify;
  font-weight: bold;
  }
i, em, .itext  {
  font-family: Courier New; 
  font-size: 9pt;
  color: 000000;
  text-align: justify;
  }

u{
  font-family: Courier New; 
  font-size: 11px;
  color: 000000;
  text-align: justify;
  }

s, .stext, .sbtext, .swtext {
  font-family: Courier New; 
  font-size: 11px;
  color: 7A7415;
  text-align: justify;
  }
a, a:link
{font-family: Courier New;
COLOR:B5A78B; 
TEXT-DECORATION: none
Letter-spacing: 0px;
font-weight: bold;

}

a:active {font-family: Courier New;
COLOR:B5A78B; 
TEXT-DECORATION: none
Letter-spacing: 0px;
font-weight: bold;
text-transform: uppercase;
}

a:visited{font-family: Courier New; 
COLOR:B5A78B; 
TEXT-DECORATION: none;
Letter-spacing: 0px;
font-weight: bold;
}

a:hover {font-family: Courier New; 
COLOR: 8A7655; 
Letter-spacing: 0px;
font-weight: bold;
}

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 Courier New; color:000000; letter-spacing: 0px; text-align: justify; display:block;}

.header {
font-weight: normal; font-size: 9; padding-bottom: 2pt; padding-top: 0pt; COLOR: 000000; 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;}

.footerwarpper {display:none !important; color: transparent;}

.profileInfo { display:none; }

td div a.text{visibility:none; display: none;}
table, tr, td {background-color: transparent;}

table { margin:0 auto; text-align:left; width:800px; }
table table { width:auto; }

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; }

</style>

blockquote {
font: 9pt Courier New;
overflow:visible;
margin-top: 15px 106px 15px 106px;
padding: 5px 5px 5px 5px;
text-align:center;
background-color:0E0100;
border:1px dashed; 
border-color:BEA052;
color: 6A5847;
line-height: 20px;
letter-spacing: 1px;
font-style: italic;
}

.title {
 font-family: Impact; 
font-size: 15pt; 
color:715B3D; 
letter-spacing: 1px;
display:block; 
overflow:auto; 
}

.link1{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851ac.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link1:hover{background-position: bottom left; }

.link2{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851ad.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link2:hover{background-position: bottom left; }

.link3{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851ae.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link3:hover{background-position: bottom left; }

.link4{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851af.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link4:hover{background-position: bottom left; }

.link5{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851ag.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link5:hover{background-position: bottom left; }

.link6{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851ah.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link6:hover{background-position: bottom left; }

.link7{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851ai.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link7:hover{background-position: bottom left; }

.link8{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851aj.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link8:hover{background-position: bottom left; }

.link9{height: 58px; width: 58px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851ak.jpg) no-repeat; display: table-cell; border: 3px solid; border-color: 000000;}
.link9:hover{background-position: bottom left; }

a.elink{height: 169px; width: 178px; overflow: hidden; background: 
url(http://cbimg6.com/layouts/09/10/35851al.jpg) no-repeat; display: table-cell;}
a.elink:hover{background-position: bottom left; }

h2.title
{
font-family: Impact, Arial;
color: A88A02;
position: relative;
font-weight: normal;
text-transform: Uppercase;
line-height: 18px;
width: 100%;
letter-spacing: 10px;
text-align: left;
}

h2.ctitle1, .ctitle2, .ctitle3
{
font-family: Impact, Arial;
color: 0000000;
position: relative;
font-weight: normal;
text-transform: Uppercase;
line-height: 18px;
width: 40%;
letter-spacing: 10px;
text-align: right;
align; right;
padding: 10px;
}

h2.ctitle1
{
background: 
url(http://cbimg6.com/layouts/09/10/35851am.gif);
}

h2.ctitle2
{
background: 
url(http://cbimg6.com/layouts/09/10/35851an.gif);
}

h2.ctitle3
{
background: 
url(http://cbimg6.com/layouts/09/10/35851ao.gif);
}

p.content1, .content2, .content3 {
border: 0px;
FONT: 9pt Courier New; 
font-weight: bold;
COLOR: 000000; 
LETTER-SPACING: 0px; 
TEXT-ALIGN: justify;
padding: 5px;
}

p.content1 {
background: 
url(http://cbimg6.com/layouts/09/10/35851am.gif);
}

p.content2 {
background: 
url(http://cbimg6.com/layouts/09/10/35851an.gif);
}

p.content3 {
background: 
url(http://cbimg6.com/layouts/09/10/35851ao.gif);
}

p.content1:first-line, .content2:first-line, .content3:first-line
{
font: 14pt Courier New; 
color: 000000; 
font-style: italic;
font-weight: bold;}

p.intro:first-letter
{font: 18pt Courier New; 
color: 730902; 
text-transform: uppercase; 
font-style: italic;}

p.intro:first-line
{
font: 10pt Courier New; 
color: 6A5847; 
text-transform: uppercase;
font-style: italic;
font-weight: bold;}

p.intro{
border: 0px;
FONT: 9pt Courier New; 
COLOR: 6A5847; 
LETTER-SPACING: 0px; 
TEXT-ALIGN: justify;
font-style: italic;
}

p, table, tr, td, th, div{
border: 0px;
font-family: 9pt Courier New; 
color:000000;  
LETTER-SPACING: 0px; 
TEXT-ALIGN: justify;
}

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

</style>

Layout Comments

Showing latest 6 of 6 comments

INSAINE GREAT WORK!

By WESTSIDEBWSLAYZ on Nov 1, 2009 1:33 pm

I really love that you included 'There was a hole here. It's gone now". Very nice!

Oh how I lol'd. xD

This whole thing is amazing. A+

By grapi3 on Oct 30, 2009 8:31 pm

Whoa, this is seriously amazing! Great animation and overall design.

By TheOn3LeftBehind on Oct 25, 2009 2:05 pm

This is a really, really awesome layout.
The animation is amazing, and everything just looks so creepy.~
:D

By BananaNugg3ts on Oct 24, 2009 10:30 am

Haha, I like the rollovers and the little animation.

By Mike on Oct 24, 2009 9:07 am

aaaaaaAAAAAAAAAHHH! i'm in love with thisssss!

By foundry on Oct 21, 2009 6:40 pm

Layout Details

Designer	AncientWhisper
Submitted on	Oct 18, 2009
Page views	3,621
Favorites	14
Comments	6
Reviewer	Mike
Approved on	Oct 21, 2009

Layout Colors

Layout Tags

abstract, games, pyramid head, silent hill, sh2, executioner, misty days, halloween, scary, creepy, animated

The Executioner - Pyramid Head

Designer's Comments

Using This Layout

Update Friend ID

Layout Code

Layout Code

Layout Comments

Layout Details

Layout Colors

Layout Tags

Layout Tools

Layout Affiliates