@charset "utf-8";
/* CSS Document */

html, body {
	margin: 0;
	padding: 0;
	height: 100%;
	background-color: #000;
}

/* heiro frame */

.frame-corner {
	width: 55px;
	height: 55px;
	position: fixed;
}

.frame-vert {
	width: 50px;
	top: 0;
	bottom: 0;
	position: fixed;
}

.frame-horz {
	left: 0;
	right: 0;
	height: 50px;
	position: fixed;
}

#frame-tl {
	left: 0;
	top: 0;
	z-index: 400;
	background-image:url(../img/corner_tl.gif);
}

#frame-bl {
	left: 0;
	bottom: 0;
	z-index: 402;
	background-image:url(../img/corner_bl.gif);
}

#frame-tr {
	right: 0;
	top: 0;
	z-index: 404;
	background-image:url(../img/corner_tr.gif);
}

#frame-br {
	right: 0;
	bottom: 0;
	z-index: 406;
	background-image:url(../img/corner_br.gif);
}

#frame-t {
	top: 0;
	z-index: 300;
	background-image:url(../img/top_tile_1.gif);
}

#frame-b {
	bottom: 0;
	z-index: 302;
	background-image:url(../img/top_tile_2.gif);
}

#frame-r {
	top: 0;
	right: 0;
	z-index: 304;
	background-image:url(../img/side_tile_1.gif);
}

#frame-l {
	top: 0;
	left: 0;
	z-index: 306;
	background-image:url(../img/side_tile_2.gif);
}

/* content layout */

#bd {
	position: absolute;
	top: 170px;
	bottom: 50px;
	left: 50px;
	right: 50px;
	z-index: 100;
}

#myFrame {
	width: 100%;
	height: 100%;
	border: none;
}

#hd {
	position: absolute;
	top: 50px;
	height: 120px;
	left: 50px;
	right: 50px;
	z-index: 200;
}

#nav {
	width: 800px;
	height: 120px;
	margin: 0 auto;
}