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 }
  11 .window {
  12         position: absolute;
  13         width: 0px;
  14         height: 0px;
  15         opacity: 0.0;
  16 }
  17 .c1 {
  18         opacity: 0.75;
  19 }
  20 .l1arrow {
  21         opacity: 1.0;
  22 }
  23 .hidden {
  24         display: none;
  25 }
  26 .vir path {
  27         opacity: 0.0;
  28 }
  29 .vir path.l1arrow {
  30         opacity: 1.0;
  31 }
  32 #credits {
  33         font-size: smaller;
  34 }
  35 td {
  36         vertical-align: top;
  37 }
  38 p {
  39         margin-top: 0;
  40 }
  41 #refutationlines {
  42         font-size: smaller;
  43 }
  44 #refutationlines .move {
  45         width: 3.5em;
  46 }
  47 #refutationlines .score {
  48         width: 3em;
  49         text-align: right;
  50         padding-right: 0.5em;
  51 }
  52 #refutationlines .depth {
  53         width: 2em;
  54         text-align: right;
  55         padding-right: 0.7em;
  56 }
  57 .white-1e1d7.nonuglyhighlight {
  58         background-color: #cce5cf;
  59 }
  60 .black-3c85d.nonuglyhighlight {
  61         background-color: #9ab6a6;
  62 }
  63 #board {
  64         display: block;
  65         float: left;
  66         width: 400px;
  67         margin-right: 1em;
  68         margin-bottom: 1em;
  69         padding: 0;
  70 }
  71 #analysis {
  72         display: block;
  73         min-width: 400px;
  74         overflow: hidden;
  75 }
  76
  77 /* If the board is too wide for the screen, shrink it to fit,
  78  * and then put the analysis below. */
  79 @media all and (max-width: 400px) {
  80         #board {
  81                 width: 100%;
  82                 float: none;
  83         }
  84         #analysis {
  85                 min-width: 0;
  86         }
  87 }
  88
  89 /* If there is almost space for the analysis, shrink the board a bit, too. */
  90 @media all and (min-width: 500px) and (max-width: 810px) {
  91         #board {
  92                 float: left;
  93                 width: 50%;
  94         }
  95         #analysis {
  96                 min-width: 0;
  97         }
  98 }