@charset "UTF-8";
/* CSS Document */
#gameHelp{
		position:absolute;
		font-family:stoke;
		font-size:14px;
		color:#333;
		padding:0px;
		top:0px;
		bottom:0px;
		left:0px;
		right:0px;
		margin:auto;
		visibility:hidden;
		z-index:50;
		pointer-events:none;
	}
	#gameHelpPanel{
		position:absolute;
		font-size:16px;
		color:#333;
		width:560px;
		height:450px;
		top:0px;
		bottom:0px;
		left:0px;
		right:0px;
		margin:auto;
		background-image:url(../img/help/help-screen.png);
		pointer-events:auto;
		
	}
	#helpArrow{
		position:absolute;
		width:100px;
		height:100px;
		left:0px;
		top:0px;
		background-image:url(../img/interface/Help/helpArrows.png);
	}
	#helpBoxOuter{
		position:absolute;
		width:500px;
		height:400px;
		left:28px;
		top:28px;
		pointer-events:none;
		/*background-color:#fffee6;*/
	}
	#helpBoxInner{
		/*position:absolute;
		width:280px;
		height:160px;
		left:8px;
		top:8px;
		border-style:solid;
		border-color:#790000;
		border-width:2px;*/
	}
	#helpHeading{
		text-align:center;
		padding:10px;
		font-size:18px;
		font-weight:bold;
	}
	#helpBody{
		padding:15px;
		padding-right: 25px;
		padding-left:55px;
	}
	#helpPic{
		margin-top:10px;
		margin-right:20px;
		width: 120px;
        height: 240px;
        position: relative;
        display: inline-block;
        float: left;
	}
	.helpPageNum{
		font-family:stoke;
	}
	.prevHelpPage{
		width: 10px;	
		height: 10px;
		position: relative;
		display: inline-block;
		margin: 10px;
		background-image: url(../img/interface/buttons/StarTickCross.png);
		background-size: 180px 20px;
		background-position: -165px -5px;
	}
	.nextHelpPage{
		width: 10px;
		height: 10px;
		position: relative;
		display: inline-block;
		margin: 10px;
		background-image: url(../img/interface/buttons/StarTickCross.png);
		background-size: 180px 20px;
		background-position: -165px -5px;
	}
	.helpDot{
		width: 10px;
		height: 10px;
		position: relative;
		display: inline-block;
		margin: 10px;
		background-image: url(../img/interface/buttons/StarTickCross.png);
		background-size: 180px 20px;
		background-position: -165px -5px;
	}
	.helpDotSelected{
		width: 10px;
		height: 10px;
		position: relative;
		display: inline-block;
		margin: 10px;
		background-image: url(../img/interface/buttons/StarTickCross.png);
		background-size: 180px 20px;
		background-position: -145px -5px;
	}
	#helpDots{
		position:absolute;
		width:auto;
		bottom:20px;
		left:0px;
		right:0px;
		margin:auto;		
	}
	.hintIcon{
		position:absolute;
		bottom: 50px;
		right: 50px;
		width: 30px;
		height: 30px;
		background-image: url(../img/interface/buttons/helpHintIcon.png);
		pointer-events: auto;
		cursor: pointer;
	}
	#panelClose{
		position:absolute;
		bottom: 20px;
		right: 30px;
		width: 45px;
		height: 45px;
		background-image:url(../img/interface/close-btn.png);
		pointer-events: auto;
		cursor: pointer;
	}
	.pathIcon{
			display: inline-block;
			width: 45px;
			float: right;
			margin-right: 10px;
			height: 45px;
			background-image: url(../img/interface/buttons/pathIcon.png);
	}
	.detailsIcon{
		display: inline-block;
		width: 45px;
		float: left;
		margin-left:-18px;
		margin-bottom:16px;
		margin-right: 10px;
		height: 45px;
		background-image: url(../img/interface/buttons/listcon.png);
	}
	.inspectIcon{
		display: inline-block;
		width: 45px;
		float: left;
		margin-left:-18px;
		margin-bottom:16px;
		margin-right: 10px;
		height: 45px;
		background-image: url(../img/interface/buttons/eyecon2.png);
	}
	.compassHelp{
		position: absolute;
		bottom: 7px;
		right: 0px;
		width: 220px;
		height: 220px;
		background-image: url(../img/help/compassHint.png);
	}
	.shipIconHelp{
			width: 90px;
			height: 90px;
			margin-left: 10px;
			margin-bottom: -20px;
			float: right;
			background-image: url(../img/interface/buttons/ship-buttonN.png);
			background-size: 90px;
			position: relative;
			top: -19px;
	}
	.suppliesHelp{
			width: 130px;
			height: 130px;
			bottom: 7px;
			left: 5px;
			opacity: .3;
			position: absolute;
			background-image: url(../img/help/supplies.png);
			background-size: 535%;
			background-position: -50px 0px;
	}