annotate www/oi/css/nodescore.css @ 101:52e44ee1c791 tip master

enabled all scores in autostart script
author Rob Canning <rc@kiben.net>
date Tue, 21 Apr 2015 16:20:57 +0100
parents d802954248a7
children
rev   line source
rob@100 1 body{
rob@100 2 font: 12px Helvetica, Arial;
rob@100 3 margin-left:0px;
rob@100 4 height:100%;
rob@100 5 }
rob@100 6
rob@100 7 h3,h4,h5,h6 {
rob@100 8 width: 400px;
rob@100 9 display: inline;
rob@100 10 color: #666;
rob@100 11 z-index: 2;
rob@100 12 }
rob@100 13
rob@100 14 h1{ font: 44px Helvetica, Arial; }
rob@100 15 h2 { font: 18px Helvetica, Arial; }
rob@100 16 h3{ font: 12px Helvetica, Arial; }
rob@100 17
rob@100 18 h4{ font: 19px Helvetica, Arial;
rob@100 19 text-align: center; margin-left:auto; margin-right:auto;
rob@100 20 }
rob@100 21
rob@100 22 a:link { color:#666;}
rob@100 23 a:visited { color: #666;}
rob@100 24 a:hover { color: black; background-color:orange; }
rob@100 25 a:active { color: black; background-color:white; }
rob@100 26
rob@100 27 ul, li, h4, h3, h2, h1, p{
rob@100 28 padding:0;
rob@100 29 margin:0;
rob@100 30 list-style:none;
rob@100 31 }
rob@100 32
rob@100 33 .soloscore{
rob@100 34 margin:0;
rob@100 35 margin-right:200px;
rob@100 36 float:right;
rob@100 37 height: 650px;
rob@100 38 width: 1150px;
rob@100 39 position: absolute;
rob@100 40 top:9%;
rob@100 41 left: 3000px;
rob@100 42 !margin: 0 auto;
rob@100 43 background:transparent;
rob@100 44 border:1px dashed red;
rob@100 45 }
rob@100 46
rob@100 47 #soloscore.anchor{display: block; position: relative; left: 1250px; visibility: hidden;}
rob@100 48
rob@100 49 #info{
rob@100 50 position: absolute;
rob@100 51 border-radius:15px;
rob@100 52 float:bottom;
rob@100 53 !top: 450px;
rob@100 54 height: 135px;
rob@100 55 width: 100%;
rob@100 56 }
rob@100 57
rob@100 58 #comms{
rob@100 59 position:fixed;
rob@100 60 top:12%;
rob@100 61 right: 10px;
rob@100 62 height: 70%;
rob@100 63 width: 180px;
rob@100 64 margin: 0px;
rob@100 65 color: white;
rob@100 66 }
rob@100 67
rob@100 68
rob@100 69 #preview{
rob@100 70 border-radius: 15px;
rob@100 71 height: 120px;
rob@100 72 width: 30%;
rob@100 73 margin: 0px;
rob@100 74 border: 1px solid gray;
rob@100 75 padding: 5px 5px 5px 5px;
rob@100 76 float:right;
rob@100 77 font-size:1em;
rob@100 78 }
rob@100 79
rob@100 80 #preview img{
rob@100 81 margin-top:15px;
rob@100 82 width:300px;
rob@100 83 background:transparent;
rob@100 84 position: relative;
rob@100 85 top:-20px;
rob@100 86 }
rob@100 87
rob@100 88 #remainingtime{
rob@100 89 padding:0px 10px;
rob@100 90 margin:0;
rob@100 91 font-size:2.2em;
rob@100 92 width:150px;
rob@100 93 float:right;
rob@100 94 !background-color:blue;
rob@100 95 position:relative;
rob@100 96 top:-5px;
rob@100 97 !left:0px;
rob@100 98 }
rob@100 99
rob@100 100 .footdata{
rob@100 101 margin-left:auto; margin-right:auto;
rob@100 102 border-radius: 15px;
rob@100 103 height: 50px;
rob@100 104 width: 100%;
rob@100 105 border: 0px solid gray;
rob@100 106 position:absolute;
rob@100 107 top: 0px;
rob@100 108 opacity:1;
rob@100 109 }
rob@100 110
rob@100 111 .outersquare{
rob@100 112 border-radius: 15px;
rob@100 113 border: 1px solid blue;
rob@100 114 padding: 1px 1px 1px 1px ;
rob@100 115 width: 99%;
rob@100 116 height: 490px;
rob@100 117 }
rob@100 118
rob@100 119 .svgmusic {
rob@100 120 padding:0px;
rob@100 121 border: 1px dashed green;
rob@100 122 display:block;
rob@100 123 border-radius: 15px;
rob@100 124 margin: 0px;
rob@100 125 width: 100%;
rob@100 126 height: 445px;
rob@100 127 min-height: 445px;
rob@100 128
rob@100 129 }
rob@100 130
rob@100 131
rob@100 132 #thesquare{ position:absolute;
rob@100 133 width:700px;
rob@100 134 }
rob@100 135 .magicsquare {
rob@100 136 border: 1px solid white;
rob@100 137 padding: 2px 2px 2px 2px;
rob@100 138 width: 110px;
rob@100 139 height: 100px;
rob@100 140 float: left;
rob@100 141 font-size: 3em;
rob@100 142 text-align:center
rob@100 143 }
rob@100 144
rob@100 145 .sqa {height:50%; width:50%; float:left; color: blue; }
rob@100 146 .sqb {height:50%; width:50%; float:right; color: green; }
rob@100 147 .sqc {height:50%; width:50%; float:left; color: aqua; }
rob@100 148 .sqd {height:50%; width:50%; float:right; color:red; }
rob@100 149
rob@100 150 .row { display:inline; }
rob@100 151 .row img{ width:160px; display:inline;}
rob@100 152 .row p{ display:inline; color:yellow;}
rob@100 153 .rrr { position:relative; display:inline;}
rob@100 154
rob@100 155 .sqrow{
rob@100 156 display:inline;
rob@100 157 padding: 2px 2px 10px 2px;
rob@100 158
rob@100 159 }
rob@100 160
rob@100 161 .latencies{
rob@100 162 /* height: 90px; width: 200px;
rob@100 163 border: 1px solid blue;
rob@100 164 position: relative; top: 15%;
rob@100 165 float: right;
rob@100 166 padding: 5px 5px 5px 5px ;
rob@100 167 background-color: yellow;
rob@100 168 */
rob@100 169 }
rob@100 170
rob@100 171 #datetime{
rob@100 172 float:left;
rob@100 173 width:90px;
rob@100 174 font-size:0.9em;
rob@100 175 text-align:center;
rob@100 176 background-color: transparent;
rob@100 177 }
rob@100 178
rob@100 179 #current{
rob@100 180 font-size:1.7em;
rob@100 181 font-weight: bold;
rob@100 182 background-color: transparent;
rob@100 183 z-index: 3;
rob@100 184 opacity: 0.8;
rob@100 185 padding: 3px 3px 3px 3px;
rob@100 186 }
rob@100 187
rob@100 188 #client_latency{
rob@100 189 position:absolute;
rob@100 190 right:100px;
rob@100 191 top:1px;
rob@100 192 background:transparent;
rob@100 193 float:right;
rob@100 194 font-size:1em;
rob@100 195 padding:0px 0px 10px 0px;
rob@100 196 }
rob@100 197
rob@100 198 #fluid {}
rob@100 199 .fluid-img{ height:50%; width:50%; }
rob@100 200 .clear { clear:both; }
rob@100 201
rob@100 202 #client_chronometer{
rob@100 203 float:right;
rob@100 204 font-size:3em;
rob@100 205 margin-right:50px;
rob@100 206 margin-top:10px;
rob@100 207 color:white;
rob@100 208 }
rob@100 209
rob@100 210 #views{
rob@100 211 position:absolute;
rob@100 212 left:65%;
rob@100 213 top:15px;
rob@100 214 float:left;
rob@100 215 }
rob@100 216
rob@100 217 .btn{background:yellow;
rob@100 218 font-size:1.2em;
rob@100 219 padding:1px;
rob@100 220 }
rob@100 221
rob@100 222 .formrow{
rob@100 223 float:left;
rob@100 224 }
rob@100 225
rob@100 226 #setPart{
rob@100 227 float:right;
rob@100 228 margin-right:70px;
rob@100 229 margin-top:15px;
rob@100 230 font-size:1.3em;
rob@100 231 background:orange;
rob@100 232 height:28px;
rob@100 233 }
rob@100 234
rob@100 235 #transport{
rob@100 236 position:absolute;
rob@100 237 right:240px;
rob@100 238 top:15px;
rob@100 239 float:right;
rob@100 240 color:white;
rob@100 241 font-size:1.3em;
rob@100 242 }
rob@100 243
rob@100 244 .transpbtn{
rob@100 245 color:white;
rob@100 246 font-size:1em;
rob@100 247 padding:1px;
rob@100 248 }
rob@100 249
rob@100 250 #ctrlstop{
rob@100 251 position:absolute;
rob@100 252 padding: 5px;
rob@100 253 border: 1px solid gray;
rob@100 254 bottom:120px;
rob@100 255 left:1800px;
rob@100 256 height:80px;
rob@100 257 width:230px;
rob@100 258 border-radius: 15px;
rob@100 259 color: gray;
rob@100 260 font-size: 3.5em;
rob@100 261 }
rob@100 262
rob@100 263 #counttitle{
rob@100 264 padding-left:10px;
rob@100 265 font-size:2em;
rob@100 266 margin:0;
rob@100 267 float:left;
rob@100 268 position:relative;
rob@100 269 top:-5px;
rob@100 270 }
rob@100 271
rob@100 272 .count {
rob@100 273 width:40px;
rob@100 274 font-size:2.5em;
rob@100 275 font-weight:bolder;
rob@100 276 margin:0;
rob@100 277 padding:0;
rob@100 278 position:relative;
rob@100 279 left:15%;
rob@100 280 top: -10px;
rob@100 281 background:transparent;
rob@100 282 float:left;
rob@100 283 }
rob@100 284
rob@100 285 #count{
rob@100 286 position:absolute;
rob@100 287 top:30%;
rob@100 288 }
rob@100 289
rob@100 290 #totalcountdown {
rob@100 291 position:absolute;
rob@100 292 top:-10%;
rob@100 293 left:20%;
rob@100 294 font-size:2em;
rob@100 295 font-weight:bolder;
rob@100 296 }
rob@100 297
rob@100 298 #countinnumber{
rob@100 299 border-radius: 15px;
rob@100 300 position: absolute;
rob@100 301 font-size: 10em;
rob@100 302 font-weight:bolder;
rob@100 303 display:inline;
rob@100 304 text-align:center;
rob@100 305 z-index: 2;
rob@100 306 opacity:0.5;
rob@100 307 float:left;
rob@100 308 }
rob@100 309
rob@100 310 #content-txt {
rob@100 311 width: 100%;
rob@100 312 height: 90%;
rob@100 313 font-size:3em;
rob@100 314 text-align:center;
rob@100 315 border:1px solid black;
rob@100 316 margin-left:auto; margin-right:auto;
rob@100 317 display:table-cell;
rob@100 318 vertical-align:middle;
rob@100 319 border-radius: 15px;
rob@100 320 }
rob@100 321
rob@100 322 .outermaster2{
rob@100 323 margin-top:5%;
rob@100 324 height: 700px;
rob@100 325 width: 4400px;
rob@100 326 border-radius: 15px;
rob@100 327 }
rob@100 328
rob@100 329 #preview-overview { width: 1200px;
rob@100 330 height: 600px;
rob@100 331 padding: 0px 0px 0px 115px;
rob@100 332 }
rob@100 333
rob@100 334 #preview-multi {
rob@100 335 height:700px;
rob@100 336 width: 1250px;
rob@100 337 padding: 0;
rob@100 338 position: absolute;
rob@100 339 left:1500px;
rob@100 340 top:60px;
rob@100 341 }
rob@100 342
rob@100 343 #preview-solo{
rob@100 344 position:absolute;
rob@100 345 border:0x dashed red;
rob@100 346 height:520px;
rob@100 347 }
rob@100 348
rob@100 349 #previewbox-solo-next{
rob@100 350 position:absolute;
rob@100 351 }
rob@100 352
rob@100 353 .solo-next{
rob@100 354 position:absolute;
rob@100 355 border:1px dashed blue;
rob@100 356 height:120px;
rob@100 357 width:22%;
rob@100 358 !float: right;
rob@100 359 bottom:0;
rob@100 360 right:0;
rob@100 361 background:transparent;
rob@100 362 padding:4px;
rob@100 363 margin:4px;
rob@100 364 }
rob@100 365
rob@100 366
rob@100 367 #nexttitle{
rob@100 368 position:absolute;
rob@100 369 left: -130px;
rob@100 370 top: 30px;
rob@100 371 color: orange;
rob@100 372 !z-index:1000;
rob@100 373 font-size:3em;
rob@100 374 opacity:0.6;
rob@100 375 }
rob@100 376
rob@100 377 .pview {
rob@100 378 border: 1px dashed gray;
rob@100 379 height:45%; width:45%; float:left;
rob@100 380 background:white;
rob@100 381 z-index:-100;
rob@100 382 margin-left:15px;
rob@100 383 margin-top:15px;
rob@100 384 position:relative;
rob@100 385 }
rob@100 386
rob@100 387 .pviewsolo {
rob@100 388 border: 1px dashed gray;
rob@100 389 width:100%;
rob@100 390 float:left;
rob@100 391 background:white;
rob@100 392 z-index:-100;
rob@100 393 position:relative;
rob@100 394 }
rob@100 395
rob@100 396 .pviewmusic {
rob@100 397 padding-top:40px;
rob@100 398 }
rob@100 399
rob@100 400 .middle { float: left;
rob@100 401 width: 10.8%;
rob@100 402 height: 12%;
rob@100 403 padding: 0;
rob@100 404 border: 0;
rob@100 405 margin: 0.33%;
rob@100 406 border: 1px dashed black;
rob@100 407 background:white;
rob@100 408 border-radius:1px;
rob@100 409 } /* 100 = 6 * widt\h + 12 * margin */
rob@100 410
rob@100 411 .middle p { font-size:2em;
rob@100 412 position:relative;
rob@100 413 left: 0px; opacity:0.5;
rob@100 414 color:blue;
rob@100 415 display:block;
rob@100 416 }
rob@100 417
rob@100 418 .middle img { padding: 0px 0px 0px 0px;
rob@100 419 position:relative; top:-15px;
rob@100 420 }
rob@100 421
rob@100 422 .middle:hover img {
rob@100 423 z-index:1000;
rob@100 424 width:500px;
rob@100 425 background-color: white;
rob@100 426 position: relative;
rob@100 427 top:60px;
rob@100 428 left:50px;
rob@100 429 border: 0px solid red;
rob@100 430 border-radius:10px;
rob@100 431 opacity: 1;
rob@100 432 box-shadow:4px -4px 10px 3px #888, inset 4px -4px 10px 3px #888;
rob@100 433 }
rob@100 434
rob@100 435 .middle p.indexnum { font-size:1em; color:black;
rob@100 436 position:relative; top:-80px; left:90px;
rob@100 437 opacity:1;
rob@100 438 }
rob@100 439
rob@100 440 .inner-0, .inner-1, .inner-2, .inner-3 {
rob@100 441 font-size:1em;
rob@100 442 float: left; width: 45%; height: 45%;
rob@100 443 padding: 0; border: 1px dashed gray;
rob@100 444 margin: 0;
rob@100 445 text-align: center;
rob@100 446 font-weight: bold;
rob@100 447 position:absolute;
rob@100 448 top: -105px;
rob@100 449
rob@100 450 }
rob@100 451
rob@100 452 .inner-0 { background-color: transparent; }
rob@100 453 .inner-1 { background-color: transparent; }
rob@100 454 .inner-2 { background-color: transparent; }
rob@100 455 .inner-3 { background-color: transparent; }
rob@100 456
rob@100 457 .musicianprog {
rob@100 458 display:inline;
rob@100 459 float:left;
rob@100 460 width:9%; background:transparent; height:14%;
rob@100 461 padding: 1px; text-align:center;
rob@100 462 position:absolute;
rob@100 463 }
rob@100 464
rob@100 465
rob@100 466 .tleftgroup {
rob@100 467 padding-top:0px;
rob@100 468 }
rob@100 469
rob@100 470 .timeleft {
rob@100 471 display:inline;
rob@100 472 width:9%;
rob@100 473 background:transparent;
rob@100 474 height:14%;
rob@100 475 padding: 1px;
rob@100 476 text-align:center;
rob@100 477 font-size:2.5em;
rob@100 478 position:absolute;
rob@100 479 right:0%;
rob@100 480 color:orange;
rob@100 481 padding:0;
rob@100 482 margin:0;
rob@100 483 }
rob@100 484
rob@100 485
rob@100 486 .unitseq {
rob@100 487 position:absolute;
rob@100 488 right:40%;
rob@100 489 text-align:center;
rob@100 490 font-size:2em;
rob@100 491 color:gray;
rob@100 492 margin:0;
rob@100 493 padding:0;
rob@100 494 }
rob@100 495
rob@100 496 .head{
rob@100 497 background:gray;
rob@100 498 opacity:1;
rob@100 499 padding:4px 0px 0px 4px;
rob@100 500 height:7%;
rob@100 501 position:fixed;
rob@100 502 top:0px;
rob@100 503 width:100%;
rob@100 504 }
rob@100 505
rob@100 506 .footx{
rob@100 507 margin:0px;
rob@100 508 background:gray;
rob@100 509 opacity:1;
rob@100 510 padding:10px;
rob@100 511 height:7%;
rob@100 512 position:fixed;
rob@100 513 bottom:0px;
rob@100 514 width:100%;
rob@100 515 padding:0px 0px 0px 10px;
rob@100 516 }
rob@100 517
rob@100 518
rob@100 519 #indexpagetitle{
rob@100 520 font-size:1.5em;
rob@100 521 float:left;
rob@100 522 margin-left:8%;
rob@100 523 padding:10px;
rob@100 524 margin-bottom:0px;
rob@100 525 color:white;
rob@100 526 letter-spacing:4px;
rob@100 527 }
rob@100 528
rob@100 529 .metrocase {
rob@100 530 margin-left:20px;
rob@100 531 margin-top:5px;
rob@100 532 float:left;
rob@100 533 border-radius: 4px;
rob@100 534 width: 60px;
rob@100 535 height:30px;
rob@100 536 color: black;
rob@100 537 text-align: center;
rob@100 538 font-size: 4em;
rob@100 539 border: 1px solid white;
rob@100 540 }
rob@100 541
rob@100 542 #metronome0 { width: 60px; height: 30px; border-radius: 4px; float:left; }
rob@100 543 #links {position:absolute; bottom:150px; left: 800px; width:900px;}
rob@100 544
rob@100 545 #transect {
rob@100 546 float:left;
rob@100 547 font-size:2em;
rob@100 548 padding:3px;
rob@100 549 padding-left:20px;
rob@100 550 margin-top:15px;
rob@100 551 background:yellow;
rob@100 552 width:250px;
rob@100 553 }
rob@100 554
rob@100 555 .tportpop {
rob@100 556 width:200px;
rob@100 557 height: 90px;
rob@100 558 margin: 1px solid white;
rob@100 559 position:relative;
rob@100 560 left:300px; top:60px;
rob@100 561 border: 1px solid green;
rob@100 562 border-radius: 1px; padding: 5px;
rob@100 563 }