1 /* file: android-developer-core.css 2 author: smain 3 date: september 2008 4 info: core developer styles (developer.android.com) 5 */ 6 7 8 /* RESET STYLES */ 9 10 html,body,div,h1,h2,h3,h4,h5,h6,p,img, 11 dl,dt,dd,ol,ul,li,table,caption,tbody, 12 tfoot,thead,tr,th,td,form,fieldset, 13 embed,object,applet { 14 margin: 0; 15 padding: 0; 16 border: 0; 17 } 18 19 /* BASICS */ 20 21 html, body { 22 overflow:hidden; /* keeps scrollbar off IE */ 23 background-color:#fff; 24 } 25 26 body { 27 font-family:arial,sans-serif; 28 color:#000; 29 font-size:13px; 30 color:#333; 31 background-image:url(images/bg_fade.jpg); 32 background-repeat:repeat-x; 33 } 34 35 a, a code { 36 color:#006699; 37 } 38 39 a:active, 40 a:active code { 41 color:#f00; 42 } 43 44 a:visited, 45 a:visited code { 46 color:#006699; 47 } 48 49 input, select, 50 textarea, option, label { 51 font-family:inherit; 52 font-size:inherit; 53 padding:0; 54 margin:0; 55 vertical-align:middle; 56 } 57 58 option { 59 padding:0 4px; 60 } 61 62 p, form { 63 padding:0; 64 margin:0 0 1em; 65 } 66 67 code, pre { 68 color:#007000; 69 font-family:monospace; 70 line-height:1em; 71 } 72 73 var { 74 color:#007000; 75 font-style:italic; 76 } 77 78 pre { 79 border:1px solid #ccc; 80 background-color:#fafafa; 81 padding:10px; 82 margin:0 0 1em 1em; 83 overflow:auto; 84 line-height:inherit; /* fixes vertical scrolling in webkit */ 85 } 86 87 h1,h2,h3,h4,h5 { 88 margin:1em 0; 89 padding:0; 90 } 91 92 p,ul,ol,dl,dd,dt,li { 93 line-height:1.3em; 94 } 95 96 ul,ol { 97 margin:0 0 .8em; 98 padding:0 0 0 2em; 99 } 100 101 li { 102 padding:0 0 .5em; 103 } 104 105 dl { 106 margin:0 0 1em 0; 107 padding:0; 108 } 109 110 dt { 111 margin:0; 112 padding:0; 113 } 114 115 dd { 116 margin:0 0 1em; 117 padding:0 0 0 2em; 118 } 119 120 li p { 121 margin:.5em 0 0; 122 } 123 124 dd p { 125 margin:1em 0 0; 126 } 127 128 li pre, li table, li img { 129 margin:.5em 0 0 1em; 130 } 131 132 dd pre, 133 #jd-content dd table, 134 #jd-content dd img { 135 margin:1em 0 0 1em; 136 } 137 138 li ul, 139 li ol, 140 dd ul, 141 dd ol { 142 margin:0; 143 padding: 0 0 0 2em; 144 } 145 146 li li, 147 dd li { 148 margin:0; 149 padding:.5em 0 0; 150 } 151 152 dl dl, 153 ol dl, 154 ul dl { 155 margin:0 0 1em; 156 padding:0; 157 } 158 159 table { 160 font-size:1em; 161 margin:0 0 1em; 162 padding:0; 163 border-collapse:collapse; 164 border-width:0; 165 empty-cells:show; 166 } 167 168 td,th { 169 border:1px solid #ccc; 170 padding:6px 12px; 171 text-align:left; 172 vertical-align:top; 173 background-color:inherit; 174 } 175 176 th { 177 background-color:#dee8f1; 178 } 179 180 td > p:last-child { 181 margin:0; 182 } 183 184 hr.blue { 185 background-color:#DDF0F2; 186 border:none; 187 height:5px; 188 margin:20px 0 10px; 189 } 190 191 blockquote { 192 margin: 0 0 1em 1em; 193 padding: 0 4em 0 1em; 194 border-left:2px solid #eee; 195 } 196 /* LAYOUT */ 197 198 #body-content { 199 /* "Preliminary" watermark for preview releases and interim builds. 200 background:transparent url(images/preliminary.png) repeat scroll 0 0; */ 201 margin:0; 202 position:relative; 203 width:100%; 204 } 205 206 #header { 207 height: 114px; 208 position:relative; 209 z-index:100; 210 min-width:675px; /* min width for the tabs, before they wrap */ 211 padding:0 10px; 212 border-bottom:3px solid #94b922; 213 } 214 215 #headerLeft{ 216 padding: 25px 0 0; 217 } 218 219 #headerLeft img{ 220 height:50px; 221 width:180px; 222 } 223 224 #headerRight { 225 position:absolute; 226 right:0; 227 top:0; 228 text-align:right; 229 } 230 231 /* Tabs in the header */ 232 233 #header ul { 234 list-style: none; 235 margin: 7px 0 0; 236 padding: 0; 237 height: 29px; 238 } 239 240 #header li { 241 float: left; 242 margin: 0px 2px 0px 0px; 243 padding:0; 244 } 245 246 #header li a { 247 text-decoration: none; 248 display: block; 249 background-image: url(images/bg_images_sprite.png); 250 background-position: 0 -58px; 251 background-repeat: no-repeat; 252 color: #666; 253 font-size: 13px; 254 font-weight: bold; 255 width: 94px; 256 height: 29px; 257 text-align: center; 258 margin: 0px; 259 } 260 261 #header li a:hover { 262 background-image: url(images/bg_images_sprite.png); 263 background-position: 0 -29px; 264 background-repeat: no-repeat; 265 } 266 267 #header li a span { 268 position:relative; 269 top:7px; 270 } 271 272 #header li a span+span { 273 display:none; 274 } 275 276 /* tab highlighting */ 277 278 .home #home-link a, 279 .guide #guide-link a, 280 .reference #reference-link a, 281 .sdk #sdk-link a, 282 .resources #resources-link a, 283 .videos #videos-link a { 284 background-image: url(images/bg_images_sprite.png); 285 background-position: 0 0; 286 background-repeat: no-repeat; 287 color: #fff; 288 font-weight: bold; 289 cursor:default; 290 } 291 292 .home #home-link a:hover, 293 .guide #guide-link a:hover, 294 .reference #reference-link a:hover, 295 .sdk #sdk-link a:hover, 296 .resources #resources-link a:hover, 297 .videos #videos-link a:hover { 298 background-image: url(images/bg_images_sprite.png); 299 background-position: 0 0; 300 } 301 302 #headerLinks { 303 margin:10px 10px 0 0; 304 height:13px; 305 font-size: 11px; 306 vertical-align: top; 307 } 308 309 #headerLinks a { 310 color: #7FA9B5; 311 } 312 313 #headerLinks img { 314 vertical-align:middle; 315 } 316 317 #language { 318 margin:0 10px 0 4px; 319 } 320 321 #search { 322 height:45px; 323 margin:15px 10px 0 0; 324 } 325 326 /* MAIN BODY */ 327 328 #mainBodyFluid { 329 margin: 20px 10px; 330 color:#333; 331 } 332 333 #mainBodyFixed { 334 margin: 20px 10px; 335 color: #333; 336 width:930px; 337 position:relative; 338 } 339 340 #mainBodyFixed h3, 341 #mainBodyFluid h3 { 342 color:#336666; 343 font-size:1.25em; 344 margin: 0em 0em 0em 0em; 345 padding-bottom:.5em; 346 } 347 348 #mainBodyFixed h2, 349 #mainBodyFluid h2 { 350 color:#336666; 351 font-size:1.25em; 352 margin: 0; 353 padding-bottom:.5em; 354 } 355 356 #mainBodyFixed h1, 357 #mainBodyFluid h1 { 358 color:#435A6E; 359 font-size:1.7em; 360 margin: 1em 0; 361 } 362 363 #mainBodyFixed .green, 364 #mainBodyFluid .green, 365 #jd-content .green { 366 color:#7BB026; 367 background-color:none; 368 } 369 370 #mainBodyLeft { 371 float: left; 372 width: 600px; 373 margin-right: 20px; 374 color: #333; 375 position:relative; 376 } 377 378 div.indent { 379 margin-left: 40px; 380 margin-right: 70px; 381 } 382 383 #mainBodyLeft p { 384 color: #333; 385 font-size: 13px; 386 } 387 388 #mainBodyLeft p.blue { 389 color: #669999; 390 } 391 392 #mainBodyLeft #communityDiv { 393 float: left; 394 background-image:url(images/bg_community_leftDiv.jpg); 395 background-repeat: no-repeat; 396 width: 581px; 397 height: 347px; 398 padding: 20px 0px 0px 20px; 399 } 400 401 #mainBodyRight { 402 float: left; 403 width: 300px; 404 color: #333; 405 } 406 407 #mainBodyRight p { 408 padding-right: 50px; 409 color: #333; 410 } 411 412 #mainBodyRight table { 413 width: 100%; 414 } 415 416 #mainBodyRight td { 417 border:0px solid #666; 418 padding:0px 5px; 419 text-align:left; 420 } 421 422 #mainBodyRight td p { 423 margin:0 0 1em 0; 424 } 425 426 #mainBodyRight .blueBorderBox { 427 border:5px solid #ddf0f2; 428 padding:18px 18px 18px 18px; 429 text-align:left; 430 } 431 432 #mainBodyFixed .seperator { 433 background-image:url(images/hr_gray_side.jpg); 434 background-repeat:no-repeat; 435 width: 100%; 436 float: left; 437 clear: both; 438 } 439 440 #mainBodyBottom { 441 float: left; 442 width: 100%; 443 clear:both; 444 color: #333; 445 } 446 447 #mainBodyBottom .seperator { 448 background-image:url(images/hr_gray_main.jpg); 449 background-repeat:no-repeat; 450 width: 100%; 451 float: left; 452 clear: both; 453 } 454 455 /* FOOTER */ 456 457 #footer { 458 float: left; 459 width:90%; 460 margin: 20px; 461 color: #aaa; 462 font-size: 11px; 463 } 464 465 #footer a { 466 color: #aaa; 467 font-size: 11px; 468 } 469 470 #footer a:hover { 471 text-decoration: underline; 472 color:#aaa; 473 } 474 475 #footerlinks { 476 margin-top:2px; 477 } 478 479 #footerlinks a, 480 #footerlinks a:visited { 481 color:#006699; 482 } 483 484 /* SEARCH FILTER */ 485 486 #search_autocomplete { 487 color:#aaa; 488 } 489 490 #search-button { 491 display:inline; 492 } 493 494 #search_filtered_div { 495 position:absolute; 496 margin-top:-1px; 497 z-index:101; 498 border:1px solid #BCCDF0; 499 background-color:#fff; 500 } 501 502 #search_filtered { 503 min-width:100%; 504 } 505 #search_filtered td{ 506 background-color:#fff; 507 border-bottom: 1px solid #669999; 508 line-height:1.5em; 509 } 510 511 #search_filtered .jd-selected { 512 background-color: #94b922; 513 cursor:pointer; 514 } 515 #search_filtered .jd-selected, 516 #search_filtered .jd-selected a { 517 color:#fff; 518 } 519 520 .no-display { 521 display: none; 522 } 523 524 .jd-autocomplete { 525 font-family: Arial, sans-serif; 526 padding-left: 6px; 527 padding-right: 6px; 528 padding-top: 1px; 529 padding-bottom: 1px; 530 font-size: 0.81em; 531 border: none; 532 margin: 0; 533 line-height: 1.05em; 534 } 535 536 .show-row { 537 display: table-row; 538 } 539 .hide-row { 540 display: hidden; 541 } 542 543 /* SEARCH */ 544 545 /* restrict global search form width */ 546 #searchForm { 547 width:350px; 548 } 549 550 #searchTxt { 551 width:200px; 552 } 553 554 /* disable twiddle and size selectors for left column */ 555 #leftSearchControl div { 556 width: 100%; 557 } 558 559 #leftSearchControl .gsc-twiddle { 560 background-image : none; 561 } 562 563 #leftSearchControl td, #searchForm td { 564 border: 0px solid #000; 565 } 566 567 #leftSearchControl .gsc-resultsHeader .gsc-title { 568 padding-left : 0px; 569 font-weight : bold; 570 font-size : 13px; 571 color:#006699; 572 display : none; 573 } 574 575 #leftSearchControl .gsc-resultsHeader div.gsc-results-selector { 576 display : none; 577 } 578 579 #leftSearchControl .gsc-resultsRoot { 580 padding-top : 6px; 581 } 582 583 #leftSearchControl div.gs-visibleUrl-long { 584 display : block; 585 color:#006699; 586 } 587 588 .gsc-webResult div.gs-visibleUrl-short, 589 table.gsc-branding, 590 .gsc-clear-button { 591 display : none; 592 } 593 594 .gsc-cursor-box .gsc-cursor div.gsc-cursor-page, 595 .gsc-cursor-box .gsc-trailing-more-results a.gsc-trailing-more-results, 596 #leftSearchControl a, 597 #leftSearchControl a b { 598 color:#006699; 599 } 600 601 .gsc-resultsHeader { 602 display: none; 603 } 604 605 /* Disable built in search forms */ 606 .gsc-control form.gsc-search-box { 607 display : none; 608 } 609 table.gsc-search-box { 610 margin:6px 0 0 0; 611 border-collapse:collapse; 612 } 613 614 td.gsc-input { 615 padding:0 2px; 616 width:100%; 617 vertical-align:middle; 618 } 619 620 input.gsc-input { 621 border:1px solid #BCCDF0; 622 width:99%; 623 padding-left:2px; 624 font-size:.95em; 625 } 626 627 td.gsc-search-button { 628 text-align: right; 629 padding:0; 630 vertical-align:top; 631 } 632 633 #search-button { 634 margin:0 0 0 2px; 635 font-size:11px; 636 } 637 638 /* search result tabs */ 639 640 #doc-content .gsc-control { 641 position:relative; 642 } 643 644 #doc-content .gsc-tabsArea { 645 position:relative; 646 white-space:nowrap; 647 } 648 649 #doc-content .gsc-tabHeader { 650 padding: 3px 6px; 651 position:relative; 652 width:auto; 653 } 654 655 #doc-content .gsc-tabHeader.gsc-tabhActive { 656 border-top: 2px solid #94B922; 657 } 658 659 #doc-content h2#searchTitle { 660 padding:0; 661 } 662 663 #doc-content .gsc-resultsbox-visible { 664 padding:1em 0 0 6px; 665 } 666 667 /* CAROUSEL */ 668 669 #homeMiddle { 670 padding: 0px 0px 0px 0px; 671 float: left; 672 width: 584px; 673 height: 627px; 674 position:relative; 675 } 676 677 #topAnnouncement { 678 background:url(images/home/bg_home_announcement.png) no-repeat 0 0; 679 } 680 681 #homeTitle { 682 padding:15px 15px 0; 683 height:30px; 684 } 685 686 #homeTitle h2 { 687 padding:0; 688 } 689 690 #announcement-block { 691 padding:0 15px 0; 692 overflow:hidden; 693 background: url(images/hr_gray_side.jpg) no-repeat 15px 0; 694 zoom:1; 695 } 696 697 #announcement-block>* { 698 padding:15px 0 0; 699 } 700 701 #announcement-block img { 702 float:left; 703 margin:0 30px 0 0; 704 } 705 706 #announcement { 707 float:left; 708 margin:0; 709 } 710 711 #carousel { 712 background:url(images/home/bg_home_carousel.png) no-repeat 0 0; 713 position:relative; 714 height:400px; 715 } 716 717 #carouselMain { 718 background: url(images/home/bg_home_carousel_board.png) 0 0 no-repeat; 719 height:auto; 720 padding: 25px 21px 0; 721 overflow:hidden; 722 position:relative; 723 zoom:1; /*IE6*/ 724 } 725 726 #carouselMain img { 727 margin:0; 728 } 729 730 #carouselMain .bulletinDesc h3 { 731 margin:0; 732 padding:0; 733 } 734 735 #carouselMain .bulletinDesc p { 736 margin:0; 737 padding:0.7em 0 0; 738 } 739 740 #carouselWheel { 741 background: url(images/home/bg_home_carousel_wheel.png) 0 0 no-repeat; 742 padding-top:40px; 743 height:150px; 744 } 745 746 .clearer { clear:both; } 747 748 a#arrow-left, a#arrow-right { 749 float:left; 750 width:42px; 751 height:42px; 752 background-image:url(images/home/carousel_buttons_sprite.png); 753 background-repeat:no-repeat; 754 } 755 a#arrow-left { 756 margin:35px 3px 0 10px; 757 } 758 a#arrow-right { 759 margin:35px 10px 0 0; 760 } 761 a.arrow-left-off, 762 a#arrow-left.arrow-left-off:hover { 763 background-position:0 0; 764 } 765 a.arrow-right-off, 766 a#arrow-right.arrow-right-off:hover { 767 background-position:-42px 0; 768 } 769 a#arrow-left:hover { 770 background-position:0 -42px; 771 } 772 a#arrow-right:hover { 773 background-position:-42px -42px; 774 } 775 a.arrow-left-on { 776 background-position:0 0; 777 } 778 a.arrow-right-on { 779 background-position:-42px 0; 780 } 781 a.arrow-right-off, 782 a.arrow-left-off { 783 cursor:default; 784 } 785 786 .app-list-container { 787 margin:0 20px; 788 position:relative; 789 width:100%; 790 } 791 792 div#list-clip { 793 height:110px; 794 width:438px; 795 overflow:hidden; 796 position:relative; 797 float:left; 798 } 799 800 div#app-list { 801 left:0; 802 z-index:1; 803 position:absolute; 804 margin:11px 0 0; 805 _margin-top:13px; 806 width:1000%; 807 } 808 809 #app-list a { 810 display:block; 811 float:left; 812 height:90px; 813 width:90px; 814 margin:0 24px 0; 815 padding:3px; 816 background:#99cccc; 817 -webkit-border-radius:7px; 818 -moz-border-radius:7px; 819 border-radius:7px; 820 text-decoration:none; 821 text-align:center; 822 font-size:11px; 823 line-height:11px; 824 } 825 826 #app-list a span { 827 position:relative; 828 top:-4px; 829 } 830 831 #app-list img { 832 width:90px; 833 height:70px; 834 margin:0; 835 } 836 837 #app-list a.selected, 838 #app-list a:active.selected, 839 #app-list a:hover.selected { 840 background:#A4C639; 841 color:#fff; 842 cursor:default; 843 text-decoration:none; 844 } 845 846 #app-list a:hover, 847 #app-list a:active { 848 background:#ff9900; 849 } 850 851 #app-list a:hover span, 852 #app-list a:active span { 853 text-decoration:underline; 854 } 855 856 #droid-name { 857 padding-top:.5em; 858 color:#666; 859 padding-bottom:.25em; 860 } 861 862 /*IE6*/ 863 * html #app-list a { zoom: 1; margin:0 24px 0 15px;} 864 865 * html #list-clip { 866 width:430px !important; 867 } 868 869 /*carousel bulletin layouts*/ 870 /*460px width*/ 871 /*185px height*/ 872 .img-left { 873 float:left; 874 width:230px; 875 overflow:hidden; 876 padding:8px 0 8px 8px; 877 } 878 .desc-right { 879 float:left; 880 width:270px; 881 padding:10px; 882 } 883 .img-right { 884 float:right; 885 width:220px; 886 overflow:hidden; 887 padding:8px 8px 8px 0; 888 } 889 .desc-left { 890 float:right; 891 width:280px; 892 padding:10px; 893 text-align:right; 894 } 895 .img-top { 896 padding:20px 20px 0; 897 } 898 .desc-bottom { 899 padding:10px; 900 } 901 902 903 /* VIDEO PAGE */ 904 905 #mainBodyLeft.videoPlayer { 906 width:570px; 907 } 908 909 #mainBodyRight.videoPlayer { 910 width:330px; 911 } 912 913 /* player */ 914 915 #videoPlayerBox { 916 background-color: #DAF3FC; 917 border-radius:7px; 918 -moz-border-radius:7px; 919 -webkit-border-radius:7px; 920 width:530px; 921 padding:20px; 922 border:1px solid #d3ecf5; 923 box-shadow:2px 3px 1px #eee; 924 -moz-box-shadow:2px 3px 1px #eee; 925 -webkit-box-shadow:2px 3px 1px #eee; 926 } 927 928 #videoBorder { 929 background-color: #FFF; 930 min-height:399px; 931 height:auto !important; 932 border:1px solid #ccdada; 933 border-radius:7px 7px 0 0; 934 -moz-border-radius:7px 7px 0 0; 935 -webkit-border-top-left-radius:7px; 936 -webkit-border-top-right-radius:7px; 937 } 938 939 #videoPlayerTitle { 940 width:500px; 941 padding:15px 15px 0; 942 } 943 944 #videoPlayerTitle h2 { 945 font-weight:bold; 946 font-size:1.2em; 947 color:#336666; 948 margin:0; 949 padding:0; 950 } 951 952 #objectWrapper { 953 padding:15px 15px; 954 height:334px; 955 width:500px; 956 } 957 958 /* playlist tabs */ 959 960 ul#videoTabs { 961 list-style-type:none; 962 padding:0; 963 clear:both; 964 margin:0; 965 padding: 20px 0 0 15px; 966 zoom:1; /* IE7/8, otherwise top-padding is double */ 967 } 968 969 ul#videoTabs li { 970 display:inline; 971 padding:0; 972 margin:0 3px 0 0; 973 line-height:2em; 974 } 975 976 ul#videoTabs li a { 977 border-radius:7px 7px 0 0; 978 -moz-border-radius:7px 7px 0 0; 979 -webkit-border-top-left-radius:7px; 980 -webkit-border-top-right-radius:7px; 981 background:#95c0d0; 982 color:#fff; 983 text-decoration:none; 984 padding:.45em 1.5em; 985 font-weight:bold; 986 } 987 988 ul#videoTabs li.selected a { 989 font-weight:bold; 990 text-decoration:none; 991 color:#555; 992 background:#daf3fc; 993 border-bottom:1px solid #daf3fc; 994 } 995 996 ul#videoTabs li:hover a { 997 background:#85acba; 998 } 999 1000 ul#videoTabs li.selected:hover a { 1001 background:#daf3fc; 1002 } 1003 1004 /* playlists */ 1005 1006 #videos { 1007 background:#daf3fc; 1008 margin-bottom:1.5em; 1009 padding:15px; 1010 border-radius:5px; 1011 -moz-border-radius:5px; 1012 -webkit-border-radius:5px; 1013 box-shadow:2px 3px 1px #eee; 1014 -moz-box-shadow:2px 3px 1px #eee; 1015 -webkit-box-shadow:2px 3px 1px #eee; 1016 } 1017 1018 #videos div { 1019 display:none; 1020 } 1021 1022 #videos div.selected { 1023 display:block; 1024 } 1025 1026 ul.videoPreviews { 1027 list-style:none; 1028 padding:0; 1029 margin:0; 1030 zoom:1; /* IE, otherwise, layout doesn't update when showing 'more' */ 1031 } 1032 1033 ul.videoPreviews li { 1034 margin:0 0 5px; 1035 padding:0; 1036 overflow:hidden; 1037 position:relative; 1038 } 1039 1040 #mainBodyFixed ul.videoPreviews h3 { 1041 font-size: 12px; 1042 margin:0 0 1em 130px; 1043 padding:0; 1044 font-weight:bold; 1045 color:inherit; 1046 } 1047 1048 ul.videoPreviews a { 1049 margin:1px; 1050 padding:10px; 1051 text-decoration:none; 1052 height:90px; 1053 display:block; 1054 border-radius:5px; 1055 -moz-border-radius:5px; 1056 -webkit-border-radius:5px; 1057 background-color:transparent; 1058 } 1059 1060 ul.videoPreviews a:hover { 1061 background-color:#FFF; 1062 border:none; /* IE8, otherwise, bg doesn't work */ 1063 } 1064 1065 ul.videoPreviews a.selected { 1066 background-color: #FF9900; 1067 } 1068 1069 ul.videoPreviews img { 1070 float:left; 1071 clear:left; 1072 margin:0; 1073 } 1074 1075 ul.videoPreviews h3 { 1076 font-size:12px; 1077 font-weight:bold; 1078 text-decoration:none; 1079 margin:0 0 1em 130px; 1080 padding:0; 1081 } 1082 1083 ul.videoPreviews p { 1084 font-size: 12px; 1085 text-decoration:none; 1086 margin:0 0 1.2em 130px; 1087 } 1088 1089 ul.videoPreviews p.full { 1090 display:none; 1091 } 1092 1093 ul.videoPreviews span.more { 1094 padding:0 0 0 12px; 1095 background:url(images/arrow_bluelink_down.png) 0 2px no-repeat; 1096 } 1097 1098 ul.videoPreviews span.less { 1099 padding:0 0 0 12px; 1100 background:url(images/arrow_bluelink_up.png) 0 2px no-repeat; 1101 display:none; 1102 } 1103 1104 ul.videoPreviews p.toggle { 1105 position:absolute; 1106 margin:0; 1107 margin-top:-23px; /* instead of bottom:23px, because IE won't do it correctly */ 1108 left:140px; 1109 } 1110 1111 ul.videoPreviews p.toggle a { 1112 height:auto; 1113 margin:0; 1114 padding:0; 1115 zoom:1; /* IE6, otherwise the margin considers the img on redraws */ 1116 } 1117 1118 ul.videoPreviews p.toggle a:hover { 1119 text-decoration:underline; 1120 background:transparent; /* IE6, otherwise it inherits white */ 1121 } 1122 1123 /* featured videos */ 1124 1125 #mainBodyRight h2 { 1126 padding:0 0 5px; 1127 } 1128 1129 #mainBodyRight ul.videoPreviews { 1130 margin:10px 0 0; 1131 } 1132 1133 #mainBodyRight ul.videoPreviews li { 1134 font-size:11px; 1135 line-height:13px; 1136 margin:0 0 5px; 1137 padding:0; 1138 } 1139 1140 #mainBodyRight ul.videoPreviews h3 { 1141 padding:0; 1142 margin:0; 1143 font-size:100%; 1144 } 1145 1146 #mainBodyRight ul.videoPreviews a { 1147 text-decoration:none; 1148 height:108px; 1149 border:1px solid #FFF; 1150 } 1151 1152 #mainBodyRight ul.videoPreviews a:hover { 1153 border:1px solid #CCDADA; 1154 } 1155 1156 #mainBodyRight ul.videoPreviews a.selected { 1157 border:1px solid #FFF; 1158 } 1159 1160 #mainBodyRight ul.videoPreviews p { 1161 line-height:1.2em; 1162 padding:0; 1163 margin:4px 0 0 130px; 1164 } 1165 1166 #mainBodyRight ul.videoPreviews img { 1167 margin-top:5px; 1168 } 1169 1170 /* Pretty printing styles. Used with prettify.js. */ 1171 1172 .str { color: #080; } 1173 .kwd { color: #008; } 1174 .com { color: #800; } 1175 .typ { color: #606; } 1176 .lit { color: #066; } 1177 .pun { color: #660; } 1178 .pln { color: #000; } 1179 dl.tag-list dt code, 1180 .tag { color: #008; } 1181 dl.atn-list dt code, 1182 .atn { color: #828; } 1183 .atv { color: #080; } 1184 .dec { color: #606; } 1185 1186 @media print { 1187 .str { color: #060; } 1188 .kwd { color: #006; font-weight: bold; } 1189 .com { color: #600; font-style: italic; } 1190 .typ { color: #404; font-weight: bold; } 1191 .lit { color: #044; } 1192 .pun { color: #440; } 1193 .pln { color: #000; } 1194 .tag { color: #006; font-weight: bold; } 1195 .atn { color: #404; } 1196 .atv { color: #060; } 1197 } 1198