|
|
- @import url(https://fonts.googleapis.com/css?family=Lato);
- body {
- font-family: 'Lato', sans-serif; }
-
- h1 {
- font: normal normal normal 32px/40px 'Lato', sans-serif; }
-
- h2 {
- font: normal normal normal 24px/30px 'Lato', sans-serif; }
-
- .record {
- font: normal normal normal 16px/30px 'Lato', sans-serif; }
- .record #log, .record #inprogress {
- font-size: 10px; }
-
- button#start {
- font: normal normal normal 14px/30px 'Lato', sans-serif;
- margin: 20px 0;
- height: 30px;
- background: #4d16e4;
- border: none;
- border-radius: 2px;
- color: white; }
-
- input#shareLink {
- font-family: monospace;
- cursor: pointer;
- width: 400px; }
-
- .link {
- color: blue; }
-
- #status {
- font: normal normal bold 16px/20px 'Lato', sans-serif; }
-
- #tally {
- height: 40px;
- overflow: auto;
- white-space: nowrap; }
- #tally .gameTable {
- display: inline-block;
- padding-right: 13.5px; }
- #tally .gameTable:last-child {
- padding-right: 0px; }
- #tally .gameTable tr td {
- font-size: 0;
- line-height: 0;
- height: 8px;
- width: 8px;
- content: ""; }
-
- .gameTable tr td {
- font: normal normal bold 30px/30px 'Lato', sans-serif;
- border-bottom: 1px solid #333;
- border-right: 1px solid #333;
- height: 160px;
- width: 160px;
- text-align: center; }
- .gameTable tr td:last-child {
- border-right: none; }
- .gameTable tr td.dim {
- opacity: 0.3; }
- .gameTable tr td.dim.highlight {
- opacity: 1; }
- .gameTable tr td.highlight {
- opacity: 1; }
-
- .gameTable tr:last-child td {
- border-bottom: none; }
-
- .hide {
- display: none !important; }
-
- .tooltip {
- position: relative;
- display: inline-block; }
- .tooltip .tooltiptext {
- visibility: hidden;
- width: 140px;
- background-color: #555;
- color: #fff;
- text-align: center;
- border-radius: 6px;
- padding: 5px;
- position: absolute;
- z-index: 1;
- bottom: 150%;
- left: 50%;
- margin-left: -75px;
- opacity: 0;
- transition: opacity 0.3s; }
- .tooltip .tooltiptext::after {
- content: "";
- position: absolute;
- top: 100%;
- left: 50%;
- margin-left: -5px;
- border-width: 5px;
- border-style: solid;
- border-color: #555 transparent transparent transparent; }
- .tooltip:hover .tooltiptext {
- visibility: visible;
- opacity: 1; }
-
|