html
{
	font-family: Calibri, Helvetica, Arial;
}

code
{
	font-family: Consolas;
	color: #7f7f3f;
	background: #ffffef;
}

div
{
	background: #ffffff;
}

li
{
}

.z0
{
	background: #ffffff;
	z-index: 0;
}

.z1
{
	background: #ffafaf;
	z-index: 1;
}

.z2
{
	background: #ffffaf;
	z-index: 2;
}

.z3
{
	background: #afffaf;
	z-index: 3;
}

.z4
{
	background: #afffff;
	z-index: 4;
}

.z5
{
	background: #afafff;
	z-index: 5;
}

.z6
{
	background: #ffafff;
	z-index: 6;
}

.container
{
	margin-left: 20px;
}



/* Test 1 */
#test1
{
}

#test1 .container
{
	height: 180px;
}

#test1 .parent
{
	position: absolute;
	text-align: right;
}

#test1 .child
{
	width: 98px;
	height: 98px;
	position: absolute;
	border: 1px solid #000000;
}

#test1 .c1
{
	left: 10px;
	top: 10px;
}

#test1 .c2
{
	left: 30px;
	top: 30px;
}

#test1 .c3
{
	left: 50px;
	top: 50px;
}

#test1 .c4
{
	left: 70px;
	top: 70px;
}


/* Test 2 */
#test2
{
}

#test2 .container
{
	height: 180px;
}

#test2 .parent
{
	position: absolute;
	text-align: right;
}

#test2 .child
{
	width: 98px;
	height: 98px;
	position: absolute;
	border: 1px solid #000000;
}

#test2 .c1
{
	left: 10px;
	top: 10px;
}

#test2 .c2
{
	left: 30px;
	top: 30px;
}

#test2 .c3
{
	left: 50px;
	top: 50px;
}

#test2 .c4
{
	left: 70px;
	top: 70px;
}

/* Test 3 */
#test3
{
}

#test3 .container
{
	position: relative;
	height: 200px;
}

#test3 .parent
{
	border: 1px solid #000000;
	position: absolute;
	text-align: right;
	width: 138px;
	height: 138px;
}

#test3 .a
{
	left: 10px;
	top: 10px;
}

#test3 .b
{
	left: 50px;
	top: 50px;
}

#test3 .child
{
	width: 98px;
	height: 98px;
	position: absolute;
	border: 1px solid #000000;
}

#test3 .a1
{
	left: 9px;
	top: 9px;
}

#test3 .a2
{
	left: 29px;
	top: 29px;
}

#test3 .b1
{
	left: 9px;
	top: 9px;
}

#test3 .b2
{
	left: 29px;
	top: 29px;
}

/* Test 4 */
#test4
{
}

#test4 .container
{
	position: relative;
	height: 200px;
}

#test4 .parent
{
	border: 1px solid #000000;
	position: absolute;
	text-align: right;
	width: 138px;
	height: 138px;
}

#test4 .a
{
	left: 10px;
	top: 10px;
}

#test4 .b
{
	left: 50px;
	top: 50px;
}

#test4 .child
{
	width: 98px;
	height: 98px;
	position: absolute;
	border: 1px solid #000000;
}

#test4 .a1
{
	left: 9px;
	top: 9px;
}

#test4 .a2
{
	left: 29px;
	top: 29px;
}

#test4 .b1
{
	left: 9px;
	top: 9px;
}

#test4 .b2
{
	left: 29px;
	top: 29px;
}

/* Test 4 */
#test5
{
}

#test5 .container
{
	position: relative;
	height: 200px;
}

#test5 .parent
{
	border: 1px solid #000000;
	position: absolute;
	text-align: right;
	width: 138px;
	height: 138px;
}

#test5 .a
{
	left: 10px;
	top: 10px;
}

#test5 .b
{
	left: 50px;
	top: 50px;
}

#test5 .child
{
	width: 98px;
	height: 98px;
	position: absolute;
	border: 1px solid #000000;
}

#test5 .a1
{
	left: 9px;
	top: 9px;
}

#test5 .a2
{
	left: 29px;
	top: 29px;
}

#test5 .b1
{
	left: 9px;
	top: 9px;
}

#test5 .b2
{
	left: 29px;
	top: 29px;
}
