* {
	max-width: 100%;
}
html, body {

	margin: 0;
	padding: 0;
	width: 100vw;
	min-height: 100vh;
	background-color: #cccccc;
	background-image: linear-gradient(180deg, #ffffff, #cccccc);
	background-position: 0 0;
	background-size: 100vw 100vh;
	background-repeat: no-repeat;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
}

h1 {
	text-align: center;
}

.TXT_C {
	text-align: center;
}

.FNT_B {
	font-weight: bold;
}

.ROW_New {
	clear: both;
}

.BOX_Pad {
	padding: 1rem;
}


.BTN_Action {
	display: inline-block;
	margin: .25rem .5rem;
	padding: .25rem .5rem;
	border: none;
	border-radius: .5rem;
	background-color: #cc6600;
	color: #ffffff;
	font-size: 1rem;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}
	.BTN_Action:hover {
		background-color: #993300;
		color: #ffffff;
	}

	

#BOX_Roots, #BOX_Branches {
	float: left;
	padding: 10px;
	width: calc(37% - 20px);
}
	#BOX_Roots a, #BOX_Branches a {
		float: left;
		position: relative;
		width: calc(14.28% - 2px);
		height: auto;
		background-color: #ffffff;
		background-image: url(../IMG/Sleeper.png);
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
	}
	#BOX_Roots a {
		border: 1px solid #cccccc;
	}
	#BOX_Branches a {
		border: 1px solid #ccffcc;
	}
	#BOX_Roots a:hover, #BOX_Roots a.Active {
		background-color: #cccccc;
	}
	#BOX_Branches a:hover, #BOX_Branches a.Active {
		background-color: #ccffcc;
	}
	#BOX_Roots a img, #BOX_Branches a img {
		width: calc(100% - 10px);
		padding: 5px;
	}
	#BOX_Roots a b, #BOX_Branches a b {
		position: absolute;
		left: 0;
		bottom: 0;
		width: calc(100% - 10px);
		padding: 5px;
		background-color: rgba(128, 128, 128, .25);
		color: #000000;
		text-decoration: none;
		text-align: center;
		font-size: 50%;
		font-weight: bold;
	}

	
#BOX_Playground {
	float: left;
	width: 26%;
}
	#BOX_Bed {
 		float: left;
 		position: relative;
 		width: 100%;
 		background-color: #eeeeff;
	}
	#BOX_Bed.Flip {
		-webkit-transform: scaleX(-1);
		transform: scaleX(-1);
	}
	#IMG_Sleeper {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
	}
	#IMG_Branch {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 2;
	}
	#LAB_SSAP {
		position: absolute;
		left: 0;
		top: 0;
		width: calc(100% - 10px);
		padding: 5px;
		background-color: rgba(128, 128, 128, .25);
		color: #000000;
		text-decoration: none;
		text-align: center;
		font-size: 200%;
		font-weight: bold;
		z-index: 1;
	}
	#LAB_Root, #LAB_Branch {
		display: inline;
	}
	
	

	
@media (orientation: portrait){
	#BOX_Roots, #BOX_Branches, #BOX_Playground {
		padding: 20px 0;
		width: 100%;
	}
}