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 { 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 } 653 654 #doc-content .gsc-tabHeader.gsc-tabhActive { 655 border-top: 2px solid #94B922; 656 } 657 658 #doc-content h2#searchTitle { 659 padding:0; 660 } 661 662 #doc-content .gsc-resultsbox-visible { 663 padding:1em 0 0 6px; 664 } 665 666 /* CAROUSEL */ 667 668 #homeMiddle { 669 padding: 0px 0px 0px 0px; 670 float: left; 671 width: 584px; 672 height: 627px; 673 position:relative; 674 } 675 676 #topAnnouncement { 677 background:url(images/home/bg_home_announcement.png) no-repeat 0 0; 678 } 679 680 #homeTitle { 681 padding:15px 15px 0; 682 height:30px; 683 } 684 685 #homeTitle h2 { 686 padding:0; 687 } 688 689 #announcement-block { 690 padding:0 15px 0; 691 overflow:hidden; 692 background: url(images/hr_gray_side.jpg) no-repeat 15px 0; 693 zoom:1; 694 } 695 696 #announcement-block>* { 697 padding:15px 0 0; 698 } 699 700 #announcement-block img { 701 float:left; 702 margin:0 30px 0 0; 703 } 704 705 #announcement { 706 float:left; 707 margin:0; 708 } 709 710 #carousel { 711 background:url(images/home/bg_home_carousel.png) no-repeat 0 0; 712 position:relative; 713 height:400px; 714 } 715 716 #carouselMain { 717 background: url(images/home/bg_home_carousel_board.png) 0 0 no-repeat; 718 height:auto; 719 padding: 25px 21px 0; 720 overflow:hidden; 721 position:relative; 722 zoom:1; /*IE6*/ 723 } 724 725 #carouselMain img { 726 margin:0; 727 } 728 729 #carouselMain .bulletinDesc h3 { 730 margin:0; 731 padding:0; 732 } 733 734 #carouselMain .bulletinDesc p { 735 margin:0; 736 padding:0.7em 0 0; 737 } 738 739 #carouselWheel { 740 background: url(images/home/bg_home_carousel_wheel.png) 0 0 no-repeat; 741 padding-top:40px; 742 height:150px; 743 } 744 745 .clearer { clear:both; } 746 747 a#arrow-left, a#arrow-right { 748 float:left; 749 width:42px; 750 height:42px; 751 background-image:url(images/home/carousel_buttons_sprite.png); 752 background-repeat:no-repeat; 753 } 754 a#arrow-left { 755 margin:35px 3px 0 10px; 756 } 757 a#arrow-right { 758 margin:35px 10px 0 0; 759 } 760 a.arrow-left-off, 761 a#arrow-left.arrow-left-off:hover { 762 background-position:0 0; 763 } 764 a.arrow-right-off, 765 a#arrow-right.arrow-right-off:hover { 766 background-position:-42px 0; 767 } 768 a#arrow-left:hover { 769 background-position:0 -42px; 770 } 771 a#arrow-right:hover { 772 background-position:-42px -42px; 773 } 774 a.arrow-left-on { 775 background-position:0 0; 776 } 777 a.arrow-right-on { 778 background-position:-42px 0; 779 } 780 a.arrow-right-off, 781 a.arrow-left-off { 782 cursor:default; 783 } 784 785 .app-list-container { 786 margin:0 20px; 787 position:relative; 788 width:100%; 789 } 790 791 div#list-clip { 792 height:110px; 793 width:438px; 794 overflow:hidden; 795 position:relative; 796 float:left; 797 } 798 799 div#app-list { 800 left:0; 801 z-index:1; 802 position:absolute; 803 margin:11px 0 0; 804 _margin-top:13px; 805 width:1000%; 806 } 807 808 #app-list a { 809 display:block; 810 float:left; 811 height:90px; 812 width:90px; 813 margin:0 24px 0; 814 padding:3px; 815 background:#99cccc; 816 -webkit-border-radius:7px; 817 -moz-border-radius:7px; 818 border-radius:7px; 819 text-decoration:none; 820 text-align:center; 821 font-size:11px; 822 line-height:11px; 823 } 824 825 #app-list a span { 826 position:relative; 827 top:-4px; 828 } 829 830 #app-list img { 831 width:90px; 832 height:70px; 833 margin:0; 834 } 835 836 #app-list a.selected, 837 #app-list a:active.selected, 838 #app-list a:hover.selected { 839 background:#A4C639; 840 color:#fff; 841 cursor:default; 842 text-decoration:none; 843 } 844 845 #app-list a:hover, 846 #app-list a:active { 847 background:#ff9900; 848 } 849 850 #app-list a:hover span, 851 #app-list a:active span { 852 text-decoration:underline; 853 } 854 855 #droid-name { 856 padding-top:.5em; 857 color:#666; 858 padding-bottom:.25em; 859 } 860 861 /*IE6*/ 862 * html #app-list a { zoom: 1; margin:0 24px 0 15px;} 863 864 * html #list-clip { 865 width:430px !important; 866 } 867 868 /*carousel bulletin layouts*/ 869 /*460px width*/ 870 /*185px height*/ 871 .img-left { 872 float:left; 873 width:230px; 874 overflow:hidden; 875 padding:8px 0 8px 8px; 876 } 877 .desc-right { 878 float:left; 879 width:270px; 880 padding:10px; 881 } 882 .img-right { 883 float:right; 884 width:220px; 885 overflow:hidden; 886 padding:8px 8px 8px 0; 887 } 888 .desc-left { 889 float:right; 890 width:280px; 891 padding:10px; 892 text-align:right; 893 } 894 .img-top { 895 padding:20px 20px 0; 896 } 897 .desc-bottom { 898 padding:10px; 899 } 900 901 902 /* VIDEO PAGE */ 903 904 #mainBodyLeft.videoPlayer { 905 width:570px; 906 } 907 908 #mainBodyRight.videoPlayer { 909 width:330px; 910 } 911 912 /* player */ 913 914 #videoPlayerBox { 915 background-color: #DAF3FC; 916 border-radius:7px; 917 -moz-border-radius:7px; 918 -webkit-border-radius:7px; 919 width:530px; 920 padding:20px; 921 border:1px solid #d3ecf5; 922 box-shadow:2px 3px 1px #eee; 923 -moz-box-shadow:2px 3px 1px #eee; 924 -webkit-box-shadow:2px 3px 1px #eee; 925 } 926 927 #videoBorder { 928 background-color: #FFF; 929 min-height:399px; 930 height:auto !important; 931 border:1px solid #ccdada; 932 border-radius:7px 7px 0 0; 933 -moz-border-radius:7px 7px 0 0; 934 -webkit-border-top-left-radius:7px; 935 -webkit-border-top-right-radius:7px; 936 } 937 938 #videoPlayerTitle { 939 width:500px; 940 padding:15px 15px 0; 941 } 942 943 #videoPlayerTitle h2 { 944 font-weight:bold; 945 font-size:1.2em; 946 color:#336666; 947 margin:0; 948 padding:0; 949 } 950 951 #objectWrapper { 952 padding:15px 15px; 953 height:334px; 954 width:500px; 955 } 956 957 /* playlist tabs */ 958 959 ul#videoTabs { 960 list-style-type:none; 961 padding:0; 962 clear:both; 963 margin:0; 964 padding: 20px 0 0 15px; 965 zoom:1; /* IE7/8, otherwise top-padding is double */ 966 } 967 968 ul#videoTabs li { 969 display:inline; 970 padding:0; 971 margin:0 3px 0 0; 972 line-height:2em; 973 } 974 975 ul#videoTabs li a { 976 border-radius:7px 7px 0 0; 977 -moz-border-radius:7px 7px 0 0; 978 -webkit-border-top-left-radius:7px; 979 -webkit-border-top-right-radius:7px; 980 background:#95c0d0; 981 color:#fff; 982 text-decoration:none; 983 padding:.45em 1.5em; 984 font-weight:bold; 985 } 986 987 ul#videoTabs li.selected a { 988 font-weight:bold; 989 text-decoration:none; 990 color:#555; 991 background:#daf3fc; 992 border-bottom:1px solid #daf3fc; 993 } 994 995 ul#videoTabs li:hover a { 996 background:#85acba; 997 } 998 999 ul#videoTabs li.selected:hover a { 1000 background:#daf3fc; 1001 } 1002 1003 /* playlists */ 1004 1005 #videos { 1006 background:#daf3fc; 1007 margin-bottom:1.5em; 1008 padding:15px; 1009 border-radius:5px; 1010 -moz-border-radius:5px; 1011 -webkit-border-radius:5px; 1012 box-shadow:2px 3px 1px #eee; 1013 -moz-box-shadow:2px 3px 1px #eee; 1014 -webkit-box-shadow:2px 3px 1px #eee; 1015 } 1016 1017 #videos div { 1018 display:none; 1019 } 1020 1021 #videos div.selected { 1022 display:block; 1023 } 1024 1025 ul.videoPreviews { 1026 list-style:none; 1027 padding:0; 1028 margin:0; 1029 zoom:1; /* IE, otherwise, layout doesn't update when showing 'more' */ 1030 } 1031 1032 ul.videoPreviews li { 1033 margin:0 0 5px; 1034 padding:0; 1035 overflow:hidden; 1036 position:relative; 1037 } 1038 1039 #mainBodyFixed ul.videoPreviews h3 { 1040 font-size: 12px; 1041 margin:0 0 1em 130px; 1042 padding:0; 1043 font-weight:bold; 1044 color:inherit; 1045 } 1046 1047 ul.videoPreviews a { 1048 margin:1px; 1049 padding:10px; 1050 text-decoration:none; 1051 height:90px; 1052 display:block; 1053 border-radius:5px; 1054 -moz-border-radius:5px; 1055 -webkit-border-radius:5px; 1056 background-color:transparent; 1057 } 1058 1059 ul.videoPreviews a:hover { 1060 background-color:#FFF; 1061 border:none; /* IE8, otherwise, bg doesn't work */ 1062 } 1063 1064 ul.videoPreviews a.selected { 1065 background-color: #FF9900; 1066 } 1067 1068 ul.videoPreviews img { 1069 float:left; 1070 clear:left; 1071 margin:0; 1072 } 1073 1074 ul.videoPreviews h3 { 1075 font-size:12px; 1076 font-weight:bold; 1077 text-decoration:none; 1078 margin:0 0 1em 130px; 1079 padding:0; 1080 } 1081 1082 ul.videoPreviews p { 1083 font-size: 12px; 1084 text-decoration:none; 1085 margin:0 0 1.2em 130px; 1086 } 1087 1088 ul.videoPreviews p.full { 1089 display:none; 1090 } 1091 1092 ul.videoPreviews span.more { 1093 padding:0 0 0 12px; 1094 background:url(images/arrow_bluelink_down.png) 0 2px no-repeat; 1095 } 1096 1097 ul.videoPreviews span.less { 1098 padding:0 0 0 12px; 1099 background:url(images/arrow_bluelink_up.png) 0 2px no-repeat; 1100 display:none; 1101 } 1102 1103 ul.videoPreviews p.toggle { 1104 position:absolute; 1105 margin:0; 1106 margin-top:-23px; /* instead of bottom:23px, because IE won't do it correctly */ 1107 left:140px; 1108 } 1109 1110 ul.videoPreviews p.toggle a { 1111 height:auto; 1112 margin:0; 1113 padding:0; 1114 zoom:1; /* IE6, otherwise the margin considers the img on redraws */ 1115 } 1116 1117 ul.videoPreviews p.toggle a:hover { 1118 text-decoration:underline; 1119 background:transparent; /* IE6, otherwise it inherits white */ 1120 } 1121 1122 /* featured videos */ 1123 1124 #mainBodyRight h2 { 1125 padding:0 0 5px; 1126 } 1127 1128 #mainBodyRight ul.videoPreviews { 1129 margin:10px 0 0; 1130 } 1131 1132 #mainBodyRight ul.videoPreviews li { 1133 font-size:11px; 1134 line-height:13px; 1135 margin:0 0 5px; 1136 padding:0; 1137 } 1138 1139 #mainBodyRight ul.videoPreviews h3 { 1140 padding:0; 1141 margin:0; 1142 } 1143 1144 #mainBodyRight ul.videoPreviews a { 1145 text-decoration:none; 1146 height:108px; 1147 border:1px solid #FFF; 1148 } 1149 1150 #mainBodyRight ul.videoPreviews a:hover { 1151 border:1px solid #CCDADA; 1152 } 1153 1154 #mainBodyRight ul.videoPreviews a.selected { 1155 border:1px solid #FFF; 1156 } 1157 1158 #mainBodyRight ul.videoPreviews p { 1159 line-height:1.2em; 1160 padding:0; 1161 margin:4px 0 0 130px; 1162 } 1163 1164 #mainBodyRight ul.videoPreviews img { 1165 margin-top:5px; 1166 } 1167 1168 /* Pretty printing styles. Used with prettify.js. */ 1169 1170 .str { color: #080; } 1171 .kwd { color: #008; } 1172 .com { color: #800; } 1173 .typ { color: #606; } 1174 .lit { color: #066; } 1175 .pun { color: #660; } 1176 .pln { color: #000; } 1177 dl.tag-list dt code, 1178 .tag { color: #008; } 1179 dl.atn-list dt code, 1180 .atn { color: #828; } 1181 .atv { color: #080; } 1182 .dec { color: #606; } 1183 1184 @media print { 1185 .str { color: #060; } 1186 .kwd { color: #006; font-weight: bold; } 1187 .com { color: #600; font-style: italic; } 1188 .typ { color: #404; font-weight: bold; } 1189 .lit { color: #044; } 1190 .pun { color: #440; } 1191 .pln { color: #000; } 1192 .tag { color: #006; font-weight: bold; } 1193 .atn { color: #404; } 1194 .atv { color: #060; } 1195 } 1196