html, body {
padding:0px;
margin:0px;
height:100%;
width:100%;
image-rendering:pixelated;
}
body {
background-image: url('!Media/BGs/checkerboarddark3.png');
background-color: #000055;
}
.backgroundspike {
background-image: url('!Media/Index/backgroundspikes.png');
z-index:-1;
width:100%;
height:98px;
}
.bgs1 {
position:fixed;
}
.bgs2 {
-webkit-transform: scaleX(-1);
transform: scaleY(-1);
bottom:0px;
position:fixed;
}
.backgroundgrad {
background-image: url('!Media/Index/gradientbg.png');
background-repeat: no-repeat;
z-index:-2;
width:100%;
height:50%;
}
.bge1 {
position:fixed;
top:0px;
}
.bge2 {
-webkit-transform: scaleY(-1);
transform: scaleY(-1);
bottom:0px;
position:fixed;
}
.fullfullcontainer {
margin-left:auto;
margin-right:auto;
position:relative;
width:1660px;
height:1250px;
}
.fullcontainer {
margin-left:auto;
margin-right:auto;
position:relative;
top:30px;
width:1519px;
height:1095px;
}
.maincontainer {
display:inline-block;
position:relative;
left:297px;
width:927px;
}
.titledecor {
margin-left:auto;
margin-right:auto;
width:872px;
height:328px;
position:relative;
z-index:4;
background-image:url('!Media/Index/titlebackdrop.gif');
top:29px;
}
.mainbox {
margin-left:auto;
margin-right:auto;
width:863px;
height:496px;
position:relative;
margin-top:25px;
color:#AA55FF;
background-image:url('!Media/Index/mainpiece.png');
text-align:center;
}
.clownfred {
width:502px;
height:492px;
position:absolute;
top:33px;
left:-30px;
z-index:3;
pointer-events:none;
}
.clownfredspeech {
width:161px;
height:200px;
position:absolute;
top:0px;
left:285px;
background-image:url('!Media/Index/cfredbubble.png');
}
.mainboxdecor {
margin-left:auto;
margin-right:auto;
margin-top:-36px;
margin-bottom:-58px;
width:858px;
height:129px;
position:relative;
z-index:4;
background-image:url('!Media/Index/decorsquiggle.png');
pointer-events:none;
}
.lowerbox {
margin-left:auto;
margin-right:auto;
width:822px;
height:260px;
position:relative;
color:#FFFFFF;
z-index:3;
background-image:url('!Media/Index/updatebox.png');
}
.txtbox {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: auto;
}
.sidebar {
width:324px;
height:100%;
display:inline-block;
position: absolute;
}
.sidebarbox {
margin-left:auto;
margin-right:auto;
position:relative;
width:323px;
height:725px;
top:160px;
background-image:url('!Media/Index/sidebar.png');
}
.sbb2 {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.infobox {
width:266px;
height:283px;
position:relative;
top:-107px;
left:42px;
color:#FFFFFF;
background-image:url('!Media/Index/infobox.png');
text-align:center;
}
.crefebox {
width:301px;
height:313px;
position:relative;
top:-61px;
left:15px;
}
.sotwbox {
width:336px;
height:282px;
position:relative;
top:-126px;
left:78px;
font-size:small;
z-index:2;
}
.sotwjuke {
width:271px;
height:346px;
position:relative;
top:-193px;
left:52px;
background-image:url('!Media/Index/jukeboxsotw.png');
animation:wiggle 3s ease-in-out infinite;
animation-timing-function: steps(1, end);
}
.advertdecor {
width:266px;
height:250px;
position:relative;
top:175px;
left:60px;
text-align:center;
z-index:4;
background-color:#000055;
color:#FFF;
display:inline-block;
}
.decorslime {
width:371px;
height:335px;
position:relative;
top:93px;
left:-63px;
z-index:-1;
background-image:url('!Media/Index/decorslime.png');
}
@keyframes wiggle {
0% {
transform:rotate(0deg) scaleX(-1) scaleY(1);
}
25% {
transform:rotate(-2deg) scaleX(-1) scaleY(0.96);
}
50% {
transform:rotate(0deg) scaleX(-1) scaleY(1);
}
75% {
transform:rotate(2deg) scaleX(-1) scaleY(0.96);
}
100% {
transform:rotate(0deg) scaleX(-1) scaleY(1);
}
}
ul {
list-style-type:none;
padding:0px;
}
a {
color:#FFFFFF;
}