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