/* Finite Arts Master Ming CSS © 2021 Hal Barwood */

/* tags */

body	{ background-color: #222220; }

h1	{ font-family: "Arial", "Helvetica", sans-serif; font-style: italic; font-size: 32px; font-weight: 600; line-height: 32px; white-space: nowrap; 	color: #FF9900; }
h2	{ font-family: "Arial", "Helvetica", sans-serif; font-style: italic; font-size: 8px; font-weight: 200; line-height: 12px; color: 	#00CC99; }
p	{ font-family: "Arial", "Helvetica", sans-serif; font-size: 14px; font-weight: normal; color: #FFFFFF; }
ul	{ font-family: "Arial", "Helvetica", sans-serif; font-size: 16px; font-weight: normal; color: #FFFFFF; }

a:link		{ text-decoration: none; color: #FFCC00; }
a:visited	{ text-decoration: none; color: #FFCC00; }
a:focus		{ text-decoration: none; color: #FFFFCC; }
a:hover 	{ text-decoration: none; color: #FFFFCC; }
a:active	{ text-decoration: none; color: #FF9900; }


/* classes */

.background
{
	position: relative; 
	top: 0px;
	left: 0px;
	width: 1100px; 
	height: 700px;
	margin-left:auto; margin-right:auto;
	padding: 0px;
	z-index: 1;
	background-color: #222220;
}

.debug
{
	/* position: absolute;
	top: 10px;
	left: 10px;*/
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 20px;
	color: #FFFF00;
	text-align: left;
	margin: 0px;
	padding: 0px;
	background: transparent;
	border: 0px
}
.game
{
	position: absolute; 
	top: 100px;
	left: 38px;
	width: 1024px; 
	height: 576px;
	margin-left:auto; margin-right:auto;
	padding: 0px;;
	z-index: 2;
	/* background-color: #282808; */
}

.mask
{
	position: absolute; 
	top: 100px;
	left: 38px;
	width: 1024px; 
	height: 576px;
	margin-left:auto; margin-right:auto;
	padding: 0px;;
	z-index: 10;
	/* background-color: #282808; */
}

.mm
{
	position: absolute; 
	top: 5px;
	left: 5px;
	/* height: 75px; */
	margin-left:auto; margin-right:auto;
	padding: 0px;;
	z-index: 2;
}

.fa
{
	position: absolute; 
	top: 510px;
	left: 0px;
	height: 60px;
	margin-left:auto; margin-right:auto;
	padding: 0px;;
	z-index: 2;
}

.hb
{
	position: absolute; 
	top: 510px;
	left: 760px;
	height: 60px;
	margin-left:auto; margin-right:auto;
	padding: 0px;;
	z-index: 2;
}

.logo
{
	position: absolute; 
	top: 15px;
	left: 935px;
	height: 72px;
	margin: 0px;
	padding: 0px;;
	z-index: 2;
}

.face
{
	position: absolute;
	top: 70px;
	left: 110px;
	height: 400px;
	z-index: 3;
}

.angryeyes
{
	position: absolute;
	top: 270px;
	left: 225px;
	height: 80px;
	z-index: 4;
}

.benigneyes
{
	position: absolute;
	top: 270px;
	left: 235px;
	height: 55px;
	z-index: 4;
}

.sleepyeyes
{
	position: absolute;
	top: 275px;
	left: 225px;
	height: 65px;
	z-index: 4;
}

.uncertainmouth
{
	position: absolute;
	top: 420px;
	left: 265px;
	height: 25px;
	z-index: 4;
}

.doubtfulmouth
{
	position: absolute;
	top: 420px;
	left: 265px;
	height: 25px;
	z-index: 4;
}

.smilingmouth
{
	position: absolute;
	top: 425px;
	left: 260px;
	height: 20px;
	z-index: 4;
}

.talkingmouth
{
	position: absolute;
	top: 415px;
	left: 270px;
	height: 35px;
	z-index: 4;
}

.talkball_ul
{
	position: absolute;
	top: 200px; 
	left: 65px;
	width: 200px;
	height: 210px;
	z-index: 5;
}

.talkball_dl
{
	position: absolute;
	top: 415px; /* 405 */
	left: 60px; /* 55px; */
	width: 220px;
	z-index: 5;
}

.talkball_ur
{
	position: absolute;
	top: 190px; 
	left: 390px; /* 420px; */
	width: 180px;
	height: 220px;
	z-index: 5;
}

.talkball_dr
{
	position: absolute;
	top: 445px; /* 440 */
	left: 380px; /* 400 */
	width: 170px;
	z-index: 5;
}

.talkball_answer
{
	position: absolute;
	top: 248px;
	left: 400px;
	width: 630px;
	height: 200px;
	z-index: 5
}

.bark_ul
{
	position: absolute;
	top: 245px;
	left: 110px;
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 24px;
	font-style: italic;
	font-weight: bold;
	color: #cc0000;
	text-align: center;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background: transparent;
	z-index: 10;
}

.bark_dl
{
	position: absolute;
	top: 465px; /* 455 */
	left: 95px; /* 100 */
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 24px;
	font-style: italic;
	font-weight: bold;
	color: #cc0000;
	text-align: center;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background: transparent;
	z-index: 10;
}

.bark_ur
{
	position: absolute;
	top: 235px;
	left: 445px;
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 24px;
	font-style: italic;
	font-weight: bold;
	color: #cc0000;
	text-align: center;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background: transparent;
	z-index: 10;
}

.bark_dr
{
	position: absolute;
	top: 515px; /* 505 */
	left: 430px; /* 430 */
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 24px;
	font-style: italic;
	font-weight: bold;
	color: #cc0000;
	text-align: center;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background: transparent;
	z-index: 10;
}

.ask
{
	position: absolute; 
	top: 580px; 
	left: 405px;
	padding: 0px;
	z-index: 2; 
	overflow: hidden;
}

.thinking
{
	position: absolute;
	top: 380px;
	left: 425px;
	height: 60px;
	z-index: 5
}

.advice
{
	position: absolute;
	top: 300px;
	left: 550px;
	width: 440px;
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 40px;
	font-style: italic;
	font-weight: bold;
	color: #cc0000;
	text-align: center;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background: transparent;
	z-index: 10;
}

.exit
{
	position: absolute; 
	top: 690px; 
	left: 38px;
	padding: 0px;
	z-index: 2; 
	overflow: hidden;
}

.copyright
{
	position: absolute;
	top: 680px;
	left: 835px;
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 15px;
	font-style: normal;
	font-weight: normal;
	color: #007777;
	text-align: left;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background: transparent;
	z-index: 10;
}