@charset "UTF-8";
/* CSS Document */
html,body{
	width:100%;
	height:100%;
}

body{
	margin:0;
	position:relative;
	overflow:auto;
	color:#eee;
}


img{
	border:0;
}

#main-image{
	position:fixed;
	top:0;
	left:0;
	width:100%;
}

#info{
	position:absolute;
	top:0;
	left:4%;
	padding-top:18%;
/*	top:175px;
	left:35px;*/
	width:50%;
	font-size:14px;
	color:#FFF;
	line-height:1.5;
	
	font-size:12px\9;
	line-height:1.4\9;	
	width:52%\9;
}

#info #detail{
	padding:8px;
	margin-bottom:10px;
}

#info #detail .name{
	width:50%;
	max-width:200px;
}


#info .gi{
	background-image:url(../images/characters/detail-bg-gi.png);
}

#info .go{
	background-image:url(../images/characters/detail-bg-go.png);
}

#info .shoku{
	background-image:url(../images/characters/detail-bg-shoku.png);
}


#info .shin{
	background-image:url(../images/characters/detail-bg-shin.png);
}


#info .other{
	background-image:url(../images/characters/detail-bg-other.png);
}


#info #detail .name{
	margin-bottom:7px;
}


#info #detail hr{
	border:1px #666 dotted;
	border-width:1px 0 0 0;
	margin:5px auto;
}

table{
	background:none;
	border-collapse:collapse;
	display:block;
}

table th,
table td{
	padding:1px;
}

table th{ font-weight:normal; text-align:left;width:70px;}

#button img{
	width:25%;
	max-width:109px;
}


#playmovie{
	/*display:none;*/
	position:absolute;
	top:0;
	left:4%;
	width:500px;
	padding-top:18%;
}

#playmovie iframe{
	border:1px #555 solid;
}

#playmovie img{
	margin-top:5px;
}


/*---CUSTOM----*/
#soundmanager-debug-toggle{
	/*display:none;*/
}

/*#sm2-container{
	z-index:auto !important;
	top:0px !important;
	left:0px !important;
	width:200px !important;
	height:200px !important;
}
*/


@media screen and (max-height:500px){
	
	#info{
		font-size:10px !important;
		line-height:1.3 !important;
		width:55% !important;
	}

}


