THE APPLICATIONS

The following is the application. You do NOT post it. You PM it to one of the admins in code once completely filled out. The only part of the CSS you're allowed to touch are the ones involved with background images. Once accepted, the admins will take care of the colors.  If you're submitting an OC student, put the two houses that you want your character to possibly be sorted in after the code of the finished application. This essentially serves as a profile application. If you're wondering why it's on an HTML page yet it's essentially the profile, it's because that's the only way to pull it off. Do NOT worry, we have the codes to redirect the regular profile over to the HTML page. Cool, right? It's essentially freeform, but it's a bit complicated to fill out, so it's best to save it on a word document to work on or make it a draft post. The code has instructions on what to put in terms of photo dimensions and anything else one can imagine. If you want to update it after a few things occurring such as changing of allegiance, self-discovery, etc., just let us know and we'll gladly update it for you! When it comes to updating it, just give us a code like this for the bio

Code:

<p>another paragraph here ok</p>

or just tell us to change the sexual orientation from blah blah blah to blah blah blah.

Code:

<style>
   @font-face {
    font-family: 'aesthetikaregular';
    src: url('http://likeakillerwave.b1.jcink.com/uploads/likeakillerwave/Aesthetika_webfont.eot');
    src: url('http://likeakillerwave.b1.jcink.com/uploads/likeakillerwave/Aesthetika_webfont.eot?#iefix') format('embedded-opentype'),
        url('Aesthetika-webfont.woff2') format('woff2'),
        url('http://likeakillerwave.b1.jcink.com/uploads/likeakillerwave/Aesthetika_webfont.woff') format('woff'),
        url('http://likeakillerwave.b1.jcink.com/uploads/likeakillerwave/Aesthetika_webfont.ttf') format('truetype'),
        url('http://likeakillerwave.b1.jcink.com/uploads/likeakillerwave/Aesthetika_webfont.svg#aesthetikaregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
  @font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: local('Oswald Regular'), local('Oswald-Regular'), url(http://fonts.gstatic.com/s/oswald/v10/yg0glPPxXUISnKUejCX4qfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
}
  #profile {
  background-color: #fff;
padding: 25px;
width: 900px;
width: auto;
}

  #profileleft {
width: 225px;
border: 15px solid #B17D8A;
padding: 25px;
height: 400px;
background-color: #fff;
   box-shadow: 1px 1px #000;
}
  
  .proflefthouse {
width: 225px;
height: 60px;
background-color: #121212;
 font-family: 'aesthetikaregular';
font-size: 35px;
color: #fff;
 text-shadow: 2px 2px #7B8396, 4px 4px #935390;
text-align: center;
}
  #hover {
overflow: hidden;
width: 225px;
height: 325px;
position: relative;
margin-top: -10px;
  background-image: url(http://placehold.it/225x325);
}
  .av {
width: 225px;
height: 325px;
background-color: rgba(0, 0, 0, 0.6);
position: relative;
top: 325px;
-webkit-transition-duration: 1.2s;
-moz-transition-duration: 1.2s;
-o-transition-duration: 1.2s;
}
  #hover:hover .av {
  top: 0px;
  }
  .gifborder {
width: 200px;
border: 5px solid #935390;
opacity: 1.0;
margin-left: 9px;
}
  .lyrics {
width: 200px;
height: 80px;
overflow: auto;
background-color: #fff;
color: #000;
text-transform: uppercase;
font-family: calibri;
border: none;
}
  .alias {
width: 200px;
height: 30px;
font-family: 'Oswald', sans-serif;
color: #fff;
background-color: #B17D8A;
 text-shadow: 2px 2px #7B8396, 4px 4px #935390;
text-transform: uppercase;
text-align: center;
}
  #profileleft .nameback {
width: 225px;
text-align: center;
display: block;
background-color: #121212;
}
  #profileleft .name {
 font-family: 'aesthetikaregular';
font-size: 30px;
color: #fff;
width: 225px;
 text-shadow: 2px 2px #7B8396, 4px 4px #935390;
}
  #profmiddle {
border: 15px solid #B17D8A;
background-color: #fff;
width: 450px;
height: 450px;
   box-shadow: 1px 1px #000;
}
  #profileright {
border: 15px solid #B17D8A;
background-color: #fff;
width: 220px;
height: 420px;
padding: 15px;
  box-shadow: 1px 1px #000;
}
  .profrightinfobody {
width: 224px;
height: 190px;
overflow: auto;
margin-top: 5px;
}
  .profrightinfo1 {
width: 215px;
height: 35px;
font-family: 'Oswald', sans-serif;
color: #fff;
background-color: #B17D8A;
 text-shadow: 2px 2px #7B8396, 4px 4px #935390;
text-transform: uppercase;
text-align: center;
font-size: 25px;
display: inline-block;
}
  .profrightinfo2 {
font-family: 'Oswald', sans-serif;
color: #fff;
background-color: #8D7390;
 text-shadow: 2px 2px #7B8396, 4px 4px #935390;
text-transform: uppercase;
text-align: center;
width: 215px;
height: 35px;
font-size: 25px;
display: inline-block;
}
   #middle {
overflow: hidden;
width: 450px;
height: 450px;
position: relative;
  display: inline-block;
  background-image: url(http://placehold.it/450);
}
  .mid {
width: 450px;
height: 450px;
background-color: rgba(0, 0, 0, 0.6);
position: relative;
top: 450px;
-webkit-transition-duration: 1.2s;
-moz-transition-duration: 1.2s;
-o-transition-duration: 1.2s;
}
  #middle:hover .mid {
  top: 0px;
  }
  .bio {
  overflow: auto;
background-color: #fff;
color: #000;
text-transform: lowercase;
font-family: calibri;
  width: 350px;
  height: 180px;
  margin-left: 45px;
  border: 5px solid #935390;
  text-align: justify;
  font-size: 12px;
  }
  .bio:first-letter {
  color: #fff;
float: left;
 font-family: 'aesthetikaregular';
font-size: 45px;
font-style: normal;
font-weight: 300;
line-height: 100%;
margin: 2px 8px 5px 0;
 text-shadow: 2px 2px #7B8396, 4px 4px #935390;
text-transform: uppercase;
  }
  .bio p:first-letter {
    color: #935390;
float: left;
 font-family: 'aesthetikaregular';
font-size: 45px;
font-style: normal;
font-weight: 300;
line-height: 100%;
margin: 2px 8px 5px 0;
 text-shadow: 2px 2px #7B8396, 4px 4px #935390;
text-transform: uppercase;
  }
  .bio p {
  color: #000;
text-transform: lowercase;
font-family: calibri;
  text-align: justify;
   font-size: 12px;
  }
  .biopic {
  width: 350px;
  height: 201px;
  background-size: contain;
  background-image:url(GIF/PIC 350PX IN WIDTH. ADJUST HEIGHT ACCORDINGLY. MAKE SURE ITS NOT TOO LONG!);
  border: 5px solid #935390;
  margin-left: 45px;
  }
  .biogen {
  width: 360px;
  height: 39px;
  font-family: 'Oswald', sans-serif;
color: #fff;
background-color: #8D7390;
 text-shadow: 2px 2px #7B8396, 4px 4px #935390;
text-transform: uppercase;
text-align: center;
  font-size: 30px;
  margin-left: 45px;
  border-bottom: 5px solid #935390;;
  }
</style><div id="profile"><table><tbody><tr><td style="vertical-align:top;"><div id="profileleft"><div class="proflefthouse" style="background-color: #ADMINONLY;">ADMIN ONLY UNLESS GRADUATE OR PROFESSOR, IF ONE OF EITHER PUT THEIR FORMER HOUSE AND ALUM AFTER IT, MUGGLES JUST PUT N/A</div>
  <div id="hover"><div class="av"><div class="gifborder"><img src="GIF/PIC 200PX IN WIDTH HERE, MAKE SURE HEIGHT IS UNDER 200PX;"><div class="lyrics">LYRICS HERE</div><div class="alias">ALIAS</div><div style="width: 200px; height: 25px; background-color: #fff; background-image:url(http://i1180.photobucket.com/albums/x403/TheXaria-Yue/profborder_zpshiasr27n.png);"></div></div></div></div>
  <div class="nameback" style="background-color: #ADMINSONLY;"><div class="name">FIRST LAST</div> </div></div> </td>
  
  <td style="vertical-align:top;"><div id="profmiddle"><div id="middle"><div class="mid"><div class="biopic"></div><div class="bio">BIO HERE USE <p></p>TO SEPARATE PARAGRAPHS</div><div class="biogen">fc. timezone.</div></div></div></div></td>
    <td style="vertical-align:top;"><div id="profileright"><div style="border-radius: 100%; -moz-border-radius: 100%; -webkit-border-radius: 100%;  width: 200px; height: 200px; border: 5px solid #935390; background-image:url(HTTP://PLACEHOLD.IT/200);"></div><div><object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="215" height="15"><param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf"><param name="bgcolor" value="#ADMINSONLY"><param name="FlashVars" value="mp3=MUST END IN MP3"></object></div><div class="profrightinfobody"><div class="profrightinfo1">age</div><div class="profrightinfo2">alleigiance (light/dark/neutral)</div><div class="profrightinfo1">blood purity</div><div class="profrightinfo2">relationship status</div><div class="profrightinfo1">sexuality - leave blank or put n/a if you're not sure yet</div><div class="profrightinfo2">negative</div><div class="profrightinfo1">positive</div><div class="profrightinfo2">negative</div><div class="profrightinfo1">positive</div></div></div></td></tr></tbody></table></div>