Six prof

<style>

@import url(https://fonts.googleapis.com/css?family=Cedarville+Cursive);
@import url(https://fonts.googleapis.com/css?family=Trade+Winds);
@import url(https://fonts.googleapis.com/css?family=Allura);
@import url(//fonts.googleapis.com/css?family=Press+Start+2P);
@import url(//fonts.googleapis.com/css?family=Lora);
@import url(//fonts.googleapis.com/css?family=Indie+Flower);

.pfor {display: none;}
#profile {background-color: transparent; border: none; }


body {background: transparent;
cursor: url(http://cur.cursors-4u.net/cursors/cur-5/cur425.cur), progress !important; }

a, a:hover {
cursor: url(http://cur.cursors-4u.net/cursors/cur-7/cur610.cur), progress !important; }


a {color: black;}
.contentcircle a{color:rgb(208, 186, 167);
transition: all 1s;
-webkit-transition: all 1s;}
.contentcircle a:hover{text-decoration: none; color: black;}

#whole {
position: fixed;
background: #ad3235;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;}

#centerpic {position: absolute;
background-image: url(http://i57.tinypic.com/6z0he8.jpg);
background-repeat: no-repeat;
background-position: center left;
background-size: auto 100%;
background-color: transparent;
top: 100px;
bottom: 100px;
left: 0px;
right: 0px;
border-top: 5px solid black;
border-bottom: 5px solid black;}

#titlepiece {
  position: absolute;
  top: 24px;
  left: 190px;
  height: 60px;
  width: 230px;
  color: black;
  border: 0px solid black;
  font-size: 50pt;
  text-align: center;
  z-index: 1;
  overflow: hidden;
  padding: 10px;
  font-family: 'Cedarville Cursive', cursive;
  font-family: 'Allura', cursive;
  font-family: 'Trade Winds', cursive;
  text-shadow: 1px 1px #ad3235;
opacity: 1;
}

#largecircle { position: absolute;
right: 100px;
top: 150px;
/* height: 500px; */
bottom: 150px;
width: 500px;
border-radius: 300px 300px 300px 300px;
border: 0px solid black;
background: #AD3234;
transition: all 2s;
-webkit-transition: all 6s;}

#blockcircle { position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
border-radius: 300px 300px 300px 300px;
border: 0px solid green;
z-index: 1;}

#spincircle { position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
border-radius: 300px 300px 300px 300px;
border: 0px solid yellow;
z-index: 0;
}

#innercircle { position: absolute;
top: 100px;
left: 100px;
height: 300px;
width: 300px;
border-radius: 300px 300px 300px 300px;
border: 0px solid black;
z-index: 2;
background: transparent;}

#toplinks { position: absolute;
height: 100px;
width: 250px;
border: 0px solid red;
top: 0px;
left: 23px;
z-index: 9;
height: 1px;
width: 1px;}

#bottomlinks { position: absolute;
height: 100px;
width: 250px;
border: 0px solid red;
bottom: 0px;
left: 23px;
z-index: 9;
width: 1px;}

#informationcircle { position: absolute;
top: 25px;
left: 25px;
height: 250px;
width: 250px;
border: 0px solid green;
border-radius: 300px 300px 300px 300px;
z-index: 3;
overflow: hidden;
background: transparent;}

.contentcircle {
position: absolute;
top: 0px;
left: 0px;
height: 250px;
width: 250px;
border: 0px solid green;
border-radius: 300px 300px 300px 300px;
color: rgb(208, 186, 167);
text-align: center;
box-sizing: border-box;
padding: 20px;
  font-family: 'Cedarville Cursive', cursive;
  font-family: 'Allura', cursive;
font-family: 'Trade Winds', cursive;
  font-family: 'Press Start 2P', Times;
font-family: 'Lora', serif;
font-family: 'Indie Flower', cursive;
  font-weight: 600;
transition: all 1s;
-webkit-transition: all 1s;
opacity: 0;
z-index: 1;}

.contentcircle:target {
opacity: 1;
z-index:2;}

#fillercircle {
position: absolute;
top: 25px;
left: 25px;
height: 250px;
width: 250px;
border: 0px solid green;
border-radius: 300px 300px 300px 300px;
background-color: #312d2e;
z-index: 0;
opacity: 1;}

#introductioncircle { position: absolute;
height: 50px;
width: 50px;
top: 123px;
left: 123px;
border: 2px solid #AD3234;
border-radius: 300px 300px 300px 300px;
z-index: 5;
background: #AD3234;
opacity: 1;
transition: all 1s;
-webkit-transition: all 1s;
}

#introductioncircle:hover{
border: 2px solid #878C8F;}

#musictho {opacity: 0;
transition: all 1s;
-webkit-transition: all 1s;}

#introductioncircle:hover #musictho{
transition: all 1s;
-webkit-transition: all 1s;
opacity: 1;}

#circleA {position: absolute;
top: 90px;
left: 60px;
height: 30px;
width: 30px;
border-radius: 300px 300px 300px 300px;
border: 1px solid black;}

#circleB{
position: absolute;
top: 10px;
left: 235px;
height: 30px;
width: 30px;
border-radius: 300px 300px 300px 300px;
border: 1px solid black;
}

#circleC {
position: absolute;
top: 90px;
left: 400px;
height: 30px;
width: 30px;
border-radius: 300px 300px 300px 300px;
border: 1px solid black;
}

#circleD {
position: absolute;
top: 380px;
left: 60px;
height: 30px;
width: 30px;
border-radius: 300px 300px 300px 300px;
border: 1px solid black;
}

#circleE{
position: absolute;
top: 455px;
left: 235px;
height: 30px;
width: 30px;
border-radius: 300px 300px 300px 300px;
border: 1px solid black;
}

#circleF {
position: absolute;
top: 380px;
left: 400px;
height: 30px;
width: 30px;
border-radius: 300px 300px 300px 300px;
border: 1px solid black;
}

#circleA, #circleB, #circleC,
#circleD, #circleE, #circleF {
transition: top 1s, left 1s, z-index 1s .5s, background-color 1s, height 1s, width 1s;
-webkit-transition: top 1s, left 1s, z-index 1s .5s, background-color 1s, height 1s, width 1s;
border: 0px solid black;
background: #878C8F;
background-image: url(http://i18.photobucket.com/albums/b149/abysmal_rage/holy-spirit-dove-symbol-holy_spirit1_2.png);
background-repeat: no-repeat;
background-position: center left;
opacity: 1;
background-size: 200%;}

#circleA:target, #circleB:target, #circleC:target,
#circleD:target, #circleE:target, #circleF:target {
  transition: top 1s, left 1s, z-index 1s .5s, background-color 1s, height 1s, width 1s;
  -webkit-transition: top 1s, left 1s, z-index 1s .5s, background-color 1s, height 1s, width 1s;
top: 225px;
left: 225px;
background-color: transparent;
height: 50px;
width: 50px;
z-index: 6;
  }

/*
#whole:hover #circleA{
transition: all 1s;
-webkit-transition: all 1s .2s;
opacity: 1;}

#whole:hover #circleB{
transition: all 1s;
-webkit-transition: all 1s .5s;
opacity: 1;}

#whole:hover #circleC{
transition: all 1s;
-webkit-transition: all 1s .8s;
opacity: 1;}

#whole:hover #circleD{
transition: all 1s;
-webkit-transition: all 1s 1.7s;
opacity: 1;}

#whole:hover #circleE{
transition: all 1s;
-webkit-transition: all 1s 1.4s;
opacity: 1;}

#whole:hover #circleF{
transition: all 1s;
-webkit-transition: all 1s 1.1s;
opacity: 1;}

#whole:hover #titlepiece{
transition: opacity 1s 2s, color 1s 2.2s, text-shadow 1s 2.5s;
-webkit-transition: opacity 1s 2s, color 1s 2.2s, text-shadow 1s 2.5s;
opacity: 1;
color: black;
text-shadow: 1px 1px #ad3235;}

*/


#linkA {
  position: absolute;
  left: 10px;
  top: 50px;
  border: 1px solid black;
  height: 20px;
  width: 20px;
  transform: rotate(-45deg);
}

#linkB {
  position: absolute;
  left: 117px;
  top: 1px;
  border: 1px solid black;
  height: 20px;
  width: 20px;
}

#linkC {
  position: absolute;
  left: 221px;
  top: 48px;
  border: 1px solid black;
  height: 20px;
  width: 20px;
  transform: rotate(45deg);
}

#linkD {
  position: absolute;
  left: 18px;
  top: 30px;
  border: 1px solid black;
  height: 20px;
  width: 20px;
  transform: rotate(45deg);
}

#linkE{
  position: absolute;
  left: 118px;
  top: 74px;
  border: 1px solid black;
  height: 20px;
  width: 20px;
}

#linkF {
  position: absolute;
  left: 216px;
  top: 29px;
  border: 1px solid black;
  height: 20px;
  width: 20px;
  transform: rotate(-45deg);
}

#linkA, #linkB, #linkC,
#linkD, #linkE, #linkF {
  color: #393136;
text-shadow: 0px 0px 4px black;
border: 0px solid black;
font-size: 15pt;
transition: all 1s;
-webkit-transition: all 1s;}

#linkA:hover, #linkB:hover, #linkC:hover,
#linkD:hover, #linkE:hover, #linkF:hover {
color: #878C8F;
text-shadow: 0px 0px 0px transparent;}


/* Found this in Hoot's profile and used it 'cos it's cool */

#ongaku {
    border-radius: 5px;
    width: 25px;
    height: 20px;
    overflow: hidden;
    background-color: #5f5d5d;
    opacity: .8;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
.musicgif {
    margin: 5px;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
#ongaku:hover .musicgif {
    margin-top: -12px;
    background-color: #ffffff;
}
 #ongaku:hover { background-color: #ffffff;}
#musicpl {
    width: 22px;
    overflow: hidden;
    height: 20px;
    padding: 2px 20px 10px 3px;
    margin-left: -20px;
    background-color: #ffffff;
}


#quotebox{position: absolute;
top: 10px;
left: 20px;
height: 100px;
width: 200px;
border: 0px solid black;
box-sizing: border-box;
padding-top: 22px;
padding-left: 29px;
overflow: hidden;
font-size: 9pt;
text-align: left;
text-transform: uppercase;
}

#leftbox{position: absolute;
height: 40px;
width: 100px;
border: 0px solid black;
left: 0px;
top: 110px;
box-sizing: border-box;
overflow: hidden;
font-size: 9pt;
text-transform: uppercase;
}
#rightbox{position: absolute;
height: 40px;
width: 100px;
border: 0px solid black;
right: 0px;
top: 110px;
box-sizing: border-box;
overflow: hidden;
font-size: 9pt;
text-transform: uppercase;
}
#contentbox{
height: 90px;
width: 200px;
border: 0px solid black;
position: absolute;
bottom: 10px;
left: 20px;
box-sizing: border-box;
padding-top: 20px;
overflow: auto;
font-size: 10pt;}


</style>

<div id="whole">

<div id="centerpic">
<div style="position: absolute;
right: 0px;
top: 0px;
width: 300px;
height: 100%;
background: #ad3235;">
</div>
</div>

<div id="titlepiece">
Six
</div>




<div id="largecircle">

<div id="blockcircle">
</div>

<a href=#first><div id="circleA">
</div></a>
<a href=#second><div id="circleB">
</div></a>
<a href=#third><div id="circleC">
</div></a>
<a href=#fourth><div id="circleD">
</div></a>
<a href=#fifth><div id="circleE">
</div></a>
<a href=#sixth><div id="circleF">
</div></a>


<div id="innercircle">
<div id="toplinks">
<a href=#circleA><div id="linkA">
▲
</div></a>
<a href=#circleB><div id="linkB">
▲
</div></a>
<a href=#circleC><div id="linkC">
▲
</div></a>
</div>

<div id="bottomlinks">
<a href=#circleD><div id="linkD">
▼
</div></a>
<a href=#circleE><div id="linkE">
▼
</div></a>
<a href=#circleF><div id="linkF">
▼
</div></a>

</div>

<div id="informationcircle">

<div class="contentcircle">
</div>

<div id="first" class="contentcircle">
<div id="quotebox">
"Do Not Regret What You Have Done"<br>- Miyamoto Musashi </div>
<div id="leftbox">
Oni General </div>
<div id="rightbox">
Exiled Youth </div>
<div id="contentbox">
'The General of Terror'.<br>
Six is a an exile, the once proud sixth son of King Zero.</div>
</div>

<div id="second" class="contentcircle">
<div id="quotebox" style="font-size: 10pt;">
"I Master The Trick, Just Like Nixon."
- Ghostface Killah</div>
<div id="leftbox">old as hell</div>
<div id="rightbox">looks 16</div>
<div id="contentbox">
Loves human music.<br>
Loves human culture.<br>
Hates humans.
</div>
</div>

<div id="third" class="contentcircle">
<div id="quotebox" style="padding-top: 18px; padding-left: 32px;">
"Invincibility Lies In The defence; the possibility of victory in the attack."
<br>- Sun Tzu</div>
<div id="leftbox">taller than mountains</div>
<div id="rightbox">stands about 5'7"</div>
<div id="contentbox">
Dislikes civility.<br>
Dislikes passivity.<br>
Loves long walks.
</div>
</div>

<div id="fourth" class="contentcircle">
<div id="quotebox" style="padding-top: 30px;
  padding-left: 26px; font-size: 11pt;">
"Get Rich Or Die Tryin'."<br>
- 50 Cent</div>
<div id="leftbox">heavier than sorrow</div>
<div id="rightbox">not really</div>
<div id="contentbox">
Is sort of a horndog.<br>
Will probably sex anything.<br>
Probably won't sex a wall.</div>
</div>

<div id="fifth" class="contentcircle">
<div id="quotebox">
"Better to fight for something than live for nothing."
- Patton Oswalt
</div>
<div id="leftbox">Hulk smash!</div>
<div id="rightbox">pretty strong</div>
<div id="contentbox">
Has no technical skills.<br>
Is very capable physically.<br>
Hopeless with magic.</div>
</div>

<div id="sixth" class="contentcircle">
<div id="quotebox">"You Jus' Mad 'Cus I'm Stylin' On You."
- Nyckz (before being punched in the face)</div>
<div id="leftbox"><a href="https://youtu.be/wUZaEDl2zto" target="_blank" title="Run the Jewels - Jeapordy">
music source</a></div>
<div id="rightbox"><a href="http://www.pixiv.net/member.php?id=3209119" target="_blank">
image source</a></div>
<div id="contentbox">
music is in the center.<br>
code is mine.<br>
art is not.</div>
</div>

</div>

<div id="fillercircle">
</div>

<div id="introductioncircle">
<div id="musictho" style="position: absolute; left: 12px;
top: 15px;">
<div id="ongaku">
<div class="musicgif"><img src="http://media.tumblr.com/tumblr_m7w2py1dEP1r6o8v2.gif"/></div>
<div id="musicpl">
<embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=https://www.dropbox.com/s/n6je7s93g7jfoam/Jeopardy%20%281%29.mp3?dl=1&t0=Jeapordy&total=1" quality="high" wmode="transparent" width="200" height="10" name="billy" offset=16sec align="middle" type="application/x-shockwave-flash" />
</div>
</div>
</div>

</div>

</div>

</div>


</div>