body { font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin: 0; }



p, ul, li, img { margin: 0; padding: 0; border: 0; }

p	{ margin-bottom: 15px; line-height: 150%; text-align: justify; }



/* basic layout */



#container	{ width: 950px; }

#header		{ height: 77px; width: 950px; background-image: url(../images/header-background.jpg); }

.bottom		{ clear: both; display: block; height: 20px; width: 790px; line-height: 20px; font-size: 10px; border-top: #CCC solid 1px; margin-top: 10px; }



ul.default			{ list-style: none; margin: 0; padding: 0; }

ul.default li		{ padding-left: 20px; margin-left: 3px; background: url(../images/list.gif) no-repeat top left; line-height: 20px; }





/* scoreboard */



.scores		{ float: right; width: 280px; height: 170px; margin-top: 10px; }

.scores ol	{ margin-left: 25px; padding: 0px; }

.score ol li { margin-bottom: 10px; margin-left: 3px; }



/* player details */



.pinfo		{ float: left; width: 180px; height: 150px; margin-top: 20px; margin-left: 20px; }

.pinfo ul	{ list-style: none; }

.pinfo ul li strong	{ font-weight: bold; color: #039; margin-top: 5px; }

.pranking	{ float: left; width: 180px; height: 150px; margin-top: 20px; }

.pranking ol	{ margin-left: 25px; padding: 0px; }

.pranking ol li { margin-left: 3px; }

.pphoto		{ float: left; border: #9999cc solid 1px; padding: 3px; margin-bottom: 5px; margin-top: 40px; margin-left: 15px; }



/* top navigation */



ul#navigation				{ list-style: none; height: 20px; }

ul#navigation li 			{ float: left; }

ul#navigation li a			{ display: block; height: 17px; padding-top: 3px; text-align: center; text-transform: uppercase; text-decoration: none; font-weight: bold; font-size: 11px; }

ul#navigation li a.button1	{ background: url(../images/button1.png); width: 141px; }

ul#navigation li a.button2	{ background-image: url(../images/button2.png); width: 128px; }

ul#navigation li a.button3	{ background-image: url(../images/button3.png); width: 127px; }

ul#navigation li a.button4	{ background-image: url(../images/button4.png); width: 129px; }

ul#navigation li a.button5	{ background-image: url(../images/button5.png); width: 128px; }

ul#navigation li a.button1:hover	{ background: url(../images/button1.png) no-repeat 0 -20px; width: 141px; }

ul#navigation li a.button2:hover	{ background: url(../images/button2.png) no-repeat 0 -20px; width: 128px; }

ul#navigation li a.button3:hover	{ background: url(../images/button3.png) no-repeat 0 -20px; width: 127px; }

ul#navigation li a.button4:hover	{ background: url(../images/button4.png) no-repeat 0 -20px; width: 129px; }

ul#navigation li a.button5:hover	{ background: url(../images/button5.png) no-repeat 0 -20px; width: 128px; }

ul#navigation li.button6	{ display: block; background-image: url(../images/button6.png); width: 297px; height: 20px; }



/* search block */



form.searchbox		{ 	display: block; height: 18px;  background: url(../images/header-bottom.png) no-repeat; clear: both; 
					line-height: 21px; text-align: right; font-weight: bold; color: #039; margin: 0; padding: 3px 160px 0 0; }
form.searchbox p	{ 	margin: 0; padding: 0; display: inline; }

input.pname			{ 	height: 13px; font-size: 11px; width: 80px; border: #CCCCCC solid 1px; margin-left: 10px; }

input.search		{ 	height: 18px; font-size: 11px; width: 60px; background: url(../images/primary-roll.gif); 
						border: 1px solid #CCC; margin-top: 0; }



/* content */



#left-column, #right-column	{ float: left; margin: 0 15px; width: 125px; }

#content					{ float: left; width: 500px; }



/* headers styles */

h1, h2, h3 { margin: 5px 0 0 0; }

h1   { color: #039; font-size: 20px; }

h1.yellow		{ background-image: url(../images/h1-background.jpg); background-repeat: no-repeat; height: 26px; line-height: 26px; 

			  font-size: 14px; color: #FFF; padding-left: 15px; width: 485px; text-transform: uppercase; margin-bottom: 15px; 

			  border-bottom: #669 solid 1px; }

h2.yellow	{ background-image: url(../images/h1-background.jpg); background-repeat: no-repeat; height: 25px; line-height: 25px; 

			  font-size: 14px; color: #FFF; padding-left: 15px; width: 485px; text-transform: uppercase; border-bottom: #669 solid 1px; }

h2.green	{ background-image: url(../images/heading-green.png); background-repeat: no-repeat; height: 26px; line-height: 26px; 

			  font-size: 14px; color: #FFF; padding-left: 15px; width: 485px; text-transform: uppercase; }

h2.blue		{ background-image: url(../images/heading-blue.png); background-repeat: no-repeat; height: 25px; line-height: 25px; 

			  font-size: 14px; color: #FFF; padding-left: 15px; width: 485px; text-transform: uppercase; }

h2.game		{ color: #039; }


h3.white	{ background-image: url(../images/h3-background.png); height: 20px; width: 125px; line-height: 20px; 

			  text-align: center; font-size: 11px; background-repeat: no-repeat; color: #039; }

h3.lblue	{ background-image: url(../images/h3-lblue.png); height: 20px; width: 125px; line-height: 20px; text-align: center; 

			  font-size: 11px; background-repeat: no-repeat; color: #039; }

h3.blue		{ background-image: url(../images/h3-blue.png); height: 20px; width: 125px; line-height: 20px; text-align: center; 

			  font-size: 11px; background-repeat: no-repeat; color: #039; }

.scores h4			{ font-size: 14px; color: #039; font-weight: bold; }

h5.gdetail	{ font-size: 12px; font-weight: bold; color: #039; margin-left: 14px; clear: both; }



/* links styles */



a			{ color: #039; text-decoration: none; }

a:visited	{ color: #039; }

a:hover		{ text-decoration: underline; }



a.bcheckers	 { display: block; float: left; background-image: url(../images/checker-big-bw.png); 

			  height: 90px; width: 238px; margin-top: 5px; margin-right: 22px; }

a.breversi	 { display: block; float: left; background-image: url(../images/reversi-big.png); height: 90px; width: 238px; margin-top: 5px; }

a.bchess	 { display: block; float: left; background-image: url(../images/chess-big.png); 

			  height: 90px; width: 238px; margin-top: 5px; margin-right: 22px; }

a.btictactoe { display: block; float: left; background-image: url(../images/tic-tac-toe-big.png); height: 90px; width: 238px; margin-top: 5px; }

a.bconnect4	 { display: block; float: left; background-image: url(../images/connect4-big.png); 

			  height: 90px; width: 238px; margin-top: 5px; margin-right: 22px; }

a.bbattle	 { display: block; float: left; background-image: url(../images/battle-block-big.png); height: 90px; width: 238px; margin-top: 5px; }

a.bballshot	 { display: block; float: left; background-image: url(../images/ball-shot-big.png); 

			   height: 90px; width: 238px; margin-top: 5px; margin-right: 22px; }

			  

a.scheckers	 		{ display: block; background: url(../images/checkers-bw.png); height: 40px; width: 125px; margin-bottom: 2px; }

/* a.scheckers:hover	{ display: block; background: url(../images/checkers.png) no-repeat 0 -40px; height: 40px; width: 125px; margin-bottom: 2px; }*/

a.schess	 		{ display: block; background: url(../images/chess.png); height: 40px; width: 125px; margin-bottom: 2px; }

a.schess:hover		{ display: block; background: url(../images/chess.png) no-repeat 0 -40px; height: 40px; width: 125px; margin-bottom: 2px; }

a.sreversi	 		{ display: block; background: url(../images/reversi.png); height: 40px; width: 125px; margin-bottom: 2px; }

a.sreversi:hover	{ display: block; background: url(../images/reversi.png) no-repeat 0 -40px; height: 40px; width: 125px; margin-bottom: 2px; }

a.stictactoe	 	{ display: block; background: url(../images/tic-tac-toe.png); height: 40px; width: 125px; margin-bottom: 2px; }

a.stictactoe:hover	{ display: block; background: url(../images/tic-tac-toe.png) no-repeat 0 -40px; height: 40px; width: 125px; margin-bottom: 2px; }

a.sconnect4	 		{ display: block; background: url(../images/connect4.png); height: 40px; width: 125px; margin-bottom: 2px; }

a.sconnect4:hover	{ display: block; background: url(../images/connect4.png) no-repeat 0 -40px; height: 40px; width: 125px; margin-bottom: 2px; }

a.sbattle	 		{ display: block; background: url(../images/battle-blocks.png); height: 40px; width: 125px; margin-bottom: 2px; }

a.sbattle:hover		{ display: block; background: url(../images/battle-blocks.png) no-repeat 0 -40px; height: 40px; width: 125px; margin-bottom: 2px; }

a.sballshot	 		{ display: block; background: url(../images/ball-shot.png); height: 40px; width: 125px; margin-bottom: 2px; }

a.sballshot:hover	{ display: block; background: url(../images/ball-shot.png) no-repeat 0 -40px; height: 40px; width: 125px; margin-bottom: 2px; }



p.bcheckers	 { display: block; float: left; background-image: url(../images/checker-big-bw.png); 

			  height: 90px; width: 238px; margin-top: 5px; margin-right: 22px; }

p.breversi	 { display: block; float: left; background-image: url(../images/reversi-big.png); height: 90px; width: 238px; margin-top: 5px; }

p.bchess	 { display: block; float: left; background-image: url(../images/chess-big.png); 

			  height: 90px; width: 238px; margin-top: 5px; margin-right: 22px; }

p.btictactoe { display: block; float: left; background-image: url(../images/tic-tac-toe-big.png); height: 90px; width: 238px; margin-top: 5px; }

p.bconnect4	 { display: block; float: left; background-image: url(../images/connect4-big.png); 

			  height: 90px; width: 238px; margin-top: 5px; margin-right: 22px; }

p.bbattle	 { display: block; float: left; background-image: url(../images/battle-block-big.png); height: 90px; width: 238px; margin-top: 5px; }

p.bballshot	 { display: block; float: left; background-image: url(../images/ball-shot-big.png); 

			   height: 90px; width: 238px; margin-top: 5px; margin-right: 22px; }



/* boxes */

.play-banner	{  width: 280px; height: 180px; margin: 5px 0; padding: 49px 0 0 220px; font-size: 26px; letter-spacing: -1px; font-family: "Lucida Grande", "Tahoma", Arial, Helvetica, sans-serif; }

.play-banner strong { color: #039; font-size: 28px;}

.play-banner b { color: #FC0; }

.white-box		{ border: #9999cc solid 1px; border-top: none; width: 117px; padding: 5px 3px; text-align: center; line-height: 120%; font-size: 11px; margin-top: 0; }

.lblue-box		{ border: #9999cc solid 1px; border-top: none; width: 113px; padding: 5px 5px; background-color: #def6ff; color: #039; line-height: 120%;

				   font-size: 11px; }

.blue-box		{ border: #9999cc solid 1px; border-top: none; width: 113px; padding: 5px 5px; background-color: #b1ecff; color: #039; line-height: 120%;

				   font-size: 11px; }



.wide-blue		{ border: #9999cc solid 1px; border-top: none; width: 338px; padding: 10px 10px 10px 150px; font-weight: bold;

				  background: url(../images/who-we-are.png) left top no-repeat #cee7ff; height: 45px; font-size: 14px; color: #039;

				  line-height: 135%; }

.wide-green		{ border: #9999cc solid 1px; border-top: none; width: 338px; padding: 10px 10px 10px 150px; line-height: 135%;

				  background: url(../images/chess-multiplayer-game.png) left top no-repeat #edffce; height: 93px; }

.wide-yellow	{ border: #9999cc solid 1px; border-top: none; width: 338px; padding: 10px 10px 10px 150px; line-height: 135%;

				  background: url(../images/play-for-free.png) left top no-repeat #fff0c1; height: 93px; display: block; margin-bottom: 10px;}

.wide-yellow:hover	{ text-decoration: none; }

/* images styles */



.avatar			{ border: #9999cc solid 1px; padding: 3px; margin-bottom: 5px; }

.game-large		{ float: left; }

.select			{ margin: 15px; width: 470px; }



/* bottom styles */



.cotopia	{ float: left; margin: 0 10px; }

.sabre		{ float: right; margin: 0 10px; }



/* texts styles */



.wide-green strong	{ display: block; color: #360; font-size: 14px; margin-bottom: 10px; }

.wide-yellow strong	{ display: block; color: #F90; font-size: 14px; margin-bottom: 10px; }

.green14			{ color: #360; font-size: 14px; margin-bottom: 10px;font-weight: bold; }

.yellow14			{ color: #F90; font-size: 14px; margin-bottom: 10px;font-weight: bold; }

.news				{ display: block; margin: 15px 0; border-bottom: #F4F4F4 solid 1px; padding-bottom: 5px; line-height: 150%; }

.topplayer			{ margin-left: 10px; }

.warn				{ font-size: 10px; color: #CCC; margin: 15px; }

.warn2				{ font-size: 10px; }

.instruction		{ margin: 5px 14px; color: #36F; font-size: 11px; }

form.loginform p 	{ text-align: left; }



/* forms */



form.loginform	{ padding: 100px 160px; }

label			{ color: #039; font-weight: bold; display: block; float: left; width: 80px; font-size: 13px; }

.login, .pass	{ height: 15px; width: 150px; font-size: 12px; border: #CCC solid 1px; }

.messages		{ margin-left: 14px; border: #CCC solid 1px; height: 50px; width: 480px; margin-bottom: 10px; }

.input150		{ height: 15px; width: 200px; font-size: 11px; border: #CCC solid 1px; }

.upload			{ height: 17px; width: 200px; font-size: 11px; border: #CCC solid 1px; }

.about			{ border: #CCC solid 1px; height: 150px; width: 300px; margin-bottom: 10px; }

.greeting		{ height: 19px; width: 200px; font-size: 12px; border: #CCC solid 1px; margin-left: 14px; }

.about14		{ border: #CCC solid 1px; height: 150px; width: 300px; margin-bottom: 10px; margin-left: 14px; }

.form1			{ margin-left: 14px; }

input.set		{ height: 18px; font-size: 11px; width: 100px; background: url(../images/primary-roll.gif); border: 1px solid #CCC; margin-top: 10px; margin-left: 15px; }



/* add-photo styles */



.sinfo			{ float: left; width: 450px; margin: 20px 0 0 15px; clear: both; font-size: 11px; }

.sinfo ul		{ list-style: none; }

.sinfo ul li 	{ margin-bottom: 5px; }



/* table styles */



table.selection				{ margin-left: 15px; }

table.selection tr th		{ width: 100px; }

table.selection tr th label	{ font-size: 11px; color: #000; font-weight: normal; text-align: left; }

table.selection tr td input	{ width: 40px; background-color: #F8F8F8; color: #06C; }



a.nounderline:hover { text-decoration: none; }



/* helpful styles */
.center { text-align: center; }

.clear	{ clear: both; }