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 #scorecontainer {
   9         font-size: x-large;
  10         margin-top: 0;
  11 }
  12 #score {
  13         float: left;
  14 }
  15 #scoresparkcontainer {
  16         overflow: hidden;
  17 }
  18 #scorespark {
  19         margin-left: 0.5em;
  20         margin-right: 0.5em;
  21 }
  22 #pvcontainer {
  23         clear: left;
  24 }
  25 .window {
  26         position: absolute;
  27         width: 0px;
  28         height: 0px;
  29         opacity: 0.0;
  30 }
  31 .c1 {
  32         opacity: 0.75;
  33 }
  34 .l1arrow {
  35         opacity: 1.0;
  36 }
  37 .hidden {
  38         display: none;
  39 }
  40 .vir path {
  41         opacity: 0.0;
  42 }
  43 .vir path.l1arrow {
  44         opacity: 1.0;
  45 }
  46 #news {
  47         font-size: smaller;
  48 }
  49 #credits {
  50         font-size: smaller;
  51 }
  52 td {
  53         vertical-align: top;
  54 }
  55 p {
  56         margin-top: 0;
  57 }
  58 #sortbyscoreholder {
  59         font-size: smaller;
  60         margin: 0;
  61         font-style: italic;
  62 }
  63 #refutationlines {
  64         font-size: smaller;
  65 }
  66 #refutationlines .move {
  67         width: 3.5em;
  68 }
  69 #refutationlines .score {
  70         width: 3em;
  71         text-align: right;
  72         padding-right: 0.5em;
  73 }
  74 #refutationlines .depth {
  75         width: 2em;
  76         text-align: right;
  77         padding-right: 0.7em;
  78 }
  79 .white-1e1d7.nonuglyhighlight {
  80         background-color: #cce5cf;
  81 }
  82 .black-3c85d.nonuglyhighlight {
  83         background-color: #9ab6a6;
  84 }
  85 #boardcontainer {
  86         width: 400px;
  87         margin-right: 1em;
  88         margin-bottom: 1em;
  89         float: left;
  90 }
  91 #board {
  92         display: block;
  93         width: 100%;
  94         padding: 0;
  95 }
  96 #hiddenboard {
  97         display: none;
  98 }
  99 #bottompanel {
 100         display: block;
 101         width: 100%;
 102         font-size: smaller;
 103         margin-top: 0.5em;
 104         margin-bottom: 0;
 105 }
 106 #numviewers {
 107         width: auto;
 108         text-align: center;
 109 }
 110 #whiteinfo {
 111         float: left;
 112         text-align: left;
 113         min-width: 20%;
 114 }
 115 #blackinfo {
 116         float: right;
 117         text-align: right;
 118         min-width: 20%;
 119         margin-right: 5px;
 120 }
 121 #whiteimbalance img, #blackimbalance img {
 122         vertical-align: text-top;
 123 }
 124 #whiteimbalance {
 125         margin-left: 5px;
 126 }
 127 #blackimbalance {
 128         margin-right: 5px;
 129 }
 130 .running-clock {
 131         font-weight: bold;
 132 }
 133 #analysis {
 134         display: block;
 135         min-width: 400px;
 136         overflow: hidden;
 137 }
 138
 139 /* If the board is too wide for the screen, shrink it to fit,
 140  * and then put the analysis below. */
 141 @media all and (max-width: 400px) {
 142         #boardcontainer {
 143                 width: 100%;
 144                 float: none;
 145         }
 146         #analysis {
 147                 min-width: 0;
 148         }
 149 }
 150
 151 /* If there is almost space for the analysis, shrink the board a bit, too. */
 152 @media all and (min-width: 500px) and (max-width: 810px) {
 153         #boardcontainer {
 154                 float: left;
 155                 width: 50%;
 156         }
 157         #analysis {
 158                 min-width: 0;
 159         }
 160 }
 161 a.move {
 162         color: black;
 163         text-decoration: none;
 164 }
 165 a.move.highlight {
 166         color: red;
 167         font-weight: bold;
 168 }
 169 a.move:hover {
 170         font-weight: bold;
 171         text-decoration: underline;
 172 }
 173
 174 #linenav {
 175         display: none;
 176 }