@charset "UTF-8";
/* CSS Document */

.blk {width:10px;height:10px;overflow:hidden;}
                    
body	{
		font-family: Arial, Helvetica, sans-serif;
		background-color: #6c6c6c;
		font-size: 100%;
		color: #000;
		padding: 0;
		margin: 0;
		}
		
#container	{
			margin: 0 auto;
			padding: 0;
			width: 960px;
			height: 640px;
			text-align: left;
			position: relative;
			}
			
#banner	{ 
		padding: 12px 0 0 164px; 
		background-image: url(graphics/banner.jpg);
		background-repeat: no-repeat;
		height: 56px;
		}	
		
h1	{ display: inline; color: #333; font-size: 20px; line-height: 1.2em; }
h2	{ display: inline; color: #333; font-size: 16px; line-height: 1.9em; }		
			
#content	{
			width: 860px;
			height: 552px;			
			padding: 46px 50px 0 50px;
			position: relative;
			background-image: url(graphics/background.jpg);
			background-repeat: no-repeat; 
			}

.hidden {
    display: none;
}

#title1	{
	position: absolute;
	left: 135px;
	top: -3px;
	color: #FFFFFF;
}

#title2	{
	position: absolute;
	left: 135px;
	top: 19px;
	color: #FFFFFF;
}	

/* Buttons */
a#bttnHome { 
				background-image: url(graphics/bttnHome.jpg);
				background-repeat: no-repeat;
				width: 84px;
				height: 66px;
				position: absolute; 
				top: 0px;
				right: 72px;
				}
a#bttnHome span { display:none; }
a#bttnHome:hover { background-image:url(graphics/bttnHomex.jpg); }

a#bttnDictionary { 
					background-image: url(graphics/bttnDictionary.png);
					background-repeat: no-repeat;
					width: 75px;
					height: 32px;
					position: absolute; 
					top: 0;
					right: 178px;
					}
a#bttnDictionary span { display:none; }
a#bttnDictionary:hover { background-image:url(graphics/bttnDictionaryx.png); }

a#bttnStore { 
				background-image: url(graphics/bttnStore.png);
				background-repeat: no-repeat;
				width: 52px;
				height: 32px;
				position: absolute; 
				top: 0;
				right: 94px;
				}
a#bttnStore span { display:none; }
a#bttnStore:hover { background-image:url(graphics/bttnStorex.png); }

a#bttnQuit { 
				background-image: url(graphics/bttnQuit.jpg);
				background-repeat: no-repeat;
				width: 71px;
				height: 66px;
				position: absolute; 
				top: 0px;
				right: 0px;
				}
a#bttnQuit span { display:none; }
a#bttnQuit:hover { background-image:url(graphics/bttnQuitx.jpg); }

a#bttnActivityMenu { 
					background-image: url(graphics/bttnActivityMenu.png);
					background-repeat: no-repeat;
					width: 119px;
					height: 31px;
					position: absolute; 
					top: 83px;
					right: 48px;
					z-index: 10;
					}
a#bttnActivityMenu span { display:none; }
a#bttnActivityMenu:hover { background-image:url(graphics/bttnActivityMenux.png); }

.topicName	{
	position: absolute;
	top: 20px;
	left: 50px;
	font-size: 20px;
	color: #1b3664;
	font-weight: bold;
	width: 705px;
			}

.instructions	{
	font-size: 16px;
	color: #000;
	position: absolute;
	top: 51px;
	left: 61px;
	width: 860px;
				}
				
.instructions2	{
	font-size: 16px;
	color: #000;
	position: absolute;
	top: 70px;
	left: 61px;
	width: 860px;
				}

.supText	{
	font-size: 16px;
	color: #1b3664;
	font-weight: bold;
	position: absolute;
	top: 107px;
	left: 49px;
	width: 860px;
			}

.supText.hidden{
	display:none;	
}
				
hr	{
	position: absolute;
	top: 89px;
	left: 50px;
	height: 1px;
	width: 860px;
	background-color: #b2b2b2;
	color: #b2b2b2;
	border: none;
	}
					
					
.feedback	{
			font-size: 18px;
			letter-spacing: .5px;
			color: #FFFFFF;
			position: absolute;
			top: 533px;
			width: 675px;
			left:900px; 
			opacity:0.0;
			}					
			
.counter {
    background-image: url(graphics/counter.png);
    background-repeat: no-repeat;
    width: 71px;
    height: 29px;
    position: absolute; 
    top: 533px;
    font-size: 13px;
    color: #1b3664;
    padding-top: 5px;
    text-align: center;
    left:770px;
    /*opacity: 0.0; */s
}

a#bttnNext {
    background-image: url(graphics/bttnNext.png);
    background-repeat: no-repeat;
    width: 64px;
    height: 36px;
    position: absolute;
    top: 532px;
    left: 847px;
    opacity: 0.0;
}
				
a#bttnNext span { display:none; }
a#bttnNext:hover { background-image:url(graphics/bttnNextx.png); }	

a#bttnBack { 
				background-image: url(graphics/bttnBack.png);
				background-repeat: no-repeat;
				width: 22px;
				height: 36px;
				position: absolute; 
				top: 532px;
				right: 193px;
				}
a#bttnBack span { display:none; }
a#bttnBack:hover { background-image:url(graphics/bttnBackx.png); }	

#turnsCounter {
	position: absolute;
	left: 33px;
	top: 38px;
	color: #FFFFFF;
	
}


/* Preloaders for button graphics */
#preload-01 { background: url(graphics/bttnHomex.png) no-repeat -9999px -9999px; }
#preload-02 { background: url(graphics/bttnDictionaryx.png) no-repeat -9999px -9999px; }
#preload-03 { background: url(graphics/bttnStorex.png) no-repeat -9999px -9999px; }
#preload-04 { background: url(graphics/bttnQuitx.png) no-repeat -9999px -9999px; }
#preload-05 { background: url(graphics/bttnListenx.png) no-repeat -9999px -9999px; }
#preload-06 { background: url(graphics/bttnPausex.png) no-repeat -9999px -9999px; }
#preload-07 { background: url(graphics/bttnNewWordx.png) no-repeat -9999px -9999px; }
#preload-08 { background: url(graphics/bttnNextx.png) no-repeat -9999px -9999px; }
#preload-09 { background: url(graphics/bttnBackx.png) no-repeat -9999px -9999px; }
#preload-10 { background: url(graphics/bttnActivityMenux.png) no-repeat -9999px -9999px; }
#preload-11 { background: url(graphics/bttnCheckx.png) no-repeat -9999px -9999px; }