/* TESTING: * /     #userMsg{background:blue}
/ * ALWAYS TURN ON BOTH! */

#userMsg {
	font-size:17px; 
    font-weight:normal; /* doesn't look great both large and bold */
	padding-right: 1px; 
    white-space:nowrap;
}
#gameSummaryDiv {
	font-size:16px; 
    font-weight:normal; /* doesn't look great both large and bold */
}
.userMsg span, #helpMsgHead{ 
	line-height: 50px;   /* image's height */
/*	height: 50px;  / * image's height */

    height: 50px;width:auto;
    
    padding-bottom:14px;
}
#userMsgImg, #msgIcon{ 
	line-height: 50px;   /* image's height */
    height: 50px;width:50px;
    padding-bottom:14px;
}
.alertifyNoteIcon{height: 40px;width:auto;margin:10 0 -10 0}
/* .userMsgRow{ height: 100%; } */

#button { padding: .5em 1em; text-decoration: none; }

/* if change this width, adjust alertify stuff below to the same width and margin-left = - 1/2 width!
#gameTable, #gameTableParent, #gameSelector{width:360px;height:360px;}
*/
/* TODO: not sure why this is off, but adding a margin fixes it
#gameSelector{margin-top:20px;}
 */
#gameTable{
	border-radius:8%;
}

#userMsgTable,#userMsgTableParent{
    height:80px;
}

/* ---------------------------------------- */
#sideTable{
	width:110px;
}
#prefsTableParentRow{
	border-radius:10px;
	height:120px;
}
#prefsTable {
    padding-right:12px;
}
#resultsTable{
	height:180px;
    font-size:18px;
}
/* ---------------------------------------- */
#bottomTable,#prefsTable2ParentTD{
    height:90px;
}
#prefsTable2ParentTD{
	border-radius:10px;
	width:120px;
}
#prefsTable2 {
    bottom:10px;
}
#resultsTable2{
	width:275px;
    font-size:18px;
}
/* ---------------------------------------- */

#settingsTable,#copyrightInfo{
    border-radius:30px;
    font-size:14px;
}
#gameTableGParent{top: 8%;}
/*#userMsgTable{ margin-right:-15px; }*/

/*.gameSquareImg, .gameSquare {width:100px;height:100px}
 .user0Icon, .user1Icon {width: 80px; height: 80px; padding-right:6px} */
.gameSquare {border-radius:10%}
.user0Icon, .user1Icon {width: 35px; height: 35px; /*padding-right:6px */}
.selectGameImg {width:70px;height:70px}
.gameSelectArea{
    height: 80px; width:100px;
}
.gameSelText{
    height: 80px; 
    width:120px; 
    font-size:22px;font-weight:bold;
    line-height: 80px; 
    white-space: nowrap;
}
.gameSelNameText{
    font-size:22px;font-weight:bold;
    white-space: nowrap;
}
#stealthCount, #backgroundVolume, #effectsVolume /* .digitSpinner - don't use class. go direct to override jqui css */
{
    font-size: 25px;
    line-height: 9px;
    /* width: 39px; */
    height: 52px;
    /*margin: 0 75 0 10;*/
    margin: 0 -25 0 0;
}
.generalSettingInfoTD {
    /*
    border-top-left-radius: 44px;
    border-bottom-left-radius: 44px;
    */
    width:200px;
    height:45px;
}
.generalSettingActionTD {
    /*
    border-top-right-radius: 44px;
    border-bottom-right-radius: 44px;
    */
    width:40px;
    height:45px;
}
.generalSettingRow
{
    height:45px;
}

.generalSettingActionTDMimic {
    width:1px;
    height:45px;
}
.actionBtnMimic
{
    width:1px;
    height:45px;
}
.buttonSettingInfoTDMimic{
    width:1px;
    height:52px;
    font-size:12px;
}
.buyBtnMimic {
	border:1px solid transparent;
	display:inline-block;
	height:50px;
	width:0.01px;
	font-size:30px; 
	line-height:50px;
    margin: 0 0 5 10;
}
.purchaseHelpBtn {
    margin: -13 12 -13 0;
    width: 45px;
    height: 45px;
    float: right;
}
.actionBtn
{
    width:45px;
    height:45px;
}
.selectPrefsBtn,.selectGameBtn,.showSlidesBtn{
    width:35px;
    height:35px;
    background:transparent;
    padding:20px;
    /*
    margin: 0 20 0 -20;
    */
}
#selectPrefsBtn{margin-top:10px}
#selectPrefsBtn2{margin-left:10px}

.prefSettinDiv{
    height:45px;
    width:180px;
}
.buttonSettingInfoTD{
    height:52px;
    width:260px;
}
.buttonSettingActionTD{
    height:52px;
    width:60px;
}
.buttonSettingRow,.buttonSettingRowMimic{
    height:52px;
}
/*
TODO: padding-left:10px; - for the main buttons

initial size of action buttons too large - need to start with small
*/

.buyBtn {
	height:50px;
	width:50px;
	font-size:30px; 
	line-height:50px;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;
    /*margin-left: 8px;
    margin-bottom: 6px; */
    margin: 0 0 5 12;
}
.genBuyBtn {
	font-size:14px;
	line-height:50px;
}
    
/* neat: remove the hard width by clearing the css ( CSS3? ) width:initial
- unfortunately, while it's animating into view it looks bad  :(
- could work if faded it in though... 
.alertify-alert,.alertify-confirm, .alertify-prompt {width:initial}  
- width must be the same as gameSelector above, and margin-left is -1/2 of that
*/
.alertify-alert,.alertify-confirm, .alertify-prompt {width:380px; margin-left:-190px; left:50%; border-radius: 50px;background:transparent}
.alertify-message, .alertify-buttons{text-align:center;font-size:20px;opacity:.99;}
.alertify-button{min-width: 60px;opacity:.99;}
.alertify-message{border-radius: 20px 20px 0px 0px;} 
.alertify-buttons{border-radius: 0px 0px 20px 20px; background: #ebc932; } 

#settingsDiv{margin-left:-20px;} /* nudge left if have space */

.simpleWait{
    width:28px;
    margin:12 0 0 0;
}
#learnMoreTextInfo1,#learnMoreTextInfo2,#learnMoreTextInfo{line-height:40px}
.learnMoreBtn{padding-right:8px; }
#moreInfoTD{padding-left:8px; font-size:17px; }
#shareLink {font-size:18px;font-weight:bold;color:gold}
#showFullCopyright {font-size:14px;}
.gameTitleImg {height:27px;width:auto;margin:0 0 -5 0}
#gameVersion {font-size:22px;font-weight:bold;}
#reloadDeviceBtn,#clearScoresBtn,#aiSpeedBtn{margin:2 4 10 -2}
#appIconImg {height:60px;width:auto;}
#mainGameTitleImg {height:30px;width:auto; /* margin:0 0 -9 0 */}
/*#gameShowTable {}*/
#gameInfoTable{width:265px}

