DIR : /home/kozerus/public_html/jkwii/js/jsdoit/jsdoit12/style.css

/home/kozerus/public_html/jkwii/js/jsdoit/jsdoit12

html, body, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p,
header, hgroup, section, article, aside, hgroup, footer, figure, figcaption, nav {
    position: relative;
    margin: 0;
    padding: 0;
    font-size: 100%;
    font-weight: normal;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-family: 'Spicy Rice', cursive;
	font-size: 48px;
	color:#F00;
}
ul, ol, dl, li, dt, dd{
    list-style: none;
}
body {
    position: relative;
    line-height: 1.0;
    background-color: #a6a6a6;
    text-align: center;
    -webkit-transform: scale(0.5,0.5);
    -webkit-text-size-adjust: none;
    width: 320px;
    height:0;
}

#cube {
	display:block;
	position:relative;
	margin:0px auto;
	width:640px;
	height:960px;
	-webkit-transform-style: preserve-3d;
	-webkit-transform: rotateX(0) rotateY(180deg) rotateZ(0);
	-webkit-transition:all 500ms ease-in-out;
	/*
	opacity:0;
	//*/
}
#cube1 {
	position:relative;
	width:640px;
	height:960px;
	overflow:hidden;
	-webkit-transform: rotateY(180deg) translateZ(320px);
}
#cube2,
#cube3,
#cube4 {
	position:absolute;
	left:0px;
	top:0px;
	width:640px;
	height:960px;
	overflow:hidden;
	-webkit-transform: rotateY(270deg) translateZ(320px);
	-webkit-transition:all 500ms ease-in-out;
}
#cube2 {
	display:none;
	background:#F69600;
}
#cube3 {
	background:#072A4E;
	display:none;
	-webkit-transform: rotateY(0deg) translateZ(320px);
}
#cube4 {
	background:#072A4E;
	display:none;
	-webkit-transform: rotateY(90deg) translateZ(320px);
}
#cloud1,#cloud2,#cloud3,#cloud4,#cloud5,#cloud6,#cloud7,#cloud8 {
	position:absolute;
	opacity:0;
}
#cloud1 {left:0px;	 top:18px;}
#cloud2 {left:476px; top:146px;}
#cloud3 {left:559px; top:144px}
#cloud4 {left:415px; top:321px;}
#cloud5 {left:-100px;top:166px;}
#cloud6 {left:-22px; top:315px;}
#cloud7 {left:-53px; top:426px;}
#cloud8 {left:399px; top:503px;}
#bg1 {
	position:absolute;
	left:0px;
	bottom:-59px;
	width:640px;
	height:209px;
	opacity:0;
	-webkit-transition:all 1500ms ease-in-out;
}
#bg2 {
	position:absolute;
	left:0px;
	top:0px;
}

#cube_h,
#cube_a {
	position:absolute;
	left:0px;
	top:0px;
	width:640px;
	height:480px;
	overflow:hidden;
	opacity:0;
	-webkit-transform-style: preserve-3d;
}
#cube_a {
	top:480px;
}

#cube_h1,
#cube_h2,
#cube_h3,
#cube_h4,
#cube_a1,
#cube_a2,
#cube_a3,
#cube_a4 {
	position:absolute;
	left:0px;
	top:0px;
	width:640px;
	height:960px;
	-webkit-transform-style: preserve-3d;
}
#cube_h1 {-webkit-transform: rotateY(180deg) translateZ(320px); background:#F69600;}
#cube_h2 {-webkit-transform: rotateY(270deg) translateZ(320px); background:#F69600;}
#cube_h3 {-webkit-transform: rotateY(0deg) translateZ(320px); background:#072A4E;}
#cube_h4 {-webkit-transform: rotateY(90deg) translateZ(320px); background:#F69600;}
#cube_a1 {-webkit-transform: rotateY(0deg) translateZ(320px); background:#072A4E;}
#cube_a2 {-webkit-transform: rotateY(90deg) translateZ(320px); background:#072A4E;}
#cube_a3 {-webkit-transform: rotateY(180deg) translateZ(320px); background:#072A4E; opacity:0;}
#cube_a4 {-webkit-transform: rotateY(270deg) translateZ(320px); background:#072A4E;}

#over {
	background:#FFF;
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	z-index:100;
	opacity:0;
}
#home_logo {
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-120px;
	margin-top:-43px;
	-webkit-transition:all 500ms ease-in-out;
	opacity:0;
}

#away_logo {
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-115px;
	margin-top:-76px;
}
#btnStart,
#btnReset {
	position:absolute;
	left:-110px;
    -webkit-transform: scale(2,2);
	top:10px;
}
#btnReset{
	top:60px;
}

#tournament {
	position:absolute;
	left:-75px;
	top:0px;
	width:960px;
	height:640px;
	opacity:0;
	-webkit-transform-style: preserve-3d;
	-webkit-transform: rotateX(100deg) rotateY(-90deg) rotateZ(0deg);
	-webkit-transition:all 800ms ease-in-out;
}
#daihyou,
#shiai {
	position:absolute;
	left:51%;
	top:38%;
	margin-left:-256px;
	margin-top:-264px;
	-webkit-transform: scale(1);
	opacity:0;
	-webkit-transition:all 800ms ease-in-out;
}
#shiai {
	margin-top:-132px;
}
#firework1,
#firework2 {
	position:absolute;
	left:61%;
	top:48%;
	-webkit-transform-style: preserve-3d;
	-webkit-transform: scale(0);
	opacity:1;
	-webkit-transition:all 400ms ease-out;
}
#firework2 {
	left:11%;
	top:38%;
}
#line {
	position:absolute;
	left:0px;
	top:475px;
	height:10px;
	width:0px;
	background:#FFF;
	-webkit-transition:all 300ms ease-in;
}
#text {
	position:absolute;
	left:0px;
	top:0px;
	width:640px;
	height:960px;
	overflow:hidden;
}
#fight {
	position:absolute;
	left:0px;
	top:440px;
	text-align:center;
	width:640px;
	font-size: 80px;
	color:#FFA;
	text-shadow: 2px 2px 4px #000;
	-webkit-transform-style: preserve-3d;
	-webkit-transform: scale(2,2) skewX(90deg);
	-webkit-transition:all 800ms ease-in-out;
}

@-webkit-keyframes home1 {
	0% {-webkit-transform: rotateY(0deg);}
	100% {-webkit-transform: rotateY(720deg);}
}
@-webkit-keyframes home2 {
	0% {-webkit-transform: rotateX(0deg) rotateY(0deg);}
	100% {-webkit-transform: rotateX(720deg) rotateY(360deg);}
}
@-webkit-keyframes home3 {
	0% {-webkit-transform: rotateZ(0deg) scale(1,1); opacity:1;}
	100% {-webkit-transform: rotateZ(-740deg) scale(2,2); opacity:1;}
}
@-webkit-keyframes away1 {
	0% {-webkit-transform: translate( 320px, -100px ) rotateZ(0deg)  scale(1,1);}
	100% {-webkit-transform: translate( 0px, 0px ) rotateZ(-740deg)  scale(2,2);}
}
@-webkit-keyframes over_f {
	0% {opacity:0;}
	20% {opacity:0.7;}
	40% {opacity:0;}
	60% {opacity:0;}
	80% {opacity:0.7;}
	100% {opacity:0;}
}
@-webkit-keyframes over {
	0% {opacity:0;;}
	20% {opacity:1;}
	100% {opacity:0;}
}
@-webkit-keyframes rotate_h {
	0% {-webkit-transform: rotateY(0deg)}
	100% {-webkit-transform: rotateY(900deg)}
}
@-webkit-keyframes rotate_a {
	0% {-webkit-transform: rotateY(0deg)}
	100% {-webkit-transform: rotateY(-720deg)}
}