I do not know javascript to use. It is CSS and html as far as I know. I am using Rikstar's personal papers template from the forums and honestly would not know what javascript looked like. And because of that error... it made it where my most recent work completed on certain portions was not saved. It was rather annoying.
[log=Script I am Currently Using]
<script>turn = 0;
function rotate_list(number)
{
turn = number;
$(document).ready(function(){
if(turn == 0)
{
$("#first").css({"transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#first").css({"-webkit-transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#first").css({"color":"rgba(0,0,0,1)"});
$("#first").css({"background-color":"transparent"});
$("#second").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#second").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#second").css({"color":"rgba(0,0,0,0)"});
$("#second").css({"background-color":"transparent;"});
$("#third").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#third").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#third").css({"color":"rgba(0,0,0,0)"});
$("#third").css({"background-color":"transparent;"});
$("#fourth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fourth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fourth").css({"color":"rgba(0,0,0,0)"});
$("#fourth").css({"background-color":"transparent;"});
$("#fifth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fifth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fifth").css({"color":"rgba(0,0,0,0)"});
$("#fifth").css({"background-color":"transparent;"});
$("#sixth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"color":"rgba(0,0,0,0)"});
$("#sixth").css({"background-color":"transparent;"});
$("#zeventh").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"color":"rgba(0,0,0,0)"});
$("#zeventh").css({"background-color":"transparent;"});
$("#eighth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"color":"rgba(0,0,0,0)"});
$("#eighth").css({"background-color":"transparent;"});
}else if(turn == 1)
{
$("#first").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"color":"rgba(0,0,0,0)"});
$("#first").css({"background-color":"transparent"});
$("#second").css({"transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#second").css({"-webkit-transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#second").css({"color":"rgba(0,0,0,1)"});
$("#second").css({"background-color":"transparent"});
$("#third").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#third").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#third").css({"color":"rgba(0,0,0,0)"});
$("#third").css({"background-color":"transparent;"});
$("#fourth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fourth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fourth").css({"color":"rgba(0,0,0,0)"});
$("#fourth").css({"background-color":"transparent;"});
$("#fifth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fifth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fifth").css({"color":"rgba(0,0,0,0)"});
$("#fifth").css({"background-color":"transparent;"});
$("#sixth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"color":"rgba(0,0,0,0)"});
$("#sixth").css({"background-color":"transparent;"});
$("#zeventh").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"color":"rgba(0,0,0,0)"});
$("#zeventh").css({"background-color":"transparent;"});
$("#eighth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"color":"rgba(0,0,0,0)"});
$("#eighth").css({"background-color":"transparent;"});
}else if(turn == 2)
{
$("#first").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"color":"rgba(0,0,0,0)"});
$("#first").css({"background-color":"transparent"});
$("#second").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"color":"rgba(0,0,0,0)"});
$("#second").css({"background-color":"transparent"});
$("#third").css({"transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#third").css({"-webkit-transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#third").css({"color":"rgba(0,0,0,1)"});
$("#third").css({"background-color":"transparent"});
$("#fourth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fourth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fourth").css({"color":"rgba(0,0,0,0)"});
$("#fourth").css({"background-color":"transparent;"});
$("#fifth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fifth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fifth").css({"color":"rgba(0,0,0,0)"});
$("#fifth").css({"background-color":"transparent;"});
$("#sixth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"color":"rgba(0,0,0,0)"});
$("#sixth").css({"background-color":"transparent;"});
$("#zeventh").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"color":"rgba(0,0,0,0)"});
$("#zeventh").css({"background-color":"transparent;"});
$("#eighth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"color":"rgba(0,0,0,0)"});
$("#eighth").css({"background-color":"transparent;"});
}else if(turn == 3)
{
$("#first").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"color":"rgba(0,0,0,0)"});
$("#first").css({"background-color":"transparent"});
$("#second").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"color":"rgba(0,0,0,0)"});
$("#second").css({"background-color":"transparent"});
$("#third").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"color":"rgba(0,0,0,0)"});
$("#third").css({"background-color":"transparent"});
$("#fourth").css({"transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#fourth").css({"-webkit-transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#fourth").css({"color":"rgba(0,0,0,1)"});
$("#fourth").css({"background-color":"transparent"});
$("#fifth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fifth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#fifth").css({"color":"rgba(0,0,0,0)"});
$("#fifth").css({"background-color":"transparent;"});
$("#sixth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"color":"rgba(0,0,0,0)"});
$("#sixth").css({"background-color":"transparent;"});
$("#zeventh").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"color":"rgba(0,0,0,0)"});
$("#zeventh").css({"background-color":"transparent;"});
$("#eighth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"color":"rgba(0,0,0,0)"});
$("#eighth").css({"background-color":"transparent;"});
}else if(turn == 4)
{
$("#first").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"color":"rgba(0,0,0,0)"});
$("#first").css({"background-color":"transparent"});
$("#second").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"color":"rgba(0,0,0,0)"});
$("#second").css({"background-color":"transparent"});
$("#third").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"color":"rgba(0,0,0,0)"});
$("#third").css({"background-color":"transparent"});
$("#fourth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fourth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fourth").css({"color":"rgba(0,0,0,0)"});
$("#fourth").css({"background-color":"transparent"});
$("#fifth").css({"transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#fifth").css({"-webkit-transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#fifth").css({"color":"rgba(0,0,0,1)"});
$("#fifth").css({"background-color":"transparent"});
$("#sixth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#sixth").css({"color":"rgba(0,0,0,0)"});
$("#sixth").css({"background-color":"transparent;"});
$("#zeventh").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"color":"rgba(0,0,0,0)"});
$("#zeventh").css({"background-color":"transparent;"});
$("#eighth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"color":"rgba(0,0,0,0)"});
$("#eighth").css({"background-color":"transparent;"});
}else if(turn == 5)
{
$("#first").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"color":"rgba(0,0,0,0)"});
$("#first").css({"background-color":"transparent"});
$("#second").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"color":"rgba(0,0,0,0)"});
$("#second").css({"background-color":"transparent"});
$("#third").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"color":"rgba(0,0,0,0)"});
$("#third").css({"background-color":"transparent"});
$("#fourth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fourth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fourth").css({"color":"rgba(0,0,0,0)"});
$("#fourth").css({"background-color":"transparent"});
$("#fifth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fifth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fifth").css({"color":"rgba(0,0,0,0)"});
$("#fifth").css({"background-color":"transparent"});
$("#sixth").css({"transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#sixth").css({"-webkit-transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#sixth").css({"color":"rgba(0,0,0,1)"});
$("#sixth").css({"background-color":"transparent"});
$("#zeventh").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#zeventh").css({"color":"rgba(0,0,0,0)"});
$("#zeventh").css({"background-color":"transparent;"});
$("#eighth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"color":"rgba(0,0,0,0)"});
$("#eighth").css({"background-color":"transparent;"});
}else if(turn == 6)
{
$("#first").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"color":"rgba(0,0,0,0)"});
$("#first").css({"background-color":"transparent"});
$("#second").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"color":"rgba(0,0,0,0)"});
$("#second").css({"background-color":"transparent"});
$("#third").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"color":"rgba(0,0,0,0)"});
$("#third").css({"background-color":"transparent"});
$("#fourth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fourth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fourth").css({"color":"rgba(0,0,0,0)"});
$("#fourth").css({"background-color":"transparent"});
$("#fifth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fifth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fifth").css({"color":"rgba(0,0,0,0)"});
$("#fifth").css({"background-color":"transparent"});
$("#sixth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#sixth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#sixth").css({"color":"rgba(0,0,0,0)"});
$("#sixth").css({"background-color":"transparent"});
$("#zeventh").css({"transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#zeventh").css({"-webkit-transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#zeventh").css({"color":"rgba(0,0,0,1)"});
$("#zeventh").css({"background-color":"transparent"});
$("#eighth").css({"transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"-webkit-transform":"rotateY(100deg) translateX(400px) translateZ(230px)"});
$("#eighth").css({"color":"rgba(0,0,0,0)"});
$("#eighth").css({"background-color":"transparent;"});
}else if(turn == 7)
{
$("#first").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#first").css({"color":"rgba(0,0,0,0)"});
$("#first").css({"background-color":"transparent"});
$("#second").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#second").css({"color":"rgba(0,0,0,0)"});
$("#second").css({"background-color":"transparent"});
$("#third").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#third").css({"color":"rgba(0,0,0,0)"});
$("#third").css({"background-color":"transparent"});
$("#fourth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fourth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fourth").css({"color":"rgba(0,0,0,0)"});
$("#fourth").css({"background-color":"transparent"});
$("#fifth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fifth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#fifth").css({"color":"rgba(0,0,0,0)"});
$("#fifth").css({"background-color":"transparent"});
$("#sixth").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#sixth").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#sixth").css({"color":"rgba(0,0,0,0)"});
$("#sixth").css({"background-color":"transparent"});
$("#zeventh").css({"transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#zeventh").css({"-webkit-transform":"rotateY(-100deg) translateX(-400px) translateZ(230px)"});
$("#zeventh").css({"color":"rgba(0,0,0,0)"});
$("#zeventh").css({"background-color":"transparent"});
$("#eighth").css({"transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#eighth").css({"-webkit-transform":"rotateY(0deg) translateX(0px) translateZ(0px)"});
$("#eighth").css({"color":"rgba(0,0,0,1)"});
$("#eighth").css({"background-color":"transparent"});
}
});
}
</script>
<style type="text/css">#main_personalpage{
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,1);
background-color: transparent;
backface-visibility: hidden;
-webkit-backface-visibility:hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
border-style: none ;
border-width: 1px;
font-family:Arial, Times, "serif";
}
#first{
position: absolute;
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,1);
background-color: transparent;
backface-visibility: hidden;
border-style: none ;
border-width: 1px;
font-family: "Playball", cursive;
font-size: 150%;
transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);
-webkit-backface-visibility: hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
transition: transform 1s, color 1s, background-color 1s, display 1s;
-webkit-transition: -webkit-transform 1s, color 1s, background-color 1s, display 1s;
}
#second{
position: absolute;
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,0);
background-color: transparent;
backface-visibility: hidden;
border-style: none ;
border-width: 1px;
font-family:"Playball", cursive;
font-size: 150%;
transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-backface-visibility: hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
transition: transform 1s, color 1s, background-color 1s, display 1s;
-webkit-transition: -webkit-transform 1s, color 1s, background-color 1s, display 1s;
}
#third{
position: absolute;
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,0);
background-color: transparent;
backface-visibility: hidden;
border-style: none ;
border-width: 1px;
font-family:Arial, Times, "serif";
transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-backface-visibility: hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
transition: transform 1s, color 1s, background-color 1s, display 1s;
-webkit-transition: -webkit-transform 1s, color 1s, background-color 1s, display 1s;
}
#fourth{
position: absolute;
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,0);
background-color: transparent;
backface-visibility: hidden;
border-style: none ;
border-width: 1px;
font-family:Arial, Times, "serif";
transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-backface-visibility: hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
transition: transform 1s, color 1s, background-color 1s, display 1s;
-webkit-transition: -webkit-transform 1s, color 1s, background-color 1s, display 1s;
}
#fifth{
position: absolute;
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,0);
background-color: transparent;
backface-visibility: hidden;
border-style: none ;
border-width: 1px;
font-family:Arial, Times, "serif";
transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-backface-visibility: hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
transition: transform 1s, color 1s, background-color 1s, display 1s;
-webkit-transition: -webkit-transform 1s, color 1s, background-color 1s, display 1s;
}
#sixth{
position: absolute;
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,0);
background-color: transparent;
backface-visibility: hidden;
border-style: none ;
border-width: 1px;
font-family:Arial, Times, "serif";
transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-backface-visibility: hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
transition: transform 1s, color 1s, background-color 1s, display 1s;
-webkit-transition: -webkit-transform 1s, color 1s, background-color 1s, display 1s;
}
#zeventh{
position: absolute;
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,0);
background-color: transparent;
backface-visibility: hidden;
border-style: none ;
border-width: 1px;
font-family:Arial, Times, "serif";
transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-backface-visibility: hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
transition: transform 1s, color 1s, background-color 1s, display 1s;
-webkit-transition: -webkit-transform 1s, color 1s, background-color 1s, display 1s;
}
#eighth{
position: absolute;
width: 80%;
margin-right: 10%;
margin-left: 10%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
color: rgba(0,0,0,0);
background-color: transparent;
backface-visibility: hidden;
border-style: none ;
border-width: 1px;
font-family:Arial, Times, "serif";
transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-transform: rotateY(100deg) translateX(400px) translateZ(230px);
-webkit-backface-visibility: hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
transition: transform 1s, color 1s, background-color 1s, display 1s;
-webkit-transition: -webkit-transform 1s, color 1s, background-color 1s, display 1s;
}
.pers{
perspective: 1500px;
}
</style>
<style>.menu-textbutton
{
background-color: transparent;
color: white;
border-radius: 4px;
text-align: center;
-webkit-transition-duration: 0.4s; /* Safari */
transition-duration: 0.4s;
}
.menu-textbutton:hover {
background-color: transparent;
color: white;
}
</style>
<div align="center">
<div align="center" id="main_personalpage" class="frm-textbutton-gold"> <button id="button" onclick="rotate_list(0)" class="frm-textbutton-gold" type="submit">Greetings</button> <button id="button" onclick="rotate_list(1)" class="frm-textbutton-gold" type="submit">Rules</button> <button id="button" onclick="rotate_list(2)" class="frm-textbutton-gold" type="submit">Reward Shop</button> <button id="button" onclick="rotate_list(3)" class="frm-textbutton-gold" type="submit">Items for Sale</button> <button id="button" onclick="rotate_list(4)" class="frm-textbutton-gold" type="submit">Trade Log</button> <button id="button" onclick="rotate_list(5)" class="frm-textbutton-gold" type="submit">Quest Log</button> <button id="button" onclick="rotate_list(6)" class="frm-textbutton-gold" type="submit">History</button> <button id="button" onclick="rotate_list(7)" class="frm-textbutton-gold" type="submit">Misq</button>
</div>
</div>
<div align="center" class="pers">
<div id="first"> <h1>Masks of the Mist Booth</h1>
<p> Welcome, for now the booth is not much; except for myself, the items I carry, and a few jobs for those that come by. If you look around there are some items that you can purchase, if you have either coin or completed enough jobs for me. Tell me what you want to buy and the trading will begin. If you have not taken on a few jobs, just ask me what is available and I will give you something to do. Some tasks and quests can be found at the Information Center in the panel on the front step of the GoE. A few of those quests and tasks overlap with this point system, while others are sponsored by other lands or quest makers.</p>--Assira the Black
</div>
<div id="second"><h1>Rules</h1> 1)People can help each other on certain tasks and quests; but if it has been found that a person is doing the task or quest for an individual. Then I will interfer; if it continues to become a problem where that person is repeatedly doing the quests for others then he/she will be given negative points equal to the task/quest. If uncertain then ask. <br /> <br /> 2)If quest items are stolen, after approaching the person if they do not return the item they will be given negative points double to what the item/quest is worth (so if the quest is worth 5points the person will receive -10points). As things progress then so do I.<br /> <br /> 3)Tasks can only be completed two times per quarter: January-March, April-June, July-September, and October-December. <br /> <br /> 4)Quests can only be completed once unless otherwise specified. <br /> <br /> 5)Points can also be awarded to quest makers, coders, and judges that link/overlap with this system. So keep notes and inform me on what is going on to receive points for this. <br /> <br /> 6)Once a year this system will be reviewed to ensure that any market fluctuations are accounted for. <br /> <br /> 7)Quest, tasks, participants, coders, quest makers, judges, trades, and so on will be recorded as much as possible. So only give items and etc. if I am awake, otherwise it makes it difficult to track who did what. <br /> <br /> 8)Items will be given at purchase and for the purchase of someone using an ability or spell on you (or on a person you chose) payment of points for the abilities will happen when it is cast. It may take some time to get a hold of the castor so do not expect it to immediately happen. <br /> <br /> 9) Remember have a fun and interesting time.<br /> <br />--Assira the Black
</div>
<div id="third"><h1>Reward Shop</h1> <br /> <br /><b> Tier 1:5-10pts</b> <br />
<style>table, tr {
text-align: center;
}
tr{
border: rules;
{
</style>
<table style="width: 100%;">
<tbody>
<tr>
<td><b>1 Silver Coin</b><br /> 31 coins in stock <br />5 pt</td>
<td><b>15* Resin</b><br /> 1 set in stock <br />10 pt</td>
<td><b>15* Bones</b><br /> 1 set in stock <br />10 pt</td>
</tr>
</tbody>
</table> <br /> <br /><b>Tier 2:15-20pts</b><br />
<style>table, tr {
text-align: center;
}
tr{
border: rules;
{
</style>
<table style="width: 100%;">
<tbody>
<tr>
<td><b>Thorny Crown</b><br /> 1 in stock <br />20 pts</td>
<td><b>Heretic Archer Card</b><br /> 2 in stock <br />20 pts</td>
<td><b>NC Handkerchief</b><br />1 in stock <br />20 pt</td>
</tr>
<tr>
<td><b>Drachorn book ends</b><br /> 1 in stock <br />20pts</td>
<td><b>A piece of bark</b><br /> 1 in stock <br />20pts</td>
<td><b>20* flowers </b><br /> 1 set in stock <br />20pts</td>
</tr>
</tbody>
</table> <br /> <br /><b>Tier 3</b><br />
<style>table, tr {
text-align: center;
}
tr{
border: rules;
{
</style>
<table style="width: 100%;">
<tbody>
<tr>
<td><b>Item 1</b><br /> 1 in stock <br />8 pt</td>
<td><b>Item 2</b><br /> 3 in stock <br />12 pt</td>
<td><b>Item 3</b><br /> 7 in stock <br />30 pt</td>
</tr>
<tr>
<td><b>Item 4</b><br /> 1 in stock <br />8pt</td>
<td><b>Item 5</b><br /> 1 in stock <br />8pt</td>
<td><b>Item 6</b><br /> 1 in stock <br />8pt</td>
</tr>
</tbody>
</table> <br /> <br /><b>Tier 4</b><br />
<style>table, tr {
text-align: center;
}
tr{
border: rules;
{
</style>
<table style="width: 100%;">
<tbody>
<tr>
<td><b>Item 1</b><br /> 1 in stock <br />8 pt</td>
<td><b>Item 2</b><br /> 3 in stock <br />12 pt</td>
<td><b>Item 3</b><br /> 7 in stock <br />30 pt</td>
</tr>
<tr>
<td><b>Item 4</b><br /> 1 in stock <br />8pt</td>
<td><b>Item 5</b><br /> 1 in stock <br />8pt</td>
<td><b>Item 6</b><br /> 1 in stock <br />8pt</td>
</tr>
</tbody>
</table> <br /> <br /><b>Tier 5</b><br />
<style>table, tr {
text-align: center;
}
tr{
border: rules;
{
</style>
<table style="width: 100%;">
<tbody>
<tr>
<td><b>Item 1</b><br /> 1 in stock <br />8 pt</td>
<td><b>Item 2</b><br /> 3 in stock <br />12 pt</td>
<td><b>Item 3</b><br /> 7 in stock <br />30 pt</td>
</tr>
<tr>
<td><b>Item 4</b><br /> 1 in stock <br />8pt</td>
<td><b>Item 5</b><br /> 1 in stock <br />8pt</td>
<td><b>Item 6</b><br /> 1 in stock <br />8pt</td>
</tr>
</tbody>
</table> <br /> <br /><b>Tier 6</b><br />
<style>table, tr {
text-align: center;
}
tr{
border: rules;
{
</style>
<table style="width: 100%;">
<tbody>
<tr>
<td><b>Item 1</b><br /> 1 in stock <br />8 pt</td>
<td><b>Item 2</b><br /> 3 in stock <br />12 pt</td>
<td><b>Item 3</b><br /> 7 in stock <br />30 pt</td>
</tr>
<tr>
<td><b>Item 4</b><br /> 1 in stock <br />8pt</td>
<td><b>Item 5</b><br /> 1 in stock <br />8pt</td>
<td><b>Item 6</b><br /> 1 in stock <br />8pt</td>
</tr>
</tbody>
</table>
</div>
<div id="fourth"><h1>Items for Sale</h1>
<style>table, tr {
text-align: center;
}
tr{
border: rules;
{
</style>
<table style="width: 100%;">
<tbody>
<tr>
<td><b>Item 1</b><br /> 1 in stock <br />80 pt</td>
<td><b>Item 2</b><br /> 3 in stock <br />12 pt</td>
<td><b>Item 3</b><br /> 7 in stock <br />30 pt</td>
</tr>
<tr>
<td><b>Item 4</b></td>
<td><b>Item 5</b></td>
<td><b>Item 6</b></td>
</tr>
</tbody>
</table>
</div>
<div id="fifth"><h1>Trade Log</h1>
<p>A list of transactions that have taken place for the Booth.</p>
</div>
<div id="sixth"><h1>Quest Log</h1>
<p>Current Quests or tasks for this quarter that people have completed.</p>
</div>
<div id="zeventh"><h1>History</h1>
<p> A brief summary of quests and tasks completed per quarter. The forums will be more detailed in this area.</p>
</div>
<div id="eighth"><h1>Miscellaneous</h1>
<p>Anything that does not currently fall under one of the tabs.</p>
</div>
</div>
[/log]