*{
	font-family: Comic Sans MS;
}

.container {
	width: 1480px;
	height: 840px;
	position:absolute;
}

	.header {
		width: 1480px;
		height: 80px;
	}
	
	.title {
		margin-left: 340px;
		width: 400px;
		height: 60px;
		text-align: center;
		background: #f48024;		  
		color: #ffffff;
        font-size: 50px;
		font-weight: bold;
		padding-bottom: 10px;
		border-radius: 10px;		
		display:inline-block;
	}
	
	.top {
		height: 40px;
		display: inline-block;
		text-align: center;
	}

	.leftpanel {
		width: 890px;
		height:630px;
		float: left;
		padding-top: 10px;
	}
	
	.editpanel {
		float: right;
		border-style: ridge;
		border-color: #00ced1;
		border-width: 8px;
		border-collapse:collapse;
		background:#000000;
	}
	
	.editpanel td {
		cursor:pointer;
		width:23px; 
		height:25px;
		text-align:center;
		padding: 0;
	}
	
	.canvasMap {
		width: 254px;
		height: 175px;
		float: center-right;
		cursor: pointer;
		border-style: outset;
		border-color: #FF8C00;
		border-width: 4px;
		background: #000000;
	}
	
	
	.iconbtnpanel {
		width: 120px;
		height: 550px;
		float: left;
		display:block;
		text-align: center;
		padding-top:5px;
	}

	.iconbutton {		
		border: 3px solid black;
		border-radius: 10px;
		width: 90px;
		height: 60px;
		background: black;
		text-align: center;
		margin: 2px 2px;
		cursor: pointer;
	}	
	
	.active, .activeCnvs, .iconbutton:hover {
		border-color: #00FF00;
		outline:none;
	}

	
	.functnbutton{
		box-shadow: 0px 10px 14px -7px #97c4fe;
		background:linear-gradient(to bottom, #79bbff 5%, #378de5 100%);
		background-color:#79bbff;
		border-radius:8px;
		width: 100px;
		height: 40px;
		display:inline-block;
		cursor:pointer;
		color:#ffffff;
		font-size:22px;
		font-weight:bold;
		text-align: center;
		text-decoration:none;
		text-shadow:0px 1px 0px #3d768a;
		border: none;
	}
	
	.functnbutton:hover {
		background:linear-gradient(to bottom, #378de5 5%, #79bbff 100%);
		background-color:#378de5;
		color:#0000cd;
	}
	.functnbutton:active {
		position:relative;
		outline:none;
		top:1px;
	}
	
	.disabled {
		pointer-events: none;
		background: #bcd4e6;
		border: none;
	}

	
	.labels{
		display: inline-block;
		width: auto;
		height: 25px;
		padding: 0px 2px;
		text-align: center;
		font-size: 20px;
	}

	.modal {
		display: block;
		position: fixed;
		z-index: 1; 
		padding-top: 100px;
		left: 0;
		top: 0;
		width: 100%; 
		height: 100%; 
		overflow: auto; 
		background-color: rgb(0,0,0); 
		background-color: rgba(0,0,0,0.4); 
	}
	
	.content-loading {
		border-radius:8px;
		background-color: #ffffe0;
		margin: auto;
		padding:10px;
		width: 500px;
		height: 360px;
		font-size: 30px;
		font-weight: bold;
		color: #0000cd;
		text-align: center;
	}	
	
	.content-link {
		display: none;
		border-radius:8px;
		background-color: #ffffe0;
		margin-left: 30%;
		padding:20px;
		width: 400px;
		height: 200px;
		font-size: 12px;
		color: red;
		text-align: center;
		position: absolute;
		z-index:3;
		display:none;
		border:1px solid red;
		word-wrap:break-word;
	}
	
	
	.btn {		
		background-color:#1B95E0;
		border-radius:4px;
		width: 80px;
		height: 30px;
		display:block;
		cursor:pointer;
		color:#ffffff;
		font-family: Helvetica Neue LT,Helvetica Neue,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;
		font-size:22px;
		text-align: center;
		margin-bottom:10px;
	}
	
	.btn:hover{
		background-color:#C7ABF;
	}
	
	.btn:active{
		outline:none;		
	}
	
	fieldset { 
		border-color: #FF8C00; 
		box-sizing: border-box; 
		width: 580px;
		height: 700px;
		float: right; 
	}
	
	@keyframes blink {
		to { color: red; }
	}
	
	.vertical {
	   width: 15px;
	   height:15px;
	   font-size:18px;
	   text-align:center;
	   transform: rotate(270deg);
	   transform-origin: 0% 40%;
	   display:inline-block;
	}
	
	#fb {		
		width:100px;
		font-size: 24px;
		float:right;
		margin-right:20px;
	}
	
	#lvls {
		width:180px;
		font-size: 24px;
		float:left;
		margin-left:20px;
	}


	

	