splash.css (9768B)
1 @font-face{ 2 font-family: "Latin-Mono-Regular"; 3 src: url('fonts/lmmono10-regular.otf'), 4 url('fonts/lmmono10-regular.otf'); /* IE */ 5 } 6 7 @font-face{ 8 font-family: "Latin-Mono-Italic"; 9 src: url('fonts/lmmono10-italic.otf'), 10 url('fonts/lmmono10-italic.otf'); /* IE */ 11 } 12 13 @font-face{ 14 font-family: "Roberta"; 15 src: url('fonts/roberta.ttf'), 16 url('fonts/roberta.ttf'); /* IE */ 17 } 18 19 @font-face{ 20 font-family: "Digital"; 21 src: url('fonts/digital_counter_7.ttf'), 22 url('fonts/digital_counter_7.ttf'); /* IE */ 23 } 24 @font-face{ 25 font-family: "Retro"; 26 src: url('fonts/retro.ttf'), 27 url('fonts/retro.ttf'); /* IE */ 28 } 29 @font-face{ 30 font-family: "Cyber"; 31 src: url('fonts/cyber.ttf'), 32 url('fonts/cyber.ttf'); /* IE */ 33 } 34 35 body 36 { 37 margin:0 auto; 38 border:0px; 39 text-align: center; 40 background-color:#242021; 41 font-family: 'Latin-Mono-Regular', sans-serif; 42 font-weight: normal; 43 color: #f4f4f4; 44 font-size: 12pt; 45 } 46 47 a 48 { 49 color:#FFBA00; 50 text-decoration: none; 51 } 52 53 a:hover 54 { 55 color: #fcdd09; 56 padding: 2px; 57 } 58 59 h1 60 { 61 padding: 0px; 62 margin: 0px; 63 font-size: 100px; 64 color:#f8f9fa; 65 font-family: 'Roberta', sans-serif; 66 line-height: 75px; 67 font-weight: normal; 68 } 69 70 h2 71 { 72 padding: 0px; 73 margin: 0px; 74 font-size: 50pt; 75 line-height: 55px; 76 font-family: 'Latin-Mono-Italic', sans-serif; 77 font-weight: normal; 78 } 79 80 81 h3 82 { 83 padding: 0px; 84 margin: 0px; 85 font-size: 50pt; 86 line-height: 45px; 87 color:#f8f9fa; 88 text-transform:uppercase; 89 font-family: 'Roberta', sans-serif; 90 font-weight: normal; 91 } 92 93 h4 94 { 95 padding: 0px; 96 margin: 0px; 97 font-size: 35pt; 98 line-height: 40px; 99 font-family: 'Cyber', sans-serif; 100 font-weight: normal; 101 } 102 103 h5 104 { 105 padding: 0px; 106 margin: 30px; 107 color:#f8f9fa; 108 font-size: 35pt; 109 line-height: 40px; 110 font-family: 'Retro', sans-serif; 111 font-weight: normal; 112 } 113 114 h6 115 { 116 padding: 0px; 117 margin: 0px; 118 font-size: 30pt; 119 font-family: 'Digital', sans-serif; 120 font-weight: normal; 121 } 122 123 124 table 125 { 126 padding: 0px; 127 margin: 0px auto; 128 width: 80%; 129 font-style: normal; 130 font-weight: normal; 131 132 } 133 134 td { 135 display: block; 136 clear:both; 137 } 138 139 th { 140 display: block; 141 clear:both; 142 } 143 144 video 145 { 146 width: 100%; 147 } 148 149 input 150 { 151 width: 70%; 152 height: 30px; 153 border: 0px solid; 154 color: #fff; 155 padding-left: 5px; 156 padding-right: 5px; 157 background-color:#555; 158 border-radius: 3px; 159 } 160 161 button 162 { 163 color: #fff; 164 border-radius: 3px; 165 font-size: 14pt; 166 font-family: 'Roberta', sans-serif; 167 background-color: #444; 168 border: 0px; 169 padding: 5px; 170 height: 30px; 171 width: 20%; 172 } 173 174 button:hover 175 { 176 177 background-color: #ff0000; 178 } 179 180 img 181 { 182 border-radius: 30px; 183 width: 100%; 184 max-width: 900px; 185 } 186 187 #container 188 { 189 margin: 0px auto; 190 height: auto; 191 max-width: 500px; 192 text-align: center; 193 } 194 195 #propaganda-container 196 { 197 margin: 0px auto; 198 height: auto; 199 width: 90%; 200 text-align: center; 201 } 202 203 .introtext 204 { 205 margin: 0px auto; 206 width: 80%; 207 height: auto; 208 text-align: center; 209 max-width: 400px; 210 } 211 212 .promotext 213 { 214 margin: 0px auto; 215 width: 50%; 216 height: auto; 217 text-align: center; 218 max-width: 300px; 219 } 220 221 .bild 222 { 223 224 background-color: #29252b; 225 border-radius: 5px; 226 } 227 .bild p 228 { 229 font-size: 14px; 230 margin:0px; 231 } 232 .bild h4 233 { 234 padding:5px; 235 } 236 237 #album 238 { 239 margin: 0px auto; 240 height: auto; 241 width: 90%; 242 max-width: 900px; 243 } 244 245 #default 246 { 247 margin: 0 auto; 248 padding-top: 5px; 249 width: 95%; 250 max-width: 400px; 251 height: auto; 252 } 253 254 #logo 255 { 256 padding-top: 5px; 257 width: 95%; 258 padding-bottom: 6px; 259 } 260 261 #tools 262 { 263 font-family: 'Roberta', sans-serif; 264 font-size:25pt; 265 padding-bottom: 10px; 266 } 267 268 #shoutbox 269 { 270 text-align: left; 271 padding-left: 5%; 272 padding-top: 10px; 273 padding-bottom: 20px; 274 } 275 276 #shoutbox p 277 { 278 margin: 2px; 279 } 280 281 #matrix-shoutbox 282 { 283 margin-top: 10px; 284 } 285 286 #matrix-shoutbox img 287 { 288 width: 90%; 289 } 290 291 #time 292 { 293 font-size: 8pt; 294 color: #98ffff; 295 } 296 297 #msg 298 { 299 font-size: 11pt; 300 color: #98ffff; 301 } 302 303 #top 304 { 305 margin: 0 auto; 306 text-align: center; 307 height: 60vh; 308 width: 50%; 309 } 310 311 #robin 312 { 313 background-color:#3B6861; 314 padding-bottom: 100px; 315 margin: 0px auto; 316 font-weight: normal; 317 font-size: 16px; 318 text-align: center; 319 } 320 321 #footer 322 { 323 position: fixed; 324 margin: 0 auto; 325 background-color:#231f20; 326 font-weight: normal; 327 font-size: 17px; 328 bottom:0px; 329 padding-top:10px; 330 height:30px; 331 width: 100%; 332 } 333 334 #onair 335 { 336 font-size: 30px; 337 color: #DB232C; 338 opacity: 0.2; 339 } 340 341 #tipjar img 342 { 343 max-width: 350px; 344 padding:2px; 345 background-color:#fff; 346 width: 35%; 347 border-radius: 2px; 348 } 349 #onair.neon {opacity: 1} 350 #onair.neonoff {opacity: 0.2} 351 352 #onairvideo 353 { 354 font-family: "Digital"; 355 font-size: 14px; 356 color: #032604; 357 opacity: 0.5; 358 text-align: center; 359 padding-top: 5px; 360 padding-bottom: 5px; 361 } 362 363 #onairvideo.neongreen {opacity: 1} 364 #onairvideo.neongreenoff {opacity: 0.2} 365 366 #song { 367 font-family: "Digital"; 368 font-size: 15px; 369 color: #fcdd09; 370 opacity: 0.5; 371 text-align: center; 372 padding-top: 10px; 373 } 374 375 #lyssnare { 376 font-family: "Digital"; 377 font-size: 15px; 378 color: #7CFC00; 379 opacity: 0.5; 380 text-align: center; 381 padding-top: 10px; 382 } 383 384 #bag 385 { 386 margin: 0px auto; 387 position:fixed; 388 color:#fff; 389 top:0; 390 width:100%; 391 background:#0A5200; 392 } 393 394 #insidebag 395 { 396 margin: 10px auto; 397 font-size: 14px; 398 width:100%; 399 } 400 401 table, tbody, tr, td 402 { 403 width: 100%; 404 } 405 406 input, select 407 { 408 padding: 4px; 409 color: #fff; 410 background-color: #555; 411 font-size: 16px; 412 border: 0px; 413 } 414 415 textarea 416 { 417 padding: 4px; 418 color: #fff; 419 background-color: #555; 420 font-size: 16px; 421 border: 0px; 422 width: 100%; 423 height: 20px; 424 } 425 426 button 427 { 428 margin:10px; 429 padding: 4px; 430 font-size: 18px; 431 color: #fff; 432 background-color: #333; 433 width: 90%; 434 } 435 436 pre 437 { 438 white-space: pre-wrap; /* Since CSS 2.1 */ 439 white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 440 white-space: -pre-wrap; /* Opera 4-6 */ 441 white-space: -o-pre-wrap; /* Opera 7 */ 442 word-wrap: break-word; /* Internet Explorer 5.5+ */ 443 } 444 445 .logo 446 { 447 width: 80%; 448 height:auto; 449 } 450 451 .logo2 452 { 453 width: 70%; 454 height:auto; 455 } 456 457 .intro 458 { 459 margin: 10px auto; 460 scroll-margin-top: 10rem; 461 padding: 10px; 462 border-radius:5px; 463 padding-bottom: 20px; 464 } 465 466 .product 467 { 468 margin: 10px auto; 469 scroll-margin-top: 10rem; 470 width: 80%; 471 padding: 10px; 472 border-radius:5px; 473 background-color:#333; 474 padding-bottom: 20px; 475 } 476 477 .editproduct 478 { 479 margin: 1px; 480 display:inline-block; 481 border-radius:5px; 482 background-color:#333; 483 } 484 485 .orders 486 { 487 margin:0 auto; 488 background-color:#333; 489 font-weight: normal; 490 font-style: normal; 491 font-size: 15px; 492 padding-top: 5px; 493 padding-left: 20px; 494 padding-right: 20px; 495 text-align: left; 496 height: auto; 497 width: 90%; 498 padding-bottom: 20px; 499 border-radius:5px; 500 } 501 502 .imgprod 503 { 504 border-radius:5px; 505 } 506 507 #payid 508 { 509 margin: 0px auto; 510 color: #888; 511 text-decoration: normal; 512 background-color: #111; 513 border: 0px; 514 width: 100%; 515 font-size: 10px; 516 text-align: center; 517 white-space: pre-wrap; /* CSS3 */ 518 white-space: -moz-pre-wrap; /* Firefox */ 519 white-space: -pre-wrap; /* Opera <7 */ 520 white-space: -o-pre-wrap; /* Opera 7 */ 521 word-wrap: break-word; /* IE */ 522 } 523 524 #payreq 525 { 526 margin: 0px auto; 527 color: #888; 528 background-color: #111; 529 border: 0px; 530 width: 100%; 531 height: 55px; 532 font-size: 10px; 533 text-align: center; 534 white-space: pre-wrap; /* CSS3 */ 535 white-space: -moz-pre-wrap; /* Firefox */ 536 white-space: -pre-wrap; /* Opera <7 */ 537 white-space: -o-pre-wrap; /* Opera 7 */ 538 word-wrap: break-word; /* IE */ 539 } 540 541 #copybutton 542 { 543 color: #333; 544 text-decoration: bold; 545 background-color: #111; 546 border: 0px; 547 padding: 5px; 548 width: auto; 549 } 550 551 #backbutton 552 { 553 color: #333; 554 text-decoration: bold; 555 background-color: #111; 556 border: 0px; 557 padding: 5px; 558 width: auto; 559 } 560 561 #description 562 { 563 height:300px; 564 } 565 566 #description2 567 { 568 height:300px; 569 } 570 571 .neonoff { 572 font-family: "Latin-Mono-Regular"; 573 color: #DB232C; 574 text-transform: uppercase; 575 text-align: center; 576 opacity: 0.2; 577 } 578 579 .neon { 580 font-family: "Roberta"; 581 color: #DB232C; 582 text-align: center; 583 opacity: 1; 584 } 585 586 .neon { 587 animation: neon 20.9s infinite alternate; 588 -moz-animation: neon 20.9s infinite alternate; 589 -webkit-animation: neon 20.9s infinite alternate; 590 } 591 592 .neongreenoff { 593 font-family: "Digital"; 594 color: #23db29; 595 text-transform: uppercase; 596 text-align: center; 597 opacity: 0.2; 598 } 599 600 .neongreen { 601 font-family: "Digital"; 602 color: #D2974E; 603 text-transform: uppercase; 604 text-align: center; 605 opacity: 1; 606 } 607 608 .neongreen { 609 animation: neongreen 20.9s infinite alternate; 610 -moz-animation: neongreen 20.9s infinite alternate; 611 -webkit-animation: neongreen 20.9s infinite alternate; 612 } 613 614 @keyframes neon { 615 0%, 19%, 21%, 23%, 25%, 14%, 6%, 10% { 616 text-shadow: 0 0 1vw #FA1C16, 0 0 3vw #FA1C16, 0 0 10vw #FA1C16, 0 0 10vw #FA1C16; 617 color: #DB232C; 618 } 619 50% { 620 text-shadow: 0 0 .5vw #800E0B, 0 0 1.5vw #800E0B, 0 0 5vw #800E0B, 0 0 5vw #800E0B; 621 } 622 20%, 24%, 55% { 623 text-shadow: none; 624 box-shadow: none; 625 } 626 } 627 628 @keyframes neongreen { 629 0%, 19%, 21%, 23%, 25%, 14%, 26%, 10% { 630 text-shadow: 0 0 1vw #16fa1e, 0 0 3vw #16fa1e, 0 0 10vw #16fa1e, 0 0 10vw #16fa1e; 631 color: #26db23; 632 } 633 50% { 634 text-shadow: 0 0 .5vw #0d7f0b, 0 0 1.5vw #0d7f0b, 0 0 5vw #0d7f0b, 0 0 5vw #0d7f0b; 635 } 636 2%, 14%, 5% { 637 text-shadow: none; 638 box-shadow: none; 639 } 640 } 641