/* mac hide\*/
html, body {height:100%}
/* end hide */

body {
	padding:0;
	margin:0;
	text-align:center;
	min-width:900px;/* for mozilla*/
	background: #ffffff;
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 12px;
	color: #66410f;
}

h1 {
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 11px;
	color: #66410f;
	font-weight: bold;
	padding-top: 5px;
	padding-bottom: 5px;
	margin: 0px;
}

h2 {
	margin: 0px;
	padding: 0px;
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 28px;
	color: #ffffff;
	font-weight: bold;
}

h3 {
	margin-bottom: 0px;
	padding-bottom: 0px;
	font-family: Tahoma, Verdana, Arial;
	font-size: 20px;
	color: #e7d19e;
	text-align: center;
	font-weight: normal;
}

img { 
	margin: 0px;
	padding: 0px;
	border: 0px;
}

a:link img, a:visited img {
	border-style: none;
}

a:link, a:visited {
	color: #a06517;
	text-decoration: underline;

}

a:hover, a:active, a:active {
	color: #a06517;
	text-decoration: none;
}

td button {
	font-family: Georgia, Tahoma, Verdana, Arial;
    font-size: 14px;
    margin-right: .3em;
    background-color: #a06517;
    color: #ffffff;
    border: 0px;
    cursor: pointer;
}

td button:disabled {
	background-color: #cacaca;
	cursor: default;
}

#container {
	min-height: 100%;
	width: 900px;
	text-align: left;
	margin: auto;
	position: relative;
}

#top {
	width: 900px;
	height: 46px;
	background: #abcbc3 url(http://static2.playtictac.com/top_right_bg.gif) no-repeat top right;	
}

#logo {
	width: 350px;
	float: left;	
}

#panel {
	width: 540px;
	float: right;
	text-align: right;
	padding-top: 9px;
	padding-right: 10px;
}

#username {
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 23px;
	color: #a06517;	
	font-weight: bold;
}

#login {
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 23px;
	color: #ffffff;	
	font-weight: bold;
}

#player, #player a:link, #player a:visited, #player a:hover, #player a:active{
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 23px;
	color: #ffffff;	
	font-weight: bold;
	text-decoration: none;
}

#slogan {
	width: 100%;
	text-align: left;	
}

#tabs {
	text-align: left;
	height: 35px;
	width: 900px;
}

#tabsleft {
	width: 30%;
	float: left;
	text-align: left;	
}

#tabsright {
	width: 70%;
	float: right;
	text-align: right;	
}

#tablist {
	list-style: none;
	padding: 0;
	margin: 0;
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 12px;
	text-align: center;  
}

#tablist li {
	list-style: none;
	padding: 0;
	margin: 0;
	float: left;
	padding-right: 10px;
}

#tablist a:link, #tablist a:visited {
	width: 104px;
  	height: 30px;
  	display: block;
  	color: #ffffff;
  	background: url(http://static1.playtictac.com/tab_bg.gif) no-repeat top center;
  	padding-top: 5px;
  	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 19px;
	font-weight: bold;
  	text-decoration: none;
}

#tablist a:hover, #tablist a:active { 
	width: 104px;
	height: 30px;
	display: block;
	text-decoration: none;
	background: url(http://static2.playtictac.com/tab_bg_active.gif) no-repeat top center;
	color: #66410f;
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 19px;
	font-weight: bold;
	text-decoration: none;
}

a.tablistactive {
	background: url(http://static3.playtictac.com/tab_bg_active.gif) no-repeat top center !important;
	color: #66410f !important;
}

#content {
	width: 900px;
	height: 460px;
	overflow: hidden;	
	position: relative;
}

#content1 {
	width: 900px;
	height: 460px;
	position: absolute;
}

#content2 {
	width: 900px;
	left: 900px;
	height: 460px;
	position: absolute;
}

#body {
	height: 434px;	
}

#gamecolumns {
	width: 865px;
	height: 347px;	
}

#footer {
	width: 100%;
}

#bottom {
	width: 100%;
	height: 15px;
}

#bottomright {
	width: 30%;	
	float: right;
	text-align: right;
}

#bottomleft {
	width: 70%;
	float: left;
	color: #ffffff;
	text-align: left;
}

#powered { 
	z-index: 1;
	position: relative;
	bottom: 7px; 
	left: 5px;
	cursor: pointer;
}

.gamecolumn {
	width: 285px;
	height: 325px;
	float: left;	
}

.gamecontent {
	width: 224px;
	margin: auto;
	height: 225px;
	background: #ffffff url(http://static2.playtictac.com/paper_bg.gif) no-repeat top left;
	vertical-align: center;
	text-align: center;
}

.gamesize {
	width: 224px;
	margin: auto;
	height: 36px;
	background: #ffffff;
	text-align: center;
	font-family: Tahoma, Verdana, Arial;
	font-size: 20px;
	font-weight: bold;
}

.gamedescription {
	width: 224px;
	margin: auto;
	height: 40px;
	padding-top: 10px;
	text-align: center;
	font-family: Tahoma, Verdana, Arial;
	font-size: 14px;
}

.gamebackground {
	padding-top: 25px;
	height: 410px;
	width: 470px; 
	float: right; 
	text-align: center;
	vertical-align: middle;
	background: #ffffff url(http://static3.playtictac.com/paper_bg.gif) repeat-x top left;
}

.invitelink {
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 14px;
	width: 333px;
	border: 1px solid #a06517;
	background-color: #f0deb0;
	color: #66410f;
}

.emailsent {
	height: 15px;
	padding-top: 5px;
	font-weight: bold;	
}

.boxclear {font-size: 1px; height: 1px}

.spacer {
	clear: both;
	height: 8px;	
}

.bigtitle {
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 30px;
	color: #66410f;
	font-weight: bold;
}

.normaltext {
	line-height: 140%;	
}

.whitetext, a.whitetext {
	color: #ffffff;	
}

.textfield {
	border: 1px solid #f0deb0;
	background-color: white;
	width: 200px;
	height: 20px;
	font-family: Georgia, Tahoma, Verdana, Arial;
	font-size: 16px;
	color: #a06517;
}

.bl1 {background: url(http://static2.playtictac.com/bl1.gif) 0 100% no-repeat #a06517; width: 100%}
.br1 {background: url(http://static3.playtictac.com/br1.gif) 100% 100% no-repeat}
.tl1 {background: url(http://static1.playtictac.com/tl1.gif) 0 0 no-repeat}
.tr1 {background: url(http://static2.playtictac.com/tr1.gif) 100% 0 no-repeat; padding:10px}

.bl2 {background: url(http://static1.playtictac.com/bl2.gif) 0 100% no-repeat #f0deb0; width: 100%}
.br2 {background: url(http://static2.playtictac.com/br2.gif) 100% 100% no-repeat}
.tl2 {background: url(http://static3.playtictac.com/tl2.gif) 0 0 no-repeat}
.tr2 {background: url(http://static1.playtictac.com/tr2.gif) 100% 0 no-repeat; padding:10px}

.bl3 {background: url(http://static2.playtictac.com/bl3.gif) 0 100% no-repeat #abcbc3; width: 100%}
.br3 {background: url(http://static3.playtictac.com/br3.gif) 100% 100% no-repeat}
.tl3 {background: url(http://static1.playtictac.com/tl3.gif) 0 0 no-repeat}
.tr3 {background: url(http://static2.playtictac.com/tr3.gif) 100% 0 no-repeat; padding:10px}

/** game styles **/

#source {
    border-top: #080 solid 1px;
    margin: 0;
    padding-top: .5em;
}

* {
    margin: 0;
    padding: 0;
}

p {
    margin-bottom: .4em;
}

table {
    width: 100%;
}

th {
    text-align: left;
}

/* MoNKey! client-specific styles */
div.monkey button {
	font-family: Georgia, Tahoma, Verdana, Arial;
    font-size: 20px;
    margin-right: .3em;
    background-color: #a06517;
    color: #ffffff;
    border: 0px;
    cursor: pointer;
}

div.monkey button:disabled {
	background-color: #cacaca;
	cursor: default;
}

div.monkey div.game ol {
    
    list-style: none;
    overflow: auto;
}

div.monkey div.game ol li {
    background: #abcbc3;
    color: #ffffff;
    float: left;
    margin-right: 5px;
    margin-bottom: 5px;
    padding: 5px;
}

div.monkey div.game ol li.current {
    background: #a06517;
    color: #ffffff;
}

div.monkey div.game ol li.open {
    background: #abcbc3;
    color: #ffffff;
}

div.monkey div.game p.rule-set-description, div.monkey div.game p.rule-set-name {
    text-align: left;
    font-weight: bold;
}

div.monkey div.game p.rule-set-name {
    margin-bottom: 0;
}

div.monkey div.game table {
    border: #a06517 solid 1px;
    border-collapse: collapse;
    width: auto;
}

div.monkey div.game tbody td.player-1.l {
    background-position: -19px 0;
}

div.monkey div.game tbody td.player-2.l {
    background-position: -19px -19px;
}

div.monkey div.game tbody td.player-3.l {
    background-position: -19px -38px;
}

div.monkey div.game tbody td.player-4.l {
    background-position: -19px -57px;
}

div.monkey div.game td {
    background: #fff url(http://static1.playtictac.com/tiles.gif) 0 21px no-repeat;
    border: #f0deb0 solid 1px;
    cursor: not-allowed;
    height: 21px;
    padding: 0;
    width: 21px;
}

div.monkey div.game td.empty {
    cursor: pointer;
}

div.monkey div.game td.player-1 {
    background-position: -38px 0;
}

div.monkey div.game td.player-2 {
    background-position: -38px -19px;
}

div.monkey div.game td.player-3 {
    background-position: -38px -38px;
}

div.monkey div.game td.player-4 {
    background-position: -38px -57px;
}

div.monkey div.game.player-1 td.hover {
    background-position: 0 0;
}

div.monkey div.game.player-2 td.hover {
    background-position: 0 -19px;
}

div.monkey div.game.player-3 td.hover {
    background-position: 0 -38px;
}

div.monkey div.game.player-4 td.hover {
    background-position: 0 -57px;
}

div.monkey div.lobby .action {
    text-align: center;
    width: 150px;
}

div.monkey div.lobby .rule-set {
    width: 60%;
}

div.monkey div.lobby tbody tr:hover {
    outline-style: solid;
    outline-width: 2px;
}

div.monkey div.lobby td {
    border-color: #eee;
    border-style: solid;
    border-width: 1px 0;
    font-size: medium;
    padding: .2em .5em;
}

div.monkey div.lobby td.no-games {
    color: #666;
    font-style: italic;
    text-align: center;
}

div.monkey div.lobby td.rule-set small {
    font-size: 14px;
}

div.monkey div.lobby td.slot {
    font-size: 14px;
    line-height: 1em;
}

div.monkey div.lobby td.slot span {
    color: #aaa;
    font-style: italic;
}

div.monkey div.lobby th {
    font-family: Georgia, serif;
}

div.monkey div.lobby tr {
    outline-color: #ccc;
}

div.monkey div.lobby tr.aborted td {
    color: #aaa;
}

div.monkey div.lobby tr.loss {
    outline-color: #c00;
}

div.monkey div.lobby tr.loss td {
    background: #fee;
    border-color: #fdd;
    color: #c00;
}

div.monkey div.lobby tr.win {
    outline-color: #080;
}

div.monkey div.lobby tr.win td {
    background: #efe;
    border-color: #dfd;
    color: #080;
}

div.monkey div.lobby tr.playing {
    outline-color: #fc0;
}

div.monkey div.lobby tr.playing td {
    background: #ffc;
    border-color: #fea;
}

div.listcontrol ul {
    border-bottom: #a06517 solid 1px;
    list-style: none;
    margin: 1em 0 .5em;
    overflow: auto;
}

div.listcontrol ul a {
    background: #abcbc3;
    color: #ffffff;
    display: block;
    outline: none;
    padding: .2em .5em;
    text-decoration: none;
}

div.listcontrol ul li {
    float: left;
    margin-left: .3em;
}

div.listcontrol.past li.past a,
div.listcontrol.play li.play a,
div.listcontrol.view li.view a {
    background-color: #a06517;
    color: #ffffff;
}

div.monkey p.player {
    color: #fff;
    font-size: medium;
    line-height: 40px;
    position: absolute;
    right: 55px;
    top: 30px;
}

div.monkey p.player a {
    color: #8f0;
}

div.monkey p.player a.alert {
    background: #8f0;
    color: #333;
}

div.monkey select {
    font-size: large;
    margin-right: .5em;
    width: 200px;
}

div.monkey table {
    margin: 0 auto 1em;
}


