.green {
	color:#22FF22;
}
.red {
	color:#FF2222;
}

.map {
	border-spacing: 1px;
	background-size: 100%;
	background-image: url(../images/OverlayTile10.png);
	background-color: #F5FBFE;
}
.map div {
	border: 0px solid #000;
	border-radius:14%;
	padding: 0px;
	margin: 0px;
	background-size: 100%;
	transition:background-color .4s;
	-webkit-transition:background-color .4s;
	-o-transition:background-color .4s;
	-moz-transition:background-color .4s;
}
.map .w1,
.map .w {
	background-image:	url(../images/OverlayTileFaceted50b.png);
	background-size: 100%;
	transition:background-color 0.6s ease-out;
	-webkit-transition:background-color 0.6s ease-out;
	-o-transition:background-color 0.6s ease-out;
	-moz-transition:background-color 0.6s ease-out;
}
.map .w1:hover,
.map .w:hover {
	background-image: url(../images/OverlayTileFaceted30.png);
}

.map .o1,
.map .o {
	background-image: url(../images/OverlayTile10.png);
	background-color: #F5FBFE;
}
.map .p1,
.map .p {
	background-image: url(../images/PathableOnly1.png);
	background-color: #FFFFEE;
}
.map .r1,
.map .r {
	background-image: url(../images/OverlayTileFaceted50b.png);
	background-color: #b85555;
}
.map .r2 {
	background-color: #CCCCCC;
	background-image: url(../images/OverlayTileFaceted50b.png);
}
.map .r3 {
	background-color: #334;
	border-radius:0px;
}
.map .s1,
.map .s {
	background-image: url(../images/OverlayStart50b.png);
	background-color: #fbfefb;
}
.map .s2 {
	background-image: url(../images/OverlayStart2.png);
	background-color: #fbfefb;
}
.map .f1,
.map .f {
	background-image: url(../images/OverlayFinish50c.png);
	background-color: #666;
}
.map .x1,
.map .x {
	background-image: url(../images/PathxRock1.png);
	background-color: #fff;
}
.map .x2 {
	background-image: url(../images/PathxRock2.png);
	background-color: #fff;
}

.map .z1 {
	background-image: url(../images/paths/Path1-1.png);
	background-color: #11E;
}
.map .z2 {
	background-image: url(../images/paths/Path1-2.png);
	background-color: #11E;
}
.map .z3 {
	background-image: url(../images/paths/Path1-3.png);
	background-color: #11E;
}
.map .z4 {
	background-image: url(../images/paths/Path1-4.png);
	background-color: #11E;
}
/* ICE MECHANIC */
.map .z5 {
	background-image: url(../images/PathableOnly1.png);
	background-color: #4ff;
}
.map .z6 {
	background-image: url(../images/PathableOnly1.png);
	background-color: #ff4;
}

/* CHECKPOINTS Andalus */
.map .c1,
.map .c {
	background-image: url(../images/wp/Andalus/Waypoints_A.png);
	background-color: #F777FF;
}
.map .c2 {
	background-image: url(../images/wp/Andalus/Waypoints_B.png);
	background-color: #FFFF11;
}
.map .c3 {
	background-image: url(../images/wp/Andalus/Waypoints_C.png);
	background-color: #FF4466;
}
.map .c4 {
	background-image: url(../images/wp/Andalus/Waypoints_D.png);
	background-color: #ff9911;
}
.map .c5 {
	background-image: url(../images/wp/Andalus/Waypoints_E.png);
	background-color: #00FFFF;
}
.map .c6 {
	background-image: url(../images/wp/Andalus/Waypoints_F.png);
	background-color: #a12ec4;
}
.map .c7 {
	background-image: url(../images/wp/Andalus/Waypoints_G.png);
	background-color: #46c0a0;
}
.map .c8 {
	background-image: url(../images/wp/Andalus/Waypoints_H.png);
	background-color: #33ff33;
}
.map .c9 {
	background-image: url(../images/wp/Andalus/Waypoints_I.png);
	background-color: #f032e6;
}
.map .c10 {
	background-image: url(../images/wp/Andalus/Waypoints_J.png);
	background-color: #d2f53c;
}
.map .c11 {
	background-image: url(../images/wp/Andalus/Waypoints_K.png);
	background-color: #fabebe;
}
.map .c12 {
	background-image: url(../images/wp/Andalus/Waypoints_L.png);
	background-color: #9090f4;
}
.map .c13 {
	background-image: url(../images/wp/Andalus/Waypoints_M.png);
	background-color: #e6beff;
}
.map .c14 {
	background-image: url(../images/wp/Andalus/Waypoints_N.png);
	background-color: #aa6e28;
}
.map .c15 {
	background-image: url(../images/wp/Andalus/Waypoints_O.png);
	background-color: #fffac8;
}



/* CHECKPOINTS VinerHandITC */
/*
.map .c1,
.map .c {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_A.png);
	background-color: #e6194b;
}
.map .c2 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_B.png);
	background-color: #3cb44b;
}
.map .c3 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_C.png);
	background-color: #ffe119;
}
.map .c4 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_D.png);
	background-color: #0082c8;
}
.map .c5 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_E.png);
	background-color: #f58231;
}
.map .c6 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_F.png);
	background-color: #911eb4;
}
.map .c7 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_G.png);
	background-color: #46f0f0;
}
.map .c8 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_H.png);
	background-color: #911eb4;
}
.map .c9 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_I.png);
	background-color: #f032e6;
}
.map .c10 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_J.png);
	background-color: #d2f53c;
}
.map .c11 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_K.png);
	background-color: #fabebe;
}
.map .c12 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_L.png);
	background-color: #008080;
}
.map .c13 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_M.png);
	background-color: #e6beff;
}
.map .c14 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_N.png);
	background-color: #aa6e28;
}
.map .c15 {
	background-image: url(../images/wp/Waypoints_VinerHandITC/Waypoints_O.png);
	background-color: #fffac8;
}
 */

/* TELEPORTS */
.map .t1,
.map .t {
	background-image: url(../images/TeleportInW.png);
	background-color: #3377AA;
}
.map .t2 {
	background-image: url(../images/TeleportIn.png);
	background-color: #44EE66;
}
.map .t3 {
	background-image: url(../images/TeleportInW.png);
	background-color: #CC5544;
}
.map .t4 {
	background-image: url(../images/TeleportIn.png);
	background-color: #55CCFF;
}
.map .t5 {
	background-image: url(../images/TeleportInW.png);
	background-color: #005533;
}
.map .t6 {
	background-image: url(../images/TeleportIn.png);
	background-color: #FFF;
}
.map .t7 {
	background-image: url(../images/TeleportInW.png);
	background-color: #000;
}
.map .u1,
.map .u {
	background-image: url(../images/TeleportOutW.png);
	background-color: #3377AA;
}
.map .u2 {
	background-image: url(../images/TeleportOut.png);
	background-color: #44EE66;
}
.map .u3 {
	background-image: url(../images/TeleportOutW.png);
	background-color: #CC5544;
}
.map .u4 {
	background-image: url(../images/TeleportOut.png);
	background-color: #55CCFF;
}
.map .u5 {
	background-image: url(../images/TeleportOutW.png);
	background-color: #005533;
}
.map .u6 {
	background-image: url(../images/TeleportOut.png);
	background-color: #FFF;
}
.map .u7 {
	background-image: url(../images/TeleportOutW.png);
	background-color: #000;
}
/* PATHING */
.transition {
	width:100%;
	height:100%;
	transition:background-color .5s ease-out;
	-webkit-transition:background-color .5s ease-out;
	-o-transition:background-color .5s ease-out;
	-moz-transition:background-color .5s ease-out;
}
.map .path0-1 {
	background-image: url(../images/paths/Arrow1.png);
	border-radius:0px;
}
.map .path0-2 {
	background-image: url(../images/paths/Arrow2.png);
	border-radius:0px;
}
.map .path0-3 {
	background-image: url(../images/paths/Arrow3.png);
	border-radius:0px;
}
.map  .path0-4 {
	background-image: url(../images/paths/Arrow4.png);
	border-radius:0px;
}
.map .path1-1 {
	background-image: url(../images/paths/Path2-1.png);
	border-radius:0px;
}
.map .path1-2 {
	background-image: url(../images/paths/Path2-2.png);
	border-radius:0px;
}
.map .path1-3 {
	background-image: url(../images/paths/Path2-3.png);
	border-radius:0px;
}
.map .path1-4 {
	background-image: url(../images/paths/Path2-4.png);
	border-radius:0px;
}

.map .child {
	width:100%;
	height:100%;
	position:relative;
	display:inline-block;
	background-size:100%;
}


.playable .o1,
.playable .o
{
	background-image: url(../images/OverlayTile10.png);
	background-color: #F5FBFE;
	transition:background-color .3s;
	-webkit-transition:background-color .3s;
	-o-transition:background-color .3s;
	-moz-transition:background-color .3s;
}
.playable .o :hover,
.playable .o1 :hover
{
	background-image: url(../images/OverlayTileFaceted20.png);
}

.tileDisplay div {
	float:left;
	border:1px solid blue;
	margin:2px;
	width:36px;
	height:36px;
}

/* grid stuff */



.mapMute {
	display:inline-block;
	width:17px;
	height:17px;
	background-size: 100%;
	position: relative;
    top: 5px;
	margin-right: 5px;
	border-radius:5px;

	transition:background-color 0.6s ease-out;
	-webkit-transition:background-color 0.6s ease-out;
	-o-transition:background-color 0.6s ease-out;
	-moz-transition:background-color 0.6s ease-out;
}
.mapMute_true {
	background-image:	url(../images/Mute.png);
	background-color: transparent;
}
.mapMute_false {
	background-image:	url(../images/Sound.png);
	background-color: transparent;
}
.mapMute_false:hover {
	background-color:#000;
}
.mapMute_true:hover {
	background-color:#CC0;
}


.grid_dsp_data {
	padding:1px;
	font-weight:bold;
}

.grid_outer {
	position:relative;
	padding: 2px 3px 3px;
	margin: 0 auto 2px;
	background-color: #334;
	border-radius: 2px;
	box-shadow: 0 0 2px #777;
}
.grid_outer a {
	color: #FFFF33;
}

.dsp_60 {
	width:60%;
}
.dsp_49 {
	width:49%;
}
.dsp_33 {
	width:32%;
}
.dsp_24 {
	width:23%;
}
.dsp_16 {
	width:16%;
}

.grid_dsp_left,
.grid_dsp_mid,
.grid_dsp_right {
	overflow: hidden;
	white-space: nowrap;
	position: relative;
	float: left;
	padding:0px;
	color: #FFFFFF;
}
.grid_dsp_left {
	text-align:left;
}
.grid_dsp_mid {
	text-align:center;
}
.grid_dsp_right {
	text-align:right;
}

.grid_inner {
	border-spacing: 0px;
	padding: 0px;
	margin: 0px;
	border: 0px;
/*
	width: 35px;
	height: 35px;
 */
}
.grid_table
{
	position:relative;
	padding: 0px;
	margin-top:1px;
	margin-bottom:1px;
	margin-left:auto;
	margin-right:auto;
	border-top: 0px solid #000;
	border-left: 0px solid #000;
	border: 1px solid #000;
	border-spacing: 0px;
}
.grid_table td, .grid_table th {
	padding: 0px;
	margin: 0px;
}
/* TODO: Depreciate this completely .. */
.grid_td,
.grid_td_rocks, .grid_td_gray, .grid_td_path, .grid_td_blanks, .grid_td_walls,
.grid_td_start, .grid_td_startB, .grid_td_finish,
.grid_td_cpa, .grid_td_cpb, .grid_td_cpc,
.grid_td_cpd, .grid_td_cpe,
.grid_td_animate, .grid_td_animate_pre,
.grid_td_tp1_in, .grid_td_tp2_in, .grid_td_tp3_in, .grid_td_tp4_in, .grid_td_tp5_in,
.grid_td_tp1_out, .grid_td_tp2_out, .grid_td_tp3_out, .grid_td_tp4_out,.grid_td_tp5_out,
.grid_td_path0-1 , .grid_td_path0-2, .grid_td_path0-3, .grid_td_path0-4,
.grid_td_path1-1 , .grid_td_path1-2, .grid_td_path1-3, .grid_td_path1-4,
.grid_td_rockxpath1, .grid_td_rockxpath2
{
	border-radius:14%;
	padding: 0px;
	margin: 0px;
	border: 0px;
	width: 35px;
	height: 35px;
	line-height:3px;
	background-image: url(../images/OverlayTileFaceted50b.png);
	background-size: 100%;
	transition:background-color .3s;
	-webkit-transition:background-color .3s;
	-o-transition:background-color .3s;
	-moz-transition:background-color .3s;
}
.grid_td
{
	background: #F5FBFE url(../images/OverlayTile10.png);
	transition:background-color .3s;
	-webkit-transition:background-color .3s;
	-o-transition:background-color .3s;
	-moz-transition:background-color .3s;
}
.grid_td:hover
{
	background: #CCCCCC url(../images/OverlayTileFaceted20.png);
}
.grid_td:click
{
	background: #CCCCCC url(../images/OverlayTileFaceted20.png);
	transition:background-color 0s;
	-webkit-transition:background-color .5s;
	-o-transition:background-color 0s;
	-moz-transition:background-color 0s;
}
.grid_td_pressed {
	background: #111122;
}

.grid_td_tp1_in, .grid_td_tp2_in, .grid_td_tp3_in, .grid_td_tp4_in, .grid_td_tp5_in,
.grid_td_tp1_out, .grid_td_tp2_out,.grid_td_tp3_out, .grid_td_tp4_out,.grid_td_tp5_out,
.grid_td_cpa, .grid_td_cpb, .grid_td_cpc, .grid_td_cpd, .grid_td_cpe
{
	transition:background-color 2s;
	-webkit-transition:background-color2s;
	-o-transition:background-color 2s;
	-moz-transition:background-color 2s;
}

.no_transition {
	transition:background-color 0s;
	-webkit-transition:background-color 0s;
	-o-transition:background-color 0s;
	-moz-transition:background-color 0s;
}


.mapdisplay, .mapdisplay_up
{
	position:absolute;
	width:auto;
	height:auto;
	box-shadow: 10px 10px 5px #000055; /* Opera */
	-webkit-box-shadow: 10px 10px 5px #000055; /* Safari and Chrome */

	-webkit-transform:
		skew(10deg,10deg)
		scale(.3, .3)
		translate(-390px, -230px)
		rotate(1deg)
		rotateX(0deg)
	;
	-moz-transform:
		skew(10deg,10deg)
		scale(.3, .3)
		translate(-390px, -230px)
		rotate(1deg)
		rotateX(0deg)
	;
	/* Remember, we need to duplicate all of this with prefix -o- and w/o prefix for opera, ff, netscape. */
	-webkit-transition:-webkit-transform 2s;
	-webkit-transition-delay: 0s;
	-moz-transition:-webkit-transform 2s;
	-moz-transition-delay: 0s;
	z-index:1;
}
.mapdisplay_up
{

	-webkit-transform:
		skew(0deg,0deg)
		scale(1, 1)
		translate(0px, 0px)
		rotate(0deg)
		rotateX(0deg)
	;
	-moz-transform:
		skew(0deg,0deg)
		scale(1, 1)
		translate(0px, 0px)
		rotate(0deg)
		rotateX(0deg)
	;
	-webkit-transition:-webkit-transform 1s;
	-moz-transition:-webkit-transform 1s;
	z-index:2;
}
.mapdisplay_up:hover {
	background:#10e;
}
.mapdisplay:hover  {
	z-index:3;
	background:#10e;
}

.mapgallery
{
	position:relative;
	float: left;
	width:auto;
	height:700px;
	background: #110088;
	color: #FFF;
}
.mapgallery a
{
	color: #FFFF33;
}


.mapcontainer
{
	border:1px solid #000;
	position:relative;
	float: left;
	width:300px;
	height:200px;
	background: #220099;
}
.clear { clear: both;}