body{
  background-color: #cdd2f0;
  font-family: Arial, Helvetica, sans-serif;
  text-align: center;
  font-size: .9rem;
}

html, body {
  touch-action: manipulation;
}

.intGridContainer {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 4px 0px;
}

.settingsContainer{
  line-height: 1.5;
}

/* #gridGollyName{
  font-size:xx-large;
} */

#gridSillyName{
  font-size: large;
}

.ramble{
  margin:auto;
  width:80%;
  text-align: left;
}

.grid table, .grid th, .grid td {
  border:2px solid #2b2b2d;
  border-collapse: collapse;
}

.grid tr{
    height: 60px;
}

.grid td{
   background-color: #484d6977;
   width: 60px;
}

.grid td.active{
  background-color: #fff157;
}

.grid td.middle{
  background-color: #a64c68bb;
  color: #3c0404cc;
  font-size: xx-large;
}

.grid td.corner, .grid td.edge{
  cursor: pointer;
}

#resultsTableContainer, #intResultsTableContainer, #intBoardContainer{
  overflow-x: auto;
  width: 100%;
}

#intBoardContainer{
  padding:3px 0;
}

#resultsTableContainer table, #resultsTableContainer th, #resultsTableContainer td{
  border:1px solid #2b2b2d;
  border-collapse: collapse;
}

#intResultsTableContainer table, #intResultsTableContainer th, #intResultsTableContainer td{
  border:1px solid #2b2b2d;
  border-collapse: collapse;
}

#resultsTableContainer table, #intResultsTableContainer table, #intBoardContainer table{
  white-space: nowrap;
}

#resultsTable, #intResultsTable{
  width: 100%;
}

#resultsTableContainer th, #resultsTableContainer td, #intResultsTableContainer th, #intResultsTableContainer td{
  padding:2px;
}

#detailTableContainer, #intDetailTableContainer{
  padding:5px 0px;
}

.intBoardInitSetting{
  width: 40px;
}

#intBoardContainer table, #intBoardContainer tr, #intBoardContainer td{
  border:1px solid #2b2b2d;
  border-collapse: collapse;
}

#intBoardContainer tr{
  height: 30px;
}


#intBoardContainer td{
  background-color: #484d6977;
  color:#08080ccc;
  width: 30px;
  text-align: center;
}


#intBoardContainer td.active{
  background-color: #fff157;
  color:#290d02bb;
}

#intBoard{
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;
}

button {
    text-rendering: auto;
    color: black;
    letter-spacing: normal;
    word-spacing: normal;
    line-height: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    text-align: center;
    cursor: default;
    box-sizing: border-box;
    background-color: #efeff3;
    margin: 0em 0em 0em 0em;
    padding-block: 1px;
    padding-inline: 6px;
    border: 1px solid black;
}

button:disabled{
  background-color: #e4e4e7;
  color: #707070;
  border: 1px solid #707070;
}

button.highlighted{
  background-color: #bdffbd;
  border: 1px solid #00760e;
}