@charset "utf-8";

/* Main formatting for Plane*/

	body{
		background-color:#fff;
	}
	
	.container{
		background-image:url(map.jpg);
		width:945px;
		height:730px;
	}
	
	.title{
		color:#369;
		font:Georgia, "Times New Roman", Times, serif;
		font-size:50px;
		font-weight:bold;
		text-align:left;
		padding:15px;
		padding-top:15px;
		margin-top:15px;
		width:500px;
		height:100px;
	}

/* Hotspot Buttons */

	.button-bikecenter {
	position:absolute;
	left:417px;
	top: 469px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-bikecenter:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-bikecenter:hover:after {
	content:attr(title);
	}
	
	.button-dragonhime{
	position:absolute;
	left:550px;
	top: 675px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-dragonhime:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-dragonhima:hover:after {
	 content:attr(title);
	}

	.button-nambanbashi{
	position:absolute;
	left:549px;
	top: 529px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-nambanbashi:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-nambanbashi:hover:after {
	 content:attr(title);
	}
	
	.button-nanshuji{
	position:absolute;
	left:867px;
	top: 228px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-nanshuji:hover {
 	 width: 65px;
 	 height: 65px;
	}
	 
	 .button-nanshuji:hover:after{
	 content:attr(title);
	}
	
	.button-phoenixstatue{
	position:absolute;
	left:440px;
	top: 508px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-phoenixstatue:hover {
 	 width: 65px;
 	 height: 65px;
	}
	 
	 .button-phoenixstatue:hover:after {
	 content:attr(title);
	}
	
	.button-sakailighthouse{
	position:absolute;
	left:631px;
	top: 671px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-sakailighthouse:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-sakailighthouse:hover:after {
	 content:attr(title);
	}
	
	.button-sakaiport{
	position:absolute;
	left:567px;
	top: 640px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-sakaiport:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-sakaiport:hover:after {
	 content:attr(title);
	}
	
	.button-sakaistation{
	position:absolute;
	left:489px;
	top: 533px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-sakaistation:hover {
 	 width: 65px;
 	 height: 65px;
	}
	 
	 .button-sakaistation:hover:after {
	 content:attr(title);
	}
	
	.button-sakura{
	position:absolute;
	left:244px;
	top: 435px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-sakura:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-sakura:hover:after {
	 content:attr(title);
	}
	
	.button-startpoint{
	position:absolute;
	left:525px;
	top: 506px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-startpoint:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-startpoint:hover:after {
	 content:attr(title);
	}
	
	.button-tramway{
	position:absolute;
	left:291px;
	top: 296px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-tramway:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-tramway:hover:after {
	 content:attr(title);
	}
	
	.button-willowtree{
	position:absolute;
	left:509px;
	top: 369px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-willowtree:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-willowtree:hover:after {
	 content:attr(title);
	}
	
	.button-xavier{
	position:absolute;
	left:384px;
	top: 339px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-xavier:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-xavier:hover:after {
	 content:attr(title);
	}
	
	.button-yamaguchi{
	position:absolute;
	left:154px;
	top: 246px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-yamaguchi:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-yamaguchi:hover:after {
	 content:attr(title);
	}
	
	.button-yosanoakiko{
	position:absolute;
	left:488px;
	top: 500px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-yosanoakiko:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-yosanoakiko:hover:after {
	 content:attr(title);
	}
	
	.button-tsukishujrhs{
	position:absolute;
	left:309px;
	top: 460px;
	height: 40px;
	width: 40px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
	}
 
 	.button-tsukishujrhs:hover {
 	 width: 65px;
 	 height: 65px;
	}
	
	.button-tsuskishujrhs:hover:after {
	 content:attr(title);
	}
	
	.credits{
	position:absolute;
	width:429px;
	height:42px;
	left:19px;
	top:695px;
	}

	/*Masking Links*/
	
	#testdiv {width:750px; margin:0px auto; border:1px solid #ccc; padding:20px 25px 12px; background:#fff}
	.tbox {position:absolute; display:none; padding:14px 17px; z-index:900}
	.tinner {padding:15px; -moz-border-radius:5px; border-radius:5px; background:#fff url(preload.gif) no-repeat 50% 50%; border-right:1px solid #333; border-bottom:1px solid #333}
	.tmask {position:absolute; display:none; top:0px; left:0px; height:100%; width:100%; background:#000; z-index:800}
	.tclose {position:absolute; top:0px; right:0px; width:30px; height:30px; cursor:pointer; background:url(close.png) no-repeat}
	.tclose:hover {background-position:0 -30px}

	#error {background:#ff6969; color:#fff; text-shadow:1px 1px #cf5454; border-right:1px solid #000; border-bottom:1px solid #000; padding:0}
	#error .tcontent {padding:10px 14px 11px; border:1px solid #ffb8b8; -moz-border-radius:5px; border-radius:5px}
	#success {background:#2ea125; color:#fff; text-shadow:1px 1px #1b6116; border-right:1px solid #000; border-bottom:1px solid #000; padding:10; -moz-border-radius:0; border-radius:0}
	#bluemask {background:#F3EDD8}
	#frameless {padding:0}
	#frameless .tclose {left:6px}