git.sesse.net Git - remoteglot/blob - www/css/remoteglot.css

   1 body {
   2         font-family: sans-serif;
   3 }
   4 h3 {
   5         margin-top: 1em;
   6         margin-bottom: 0;
   7 }
   8 #score {
   9         font-size: x-large;
  10         margin-top: 0;
  11 }
  12 .window {
  13         position: absolute;
  14         width: 0px;
  15         height: 0px;
  16         opacity: 0.0;
  17 }
  18 .c1 {
  19         opacity: 0.75;
  20 }
  21 .l1arrow {
  22         opacity: 1.0;
  23 }
  24 .hidden {
  25         display: none;
  26 }
  27 .vir path {
  28         opacity: 0.0;
  29 }
  30 .vir path.l1arrow {
  31         opacity: 1.0;
  32 }
  33 #credits {
  34         font-size: smaller;
  35 }
  36 td {
  37         vertical-align: top;
  38 }
  39 p {
  40         margin-top: 0;
  41 }
  42 #sortbyscoreholder {
  43         font-size: smaller;
  44         margin: 0;
  45         font-style: italic;
  46 }
  47 #refutationlines {
  48         font-size: smaller;
  49 }
  50 #refutationlines .move {
  51         width: 3.5em;
  52 }
  53 #refutationlines .score {
  54         width: 3em;
  55         text-align: right;
  56         padding-right: 0.5em;
  57 }
  58 #refutationlines .depth {
  59         width: 2em;
  60         text-align: right;
  61         padding-right: 0.7em;
  62 }
  63 .white-1e1d7.nonuglyhighlight {
  64         background-color: #cce5cf;
  65 }
  66 .black-3c85d.nonuglyhighlight {
  67         background-color: #9ab6a6;
  68 }
  69 #boardcontainer {
  70         width: 400px;
  71         margin-right: 1em;
  72         margin-bottom: 1em;
  73         float: left;
  74 }
  75 #board {
  76         display: block;
  77         width: 100%;
  78         padding: 0;
  79 }
  80 #hiddenboard {
  81         display: none;
  82 }
  83 #numviewers {
  84         display: block;
  85         width: 100%;
  86         text-align: center;
  87         font-size: smaller;
  88         margin-top: 0.5em;
  89         margin-bottom: 0;
  90 }
  91 #analysis {
  92         display: block;
  93         min-width: 400px;
  94         overflow: hidden;
  95 }
  96
  97 /* If the board is too wide for the screen, shrink it to fit,
  98  * and then put the analysis below. */
  99 @media all and (max-width: 400px) {
 100         #boardcontainer {
 101                 width: 100%;
 102                 float: none;
 103         }
 104         #analysis {
 105                 min-width: 0;
 106         }
 107 }
 108
 109 /* If there is almost space for the analysis, shrink the board a bit, too. */
 110 @media all and (min-width: 500px) and (max-width: 810px) {
 111         #boardcontainer {
 112                 float: left;
 113                 width: 50%;
 114         }
 115         #analysis {
 116                 min-width: 0;
 117         }
 118 }
 119 a.move {
 120         color: black;
 121         text-decoration: none;
 122 }
 123 a.move.highlight {
 124         color: red;
 125         font-weight: bold;
 126 }
 127 a.move:hover {
 128         font-weight: bold;
 129         text-decoration: underline;
 130 }
 131
 132 #linenav {
 133         display: none;
 134 }