.fileInfo {
    Name: style.css;
    Version: 94;
    Date: "04/11/23";
    Owner: "This software is owned by Walter Coles";
}
/****************************************************/

body {
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    font-size: 16px;
    margin: 0px;
    background-color: forestgreen;
    z-index: 0;
}
/****************************************************/
/***  START - TOP PANEL  ***/

.TopPanel {
    position: fixed;
    left: 0px;
    
    height: 20px;
        
    padding: 12px 0 10px 5px;
    background-color: yellow;
    
    /*  ARROW CURSOR  */
    cursor: default;    

    border-style: solid;
    border-color: purple;
    border-width: 3px 3px 3px 3px;
}
/***  END - TOP PANEL  ***/
/****************************************************/


/****************************************************/
/***  START - MENU BAR ITEM  ***/
/*** yellow is to blend in the menu bar ***/
/*** correct colors will be done in startUp.js ***/

.MenuBarItem {
    width 550px;
    color: yellow;
    background-color: yellow;
    text-align: center;
    padding: 3px 7px 3px 5px;
    
    border-style: solid;
    border-color: yellow;
    border-width: 2px;
    border-radius: 25px;
    
    /* BLANK SPACE TO THE RIGHT OF EACH OPTION BOX */
    /* adjust button spacing in index.html */
    margin-right: 12px;
    
    /*  HAND POINTER  */
    cursor: pointer;

}
/***  END - MENU BAR ITEM  ***/
/****************************************************/


/****************************************************/
/*** START - TEST BUTTONS ***/

.testButton {
    position: absolute; 
    z-index: 62;    
    width = 15;
    color: black;
    background-color: lightcyan;
    text-align: center;
    padding: 3px 7px 3px 5px;
    visibility: hidden;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
        
    /*  HAND POINTER  */
    cursor: pointer;
}
/*** END - TEST BUTTONS ***/
/****************************************************/


/****************************************************/
/*** START - BUTTON TOOL TIP ***/

.menuToolTip {
    position: absolute; 
    display: none;
    color: black;
    background-color: lightgreen;
    text-align: left;
    padding: 3px 7px 3px 10px;
        
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 15px;
        
    /*  HAND POINTER  */
    cursor: default;
}
/*** END - BUTTON TOOL TIP ***/
/****************************************************/


/****************************************************/
/*** START - TEST LABELS ***/

.messageLabel {
    position: absolute;
    color: white;
    font-size: 20px;
    font-weight: bold;
    visibility: hidden;
}

.test2Label {
    position: absolute;
    color: white;
    font-size: 20px;
    font-weight: bold;
    left: 150px;
    top: 50px;
    display: none;
}

.test4Label {
    position: absolute;
    color: white;
    font-size: 20px;
    font-weight: bold;
    left: 0px;
    display: none;
}

.test5Label {
    position: absolute;
    color: white;
    font-size: 20px;
    font-weight: bold;
    left: 0px;
    display: none;
}

/*** END - TEST LABELS ***/
/****************************************************/


/***************************************************/
/*** START - SCORE LABEL AND FIELD ***/

.scoreLabel {
    position: absolute;
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.scoreField {
    position: absolute;
    color: white;
    font-size: 20px;
    font-weight: bold;
}
/*** hor is handled in misc.js ***/
/*** END - SCORE LABEL AND FIELD ***/
/***************************************************/

/****************************************************/
/*** START - GAME NAME LABEL ***/

.docLabel {
    position: absolute;
    color: white;
    font-size: 20px;
    font-weight: bold;
}
/*** END - GAME NAME LABEL ***/
/****************************************************/


/****************************************************/
/***  START - CARD DISPLAY ***/

.sampleCard {
    position: absolute;
    display: none;
    cursor: "default";
}    
/*** END - CARD DISPLAY ***/
/****************************************************/ 

.duumyCard {
    position: absolute;
    display: none;
    cursor: "default";
}
/****************************************************/
/*** START - CIRCLE HELP BUTTON ***/

.circleHelpButton {
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
        
    color: black;
    background-color: lightGreen;
    text-align: center;
    padding: 3px 2px 1px 2px;
    visibility: hidden;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 13px 13px 13px 13px;
    
    cursor: pointer;
}
/*** END - CIRCLE HELP BUTTON ***/
/****************************************************/


/****************************************************/
/*** START - PANEL ***/

.panel {
    position: absolute;
    z-index: 65;
    padding: 0;
    background-color: lightYellow;
    
    border-style: solid;
    border-color: purple;
    border-width: 4px;
    border-radius: 15px;

    /* start off hidden */
    display: none;

    overflow: auto; 
}
/*** END - PANEL ***/
/****************************************************/

/****************************************************/
/*** START - PANEL TOP BAND ***/

.panelTopBand {
    position: absolute;
    left: 0;
    top: 0;
    height: 30px;
    z-index: 61;
    background-color: yellow;
    
    border-style: solid;
    border-color: purple;
    border-width: 0 0 3px 0;
    border-radius: 15px 15px 0 0;
    
}
/*** END - PANEL TOP BAND ***/
/****************************************************/

/****************************************************/
/*** START - PANEL TITLE ***/

.panelTitle {
    position: relative;
    text-align: center;
    top: 5px;
    color: black;
    font-size: large;
    font-weight: bold;
}
/*** END - PANEL TITLE ***/
/****************************************************/


/****************************************************/
/*** START - GAME BAND ***/

.gameBand {
    position: absolute;
    left: 0px;
    top: 33px;
    height: 30px;
    z-index: 61;
        
    border-style: solid;
    border-color: purple;
    border-width: 0 0 3px 0;
}
/*** END - GAME BAND ***/
/****************************************************/


/****************************************************/
/*** START - OPTIONS PANEL - LABELS ***/

.optionsLabel {
    position: absolute;
    color: black;
    font-size: medium;
    font-weight: bold;
}
/*** END - OPTIONS PANEL - LABELS ***/
/****************************************************/

/****************************************************/
/*** START - OPTIONS PANEL BUTTON ***/

.optionsButton {
    position: absolute; 
    left: 200px;
    top: 30px;
    z-index: 62;    
        
    color: black;
    background-color: lightcyan;
    text-align: center;
    padding: 3px 7px 3px 5px;
        
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
        
    /*  HAND POINTER  */
    cursor: pointer;
}
/*** END - OPTIONS PANEL BUTTON ***/
/****************************************************/


/****************************************************/
/*** START - SMALL HELP BUTTON ***/

.smallHelpButton {
    position: absolute;
    display: block;
    height: 22px;
    
    color: black;
    background-color: lightGreen;
    text-align: center;
    padding: 3px 7px 0px 5px;
        
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    cursor: pointer;
}
/*** END - SMALL HELP BUTTON ***/
/****************************************************/


/****************************************************/
/*** START - STATISTICS PANEL - BOX ***/

/*** CURRENT HANDS and COMPLETED HANDS labels ***/
.statsLabel {
    position: absolute;
    color: black;
}
/*** statsGameNameData ***/
.statsGameNameData {
    position: relative;    
    text-align: center;
    color: black;
}

.statsData {
    position: absolute;
    color: black;
}

/*** END - STATISTICS PANEL - BOX ***/
/****************************************************/

/****************************************************/
/*** START - STATISTICS PANEL - HORIZONTAL LINE ***/

.horLine {
    position: absolute;
    left: 0;
    height: 5px;
    z-index: 66;
            
    border-style: solid;
    border-color: purple;
    border-width: 0 0 3px 0;
}
/*** END - STATISTICS PANEL - HORIZONTAL LINE ***/
/****************************************************/

/****************************************************/
/*** START - STATISTICS PANEL - DELETE BUTTON ***/

.statsPanelButton {
    position: relative;
    z-index: 71;
    
    color: white;
    background-color: red;
    text-align: center;
    font-weight: bold;
    padding: 3px 8px 3px 8px;
        
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    margin-left: 15px;
 
    /*  HAND POINTER  */
    cursor: pointer;
}
/*** END - STATISTICS PANEL - DELETE BUTTON ***/
/****************************************************/


/****************************************************/
/*** START - STATS DELETE PANEL ***/

.statsDeletePanelButton {
    position: absolute;
    z-index: 71;
    
    color: white;
    background-color: red;
    text-align: center;
    font-weight: bold;
    padding: 3px 8px 3px 8px;
        
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    margin-left: 15px;
    
    /*  HAND POINTER  */
    cursor: pointer;
}
/*** END - STATS DELETE PANEL -  ***/
/****************************************************/


/****************************************************/
/*** START - HELP PANEL BUTTON ***/
/*** help panel and game help panel buttons ***/

.helpPanelButton {
    position: absolute;
    z-index: 71;
    
    color: black;
    background-color: lightGreen;
    text-align: center;
    padding: 3px 7px 3px 7px;
        
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    /*  HAND POINTER  */
    cursor: pointer;
}
/*** END - HELP PANEL BUTTON ***/
/****************************************************/


/****************************************************/
/*** START - BUTTON HELP BUTTON ***/

.buttonHelpButton {
    position: absolute;
    z-index: 71;
    
    color: black;
    text-align: center;
    padding: 3px 7px 3px 7px;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
}
/*** END - BUTTON HELP BUTTON ***/
/****************************************************/



.buttonSubBox {
    position: absolute;
    z-index: 71;
}


/*****************************************************
// START - STATS HELP









/****************************************************/
/*** START - STATS HELP PANEL - NO HELP BUTTON ***/

.statsHelpPanelButton {
    position: relative;
    z-index: 71;
    
    color: black;
    background-color: lightgreen;
    text-align: center;
    padding: 3px 7px 3px 7px;
        
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    margin-left: 15px;
    
    /*  HAND POINTER  */
    cursor: pointer;
}
/*** END - STATS HELP PANEL - NO HELP BUTTON ***/
/****************************************************/


/****************************************************/
/*** START - WIN PANEL ***/

.winPanel {
    position: absolute;
    background-color: lightyellow;
    
    border-style: solid;
    border-color: purple;
    border-width: 4px;
    border-radius: 15px;
    
    margin-left: 15px;
    overflow-x: hidden;
    z-index: 80;
    display: none;
}
/*** END - WIN PANEL
/****************************************************/

/****************************************************/
/*** START - WIN MESSAGE 1 ***/

.winMessage1 {
    position: relative;
    text-align: center;
    color: red;
    font-size: 100px;
    font-weight: bold;
    z-index: 81;
}
/*** END - WIN MESSAGE 1 ***/
/****************************************************/

/****************************************************/
/*** START - WIN MESSAGE 2 ***/

.winMessage2 {
    position: relative;
    text-align: center;
    color: darkblue;
    font-size: 50px;
    font-weight: bold;
    z-index: 81;
}
/*** END - WIN MESSAGE 2 ***/
/****************************************************/

/****************************************************/
/*** START - WIN MESSAGE 3 ***/

.winMessage3 {
    position: relative;
    text-align: center;
    color: darkblue;
    font-size: 40px;
    font-weight: bold;
    z-index: 81;
}
/*** END - WIN MESSAGE 3 ***/
/****************************************************/

/****************************************************/
/*** START - WIN EXIT MESSAGE ***/

.winExitMessage {
    position: relative;
    text-align: center;
    color: darkblue;
    font-size: 50px;
    font-weight: bold;
    z-index: 81;
}
/*** END - WIN EXIT MESSAGE
/****************************************************/

/****************************************************/
/*** START - WIN STATS MESSAGE ***/

.winStatsMsg {
    position: relative;
    display: block;
    text-align: center;
    color: darkblue;
    font-size: 30px;
    font-weight: bold;
    z-index: 81;
}
/*** END - WIN STATS MESSAGE ***/
/****************************************************/

/****************************************************/
/*** START - WIN BUTTONS ***/

.winButton {
    position: absolute;
    font-size: 30px;
    color: black;
    background-color: lightCyan;
    text-align: center;
    padding: 4px 7px 4px 4px;
    height: 35px;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    cursor: pointer;
}
/*** END - WIN BUTTONS ***/
/****************************************************/


/****************************************************/
/*** START - SMALL WIN PANEL - BUTTONS ***/

.smallWinButton {
    position: absolute;
    font-size: 20px;
    color: black;
    background-color: red;
    text-align: center;
    padding: 3px, 7px, 3px, 7px;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    cursor: pointer;
    
}
/*** END - DMALL WIN PANEL - BUTTONS ***/
/****************************************************/


/****************************************************/
/*** START - SUPPORT - BUTTON ***/

.supportButton {
    position: absolute;
    left: 0px;
    width: 20px;
    bottom: 0px;
    height: 20px;
    background-color: green;
    
    border-style: hidden;
    border-width: 1px;
}
/*** END - SUPPORT - BUTTON ***/
/****************************************************/

.suppTable {
    position: absolute;
    left: 10px;
    top: 45px;
    text-align: right;
}


.suppRightTable {
    position: absolute;
    left: 230px;
    top: 45px;
}

/****************************************************/
/*** START - SUPPORT - MAIN ***/

.suppData {
    position: absolute;
    left: 140px;
}
/*** END - SUPPORT - MAIN ***/
/****************************************************/


.suppRightData {
    position: absolute;
    left: 387px;
}
/****************************************************/
/*** START - SUPPORT - SET DEBUG MODE ***/

.debugModeLabel {
    position: absolute;
    left: 250px;
    top: 345px;
    z-index: 62;
    color: black;
}


.debugOnButton {
    position: absolute;
    left: 360px;
    top: 340px;
    z-index: 62;
    color: black;
    background-color: lightcyan;
    text-align: center;
    padding: 3px 7px 3px 5px;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    cursor: pointer;
    visibility: visible;
}


.debugOffButton {
    position: absolute;
    left: 410px;
    top: 340px;
    z-index: 62;
    color: black;
    background-color: lightcyan;
    text-align: center;
    padding: 3px 7px 3px 5px;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    cursor: pointer;
    visibility: visible;
}
/*** END - SUPPORT - SET DEBUG MODE ***>
/****************************************************/

/****************************************************/
/*** START - SUPPORT - SET PILE NUMBER ***/

.debugPileNumLabel {
    position: absolute;
    left: 200px;
    top: 385px;
    z-index: 62;
    color: black;
}


.debugPileNum {
    position: absolute;
    left: 310px;
    top: 380px;
    z-index: 62;
    color: black;
    background-color: lightcyan;
    text-align: center;
    padding: 3px 7px 3px 5px;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    cursor: pointer;
    visibility: visible;
}


.debugIncButton {
    position: absolute;
    left: 360px;
    top: 380px;
    z-index: 62;
    color: black;
    background-color: lightcyan;
    text-align: center;
    padding: 3px 7px 3px 5px;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    cursor: pointer;
    visibility: visible;
}


.debugDecButton {
    position: absolute;
    left: 410px;
    top: 380px;
    z-index: 62;
    color: black;
    background-color: lightcyan;
    text-align: center;
    padding: 3px 7px 3px 5px;
    
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
    
    cursor: pointer;
    visibility: visible;
}

/*** END - SUPPORT - SET PILE NUMBER ***/
/****************************************************/


/****************************************************/
/***  START - MAIN PANEL  ***/
.MainPanel {
    margin-right: 300px;
    top: 44px;
    bottom: 600px;  
    text-align: left;
    padding: 10px;
}
/***  END - MAIN PANEL  ***/
/****************************************************/


/****************************************************/
/*** START - TRACE INDICATOR ***/

.trace {
    position: absolute;
    left: 5px;
    bottom: 3px;
}
/*** END - TRACE INDICATOR ***/
/****************************************************/


/****************************************************/
/*** START - ABOUT - PRIVACY PANEL BUTTON ***/

.privacyPanelButton {
    position: absolute;
    z-index: 66;
    
    color: black;
    background-color: lightcyan;
    text-align: center;
    padding: 3px 7px 3px 7px;
        
    border-style: solid;
    border-color: purple;
    border-width: 2px;
    border-radius: 25px;
        
    /*  HAND POINTER  */
    cursor: pointer;
}
/*** END - ABOUT - PRIVACY PANEL BUTTON ***/
/****************************************************/


/****************************************************/
/*** START - WELCOME - MESSAGES ***/

.welcomeMessages {
    position: relative;
    text-align: center;
    color: black;
    font-size: 25px;
    font-weight: bold;
    z-index: 101;
}
/*** END - WELCOME - MESSAGES ***/
/****************************************************/


/*** END - FILE - style.css ***/