default.css revision b7b497115fb19d17a3e5de20646a5eac759c0095
1/* color definitions */ 2/* 16 column layout */ 3/* clearfix idiom */ 4/* common mixins */ 5/* page layout + top-level styles */ 6::selection { 7 background-color: #0099cc; 8 color: #fff; } 9::-webkit-selection { 10 background-color: #0099cc; 11 color: #fff; } 12::-moz-selection { 13 background-color: #0099cc; 14 color: #fff; } 15 16html, body { 17 height: 100%; 18 margin: 0; 19 padding: 0; 20 background-color:#F9F9F9; 21 -webkit-font-smoothing: antialiased; 22 /* prevent subpixel antialiasing, which thickens the text */ 23 /* text-rendering: optimizeLegibility; */ 24 /* turned off ligatures due to bug 5945455 */ } 25 26body { 27 color: #222; 28 font: 14px/19px Roboto, sans-serif; 29 font-weight: 400; 30 letter-spacing:.1; 31 padding:0 10px; } 32 33#page-container { 34 width: 940px; 35 margin: 0 40px; } 36 37#page-header { 38 height: 80px; 39 margin-bottom: 20px; 40 font-size: 48px; 41 line-height: 48px; 42 font-weight: 100; 43 padding-left: 10px; } 44 #page-header a { 45 display: block; 46 position: relative; 47 top: 20px; 48 text-decoration: none; 49 color: #555555 !important; } 50 51#main-row { 52 display: inline-block; } 53 #main-row:after { 54 content: "."; 55 display: block; 56 height: 0; 57 clear: both; 58 visibility: hidden; } 59 * html #main-row { 60 height: 1px; } 61 62#page-footer { 63 margin-left: 190px; 64 margin-top: 80px; 65 color: #999999; 66 padding-bottom: 40px; 67 font-size: 12px; 68 line-height: 15px; } 69 #page-footer a { 70 color: #777777; } 71 #page-footer #copyright { 72 margin-bottom: 10px; } 73 74#nav-container { 75 width: 160px; 76 min-height: 10px; 77 margin-right: 20px; 78 float: left; } 79 80#nav { 81 margin:0; 82 padding:0 0 30px; 83} 84 85#side-nav { 86 min-height:5px; /* silly way to avoid doc floating left when nav goes fixed */ 87 margin-bottom:1px; 88} 89#devdoc-nav { 90 outline:none; 91 width:auto; 92 margin: 20px 0 0; } 93 94#devdoc-nav h2 { 95 border:0; 96} 97 98#devdoc-nav.fixed { 99 position: fixed; 100 margin:0; 101 top: 20px; } 102 103#devdoc-nav span.small { 104 font-size:12px; 105 font-weight:normal; 106} 107 108#content { 109 width: 760px; 110 float: left; } 111 112a:hover, 113acronym:hover { 114 color: #7aa1b0 !important; } 115 116a:focus, 117a:active { 118 color: #33b5e5 !important; } 119 120a.external-link { 121 background:url('../images/styles/open_new_page.png') no-repeat 100% 50%; 122 padding-right:16px; 123} 124 125img { 126 border: none; } 127#jd-content img { 128 margin-bottom:15px; 129} 130 131ul { 132 margin: 0; 133 padding: 0; } 134 135strong { 136 font-weight: 500; } 137 138em { 139 font-style: italic; } 140 141acronym, 142.tooltip-link { 143 border-bottom: 1px dotted #555555; 144 cursor: help; } 145 146acronym:hover, 147.tooltip-link:hover { 148 color: #7aa1b0; 149 border-bottom-color: #7aa1b0; } 150 151img.with-shadow, 152video.with-shadow { 153 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25); } 154 155/* disclosures mixin */ 156/* content layout */ 157.layout-content-row { 158 display: inline-block; 159 margin-bottom: 10px; } 160 .layout-content-row:after { 161 content: "."; 162 display: block; 163 height: 0; 164 clear: both; 165 visibility: hidden; } 166 * html .layout-content-row { 167 height: 1px; } 168 169.layout-content-col { 170 float: left; 171 margin-left: 20px; } 172 .layout-content-col:first-child { 173 margin-left: 0; } 174 .layout-content-col h3, 175 .layout-content-col h4 { 176 margin-top:0; } 177 178.layout-content-col.span-1 { 179 width: 40px; } 180 181.layout-content-col.span-2 { 182 width: 100px; } 183 184.layout-content-col.span-3 { 185 width: 160px; } 186 187.layout-content-col.span-4 { 188 width: 220px; } 189 190.layout-content-col.span-5 { 191 width: 280px; } 192 193.layout-content-col.span-6 { 194 width: 340px; } 195 196.layout-content-col.span-7 { 197 width: 400px; } 198 199.layout-content-col.span-8 { 200 width: 460px; } 201 202.layout-content-col.span-9 { 203 width: 520px; } 204 205.layout-content-col.span-10 { 206 width: 580px; } 207 208.layout-content-col.span-11 { 209 width: 640px; } 210 211.layout-content-col.span-12 { 212 width: 700px; } 213 214.layout-content-col.span-13 { 215 width: 760px; } 216 217.vspace.size-1 { 218 height: 10px; } 219 220.vspace.size-2 { 221 height: 20px; } 222 223.vspace.size-3 { 224 height: 30px; } 225 226.vspace.size-4 { 227 height: 40px; } 228 229.vspace.size-5 { 230 height: 50px; } 231 232.vspace.size-6 { 233 height: 60px; } 234 235.vspace.size-7 { 236 height: 70px; } 237 238.vspace.size-8 { 239 height: 80px; } 240 241.vspace.size-9 { 242 height: 90px; } 243 244.vspace.size-10 { 245 height: 100px; } 246 247.vspace.size-11 { 248 height: 110px; } 249 250.vspace.size-12 { 251 height: 120px; } 252 253.vspace.size-13 { 254 height: 130px; } 255 256.vspace.size-14 { 257 height: 140px; } 258 259.vspace.size-15 { 260 height: 150px; } 261 262.vspace.size-16 { 263 height: 160px; } 264 265/* nav */ 266#nav { 267 /* section header divs */ 268 /* expanded section header divs */ 269 /* sublinks */ } 270 #nav li { 271 list-style-type: none; 272 font-size: 14px; 273 margin:0; 274 padding:0; 275 line-height: 15px; } 276 #nav a { 277 color: #555555; 278 text-decoration: none; 279 word-wrap:break-word; } 280 #nav .nav-section-header { 281 position: relative; 282 margin-bottom: 1px; 283 padding: 0 30px 0 0; } 284 #nav li.selected a, #nav li.selected > .nav-section-header > a { 285 color: #09C; 286 } 287 #nav li.selected ul li a { 288 /* don't highlight child items */ 289 color: #555555; } 290 #nav .nav-section .nav-section .nav-section-header { 291 /* no white line between second level sections */ 292 margin-bottom: 0; } 293 /* section header links */ 294 #nav > li > div > a { 295 display: block; 296 color: #333333; 297 font-weight: 500; 298 padding: 10px 0 10px 10px; } 299 #nav .nav-section-header:after { 300 content: ''; 301 background: transparent url(../images/styles/disclosure_down.png) no-repeat scroll 50% 50%; 302 width: 34px; 303 height: 34px; 304 display: block; 305 position: absolute; 306 top: 0; 307 right: 0; } 308 #nav .nav-section-header.empty { 309 padding:0; } 310 #nav .nav-section-header.empty:after { 311 display: none; } 312 /* nested nav headers */ 313 #nav .nav-section .nav-section { 314 position: relative; 315 padding: 0; 316 margin: 0; } 317 #nav .nav-section li a { 318 /* first gen child (2nd level li) */ 319 display:block; 320 font-weight: normal; 321 text-transform: none; 322 padding: 7px 5px 7px 10px; 323 } 324 #nav .nav-section li li a { 325 /* second gen child (3rd level li) */ 326 padding: 5px 5px 5px 10px; 327 } 328 #nav li.expanded .nav-section-header { 329 background:#e9e9e9; 330 background: rgba(0, 0, 0, 0.05); } 331 #nav li.expanded li .nav-section-header { 332 background: transparent; } 333 #nav li.expanded li ul { 334 /* 3rd level ul */ 335 padding:0 0 0 10px; 336 } 337 #nav li.expanded > .nav-section-header:after { 338 content: ''; 339 background: transparent url(../images/styles/disclosure_up.png) no-repeat scroll 50% 50%; 340 width: 34px; 341 height: 34px; } 342 #nav li.expanded li ul.tree-list-children { 343 padding: 0; 344 } 345 #nav li.expanded li ul.tree-list-children .tree-list-children { 346 padding:0 0 0 10px; 347 } 348 #nav li span.tree-list-subtitle { 349 display:inline-block; 350 padding:5px 0 0 10px; 351 color:#555; 352 text-transform:uppercase; 353 font-size:12px; 354 } 355 #nav li span.tree-list-subtitle:before { 356 content: '—'; 357 } 358 #nav li span.tree-list-subtitle:after { 359 content: '—'; 360 } 361 #nav li span.tree-list-subtitle.package { 362 padding-top:15px; 363 cursor:default; 364 } 365 #nav li span.tree-list-subtitle.package:before { 366 content: ''; 367 } 368 #nav li span.tree-list-subtitle.package:after { 369 content: ''; 370 } 371 #nav li ul.tree-list-children.classes { 372 padding-left:10px; 373 } 374 #nav li ul { 375 display:none; 376 overflow: hidden; 377 margin: 0; } 378 #nav li ul.animate-height-in { 379 -webkit-transition: height 0.25s ease-in; 380 -moz-transition: height 0.25s ease-in; 381 transition: height 0.25s ease-in; } 382 #nav li ul.animate-height-out { 383 -webkit-transition: height 0.25s ease-out; 384 -moz-transition: height 0.25s ease-out; 385 transition: height 0.25s ease-out; } 386 #nav li ul li { 387 padding: 0; } 388 #nav li li li { 389 padding: 0; } 390 #nav li.expanded ul { 391 } 392 #nav li ul > li { 393 padding:0; 394 } 395 #nav li ul > li:last-child { 396 padding-bottom:5px; 397 } 398 #nav li ul.tree-list-children > li:last-child { 399 padding-bottom:0; 400 } 401 #nav li.expanded ul > li { 402 background:#efefef; 403 background: rgba(0, 0, 0, 0.03); } 404 #nav li.expanded ul > li li { 405 background:inherit; } 406 #nav li ul.tree-list-children ul { 407 display:block; } 408 409#nav.samples-nav li li li { 410 font-size:13px; 411} 412#nav.samples-nav li li li a { 413 padding-top:3px; 414 padding-bottom:3px; 415} 416#nav.samples-nav li li ul > li:last-child { 417 padding-bottom:3px; 418} 419 420.new, 421.new-child { 422 font-size: .78em; 423 font-weight: bold; 424 color: #ff3d3d; 425 vertical-align:top; 426 white-space:nowrap; 427} 428 429/* content header */ 430.content-header { 431 height: 30px; 432 margin:20px 0 25px; 433 padding:0 0 10px;} 434.content-header.just-links { 435 margin-bottom:0; 436 padding-bottom:0;} 437 438.content-header h1 { 439 color:#000; 440 margin:0; 441 border-bottom:0; 442 padding:0; 443} 444.content-header > div:first-child { 445 height:55px; /* set fixed height for the header div to ensure the 446 next/prev links align with toc on training classes */ 447} 448 449.content-footer { 450 border-top: 1px solid #ccc; 451 margin-top: 10px; 452 padding-top:10px; 453 height: 30px; } 454 455.content-footer .col-9 { 456 margin-left:0; 457} 458.content-footer .col-4 { 459 margin-right:0; 460} 461.content-footer.wrap { 462 width:940px; 463} 464 465.paging-links { 466 position: relative; } 467 .paging-links a { 468 position: absolute; } 469 .paging-links a, 470 .training-nav-top a { 471 font-size: 14px; 472 line-height: 30px; 473 color: #555555; 474 text-decoration: none; 475 text-transform: uppercase; } 476 .paging-links .prev-page-link:before, 477 .training-nav-top .prev-page-link:before { 478 content: ''; 479 background: transparent url(../images/styles/disclosure_left.png) no-repeat scroll 50% 50%; 480 width: 10px; 481 height: 10px; 482 display: inline-block; 483 margin-right: 5px; } 484 .training-nav-top .next-page-link, 485 .training-nav-top .start-class-link, 486 .training-nav-top .start-course-link { 487 right: 10px; } 488 .paging-links .prev-page-link { 489 left: -15px; } 490 .paging-links .next-page-link { 491 right: 0px; } 492 .next-page-link:after, 493 .start-class-link:after, 494 .start-course-link:after, 495 .next-class-link:after, 496 .go-link:after { 497 content: ''; 498 background: transparent url(../images/styles/disclosure_right.png) no-repeat scroll 50% 50%; 499 width: 10px; 500 height: 10px; 501 display: inline-block; 502 margin-left: 5px; } 503 .prev-page-link.inline:before { 504 content: none; } 505 .next-page-link.inline:after { 506 content: none; } 507 508 509 .training-nav-top a { 510 display:block; 511 float:left; 512 width:122px; 513 height:28px; 514 padding: 8px; 515 line-height:28px; 516 text-align:center; 517 border:1px solid #DADADA; 518 border-bottom:0; 519 } 520 521 .training-nav-top a.next-page-link { 522 border-left:0; 523 width:123px; 524 } 525 526 .paging-links a.disabled, 527 .training-nav-top a.disabled, 528 .content-footer a.disabled { 529 color:#bbb; 530 } 531 532 .paging-links a.disabled:hover, 533 .training-nav-top a.disabled:hover, 534 .content-footer a.disabled:hover { 535 cursor:default; 536 color:#bbb !important; 537 } 538 539 .training-nav-top a.start-class-link, 540 .training-nav-top a.start-course-link { 541 width:262px; 542 } 543 544 .paging-links a.start-class-link { 545 width:100%; 546 text-align:right; 547 } 548 549 /* list of classes on course landing page */ 550 ol.class-list { 551 list-style:none; 552 margin-left:0; 553 } 554 ol.class-list>li { 555 margin:0 0 15px; 556 padding:5px 0 0; 557 overflow:hidden; 558 border-top:1px solid #ccc; 559 } 560 ol.class-list li a.title { 561 font-size:16px; 562 margin:0; 563 clear:left; 564 display:block; 565 height:32px; 566 padding:0 4px; 567 } 568 ol.class-list li a.title h2 { 569 color:inherit; 570 margin:0 0 10px; 571 display:block; 572 float:left; 573 width:675px; 574 } 575 ol.class-list li a.title span { 576 display:none; 577 float:left; 578 font-size:18px; 579 font-weight:bold; 580 background: transparent url(../images/styles/disclosure_right.png) no-repeat scroll 50% 50%; 581 width: 10px; 582 height: 32px; 583 } 584 ol.class-list li a.title:hover { 585 background:#ddd; 586 color:#258AAF !important; 587 } 588 ol.class-list li a.title:hover span { 589 display:block; 590 } 591 592 #jd-content 593 ol.class-list li img { 594 float:left; 595 clear:left; 596 width:64px; 597 margin:0 20px 0 0; 598 } 599 ol.class-list li p.description { 600 float:left; 601 display:block; 602 width:250px; 603 margin:0; 604 } 605 ol.class-list li p.description.article { 606 width: 550px; 607 } 608 ol.class-list ol { 609 float:left; 610 width:320px; 611 margin:0 0 0 30px; 612 list-style:none; 613 margin:0 0 0 20px; 614 } 615 ol.class-list div.lessons li { 616 margin:0 0 6px; 617 line-height:16px; 618 } 619 620 621 .hide { 622 display:none !important; 623 } 624 625 .content-footer.next-class { 626 display:block; 627 border:0; 628 margin-top:0; 629 padding-top:0; 630 } 631 632 .content-footer.next-class a.next-class-link { 633 display:block; 634 float:right; 635 text-transform:uppercase; 636 } 637 638 639 640 /* inner-doc tabs w/ title */ 641 642div#title-tabs-wrapper { 643 border-bottom:1px solid #ccc; 644 margin:20px 0 30px; 645} 646h1.with-title-tabs { 647 display:inline-block; 648 margin:0 0 -1px 0; 649 padding:0 60px 0 0; 650 border-bottom:1px solid #F9F9F9; 651} 652ul#title-tabs { 653 list-style:none; 654 padding:0; 655 height:29px; 656 margin:0; 657 font-size:16px; 658 line-height:26px; 659 display:inline-block; 660 vertical-align:bottom; 661} 662ul#title-tabs li { 663 display:block; 664 float:left; 665 margin-right:40px; 666 border-bottom: 3px solid transparent; 667} 668ul#title-tabs li.selected { 669 border-bottom: 3px solid #93C; 670} 671ul#title-tabs li a { 672 color:#333; 673} 674ul#title-tabs li a:hover, 675ul#title-tabs li a:active { 676 color:#93C !important; 677} 678 679 680 681/* content body */ 682@-webkit-keyframes glowheader { 683 from { 684 background-color: #33b5e5; 685 color: #000; 686 border-bottom-color: #000; } 687 688 to { 689 background-color: transparent; 690 color: #33b5e5; 691 border-bottom-color: #33b5e5; } } 692 693@-moz-keyframes glowheader { 694 from { 695 background-color: #33b5e5; 696 color: #000; 697 border-bottom-color: #000; } 698 699 to { 700 background-color: transparent; 701 color: #33b5e5; 702 border-bottom-color: #33b5e5; } } 703 704@keyframes glowheader { 705 from { 706 background-color: #33b5e5; 707 color: #000; 708 border-bottom-color: #000; } 709 710 to { 711 background-color: transparent; 712 color: #33b5e5; 713 border-bottom-color: #33b5e5; } } 714 715h2:target, 716h3:target { 717 -webkit-animation-name: glowheader; 718 -moz-animation-name: glowheader; 719 animation-name: glowheader; 720 -webkit-animation-duration: 0.7s; 721 -moz-animation-duration: 0.7s; 722 animation-duration: 0.7s; 723 -webkit-animation-timing-function: ease-out; 724 -moz-animation-timing-function: ease-out; 725 animation-timing-function: ease-out; } 726 727.design ol h4 { 728 margin-bottom:0; 729} 730.design ol { 731 counter-reset: item; } 732 .design ol>li { 733 font-size: 14px; 734 line-height: 20px; 735 list-style-type: none; 736 position: relative; } 737 .design ol>li:before { 738 content: counter(item) ". "; 739 counter-increment: item; 740 position: absolute; 741 left: -20px; 742 top: 0; } 743 .design ol li.value-1:before { 744 content: "1. "; } 745 .design ol li.value-2:before { 746 content: "2. "; } 747 .design ol li.value-3:before { 748 content: "3. "; } 749 .design ol li.value-4:before { 750 content: "4. "; } 751 .design ol li.value-5:before { 752 content: "5. "; } 753 .design ol li.value-6:before { 754 content: "6. "; } 755 .design ol li.value-7:before { 756 content: "7. "; } 757 .design ol li.value-8:before { 758 content: "8. "; } 759 .design ol li.value-9:before { 760 content: "9. "; } 761 .design ol li.value-10:before { 762 content: "10. "; } 763.design .with-callouts ol>li { 764 list-style-position: inside; 765 margin-left: 0; } 766 .design .with-callouts ol>li:before { 767 display: inline; 768 left: -20px; 769 float: left; 770 width: 17px; 771 color: #33b5e5; 772 font-weight: 500; } 773.design .with-callouts ul>li { 774 list-style-position: outside; } 775 776/* special list items */ 777li.no-bullet { 778 list-style-type: none !important; } 779li.no-bullet *{ 780 margin:0; } 781 782.design li.with-icon { 783 position: relative; 784 margin-left: 20px; 785 min-height: 30px; } 786 .design li.with-icon p { 787 margin-left: 0 !important; } 788 .design li.with-icon:before { 789 position: absolute; 790 left: -40px; 791 top: 0; 792 content: ''; 793 width: 30px; 794 height: 30px; } 795 .design li.with-icon.tablet:before { 796 background-image: url(../images/styles/ico_phone_tablet.png); } 797 .design li.with-icon.web:before { 798 background-image: url(../images/styles/ico_web.png); } 799 .design li.with-icon.action:before { 800 background-image: url(../images/styles/ico_action.png); } 801 .design li.with-icon.use:before { 802 background-image: url(../images/styles/ico_use.png); } 803 804/* figures and callouts */ 805.figure { 806 position: relative; } 807 .figure.pad-below { 808 margin-bottom: 20px; } 809 .figure .figure-callout { 810 position: absolute; 811 color: #fff; 812 font-weight: 500; 813 font-size: 16px; 814 line-height: 23px; 815 text-align: center; 816 background: transparent url(../images/styles/callout.png) no-repeat scroll 50% 50%; 817 padding-right: 2px; 818 width: 30px; 819 height: 29px; 820 z-index: 1000; } 821 .figure .figure-callout.top { 822 top: -9px; } 823 .figure .figure-callout.right { 824 right: -5px; } 825 826.figure-caption { 827 margin: 0 10px 20px 0; 828 font-size: 14px; 829 line-height: 20px; 830 font-style: italic; } 831 832/* rows of figures */ 833.figure-row { 834 font-size: 0; 835 line-height: 0; 836 /* to prevent space between figures */ } 837 .figure-row .figure { 838 display: inline-block; 839 vertical-align: top; } 840 .figure-row .figure + .figure { 841 margin-left: 10px; 842 /* reintroduce space between figures */ } 843 844/* video containers */ 845.framed-galaxynexus-land-span-13 { 846 background: transparent url(../images/styles/device_galaxynexus_blank_land_span13.png) no-repeat 847scroll top left; 848 padding: 42px 122px 62px 126px; 849 overflow: hidden; } 850 .framed-galaxynexus-land-span-13, .framed-galaxynexus-land-span-13 video, 851.framed-galaxynexus-land-span-13 img { 852 width: 512px; 853 height: 286px; } 854 855 856.framed-galaxynexus-land-span-8{ 857 background: transparent url(../images/styles/device_galaxynexus_blank_land_span8.png) no-repeat 858scroll top left; 859 padding: 26px 68px 38px 72px; 860 overflow: hidden; } 861 .framed-galaxynexus-land-span-8, .framed-galaxynexus-land-span-8 video, 862.framed-galaxynexus-land-span-8 img { 863 width: 320px; 864 height: 180px; } 865 866.framed-galaxynexus-port-span-9 { 867 background: transparent url(../images/styles/device_galaxynexus_blank_port_span9.png) no-repeat 868scroll top left; 869 padding: 95px 122px 107px 124px; 870 overflow: hidden; } 871 .framed-galaxynexus-port-span-9, .framed-galaxynexus-port-span-9 video, 872.framed-galaxynexus-port-span-9 img { 873 width: 274px; 874 height: 488px; } 875 876.framed-galaxynexus-port-span-5 { 877 background: transparent url(../images/styles/device_galaxynexus_blank_port_span5.png) no-repeat 878scroll top left; 879 padding: 75px 31px 76px 33px; 880 overflow: hidden; } 881 .framed-galaxynexus-port-span-5, .framed-galaxynexus-port-span-5 video, 882.framed-galaxynexus-port-span-5 img { 883 width: 216px; 884 height: 384px; } 885 886.framed-nexus4-port-216 { 887 background: transparent url(../images/styles/device_nexus4_blank_port_432.png) no-repeat 888scroll top left; 889 background-size:240px 465px; 890 padding: 52px 12px 52px 12px; 891 overflow: hidden; } 892 .framed-nexus4-port-216, .framed-nexus4-port-216 video, 893 .framed-nexus4-port-216 img { 894 width: 216px; 895 height: 360px; } 896 897.framed-nexus5-port-span-5 { 898 background: transparent url(../images/styles/device_nexus5_blank_port_span5.png) no-repeat 899 scroll top left; 900 padding: 52px 33px 69px 31px; 901 overflow: hidden; 902} 903 904.framed-nexus5-port-span-5, 905.framed-nexus5-port-span-5 video, 906.framed-nexus5-port-span-5 img { 907 width: 216px; 908 height: 384px; 909} 910 911.framed-nexus5-land-span-13 { 912 background: transparent url(../images/styles/device_nexus5_blank_land_span13.png) no-repeat scroll top left; 913 padding: 36px 119px 54px 108px; 914 overflow: hidden; 915} 916 917.framed-nexus5-land-span-13, 918.framed-nexus5-land-span-13 video, 919.framed-nexus5-land-span-13 img { 920 width: 533px; 921 height: 300px; 922} 923 924.framed-nexus5-port-span-5, 925.framed-nexus5-port-span-5 video, 926.framed-nexus5-port-span-5 img { 927 width: 216px; 928 height: 384px; 929} 930 931/* landing page disclosures */ 932.landing-page-link { 933 text-decoration: none; 934 font-weight: 500; 935 color: #333333; } 936 .landing-page-link:after { 937 content: ''; 938 background: transparent url(../images/styles/disclosure_right.png) no-repeat scroll 50% 50%; 939 width: 10px; 940 height: 10px; 941 display: inline-block; 942 margin-left: 5px; } 943 944/* tooltips */ 945.tooltip-box { 946 position: absolute; 947 background-color: rgba(0, 0, 0, 0.9); 948 border-radius: 2px; 949 font-size: 14px; 950 line-height: 20px; 951 color: #fff; 952 padding: 6px 10px; 953 max-width: 250px; 954 z-index: 10000; } 955 .tooltip-box.below:after { 956 position: absolute; 957 content: ''; 958 line-height: 0; 959 display: block; 960 top: -10px; 961 left: 5px; 962 border: 5px solid transparent; 963 border-bottom-color: rgba(0, 0, 0, 0.9); } 964 965/* video note */ 966.video-instructions { 967 margin-top: 10px; 968 margin-bottom: 10px; } 969 .video-instructions:before { 970 content: ''; 971 background: transparent url(../images/styles/ico_movie_inline.png) no-repeat scroll top left; 972 display: inline-block; 973 width: 12px; 974 height: 12px; 975 margin-right: 8px; } 976 .video-instructions:after { 977 content: 'Click device screen to replay movie.'; } 978 979/* download buttons */ 980.download-button { 981 display: block; 982 margin-bottom: 5px; 983 text-decoration: none; 984 background-color: #33b5e5; 985 color: #fff !important; 986 font-weight: 500; 987 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12); 988 padding: 6px 12px; 989 border-radius: 2px; } 990 .download-button:hover, .download-button:focus { 991 background-color: #0099cc; 992 color: #fff !important; } 993 .download-button:active { 994 background-color: #006699; } 995 996/* UI tables and other things found in Writing style and Settings pattern */ 997.ui-table { 998 width: 100%; 999 background-color: #282828; 1000 color: #fff; 1001 border-radius: 2px; 1002 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25); 1003 border-collapse: separate; } 1004 .ui-table th, 1005 .ui-table td { 1006 padding: 5px 10px; 1007 background-color: inherit; 1008 border:0;} 1009 .ui-table thead th { 1010 font-weight: bold; } 1011 .ui-table tfoot td { 1012 border-top: 1px solid #494949; 1013 border-right: 1px solid #494949; 1014 text-align: center; } 1015 .ui-table tfoot td:last-child { 1016 border-right: 0; } 1017 1018.layout-with-list-item-margins { 1019 margin-left: 30px !important; } 1020 1021.emulate-content-left-padding { 1022 margin-left: 10px; } 1023 1024.do-dont-label { 1025 margin-bottom: 10px; 1026 padding-left: 20px; 1027 background: transparent none no-repeat scroll 0px 3px; } 1028 .do-dont-label.bad { 1029 background-image: url(../images/styles/ico_wrong.png); } 1030 .do-dont-label.good { 1031 background-image: url(../images/styles/ico_good.png); } 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042 1043 1044 1045 1046 1047 1048 1049 1050 1051/***** PREVIOUSLY style.css ******************/ 1052 1053 1054 1055 1056 1057@media screen, projection, print { 1058[dir='rtl'] { 1059 direction: rtl; 1060} 1061html { 1062 line-height: 20px; 1063} 1064pre, table, input, textarea, code { 1065 font-size: 1em; 1066} 1067address, abbr, cite { 1068 font-style: normal; 1069} 1070[dir='rtl'] th { 1071 text-align: right; 1072} 1073html[lang^=ja] blockquote, html[lang^=ja] q, html[lang^=ko] blockquote, html[lang^=ko] q, 1074html[lang^=zh] blockquote, html[lang^=zh] q { 1075 font-style: normal; 1076} 1077q { 1078 font-style: italic; 1079} 1080fieldset, iframe, img { 1081 border: 0; 1082} 1083img { 1084 -ms-interpolation-mode: bicubic; 1085 vertical-align: middle; 1086 max-width: 100%; 1087} 1088q { 1089 quotes: none; 1090} 1091sup, sub { 1092 font-size: 11px; 1093 line-height: 0; 1094} 1095} 1096 1097@media screen, projection { 1098 1099table, fieldset { 1100 margin: 0; 1101} 1102h1 { 1103 color:#333; 1104 font-size: 22px; 1105 margin: 20px 0 20px; 1106 padding:0 0 10px; 1107} 1108h1, h2 { 1109 line-height: 32px; 1110} 1111h1.short { 1112 margin-right:320px; 1113} 1114h1.short { 1115 margin-right:320px; 1116} 1117h1.super { 1118 font-size: 37px; 1119} 1120h2 { 1121 color:#333; 1122 font-size: 20px; 1123 margin: 20px 0 20px; 1124 padding:0; 1125} 1126h3 { 1127 color:#333; 1128 font-size: 18px; 1129} 1130h3, h4 { 1131 color:#333; 1132 line-height: 20px; 1133 margin: 10px 0; 1134} 1135h4 { 1136 font-size: 16px; 1137} 1138h5 { 1139 font-size: 14px; 1140} 1141h5, h6 { 1142 margin: 5px 0; 1143} 1144h6 { 1145 font-size: 12px; 1146} 1147hr { /* applied to the bottom of h2 elements */ 1148 height: 1px; 1149 margin: 5px 0 20px; 1150 border: 0; 1151 background: #ccc; 1152} 1153p, pre, table, form { 1154 margin: 0 0 15px; 1155} 1156small { 1157 font-size: 11.5px; 1158 color: #000; 1159} 1160ul, ol { 1161 margin: 0 0 15px 18px; 1162 padding: 0; 1163} 1164[dir='rtl'] ul, [dir='rtl'] ol { 1165 margin: 10px 30px 10px 10px; 1166} 1167ul ul, ul ol, ol ul, ol ol { 1168 margin-bottom: 0; 1169 margin-top: 0; 1170} 1171li { 1172 margin:0 0 5px; 1173} 1174dd { 1175 margin:0 0 10px 30px; 1176} 1177dd p, 1178dd pre, 1179dd ul, 1180dd ol, 1181dd dl { 1182 margin-top:10px; 1183} 1184li p, 1185li pre, 1186li ul, 1187li ol, 1188li dl { 1189 margin-top:5px; 1190 margin-bottom:5px; 1191} 1192dl dd dl:first-child { 1193 margin-top:0; 1194} 1195pre strong, pre b, a strong, a b, a code { 1196 color: inherit; 1197} 1198pre, code { 1199 color: #060; 1200 font: 13px/1.5 monospace; 1201} 1202code { 1203 font-weight:bold; 1204 font: 13px/14px monospace; 1205} 1206 1207legend { 1208 display: none; 1209} 1210a:link, a:visited { 1211 color: #258aaf; 1212 text-decoration: none; 1213} 1214a:focus, a:hover, a:active { 1215 color: #33B5E5; 1216 text-decoration: none; 1217} 1218strong, b { 1219 font-weight:bold; 1220 color: #222; 1221} 1222table { 1223 border-collapse: collapse; 1224 border-spacing: 0; 1225 border:0; 1226 margin: .5em 1em 1em 0; 1227 width:100%; /* consistent table widths; within IE's quirks */ 1228 background-color:#f7f7f7; 1229} 1230th, td { 1231 padding: 4px 12px; 1232 vertical-align: top; 1233 text-align: left; 1234} 1235td { 1236 background-color:inherit; 1237 border:solid 1px #DDD; 1238} 1239td *:last-child { 1240 margin-bottom:0; 1241} 1242th { 1243 background-color: #999; 1244 color: #fff; 1245 border:solid 1px #DDD; 1246 font-weight: normal; 1247} 1248tr:first-of-type th:first-of-type:empty { 1249 visibility: hidden; 1250} 1251/* -------------------------------------------------------------------------- 1252Footer 1253*/ 1254.line { 1255 clear: both; 1256 background: #acbc00; 1257 background: -moz-linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%); 1258 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #acbc00), 1259color-stop(50%, #acbc00), color-stop(50%, #bdde00), color-stop(100%, #bdde00)); 1260 background: -webkit-linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%); 1261 background: -o-linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%); 1262 background: -ms-linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%); 1263 background: linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%); 1264 height: 2px; 1265 margin-top: 150px; 1266 position: relative; 1267 z-index: 11; 1268} 1269#footer { 1270 font-size:11px; 1271 clear: both; 1272 color: #999; 1273 padding: 15px 0; 1274 margin-top:10px; 1275 width:auto; 1276} 1277#footer-local ul { 1278 list-style: none; 1279 margin: 5px 0 30px 0; 1280} 1281#footer-local li { 1282 display: inline; 1283} 1284#footer-local li+li:before { 1285 content: '|'; 1286 padding: 0 3px; 1287 color: #e5e5e5; 1288} 1289#footer-global { 1290 padding: 10px 15px; 1291 background: #f5f5f5; 1292} 1293#footer-global { 1294 border-top: 1px solid #ebebeb; 1295 font-size: 11.5px; 1296 line-height: 1.8; 1297 list-style: none; 1298} 1299#footer-global ul { 1300 margin: 0; 1301} 1302#footer-global li { 1303 display: inline; 1304 font-weight: bold; 1305} 1306#footer-global li+li:before { 1307 content: '¬?'; 1308 padding: 0 3px; 1309} 1310* html #footer-global li { 1311 margin: 0 13px 0 0; 1312} 1313* [dir='rtl'] #footer-global li { 1314 margin: 0 0 0 13px; 1315} 1316*+html #footer-global li { 1317 margin: 0 13px 0 0; 1318} 1319*+[dir='rtl'] #footer-global li { 1320 margin: 0 0 0 13px; 1321} 1322#footer-global li a { 1323 font-weight: normal; 1324} 1325.locales { 1326 margin: 10px 0 0 0px; 1327} 1328[dir='rtl'] .locales { 1329 background-position: right center; 1330 float: left; 1331 padding: 0 24px 0 0; 1332} 1333.locales form { 1334 margin: 0; 1335} 1336.locales select, .sites select { 1337 line-height: 3.08; 1338 margin: 0px 0; 1339 border: solid 1px #EBEBEB; 1340 -webkit-appearance: none; 1341 background: white url('../images/arrows-up-down.png') right center no-repeat; 1342 height: 30px; 1343 color: #222; 1344 line-height: normal; 1345 padding: 5px; 1346 width: 230px; 1347} 1348} 1349 1350/* ============================================================================= 1351 Print Only 1352 ========================================================================== */ 1353@media print { 1354 /* configure printed page */ 1355 @page { 1356 margin: 0.75in 1in; 1357 widows: 4; 1358 orphans: 4; 1359 } 1360 1361 /* reset spacing metrics */ 1362 html, body, .wrap { 1363 margin: 0 !important; 1364 padding: 0 !important; 1365 width: auto !important; 1366 } 1367 1368 /* leave enough space on the left for bullets */ 1369 body { 1370 padding-left: 20px !important; 1371 } 1372 #doc-col { 1373 margin-left: 0; 1374 } 1375 1376 /* hide a bunch of non-content elements */ 1377 #header, #footer, #nav-x, #side-nav, 1378 .training-nav-top, .training-nav-bottom, 1379 #doc-col .content-footer, 1380 .nav-x, .nav-y, 1381 .paging-links, 1382 a.totop { 1383 display: none !important; 1384 } 1385 1386 /* remove extra space above page titles */ 1387 #doc-col .content-header { 1388 margin-top: 0; 1389 } 1390 1391 /* bump up spacing above subheadings */ 1392 h2 { 1393 margin-top: 40px !important; 1394 } 1395 1396 /* print link URLs where possible and give links default text color */ 1397 p a:after { 1398 content: " (" attr(href) ")"; 1399 font-size: 80%; 1400 } 1401 p a { 1402 word-wrap: break-word; 1403 } 1404 a { 1405 color: inherit; 1406 } 1407 1408 /* syntax highlighting rules */ 1409 .str { color: #060; } 1410 .kwd { color: #006; font-weight: bold; } 1411 .com { color: #600; font-style: italic; } 1412 .typ { color: #404; font-weight: bold; } 1413 .lit { color: #044; } 1414 .pun { color: #440; } 1415 .pln { color: #000; } 1416 .tag { color: #006; font-weight: bold; } 1417 .atn { color: #404; } 1418 .atv { color: #060; } 1419} 1420 1421/* ============================================================================= 1422 Columns 1423 ========================================================================== */ 1424 1425@media screen, projection, print { 1426.full { 1427 padding: 2.5em 0; 1428 border-top: solid 1px #ddd; 1429 border-bottom: solid 1px #ddd; 1430 background: #f7f7f7; 1431} 1432.wrap { 1433 margin: 0 auto; 1434 width: 940px; 1435 clear: both; 1436} 1437.cols { 1438 height: 1%; 1439 margin: 0 -1.533742331288343558282%; 1440 width: 103.06748466257669%} 1441*+html .cols { 1442 margin-bottom: 20px; 1443} 1444.cols:after { 1445 clear: both; 1446 content: ' '; 1447 display: block; 1448 height: 0; 1449 visibility: hidden; 1450} 1451.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, 1452.col-13, .col-14, .col-15, .col-16 { 1453 display: inline; 1454 float: left; 1455 margin-left: 10px; 1456 margin-right: 10px; 1457} 1458/* 1459* html .col-1, * html .col-2, * html .col-3, * html .col-4, * html .col-5, * html .col-6, * html 1460.col-7, * html .col-8, * html .col-9, * html .col-10, * html .col-11, * html .col-12 { 1461 margin: 0; 1462 padding: 0 1.4% 20px; 1463} 1464[dir='rtl'] .col-1, [dir='rtl'] .col-2, [dir='rtl'] .col-3, [dir='rtl'] .col-4, [dir='rtl'] .col-5, 1465[dir='rtl'] .col-6, [dir='rtl'] .col-7, [dir='rtl'] .col-8, [dir='rtl'] .col-9, [dir='rtl'] .col-10, 1466[dir='rtl'] .col-11, [dir='rtl'] .col-12 { 1467 float: right; 1468} 1469*/ 1470.col-1 { width: 40px } 1471.col-2 { width: 100px } 1472.col-3 { width: 160px } 1473.col-4 { width: 220px } 1474.col-5 { width: 280px } 1475.col-6 { width: 340px } 1476.col-7 { width: 400px } 1477.col-8 { width: 460px } 1478.col-9 { width: 520px } 1479.col-10 { width: 580px } 1480.col-11 { width: 640px } 1481.col-12 { width: 700px } 1482.col-13 { width: 760px } 1483.col-14 { width: 820px } 1484.col-15 { width: 880px } 1485.col-16 { width: 940px } 1486} 1487 1488.col-right { 1489 margin-right:0px; 1490} 1491 1492@media screen and (max-width:772px) { 1493.col-5, .col-6, .col-7 { 1494 clear: both; 1495 width: 97.0238096%} 1496} 1497 1498/* ============================================================================= 1499 Layout 1500 ========================================================================== */ 1501@media screen, projection, print { 1502 1503/* -------------------------------------------------------------------------- 1504Header, Login, Nav-X, Search 1505*/ 1506#header { 1507 padding: 2.2em 0 0.2em 0; 1508} 1509#header:before, #header:after { 1510 content: ""; 1511 display: table; 1512 clear: both 1513} 1514.logo, .nav-x { 1515 float: left; 1516} 1517.nav-x { 1518 margin-top: -2px; 1519 list-style-type: none; 1520} 1521.nav-x a { 1522 color: #333; 1523 font-size: 16px; 1524} 1525.design a.selected { 1526 color: #33b5e5; 1527} 1528.develop a.selected { 1529 color: #F80; 1530} 1531.distribute a.selected { 1532 color: #9C0; 1533} 1534 1535 1536 1537.nav-x li { 1538 display: inline; 1539 margin-right: 45px; 1540} 1541.search { 1542 float: right; 1543 position: relative; 1544 width: 220px 1545} 1546.search .bottom, .search .left, .search .right { 1547 position: absolute; 1548 background-color: #a3a3a3; 1549} 1550.search .bottom { 1551 width: 220px; 1552 height: 1px; 1553 top: 24px; 1554 left: 0 1555} 1556.search .left, .search .right { 1557 height: 5px; 1558 width: 1px 1559} 1560.search .left { top: 19px; left: 0 } 1561.search .right { top: 19px; right: 0 } 1562.search form { 1563 float: left; 1564 margin-top: 2px; 1565 width: inherit; 1566} 1567.search .close, 1568#player-frame .close { 1569 position: absolute; 1570 right: 8px; 1571 bottom: 4px; 1572 width: 16px; 1573 height: 16px; 1574 margin: 0; 1575 text-indent: -1000em; 1576 background: url(../images/close.png) no-repeat 0 0; 1577 z-index:9999; 1578} 1579.search .close:hover, .search .close:focus, 1580#player-frame .close:hover, #player-frame .close:focus { 1581 background-position: -16px 0; 1582 cursor:pointer; 1583} 1584#player-frame .close { 1585 top: 6px; 1586} 1587.search form input { 1588 color: #999; 1589 font-size: 1em; 1590 width: inherit; 1591 border: none; 1592 margin: 0; 1593 padding:0 0 0 6px; 1594 z-index: 1500; 1595 background-color: transparent 1596} 1597.search:hover .bottom, .search:hover .left, .search:hover .right { 1598 background-color: #33b5e5; 1599} 1600.search:hover .icon { 1601 background-position: -8px 0 1602} 1603.search form input:focus { 1604 color: #222; 1605 font-weight: bold; 1606 outline:0; 1607} 1608/* Search Dropdown */ 1609.search-dropdown { 1610 padding: 15px; 1611 width: 192px; 1612 border: solid 1px #c5c5c5; 1613 background: #fff; 1614 position: absolute; 1615 top: 35px; 1616 left: 0; 1617 -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2); 1618 -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2); 1619 box-shadow: 0 0 10px rgba(0,0,0,0.2) 1620} 1621.search-dropdown ul, .search-dropdown ul li { 1622 list-style-type: none; 1623 margin: 0; 1624 padding: 0 1625} 1626.search-dropdown ul li { 1627 clear: both 1628} 1629.search-dropdown img { 1630 float: left; 1631 margin: 0 10px 10px 0 1632} 1633.search-dropdown h6 { 1634 color: #222; 1635 margin: 0; 1636 line-height: normal 1637} 1638.search-dropdown .desc { 1639 color: #999; 1640 font-size: 11.5px; 1641 line-height: normal; 1642 margin: 0; 1643} 1644.search-dropdown li a:hover h6, .search-dropdown li a:hover .desc { 1645 color: #33b5e5 1646} 1647/* -------------------------------------------------------------------------- 1648Buttons 1649*/ 1650.button, a.button, .button-secondary, a.button-secondary { 1651 border-image: initial; 1652 -webkit-border-radius: 2px; 1653 -moz-border-radius: 2px; 1654 border-radius: 2px; 1655 cursor: pointer; 1656} 1657.button, a.button { 1658 display:inline-block; 1659 background-color: #09c; 1660 background-image: -webkit-gradient(linear, left top, left bottom, from(#2faddb), to(#09c)); 1661 background-image: -webkit-linear-gradient(top, #2faddb, #09c); 1662 background-image: -moz-linear-gradient(top, #2faddb, #09c); 1663 background-image: -ms-linear-gradient(top, #2faddb, #09c); 1664 background-image: -o-linear-gradient(top, #2faddb, #09c); 1665 background-image: linear-gradient(top, #2faddb, #09c); 1666 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2faddb', EndColorStr='#0099cc',GradientType=0); 1667 border: 1px solid #3990ab; 1668 color: #fff; 1669} 1670.button-secondary, a.button-secondary { 1671 background-color: #f3f3f3; 1672 border: 1px solid #dcdcdc; 1673 color: #444; 1674} 1675a.button, a.button:visited, a.button-secondary, a.button-secondary:visited { 1676 margin-right: 16px; 1677 font-weight: 400; 1678 min-width: 54px; 1679 outline: 0; 1680 padding: 8px 15px; 1681 text-align: center; 1682} 1683.button, .button-secondary { 1684 margin-right: 16px; 1685 font-weight: 400; 1686 min-width: 54px; 1687 outline: 0; 1688 padding: 0 15px; 1689 text-align: center; 1690} 1691.button:hover, a.button:hover { 1692 border-color: #09c; 1693 background-color: #4cadcb; 1694 background-image: -webkit-gradient(linear, left top, left bottom, from(#5dbcd9), to(#4cadcb)); 1695 background-image: -webkit-linear-gradient(top, #5dbcd9, #4cadcb); 1696 background-image: -moz-linear-gradient(top, #5dbcd9, #4cadcb); 1697 background-image: -ms-linear-gradient(top, #5dbcd9, #4cadcb); 1698 background-image: -o-linear-gradient(top, #5dbcd9, #4cadcb); 1699 background-image: linear-gradient(top, #5dbcd9, #4cadcb); 1700 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#5dbcd9', 1701EndColorStr='#4cadcb',GradientType=0); 1702 color: #fff !important; 1703} 1704.button:active, a.button:active { 1705 background-color: #1e799a; 1706 background-image: none; 1707 border-color: #30b7e6; 1708} 1709a.button.big.subtitle { 1710 line-height:18px; 1711} 1712.button-secondary:hover, a.button-secondary:hover { 1713 border-color: #dbdbdb; 1714 background-color: #f3f3f3; 1715 background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#ececec)); 1716 background-image: -webkit-linear-gradient(top, #f9f9f9, #ececec); 1717 background-image: -moz-linear-gradient(top, #f9f9f9, #ececec); 1718 background-image: -ms-linear-gradient(top, #f9f9f9, #ececec); 1719 background-image: -o-linear-gradient(top, #f9f9f9, #ececec); 1720 background-image: linear-gradient(top, #f9f9f9, #ececec); 1721 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9', 1722EndColorStr='#ececec'); 1723 color: #33B5E5 !important; 1724} 1725.button-secondary:active, a.button-secondary:active { 1726 border-color: #dadada; 1727 background: #ebebeb; /* Old browsers */ 1728 /* IE9 SVG, needs conditional override of 'filter' to 'none' */ 1729 background: 1730url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/ 1731Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0Jv 1732eD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+ 1733CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIg 1734eDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ViZWJl 1735YiIgc3RvcC1vcGFjaXR5PSIxIi8+ 1736CiAgICA8c3RvcCBvZmZzZXQ9IjEwJSIgc3RvcC1jb2xvcj0iI2Y5ZjlmOSIgc3RvcC1vcGFjaXR5PSIxIi8+ 1737CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ZhZmFmYSIgc3RvcC1vcGFjaXR5PSIxIi8+ 1738CiAgICA8c3RvcCBvZmZzZXQ9IjkwJSIgc3RvcC1jb2xvcj0iI2Y5ZjlmOSIgc3RvcC1vcGFjaXR5PSIxIi8+ 1739CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNmY2ZjYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFy 1740R3JhZGllbnQ+ 1741CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIg 1742Lz4KPC9zdmc+); 1743 background: -moz-linear-gradient(top, #ebebeb 0%, #f9f9f9 5%, #fafafa 50%, #f9f9f9 90%, 1744#ffffff 100%); /* FF3.6+ */ 1745 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ebebeb), 1746color-stop(5%,#f9f9f9), color-stop(50%,#fafafa), color-stop(90%,#f9f9f9), color-stop(100%,#ffffff)); 1747/* Chrome,Safari4+ */ 1748 background: -webkit-linear-gradient(top, #ebebeb 0%,#f9f9f9 5%,#fafafa 50%,#f9f9f9 174990%,#ffffff 100%); /* Chrome10+,Safari5.1+ */ 1750 background: -o-linear-gradient(top, #ebebeb 0%,#f9f9f9 5%,#fafafa 50%,#f9f9f9 90%,#ffffff 1751100%); /* Opera 11.10+ */ 1752 background: -ms-linear-gradient(top, #ebebeb 0%,#f9f9f9 5%,#fafafa 50%,#f9f9f9 90%,#ffffff 1753100%); /* IE10+ */ 1754 background: linear-gradient(top, #ebebeb 0%,#f9f9f9 5%,#fafafa 50%,#f9f9f9 90%,#ffffff 1755100%); /* W3C */ 1756 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebebeb', 1757endColorstr='#ffffff',GradientType=0 ); /* IE6-8 */ 1758 -webkit-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); 1759 -moz-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); 1760 box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); 1761 color: #258AAF !important; 1762} 1763.button.big { 1764 font-size:20px; 1765 display:inline-block; 1766} 1767.button.big span.small { 1768 font-size:14px; 1769} 1770.button-caption { 1771 margin-top:10px; 1772 font-size:12px; 1773 font-style:italic; 1774} 1775 1776.button.disabled, 1777.button.disabled:hover, 1778.button.disabled:active { 1779 background:#ebebeb; 1780 color:#999 !important; 1781 border-color:#999; 1782 cursor:default; 1783} 1784 1785.training-nav-top a.button-secondary, 1786.training-nav-bottom a.button-secondary { 1787 display:block; 1788 float:left; 1789 margin:0; 1790 width:130px; 1791 text-transform:uppercase; 1792 font-weight:bold; 1793 1794 background-color: #f3f3f3; 1795 background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#ececec)); 1796 background-image: -webkit-linear-gradient(top, #f9f9f9, #ececec); 1797 background-image: -moz-linear-gradient(top, #f9f9f9, #ececec); 1798 background-image: -ms-linear-gradient(top, #f9f9f9, #ececec); 1799 background-image: -o-linear-gradient(top, #f9f9f9, #ececec); 1800 background-image: linear-gradient(top, #f9f9f9, #ececec); 1801 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9', 1802EndColorStr='#ececec'); 1803 color: #33B5E5; 1804} 1805 1806.training-nav-top a.button-secondary:hover, 1807.training-nav-bottom a.button-secondary:hover { 1808 background-color: #09c; 1809 background-image: -webkit-gradient(linear, left top, left bottom, from(#2faddb), to(#09c)); 1810 background-image: -webkit-linear-gradient(top, #2faddb, #09c); 1811 background-image: -moz-linear-gradient(top, #2faddb, #09c); 1812 background-image: -ms-linear-gradient(top, #2faddb, #09c); 1813 background-image: -o-linear-gradient(top, #2faddb, #09c); 1814 background-image: linear-gradient(top, #2faddb, #09c); 1815 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2faddb', EndColorStr='#09c'); 1816 border: 1px solid #3990ab; 1817 color: #fff !important; 1818} 1819 1820.training-nav-top a.button-secondary.last, 1821.training-nav-bottom a.button-secondary.last { 1822 border-left:0; 1823} 1824 1825.training-nav-top a.button-secondary.double-size, 1826.training-nav-bottom a.button-secondary.double-size { 1827 width:291px; 1828} 1829 1830.training-nav-top, 1831.training-nav-bottom { 1832 float:right; 1833 margin:0 0 0 20px; 1834} 1835 1836.training-nav-bottom { 1837 padding:0 0 20px; 1838} 1839 1840#tb-wrapper, 1841#qv-wrapper { 1842 float:right; 1843 clear:right; 1844 margin:0 0 0 20px; /* negative top-margin to counter the content-header bottom margin */ 1845 padding:0 0 20px; 1846} 1847 1848#tb-wrapper { 1849 margin:-29px 0 0 20px; /* negative top-margin to counter the content-header bottom margin */ 1850} 1851 1852#tb, 1853#qv { 1854 font-size:13px; 1855 line-height:18px; 1856 width:238px; 1857 border:1px solid #ccc; 1858 float:right; 1859} 1860 1861#tb { 1862 width:278px; 1863} 1864 1865#tb h2, 1866#qv h2 { 1867 margin:10px 15px; 1868 padding:0; 1869 text-transform:uppercase; 1870 border-bottom:1px solid gainsboro; 1871} 1872 1873#tb *, 1874#qv * { 1875 font-size:inherit; 1876} 1877 1878#tb .download-box, 1879#qv .download-box { 1880 padding:0 0 0 15px; 1881} 1882 1883#tb .download-box .filename, 1884#qv .download-box .filename { 1885 font-size:11px; 1886 margin:4px 4px 10px; 1887 color:#666; 1888} 1889 1890 1891/* Dev guide quicknav */ 1892 1893.sidebox-wrapper { 1894 float:right; 1895 clear:right; 1896 margin:0 0 0 20px; 1897 padding:0 0 20px; 1898} 1899 1900.sidebox { 1901 width:226px; 1902 font-size:13px; 1903 line-height:18px; 1904 border-left:4px solid #99CC00; 1905 float:right; 1906 padding:0 0 0 10px; 1907 margin:0 0 1em 20px; 1908} 1909 1910.sidebox h2, 1911.sidebox h3, 1912.sidebox h4, 1913.sidebox h5 { 1914 font-weight:bold; 1915 margin:0 0 10px; 1916 line-height: 16px; 1917} 1918 1919.sidebox * { 1920 font-size:inherit; 1921} 1922 1923.sidebox > *:last-child { 1924 margin-bottom:0; 1925} 1926 1927#tb ol, 1928#tb ul, 1929#qv ul { 1930 margin:0 15px 10px 35px; 1931} 1932 1933#qv ol { 1934 list-style:none; 1935 margin:0 15px 15px; 1936 font-size:inherit; 1937 line-height:inherit; 1938} 1939 1940#tb ol ol, 1941#tb ul ul, 1942#qv ol ol, 1943#qv ul ul, 1944.sidebox ol ol, 1945.sidebox ul ul { 1946 margin-bottom:0; 1947} 1948 1949#qv ol ol { 1950 margin:3px 0 3px 15px; 1951} 1952 1953.sidebox p, 1954#qv p, 1955#tb p { 1956 margin: 0 0 10px; 1957} 1958 1959/* related resources blocks in checklists */ 1960 1961.rel-resources { 1962 margin:10px 0px; 1963 border:1px solid #ccc; 1964 background-color:rgba(0, 0, 0, 0.027451); 1965 border:1px solid #ccc; 1966 font-size:13px; 1967 color:#6f6f6f; 1968} 1969 1970.rel-resources ul { 1971padding: .5em 1em 0 1em; 1972} 1973 1974.rel-resources a { 1975font-weight:500; 1976} 1977 1978.rel-resources h3 { 1979 margin:4px 15px 0px 15px; 1980 font-size:13px; 1981 font-weight:600; 1982 text-transform:uppercase; 1983} 1984 1985/* -------------------------------------------------------------------------- 1986Form 1987*/ 1988.article form { 1989 margin: 0 0 20px; 1990} 1991.article form .form-required { 1992 color: #dd4b39; 1993} 1994.article form fieldset { 1995 margin: 0 0 20px; 1996 padding: 0; 1997} 1998.article form legend { 1999 display: block; 2000 line-height: 1.5; 2001 margin: 0; 2002 padding: 0; 2003} 2004/* 2005.article form ol, .article form ul { 2006 margin: 0 0 0 1em; 2007 padding: 0 0 0 1em; 2008} 2009[dir='rtl'] .article form ol, [dir='rtl'] .article form ul { 2010 margin: 0 1em 0 0; 2011 padding: 0 1em 0 0; 2012} 2013.article form ol ul, .article form ul ul, [dir='rtl'] .article form ol ul, [dir='rtl'] .article form 2014ul ul { 2015 list-style: none; 2016 margin: 0; 2017 padding: 0; 2018} 2019.article form li { 2020 margin: 0 0 20px; 2021} 2022.article form li li { 2023 margin: 0 0 5px; 2024} 2025*/ 2026.article form label { 2027 display: block; 2028 margin: 0 0 5px; 2029 padding: 0; 2030} 2031.article form input[type='text'], .article form select, .article form textarea, .article form 2032.checkbox-group, .article form .radio-group { 2033 margin-bottom: 15px; 2034} 2035.checkbox-group input { 2036 width: 13px; 2037 height: 13px; 2038 background: #fff; 2039 border: solid 1px #c6c6c6; 2040 float: left; 2041} 2042.article form .checkbox-group, .article form .radio-group { 2043 display: block 2044} 2045.article form select { 2046 border: solid 1px #ebebeb; 2047 border-top-color: #ddd; 2048 -webkit-appearance: none; 2049 background: #f3f3f3 url(../images/arrows-up-down.png) right center no-repeat; 2050 height: 30px; 2051 color: #222; 2052 line-height: normal; 2053 padding: 5px; 2054 width: 130px; 2055} 2056 2057.article form .browse .browse-msg { 2058 font-size: 11.5px; 2059} 2060.article form .browse .button-secondary { 2061 height: auto; 2062 line-height: 25px; 2063 font-size: 11px; 2064 padding: 0 8px; 2065 margin: 0 10px 15px 0; 2066} 2067.article form input[type='text'], .article form textarea { 2068 border: 1px solid #ebebeb; 2069 border-top-color: #dcdcdc; 2070 color: #222; 2071 line-height: normal; 2072 padding: 6px 10px; 2073 width: 300px; 2074} 2075.article form textarea { 2076 height: 150px; 2077} 2078.article form input[type='text']:focus, .article form textarea:focus { 2079 border-color: #33B5E5; 2080 -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2); 2081 -o-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2); 2082 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2); 2083 box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2); 2084 outline: 0; 2085} 2086.article form input[disabled], .article form textarea[disabled], .article form label.form-disabled { 2087 color: #999; 2088} 2089.article form input[type='text'][disabled], .article form textarea[disabled] { 2090 background-color: #ebebeb; 2091} 2092form .form-error input[type='text'], form .form-error textarea { 2093 border-color: #dd4b39; 2094 margin-right: 20px; 2095} 2096.aside { 2097 -moz-border-radius: 2px; 2098 -webkit-border-radius: 2px; 2099 border-radius: 2px; 2100 margin: 10px 0; 2101 padding: 20px; 2102 color: #666; 2103 position: relative; 2104 background: #f9f9f9; 2105} 2106/* 2107.aside, .notification, .promo { 2108 -moz-border-radius: 2px; 2109 -webkit-border-radius: 2px; 2110 border-radius: 2px; 2111 margin: 10px 0; 2112 padding: 10px; 2113 position: relative; 2114} 2115.aside>:first-child, .notification>:first-child, .promo>:first-child { 2116 margin-top: 0; 2117} 2118.aside>:last-child, .notification>:last-child, .promo>:last-child { 2119 margin-bottom: 0; 2120} 2121.aside { 2122 background: #f9f9f9; 2123} 2124.notification { 2125 background: #fffbe4; 2126 border-color: #f8f6e6; 2127} 2128.promo { 2129 background: #f6f9ff; 2130 border-color: #eff2f9; 2131} 2132*/ 2133 2134/* SDK TOS styles */ 2135 2136div.sdk-terms { 2137 white-space: pre-wrap; 2138 word-wrap: break-word; 2139 font-family: inherit; 2140 font-size: inherit; 2141 padding: 10px; 2142 height: 370px; 2143 width: 738px; 2144 border: 1px solid #444; 2145 background: transparent; 2146 overflow:auto; 2147 margin:0 0 10px; 2148} 2149 2150div.sdk-terms.fullsize { 2151 padding: 0; 2152 height: auto; 2153 width: auto; 2154 border:none; 2155} 2156 2157div.sdk-terms h3, 2158div.sdk-terms h2 { 2159 margin:0; 2160} 2161 2162div#sdk-terms-form { 2163 padding:0 0 0 10px; 2164} 2165 2166div#sdk-terms-form input { 2167 display:inline; 2168 margin:4px 4px 4px 0; 2169} 2170 2171 2172/* -------------------------------------------------------------------------- 2173Code Style 2174*/ 2175pre { 2176 margin:0 0 1em 0; 2177 padding: 1em; 2178 overflow: auto; 2179 border: solid 1px #ddd; 2180 background: #f7f7f7; 2181} 2182.str { color: #800; } /* Code string */ 2183.kwd { color: #008; } 2184.typ { color: #606; } 2185.lit { color: #066; } 2186.pun { color: #660; } 2187.pln { color: #000; } 2188.tag { color: #008; } 2189.atn { color: #828; } 2190.atv { color: #800; } /* XML string */ 2191.dec { color: #606; } 2192 2193/* -------------------------------------------------------------------------- 2194Three-Pane 2195*/ 2196/* Package Nav & Classes Nav */ 2197.three-pane { 2198 position: relative; 2199 border-top: solid 1px #ebebeb; 2200} 2201#packages-nav .js-pane, 2202#classes-nav .js-pane { 2203 overflow:visible; 2204} 2205#packages-nav { 2206 height:270px; 2207 max-height: inherit; 2208 overflow: hidden; 2209 position: relative; 2210} 2211#classes-nav { 2212 overflow: hidden; 2213 position: relative; 2214} 2215#packages-nav ul, #classes-nav ul { 2216 list-style-type: none; 2217 margin: 10px 0 20px 0; 2218 padding: 0; 2219} 2220#classes-nav li { 2221 font-weight: bold; 2222 margin: 5px 0; 2223} 2224#packages-nav li, 2225#classes-nav li li { 2226 margin: 0; 2227} 2228#packages-nav li a, #packages-nav li a:active, #packages-nav li a:visited, 2229#classes-nav li a, #classes-nav li a:active, #classes-nav li a:visited { 2230 padding: 0 0 0 4px; 2231} 2232#packages-nav li a, #packages-nav li a:active, #packages-nav li a:visited, 2233#classes-nav li li a, #classes-nav li li a:active, #classes-nav li li a:visited, 2234#nav-tree li a, #nav-tree li a:active, #nav-tree li a:visited { 2235 color: #222; 2236 font-weight: normal; 2237} 2238#packages-nav li a, #packages-nav li a:active, #packages-nav li a:visited, 2239#classes-nav li li a, #classes-nav li li a:active, #classes-nav li li a:visited { 2240 display: block; 2241} 2242#packages-nav li.selected a, #packages-nav li.selected a:active, #packages-nav li.selected 2243a:visited, 2244#classes-nav li li.selected a, #classes-nav li li.selected a:active, #classes-nav li li.selected 2245a:visited, 2246#nav-tree li div.selected { 2247 font-weight: 500; 2248 color: #0099cc; 2249 background-color:#fff; } 2250 #packages-nav li.selected ul li a, 2251 #classes-nav li.selected ul li a { 2252 /* don't highlight child items */ 2253 color: #555555; } 2254#nav-tree li div.selected a { 2255 font-weight: 500; 2256 color: #0099cc; 2257} 2258#nav-swap { 2259 height:30px; 2260 border-top:1px solid #ccc; 2261} 2262#nav-swap a { 2263 display:inline-block; 2264 height:100%; 2265 color: #222; 2266 font-size: 12px; 2267 padding: 5px 0 5px 5px; 2268} 2269 2270#nav-swap .fullscreen { 2271 float: right; 2272 width: 24px; 2273 height: 24px; 2274 text-indent: -1000em; 2275 padding:0; 2276 margin:3px 5px 0; 2277 background: url(../images/fullscreen.png) no-repeat -24px 0; 2278} 2279#nav-swap .fullscreen.disabled { 2280 background-position: 0 0; 2281} 2282#nav-swap .fullscreen:hover, 2283#nav-swap .fullscreen:focus { 2284 cursor:pointer; 2285} 2286 2287 2288/* nav tree */ 2289#side-nav, #swapper, 2290#nav-tree, #tree-list { 2291 overflow:hidden; 2292 margin-left:0; 2293} 2294 2295#devdoc-nav { 2296 overflow:visible !important; /* To keep the "to top" button visible */ 2297} 2298 2299#nav-tree ul { 2300 list-style:none; 2301 padding:0; 2302 margin:10px 0; 2303} 2304 2305#nav-tree ul li div { 2306 padding:0 0 0 4px; 2307} 2308 2309#side-nav #nav-tree ul li a, 2310#side-nav #nav-tree ul li span.no-children { 2311 padding: 0; 2312 margin: 0; 2313} 2314 2315#nav-tree .plus { 2316 margin: 0 3px 0 0; 2317} 2318 2319#nav-tree ul ul { 2320 list-style: none; 2321 margin: 0; 2322 padding: 0 0 0 0; 2323} 2324 2325#nav-tree ul li { 2326 margin: 0; 2327 padding: 0 0 0 0; 2328 white-space: nowrap; 2329} 2330 2331#nav-tree .children_ul { 2332 padding:0; 2333 margin:0; 2334} 2335#nav-tree .children_ul li div { 2336 padding:0 0 0 10px; 2337} 2338#nav-tree .children_ul .children_ul li div { 2339 padding:0 0 0 20px; 2340} 2341 2342#nav-tree a.nolink { 2343 color: #222; 2344 text-decoration: none; 2345} 2346 2347#nav-tree span.label { 2348 width: 100%; 2349} 2350 2351#nav-tree { 2352 overflow-x: auto; 2353 overflow-y: scroll; 2354 outline:0; 2355} 2356 2357 2358/* Content */ 2359#doc-col { 2360 margin-right:0; 2361} 2362#doc-content-container { 2363 margin-left: 291px 2364} 2365#doc-header, #doc-content { 2366 padding: 1em 2em; 2367} 2368#doc-header { 2369 background: #f7f7f7; 2370} 2371#doc-header h1 { 2372 line-height: 0; 2373 margin-bottom: 15px; 2374} 2375#api-info-block { 2376 float: right; 2377 font-weight: bold; 2378} 2379#api-info-block a, #api-info-block a:active, #api-info-block a:visited { 2380 color: #222; 2381} 2382#api-info-block a:hover, #api-info-block a:focus { 2383 color: #33B5E5; 2384} 2385#api-nav-header { 2386 height:19px; /* plus 16px padding = 35; same as #nav li */ 2387 font-size:14px; 2388 padding: 8px 0; 2389 margin: 0; 2390 border-bottom: 1px solid #CCC; 2391 background:#e9e9e9; 2392 background: rgba(0, 0, 0, 0.05); /* matches #nav li.expanded */ 2393 2394} 2395#api-nav-title { 2396 padding:0 5px; 2397 white-space:nowrap; 2398} 2399 2400#api-level-toggle { 2401 float:right; 2402 padding:0 5px; 2403} 2404 2405#api-level-toggle label { 2406 margin:0; 2407 vertical-align:top; 2408 line-height: 19px; 2409 font-size:13px; 2410 height: 19px; 2411} 2412 2413#api-level-toggle .select-wrapper { 2414 width: 35px; 2415 display: inline-block; 2416 overflow: hidden; 2417} 2418#api-level-toggle select { 2419 border: 0; 2420 appearance:none; 2421 -moz-appearance:none; 2422 -webkit-appearance: none; 2423 background: transparent url(../images/arrows-up-down.png) 23px 5px no-repeat; 2424 color: #222; 2425 height: 19px; 2426 line-height: 19px; 2427 padding: 0; 2428 margin:1px 0 0 0; 2429 width:150%; 2430 font-size:13px; 2431 vertical-align:top; 2432 outline:0; 2433} 2434 2435 2436/* Toggle for revision notes and stuff */ 2437div.toggle-content.closed .toggle-content-toggleme { 2438 display:none; 2439} 2440 2441#jd-content img.toggle-content-img { 2442 margin:0 5px 5px 0; 2443} 2444 2445div.toggle-content-toggleme { 2446 padding:0 0 0 15px; 2447} 2448 2449 2450/* API LEVEL FILTERED MEMBERS */ 2451 2452.absent, 2453.absent a:link, 2454.absent a:visited, 2455.absent a:hover, 2456.absent * { 2457 color:#bbb !important; 2458 cursor:default !important; 2459 text-decoration:none !important; 2460} 2461#devdoc-nav li.absent.selected, 2462#devdoc-nav li.absent.selected *, 2463#devdoc-nav div.label.absent.selected, 2464#devdoc-nav div.label.absent.selected * { 2465 background-color:#eaeaea !important; 2466} 2467.absent h4.jd-details-title, 2468.absent h4.jd-details-title * { 2469 background-color:#f6f6f6 !important; 2470} 2471.absent img { 2472 opacity: .3; 2473 filter: alpha(opacity=30); 2474 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 2475} 2476 2477 2478 2479 2480 2481 2482 2483 2484 2485/* JQUERY RESIZABLE STYLES */ 2486.ui-resizable { position: relative; } 2487.ui-resizable-handle { position: absolute; display: none; font-size: 0.1px; z-index:1; } 2488.ui-resizable .ui-resizable-handle { display: block; border-bottom: 1px solid #e4e4e4; } 2489/*body .ui-resizable-disabled .ui-resizable-handle { display: none; } 2490body .ui-resizable-autohide .ui-resizable-handle { display: none; }*/ 2491.ui-resizable-s { cursor: s-resize; height: 10px; width: 100% !important; bottom: -11px; left: 0; 2492border-bottom: solid 1px #ededed; 2493 background: #f7f7f7 url("../images/resizable-s2.png") no-repeat scroll center center; } 2494/* 2495.ui-resizable-e { 2496cursor: e-resize; width: 10px; right: 0; top: 0; height: 100%; border-right: solid 24971px #ededed;background: #f7f7f7 url("../images/resizable-e2.png") no-repeat scroll center center; } 2498*/ 2499 2500/* -------------------------------------------------------------------------- 2501Lightbox 2502*/ 2503.lightbox { 2504 width: 769px; 2505 padding: 1.5em; 2506 margin: 0 auto; 2507 border: solid 1px #dcdcdc; 2508 background: #fff; 2509 -moz-box-shadow: 1px 1px 5px rgba(0,0,0,0.1); 2510 -webkit-box-shadow: 1px 1px 5px rgba(0,0,0,0.1); 2511 box-shadow: 1px 1px 5px rgba(0,0,0,0.1) 2512} 2513.lightbox .header { 2514 float: left; 2515 width: 720px; 2516 margin: -10px 20px 10px 0; 2517} 2518.lightbox .close { 2519 float: right; 2520 width: 10px; 2521 height: 10px; 2522 margin: -10px -10px 10px 0; 2523 text-indent: -1000em; 2524 background: url(../images/close.png) no-repeat 0 0; 2525} 2526.lightbox .close:hover, .lightbox .close:focus { 2527 background-position: -10px 0; 2528} 2529 2530/* -------------------------------------------------------------------------- 2531Styles for samples browser 2532*/ 2533 2534#codesample-wrapper { 2535 width:100000px; /* super wide to contain floats, but doesn't cause scroll */ 2536 overflow:visible; 2537} 2538pre#codesample-block { 2539 float:left; 2540 overflow:visible; 2541 background:transparent; 2542 border:none; 2543} 2544pre#codesample-block a.number { 2545 display:none; 2546} 2547pre#codesample-block .code-line:hover { 2548 background:#e7e7e7; 2549} 2550pre#codesample-line-numbers { 2551 float:left; 2552 width:2em; 2553 background:transparent; 2554 border:none; 2555 border-right:1px solid #ccc; 2556 padding-left:0; 2557 font-family:monospace; 2558 text-align:right; 2559 -webkit-touch-callout: none; 2560 -webkit-user-select: none; 2561 -khtml-user-select: none; 2562 -moz-user-select: -moz-none; 2563 -ms-user-select: none; 2564 user-select: none; 2565} 2566pre#codesample-line-numbers a { 2567 color:#999; 2568} 2569pre#codesample-line-numbers.hidden { 2570 display:none; 2571} 2572pre#codesample-block span.code-line { 2573 width:100%; 2574 display:inline-block; 2575} 2576 2577/* 2578Styles for displaying image or video resources in samples browser. 2579Resources are marked as no-display if they exceed the size limit. 2580*/ 2581div#codesample-resource img, div#codesample-resource video { 2582 border: 1px solid #ececec; 2583} 2584 2585div#codesample-resource.noDisplay div { 2586 border: 1px solid #ececec; 2587 width:120px; 2588 margin-bottom:4px; 2589 padding:20px; 2590} 2591 2592div#codesample-resource .noDisplay-message:after { 2593 font-style:italic; 2594 font-size:12px; 2595 content: 'This resource is not available for browsing. To view it, please download the project.'; 2596} 2597 2598/* 2599Styles for project structure (treeview) page 2600*/ 2601.structure-dir { 2602background-image:url(../../assets/images/folder.png); 2603background-repeat:no-repeat; 2604background-position:16px 2px; 2605 margin:.25em 0 0 0; 2606 padding:0 0 0 0; 2607} 2608 2609.structure-toggleme { 2610 margin:0 0 0 3em; 2611 padding:0 0 0 0; 2612 text-decoration:none; 2613} 2614 2615.structure-java{ 2616background-image:url(../../assets/images/file-java.png); 2617background-repeat:no-repeat; 2618background-position:0px 2px; 2619 margin:.3em 0 0 0; 2620 padding:.3em 0 .3em 22px; 2621} 2622 2623.structure-file { 2624background-image:url(../../assets/images/file-generic.png); 2625background-repeat:no-repeat; 2626background-position:0px 2px; 2627 margin:.3em 0 0 0; 2628 padding:.3em 0 .3em 22px; 2629} 2630 2631.structure-xml { 2632background-image:url(../../assets/images/file-xml.png); 2633background-repeat:no-repeat; 2634background-position:0px 2px; 2635 margin:.3em 0 0 0; 2636 padding:.3em 0 .25em 22px; 2637} 2638 2639.structure-img { 2640background-image:url(../../assets/images/file-image.png); 2641background-repeat:no-repeat; 2642background-position:0px 2px; 2643 margin:.3em 0 0 0; 2644 padding:.3em 0 .25em 22px; 2645} 2646 2647.structure-manifest { 2648background-image:url(../../assets/images/file-manifest.png); 2649background-repeat:no-repeat; 2650 margin:.0 0 0 1.25em; 2651 padding:0 0 0 22px; 2652 text-decoration:none; 2653} 2654 2655#jd-content .structure-toggle-img { 2656 margin:.5em 0 0 0; 2657padding-right:2.1em; 2658} 2659 2660.dirInfo { 2661 margin-left:2em; 2662} 2663 2664.structure-dir a { 2665 text-decoration:none; 2666} 2667 2668.structure-manifest a { 2669 text-decoration: none; 2670} 2671.structure-file a { 2672 text-decoration: none; 2673} 2674 2675.sampleEmbed { 2676 background-color:rgb(249, 249, 249); 2677} 2678 2679.sampleEmbed ol.lineNumbers { 2680 list-style-type: decimal; 2681 padding-left:1em; 2682} 2683 2684.sampleEmbed ol.lineNumbers li { 2685border-left:1px solid #ddd; 2686border-right:1px solid #ddd; 2687color:gray; 2688background-color:#f7f7f7; 2689margin:0 0 0 24px; 2690padding: 2px 2px 2px 6px; 2691} 2692 2693.sampleEmbed ol.lineNumbers li:hover { 2694background: #efefef; 2695} 2696 2697.samples-nav li a { 2698 overflow: hidden; 2699 text-overflow: ellipsis; 2700 white-space: nowrap; 2701} 2702 2703/* -------------------------------------------------------------------------- 2704Styles for raw formatted line numbers (not used with listformatted version) 2705div.sampleLine div.lineNumber { 2706 display: inline; 2707} 2708div.sampleLine div.lineCode { 2709 display: inline; 2710 padding-left:6px; 2711} 2712div.sampleLine { 2713 padding:0; 2714 margin:0; 2715}*/ 2716 2717/* -------------------------------------------------------------------------- 2718Butterbar 2719*/ 2720#butterbar-wrapper { 2721 position:absolute; 2722 top:0; 2723 left:0; 2724 width:100%; 2725} 2726#butterbar { 2727 width:940px; 2728 margin:0 auto; 2729} 2730#butterbar-message { 2731 background-color:#f80; 2732 float:right; 2733 font-size:12px; 2734 font-weight:bold; 2735 padding:0 10px; 2736 border-radius: 0 0 5px 5px; 2737} 2738#butterbar-message a {color:#fff !important} 2739#butterbar-message a:hover {text-decoration:underline;} 2740 2741/* -------------------------------------------------------------------------- 2742Misc 2743*/ 2744 2745 2746.clearfix:before, .clearfix:after { 2747 content: ""; 2748 display: table 2749} 2750.clearfix:after { 2751 clear: both 2752} 2753.clearfix { 2754 *zoom: 1 2755} 2756table.blank th, table.blank td { 2757 border: 0; 2758 background: none 2759} 2760.caption { 2761 margin: 0.5em 0 2em 0; 2762 color: #000; 2763 font-size: 11.5px; 2764} 2765 2766.nolist, .nolist ul, .nolist ol { 2767 list-style:none; 2768 margin-left:0; 2769} 2770#tb .nolist { 2771 margin-left:15px; 2772} 2773 2774dl.xml>dt { 2775 text-transform:uppercase; 2776} 2777dl.xml dl.attr { 2778 margin-top:0; 2779} 2780 2781pre.classic { 2782 background-color:transparent; 2783 border:none; 2784 padding:0; 2785} 2786 2787p.img-caption { 2788 margin: -10px 0 20px; 2789 font-size:13px; 2790 color:#666; 2791} 2792 2793div.figure, 2794div.figure-right { 2795 float:right; 2796 clear:right; 2797 margin:10px 0 0 0; 2798 padding:0 0 0 20px; 2799 /* width must be defined w/ an inline style matching the image width */ 2800} 2801 2802div.figure-left { 2803 float:left; 2804 clear:left; 2805 margin:10px 0 0 0; 2806 padding:0 20px 0 0; 2807 /* width must be defined w/ an inline style matching the image width */ 2808} 2809 2810img.frame { 2811 border:1px solid #DDD; 2812 padding:4px; 2813} 2814 2815p.table-caption { 2816 margin: 0 0 4px 0; 2817 font-size:13px; 2818 color:#666; 2819} 2820 2821p.code-caption { 2822 margin-bottom: 4px; 2823 font: 12px/1.5 monospace; 2824 color:#666; 2825} 2826 2827div.note, 2828div.caution, 2829div.warning { 2830 margin: 0 0 15px; 2831} 2832 2833p.note, div.note, 2834p.caution, div.caution, 2835p.warning, div.warning { 2836 padding: 0 0 0 10px; 2837 border-left: 4px solid; 2838} 2839 2840p.note, div.note { 2841 border-color: #258AAF; 2842} 2843 2844p.caution, div.caution { 2845 border-color: #FF8800; 2846} 2847 2848p.warning, div.warning { 2849 border-color: #ff4443; 2850} 2851 2852div.note.design { 2853 border-left: 4px solid #33B5E5; 2854} 2855 2856div.note.develop { 2857 border-left: 4px solid #F80; 2858} 2859 2860div.note.distribute { 2861 border-left: 4px solid #9C0; 2862} 2863 2864.note p, .caution p, .warning p { 2865 margin:0 0 5px; 2866} 2867 2868.note p:last-child, .caution p:last-child, .warning p:last-child { 2869 margin-bottom:0; 2870} 2871 2872body.about blockquote { 2873 display:block; 2874 float:right; 2875 width:280px; 2876 font-size:20px; 2877 font-style:italic; 2878 line-height:24px; 2879 color:#33B5E5; 2880 margin:0 0 20px 30px; 2881} 2882 2883div.design-announce p { 2884 margin:0 0 10px; 2885} 2886 2887#devdoc-nav a.totop { 2888 display:block; 2889 top:0; 2890 width:inherit; 2891 background: transparent url(../images/styles/gototop.png) no-repeat scroll 50% 50%; 2892 text-indent:-9999em; 2893} 2894#devdoc-nav a.totop { 2895 position:fixed; 2896 display:none; 2897} 2898#devdoc-nav a.totop:hover { 2899 background-color:#33B5E5; 2900} 2901 2902.content-footer a.totop { 2903 text-transform:uppercase; 2904 line-height:30px; 2905} 2906 2907.expandable { 2908 height:34px; 2909 padding-left:20px; 2910 position:relative; 2911} 2912.expandable:before { 2913 content: ''; 2914 background-image: url(../images/styles/disclosure_down.png); 2915 background-repeat:no-repeat; 2916 background-position: -12px -9px; 2917 width: 20px; 2918 height: 20px; 2919 display: inline-block; 2920 position: absolute; 2921 top: 0; 2922 left: 0; } 2923} 2924.expandable.expanded:before { 2925 background-image: url(../images/styles/disclosure_up.png); 2926} 2927 2928/* notice box for cross links between Design/Develop docs */ 2929a.notice-developers-video, 2930a.notice-developers, 2931a.notice-designers-video, 2932a.notice-designers { 2933 float:right; 2934 clear:right; 2935 width:238px; 2936 min-height:50px; 2937 margin:0 0 20px 20px; 2938 border:1px solid #ddd; 2939} 2940a.notice-developers-video.wide, 2941a.notice-developers.wide, 2942a.notice-designers-video.wide, 2943a.notice-designers.wide { 2944 width:278px; 2945} 2946a.notice-developers-video div, 2947a.notice-developers div, 2948a.notice-designers-video div, 2949a.notice-designers div { 2950 min-height:40px; 2951 background:url('../images/styles/notice-developers@2x.png') no-repeat 10px 10px; 2952 background-size:40px 40px; 2953 padding:10px 10px 10px 60px; 2954} 2955a.notice-designers div { 2956 background:url('../images/styles/notice-designers@2x.png') no-repeat 10px 10px; 2957 background-size:40px 40px; 2958} 2959a.notice-designers-video div { 2960 background:url('../images/styles/notice-designers-video@2x.png') no-repeat 10px 10px; 2961 background-size:40px 40px; 2962} 2963a.notice-developers-video div { 2964 background:url('../images/styles/notice-developers-video@2x.png') no-repeat 10px 10px; 2965 background-size:40px 40px; 2966} 2967a.notice-developers-video:hover, 2968a.notice-developers:hover, 2969a.notice-designers-video:hover, 2970a.notice-designers:hover { 2971 background:#eee; 2972} 2973a.notice-developers-video h3, 2974a.notice-developers h3, 2975a.notice-designers-video h3, 2976a.notice-designers h3 { 2977 font-size:13px; 2978 line-height:18px; 2979 font-weight:bold; 2980 text-transform:uppercase; 2981 color:#000 !important; 2982 margin:0 0 1px; 2983} 2984a.notice-developers-video p, 2985a.notice-developers p, 2986a.notice-designers-video p, 2987a.notice-designers p { 2988 margin:0; 2989 line-height:14px; 2990} 2991a.notice-developers-video.left, 2992a.notice-developers.left, 2993a.notice-designers-video.left, 2994a.notice-designers.left { 2995 margin-left:0; 2996 float:left; 2997} 2998 2999 3000/* hide nested list items; companion to hideNestedLists() */ 3001.hide-nested li ol, 3002.hide-nested li ul { 3003 display:none; 3004} 3005 3006a.header-toggle { 3007 display:block; 3008 float:right; 3009 text-transform:uppercase; 3010 font-size:.8em !important; 3011 font-weight:normal; 3012 margin-top:2px; 3013} 3014 3015 3016/* ----------------------------------------------- 3017good/bad example containers 3018*/ 3019 3020div.example-block { 3021 background-repeat: no-repeat; 3022 background-position:10px 8px; 3023 background-color:#ccc; 3024 padding:4px; 3025 margin:.8em auto 1.5em 2em; 3026 width:260px; 3027 float:right; 3028} 3029/* red container */ 3030.example-block.bad { 3031 background-image: url(/images/example-bad.png); 3032 background-color:#f4cccc; 3033} 3034/* green container */ 3035.example-block.good { 3036 background-image: url(/images/example-good.png); 3037 background-color:#d9ead3; 3038} 3039/* container heading div */ 3040#jd-content .example-block .heading { 3041 font-weight:bold; 3042 margin:6px 0 9px 36px; 3043 padding:6px auto; 3044} 3045/* container image (if any) */ 3046#jd-content .example-block img { 3047 margin:0; 3048 padding:0px; 3049} 3050 3051.example-block table { 3052 margin:0; 3053} 3054 3055/* ----------------------------------------------- 3056Dialog box for popup messages 3057*/ 3058 3059div.dialog { 3060 height:0; 3061 margin:0 auto; 3062} 3063 3064div.dialog>div { 3065 z-index:99; 3066 position:fixed; 3067 margin:70px 0; 3068 width: 391px; 3069 height: 200px; 3070 background: #F7F7F7; 3071-moz-box-shadow: 0 0 15px rgba(0,0,0,0.5); 3072-webkit-box-shadow: 0 0 15px rgba(0,0,0,0.5); 3073box-shadow: 0 0 15px rgba(0,0,0,0.5); 3074} 3075/* IE6 can't position fixed */ 3076* html div.dialog div { position:absolute; } 3077 3078 3079div#deprecatedSticker { 3080 display:none; 3081 z-index:99; 3082 position:fixed; 3083 right:15px; 3084 top:114px; 3085 margin:0; 3086 padding:1em; 3087 background:#FFF; 3088 border:1px solid #dddd00; 3089 box-shadow:-5px 5px 10px #ccc; 3090 -moz-box-shadow:-5px 5px 10px #ccc; 3091 -webkit-box-shadow:-5px 5px 10px #ccc; 3092} 3093 3094div#naMessage { 3095 display:none; 3096 width:555px; 3097 height:0; 3098 margin:0 auto; 3099} 3100 3101div#naMessage div { 3102 z-index:99; 3103 width:450px; 3104 position:fixed; 3105 margin:50px 0; 3106 padding:4em 4em 3em; 3107 background:#FFF; 3108 border:1px solid #999; 3109 box-shadow:-10px 10px 40px #888; 3110 -moz-box-shadow:-10px 10px 40px #888; 3111 -webkit-box-shadow:-10px 10px 40px #888; 3112} 3113/* IE6 can't position fixed */ 3114* html div#naMessage div { position:absolute; } 3115 3116div#naMessage strong { 3117 font-size:1.1em; 3118} 3119 3120 3121/* -------------------------------------------------------------------------- 3122Slideshow Controls & Next/Prev 3123*/ 3124.slideshow-next, .slideshow-prev { 3125 width: 20px; 3126 height: 36px; 3127 text-indent: -1000em; 3128} 3129.slideshow-container { 3130 margin: 2em 0; 3131} 3132.slideshow-container:before, .slideshow-container:after { 3133 content: ""; 3134 display: table; 3135 clear: both; 3136} 3137a.slideshow-next, a.slideshow-next:visited { 3138 3139 float: right; 3140 3141 background: url(../images/arrow-right.png) no-repeat 0 0 3142 3143} 3144 3145a.slideshow-prev, a.slideshow-prev:visited { 3146 3147 float: left; 3148 3149 background: url(../images/arrow-left.png) no-repeat 0 0 3150 3151} 3152 3153.slideshow-next:hover, .slideshow-prev:hover, .slideshow-next:focus, .slideshow-prev:focus { 3154 3155 background-position: 0 -36px 3156 3157} 3158 3159.slideshow-next:active, .slideshow-prev:active { 3160 3161 background-position: 0 -72px 3162 3163} 3164.slideshow-nav { 3165 width: 74px; 3166 margin: 0 auto; 3167} 3168.slideshow-nav a, .slideshow-nav a:visited { 3169 display: inline-block; 3170 width: 12px; 3171 height: 12px; 3172 margin: 0 2px 20px 2px; 3173 background: #ccc; 3174 -webkit-border-radius: 50%; 3175 -moz-border-radius: 50%; 3176 border-radius: 50%; 3177} 3178.slideshow-nav a:hover, .slideshow-nav a:focus { 3179 3180 background: #33B5E5 3181} 3182 3183.slideshow-nav a:active { 3184 3185 background: #1e799a; 3186 background: #ebebeb; 3187 -webkit-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); 3188 -moz-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); 3189 box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); 3190} 3191.slideshow-nav a.active, .slideshow-nav a.active:active, .slideshow-nav a.active:visited { 3192 background: #33B5E5 3193} 3194/* -------------------------------------------------------------------------- 3195Tabs 3196*/ 3197ul.tabs { 3198 padding: 0; 3199 margin: 2em 0 0 0; 3200} 3201ul.tabs:before, ul.tabs:after { 3202 content: ""; 3203 display: table; 3204 clear: both; 3205} 3206ul.tabs li { 3207 list-style-type: none; 3208 float: left; 3209} 3210ul.tabs li a, ul.tabs li a:active, ul.tabs li a:visited { 3211 display: block; 3212 height: 36px; 3213 line-height: 36px; 3214 padding: 0 15px; 3215 margin-right: 2px; 3216 color: #222; 3217 -moz-border-radius-topleft: 2px; 3218 -moz-border-radius-topright: 2px; 3219 -moz-border-radius-bottomright: px; 3220 -moz-border-radius-bottomleft: px; 3221 -webkit-border-radius: 2px 2px px px; 3222 border-radius: 2px 2px px px; 3223 border-top: solid 1px #ebebeb; 3224 border-left: solid 1px #ebebeb; 3225 border-right: solid 1px #ebebeb; 3226 background-color: #fff; 3227 background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#fafafa)); 3228 background-image: -webkit-linear-gradient(top, #ffffff, #fafafa); 3229 background-image: -moz-linear-gradient(top, #ffffff, #fafafa); 3230 background-image: -ms-linear-gradient(top, #ffffff, #fafafa); 3231 background-image: -o-linear-gradient(top, #ffffff, #fafafa); 3232 background-image: linear-gradient(top, #ffffff, #fafafa); 3233 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', 3234EndColorStr='#fafafa'); 3235} 3236ul.tabs li a:hover { 3237 color: #33B5E5; 3238} 3239ul.tabs li a.selected { 3240 height: 37px; 3241 color: #33B5E5; 3242 background-color: #f7f7f7; 3243 background-image: none; 3244 border-color: #ddd; 3245} 3246.tab-content { 3247 padding: 1.2em; 3248 margin: -1px 0 2em 0; 3249 -webkit-border-radius: 2px; 3250 -moz-border-radius: 2px; 3251 border-radius: 2px; 3252 border: solid 1px #ddd; 3253 background: #f7f7f7; 3254} 3255/* -------------------------------------------------------------------------- 3256Feature Boxes 3257*/ 3258.feature-box { 3259 width: 291px; 3260 height: 200px; 3261 position: relative; 3262 background: #F7F7F7; 3263} 3264.box-border .top, .box-border .bottom, .box-border .left, .box-border .right { 3265 z-index: 100; 3266 position: absolute; 3267 background-color: #aaa; 3268} 3269.box-border .top, .box-border .bottom { 3270 width: 291px; 3271 height: 1px; 3272} 3273.dialog .box-border .top, 3274.dialog .box-border .bottom { width:391px; } 3275 3276.box-border .left, .box-border .right { 3277 width: 1px; 3278 height: 8px; 3279} 3280.box-border .top { top: 0; left: 0 } 3281.box-border .top .left { top: 1px; left: 0 } 3282.box-border .top .right { top: 1px; right: 0 } 3283.box-border .bottom .left { top: -8px; left: 0 } 3284.box-border .bottom { top: 200px; left: 0 } 3285.box-border .bottom .right { top: -8px; right: 0 } 3286 3287.feature-box h4, 3288.dialog h4 { 3289 margin: 15px 18px 10px; 3290 padding:0; 3291} 3292 3293.feature-box p, 3294.dialog p { 3295 margin: 10px 18px; 3296 padding:0; 3297} 3298.feature-box .link, 3299.dialog .link { 3300 border-top: 1px solid #dedede; 3301 bottom: 0; 3302 position: absolute; 3303 width: inherit; 3304} 3305.feature-box a, .feature-box h4, 3306.dialog a, .dialog h4 { 3307 -webkit-transition: color .4s ease; 3308 -moz-transition: color .4s ease; 3309 -o-transition: color .4s ease; 3310 transition: color .4s ease; 3311} 3312.feature-box:hover { 3313 cursor: pointer; 3314} 3315.feature-box:hover .box-border .top, .feature-box:hover .box-border .bottom, .feature-box:hover 3316.left, .feature-box:hover .right { 3317 background-color: #33B5E5; 3318} 3319.feature-box:hover h4, .feature-box:hover a { 3320 color: #33B5E5; 3321} 3322/* -------------------------------------------------------------------------- 3323Page-Specific Styles 3324*/ 3325.colors { 3326 position: relative; 3327 float: left; 3328 width: 92px; 3329 margin: 40px 0 20px; 3330} 3331.colors div { 3332 color: #fff; 3333 font-size: 11.5px; 3334 width: 82px; 3335 height: 82px; 3336 margin-top:-30px; 3337 line-height: 82px; 3338 text-align: center; 3339 border: solid 5px #fff; 3340 -webkit-border-radius: 50%; 3341 -moz-border-radius: 50%; 3342 border-radius: 50%; 3343} 3344 3345 3346 3347 3348 3349 3350 3351 3352 3353 3354 3355 3356 3357 3358/* ########### REFERENCE DOCS ################## */ 3359 3360#packages-nav h2, 3361#classes-nav h2 { 3362 font-size:18px; 3363 margin:0; 3364 padding:0 0 0 4px; 3365} 3366 3367#jd-header { 3368 padding: 0 0 5px; 3369 margin: 20px 0 10px; 3370 font-size:13px; 3371 border-bottom:solid 1px #ccc; 3372} 3373 3374#jd-header h1 { 3375 margin:0; 3376 padding:0; 3377} 3378 3379/* page-top-right container for reference pages (holds 3380links to summary tables) */ 3381#api-info-block { 3382 font-size:13px; 3383 margin:20px 0 0; 3384 padding:0 10px 6px; 3385 font-weight:normal; 3386 float:right; 3387 text-align:right; 3388 color:#999; 3389 max-width:70%; 3390} 3391 3392#api-info-block div.api-level { 3393 font-weight:bold; 3394 font-size:inherit; 3395 float:none; 3396 color:#222; 3397 padding:0; 3398 margin:0; 3399} 3400 3401/* inheritance table */ 3402.jd-inheritance-table { 3403 border-spacing:0; 3404 margin:0; 3405 padding:0; 3406 font-size:13px; 3407 background-color:transparent; 3408} 3409.jd-inheritance-table tr td { 3410 border: none; 3411 margin: 0; 3412 padding: 0; 3413 background-color:transparent; 3414} 3415.jd-inheritance-table .jd-inheritance-space { 3416 font-weight:bold; 3417 width:1em; 3418} 3419.jd-inheritance-table .jd-inheritance-interface-cell { 3420 padding-left: 17px; 3421} 3422 3423 3424 3425.jd-sumtable a { 3426 text-decoration:none; 3427} 3428 3429.jd-sumtable a:hover { 3430 text-decoration:underline; 3431} 3432 3433/* the link inside a sumtable for "Show All/Hide All" */ 3434.toggle-all { 3435 display:block; 3436 float:right; 3437 font-weight:normal; 3438 font-size:0.9em; 3439} 3440 3441/* adjustments for in/direct subclasses tables */ 3442.jd-sumtable.jd-sumtable-subclasses { 3443 margin: 1em 0 0 0; 3444 max-width:968px; 3445 background-color:transparent; 3446 font-size:13px; 3447} 3448 3449/* extra space between end of method name and open-paren */ 3450.sympad { 3451 margin-right: 2px; 3452} 3453 3454/* right alignment for the return type in sumtable */ 3455.jd-sumtable .jd-typecol { 3456 text-align:right; 3457} 3458 3459/* adjustments for the expando table-in-table */ 3460.jd-sumtable-expando { 3461 margin:.5em 0; 3462 padding:0; 3463} 3464 3465/* a div that holds a short description */ 3466.jd-descrdiv { 3467 padding:3px 1em 0 1em; 3468 margin:0; 3469 border:0; 3470} 3471 3472#jd-content img.jd-expando-trigger-img { 3473 padding:0 4px 4px 0; 3474 margin:0; 3475} 3476 3477.jd-sumtable-subclasses div#subclasses-direct, 3478.jd-sumtable-subclasses div#subclasses-indirect { 3479 margin:0 0 0 13px; 3480} 3481 3482 3483 3484/********* MEMBER REF *************/ 3485 3486 3487.jd-details { 3488/* border:1px solid #669999; 3489 padding:4px; */ 3490 margin:0 0 1em; 3491} 3492 3493/* API reference: a container for the 3494.tagdata blocks that make up the detailed 3495description */ 3496.jd-details-descr { 3497 padding:0; 3498 margin:.5em .25em; 3499} 3500 3501/* API reference: a block containing 3502a detailed description, a params table, 3503seealso list, etc */ 3504.jd-tagdata { 3505 margin:.5em 1em; 3506} 3507 3508.jd-tagdata p { 3509 margin:0 0 1em 1em; 3510} 3511 3512/* API reference: adjustments to 3513the detailed description block */ 3514.jd-tagdescr { 3515 margin:.25em 0 .75em 0; 3516} 3517 3518.jd-tagdescr ol, 3519.jd-tagdescr ul { 3520 margin:0 2.5em; 3521 padding:0; 3522} 3523 3524.jd-tagdescr table, 3525.jd-tagdescr img { 3526 margin:.25em 1em; 3527} 3528 3529.jd-tagdescr li { 3530margin:0 0 .25em 0; 3531padding:0; 3532} 3533 3534/* API reference: heading marking 3535the details section for constants, 3536attrs, methods, etc. */ 3537h4.jd-details-title { 3538 font-size:1.15em; 3539 background-color: #E2E2E2; 3540 margin:1.5em 0 .6em; 3541 padding:3px 95px 3px 3px; /* room for api-level */ 3542} 3543body.google h4.jd-details-title { 3544 background-color: #FFF; 3545 padding-top:5px; 3546 border-top: 1px solid #ccc; 3547} 3548body.google table.jd-sumtable th { 3549 background-color: #FFF; 3550 color:#000; 3551} 3552 3553h4.jd-tagtitle { 3554 margin:0; 3555} 3556 3557h4 .normal { 3558 font-weight:normal; 3559} 3560 3561/* API reference: heading for "Parameters", "See Also", etc., 3562in details sections */ 3563h5.jd-tagtitle { 3564 margin:0 0 .25em 0; 3565 font-size:1em; 3566} 3567 3568.jd-tagtable { 3569 margin:0; 3570 background-color:transparent; 3571 width:auto; 3572} 3573 3574.jd-tagtable td, 3575.jd-tagtable th { 3576 border:none; 3577 background-color:#fff; 3578 vertical-align:top; 3579 font-weight:normal; 3580 padding:2px 10px; 3581} 3582 3583.jd-tagtable th { 3584 font-style:italic; 3585} 3586 3587/* Inline api level indicator for methods */ 3588div.api-level { 3589 font-size:.8em; 3590 font-weight:normal; 3591 color:#999; 3592 float:right; 3593 padding:0 8px 0; 3594 margin-top:-30px; 3595} 3596 3597table.jd-tagtable td, 3598table.jd-tagtable th { 3599 background-color:transparent; 3600} 3601 3602table.jd-tagtable th { 3603 color:inherit; 3604} 3605 3606 3607 3608 3609 3610 3611 3612 3613 3614 3615 3616 3617 3618 3619 3620 3621 3622 3623 3624 3625 3626 3627 3628/* SEARCH FILTER */ 3629 3630.menu-container { 3631 position:relative; 3632} 3633#search_autocomplete { 3634 font-weight:normal; 3635} 3636 3637.search_filtered_wrapper.reference { 3638 width: 193px; 3639 float: right; 3640} 3641.search_filtered_wrapper.docs { 3642 width:875px; 3643 float: left; 3644 position:absolute; 3645 top:26px; 3646 right:66px; 3647} 3648.suggest-card { 3649 position:relative; 3650 width:170px; 3651 min-height:90px; 3652 padding:5px; 3653 border: solid 1px #C5C5C5; 3654 background: white; 3655 top: 15px; 3656 margin-right:-5px; 3657 -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2); 3658 -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 3659 box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 3660} 3661.suggest-card.reference { 3662 position:absolute; 3663 z-index:999; 3664 min-width:171px; /* +padding and border makes this match input width */ 3665 min-height:93px; /* add 3px because this has 1 not 4px top border */ 3666 width:auto; 3667 top:41px; 3668 margin:0; 3669} 3670.suggest-card.develop { 3671 z-index:997; 3672 border-top: solid 4px #F80; 3673 float:right; 3674} 3675.suggest-card.design { 3676 z-index:996; 3677 border-top: solid 4px #33b5e5; 3678 float:right; 3679} 3680.suggest-card.distribute { 3681 z-index:995; 3682 border-top: solid 4px #9C0; 3683 float:right; 3684} 3685.child-card { 3686 width:100%; 3687} 3688.suggest-card.dummy { 3689 width:172px; 3690 float:right; 3691 border:0; 3692 background:transparent; 3693 -moz-box-shadow: none; 3694 -webkit-box-shadow: none; 3695 box-shadow: none; 3696} 3697 3698ul.search_filtered { 3699 min-width:100%; 3700 list-style: none; 3701 margin: 0 0 5px; 3702 padding: 0; 3703} 3704.search_filtered .jd-selected { 3705 background:#efefef; 3706 cursor:pointer; 3707} 3708.search_filtered .jd-selected, 3709.search_filtered .jd-selected a { 3710 color:#09C !important; 3711} 3712 3713.no-display { 3714 display: none; 3715} 3716 3717.search_filtered li.jd-autocomplete { 3718 font-size: 0.81em; 3719 border: none; 3720 margin: 0 0 2px; 3721 padding: 0; 3722 line-height:1.5em; 3723} 3724 3725.search_filtered li a { 3726 padding:0 5px; 3727 color:#222 !important; 3728 display:inline-block; 3729 line-height:12px; 3730} 3731 3732.search_filtered li.header { 3733 font-weight:bold; 3734 color:#444; 3735 border: none; 3736 margin: 8px 0 2px; 3737 padding:1px 5px; 3738 line-height:1.5em; 3739} 3740.search_filtered li.header.small { 3741 font-size:0.85em; 3742} 3743 3744.suggest-card.reference 3745.search_filtered li.header { 3746 color:#aaa; 3747 font-size: 0.81em; 3748} 3749 3750.search_filtered li.header:first-child { 3751 margin: 0 0 2px; 3752} 3753 3754.show-item { 3755 display: table-row; 3756} 3757.hide-item { 3758 display: hidden; 3759} 3760 3761 3762 3763 3764 3765/* SEARCH RESULTS */ 3766 3767 3768#leftSearchControl .gsc-twiddle { 3769 background-image : none; 3770} 3771 3772#leftSearchControl td, #searchForm td { 3773 border: 0px solid #000; 3774 padding:0; 3775} 3776 3777#leftSearchControl .gsc-resultsHeader .gsc-title { 3778 padding-left : 0px; 3779 font-weight : bold; 3780 font-size : 13px; 3781 color:#006699; 3782 display : none; 3783} 3784 3785#leftSearchControl .gsc-resultsHeader div.gsc-results-selector { 3786 display : none; 3787} 3788 3789#leftSearchControl .gsc-resultsRoot { 3790 padding-top : 6px; 3791} 3792 3793#leftSearchControl div.gs-visibleUrl-long { 3794 display : block; 3795 color:#006699; 3796} 3797 3798#leftSearchControl .gsc-webResult { 3799 padding:0 0 20px 0; 3800} 3801 3802.gsc-webResult div.gs-visibleUrl-short, 3803table.gsc-branding, 3804.gsc-clear-button { 3805 display : none; 3806} 3807 3808.gsc-cursor-box .gsc-cursor div.gsc-cursor-page, 3809.gsc-cursor-box .gsc-trailing-more-results a.gsc-trailing-more-results, 3810#leftSearchControl a, 3811#leftSearchControl a b { 3812 color:#006699; 3813} 3814 3815.gsc-resultsHeader { 3816 display: none; 3817} 3818 3819/* Disable built in search forms */ 3820.gsc-control form.gsc-search-box { 3821 display : none; 3822} 3823table.gsc-search-box { 3824 margin:6px 0 0 0; 3825 border-collapse:collapse; 3826} 3827 3828td.gsc-input { 3829 padding:0 2px; 3830 width:100%; 3831 vertical-align:middle; 3832} 3833 3834input.gsc-input { 3835 border:1px solid #BCCDF0; 3836 width:99%; 3837 padding-left:2px; 3838 font-size:.95em; 3839} 3840 3841td.gsc-search-button { 3842 text-align: right; 3843 padding:0; 3844 vertical-align:top; 3845} 3846 3847 3848#searchResults { 3849 overflow:hidden; /* because the repositioned page links makes the section think it needs to scroll 3850(it doesn't) */ 3851 height:auto; 3852} 3853 3854#searchResults .gsc-control { 3855 position:relative; 3856 width:auto; 3857 padding:0 0 10px; 3858} 3859 3860#searchResults .gsc-tabsArea { 3861 position:relative; 3862 white-space:nowrap; 3863 float:left; 3864 width:200px; 3865} 3866 3867#searchResults .gsc-above-wrapper-area { 3868 display:none; 3869} 3870 3871#searchResults .gsc-resultsbox-visible { 3872 float:left; 3873 width:720px; 3874 margin-left:20px; 3875} 3876 3877#searchResults .gsc-tabHeader { 3878 padding: 3px 6px; 3879 position:relative; 3880 width:auto; 3881 display:block; 3882} 3883 3884#searchResults h2#searchTitle { 3885 padding:0; 3886 margin:5px 0; 3887 border:none; 3888} 3889 3890#searchResults h2#searchTitle em { 3891 font-style:normal; 3892 color:#33B5E5; 3893} 3894 3895#searchResults .gsc-table-result { 3896 margin:5px 0 10px 0; 3897 background-color:transparent; 3898} 3899#searchResults .gs-web-image-box, .gs-promotion-image-box { 3900 width:120px; 3901} 3902#searchResults .gs-web-image-box img.gs-image, .gs-promotion-image-box img.gs-promotion-image { 3903 max-width:120px; 3904} 3905 3906#searchResults .gsc-table-result .gsc-thumbnail { 3907 padding:0 20px 0 0; 3908} 3909 3910#searchResults td { 3911 background-color:transparent; 3912} 3913 3914#searchResults .gsc-expansionArea { 3915 position:relative; 3916} 3917#searchResults .gsc-tabsArea .gsc-cursor-box { 3918 width:200px; 3919 padding:20px 0 0 1px; 3920} 3921#searchResults .gsc-cursor-page { 3922 display:inline-block; 3923 float:left; 3924 margin:-1px 0 0 -1px; 3925 padding:0; 3926 height:27px; 3927 width:27px; 3928 text-align:center; 3929 line-height:2; 3930} 3931 3932#searchResults .gsc-tabHeader.gsc-tabhInactive, 3933#searchResults .gsc-cursor-page { 3934 text-decoration:none; 3935 color:#258AAF; 3936 border: solid 1px #DADADA; 3937} 3938 3939#searchResults .gsc-tabHeader.gsc-tabhInactive:hover, 3940#searchResults .gsc-cursor-page:hover { 3941 border-color: #DBDBDB; 3942 background-color: #F3F3F3; 3943 background-image: -webkit-gradient(linear, left top, left bottom, from(#F9F9F9), to(#ECECEC)); 3944 background-image: -webkit-linear-gradient(top, #F9F9F9, #ECECEC); 3945 background-image: -moz-linear-gradient(top, #F9F9F9, #ECECEC); 3946 background-image: -ms-linear-gradient(top, #F9F9F9, #ECECEC); 3947 background-image: -o-linear-gradient(top, #F9F9F9, #ECECEC); 3948 background-image: linear-gradient(top, #F9F9F9, #ECECEC); 3949 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9', 3950EndColorStr='#ececec'); 3951 color: #33B5E5; 3952} 3953 3954#searchResults .gsc-tabHeader.gsc-tabhActive, 3955#searchResults .gsc-tabHeader.gsc-tabhActive:hover, 3956#searchResults .gsc-cursor-page.gsc-cursor-current-page, 3957#searchResults .gsc-cursor-page.gsc-cursor-current-page:hover { 3958 color:#fff; 3959 background-color: #09C; 3960 background-image: -webkit-gradient(linear, left top, left bottom, from(#2FADDB), to(#09C)); 3961 background-image: -webkit-linear-gradient(top, #2FADDB, #09C); 3962 background-image: -moz-linear-gradient(top, #2FADDB, #09C); 3963 background-image: -ms-linear-gradient(top, #2FADDB, #09C); 3964 background-image: -o-linear-gradient(top, #2FADDB, #09C); 3965 background-image: linear-gradient(top, #2FADDB, #09C); 3966 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2faddb', EndColorStr='#09c'); 3967 border: 1px solid #3990AB; 3968 z-index:100; 3969} 3970 3971} 3972 3973 3974 3975 3976 3977 3978 3979 3980 3981 3982 3983 3984 3985/*********** PREVIOUSLY dac-styles.css ***************/ 3986 3987 3988#header { 3989 border-bottom:0; 3990} 3991 3992#header .wrap { 3993 max-width:940px; 3994 height:41px; 3995 border-bottom:1px solid; 3996 border-color: #ccc; 3997 position:relative; 3998} 3999 4000.about #header .wrap { 4001 border-color: #9933CC; 4002} 4003 4004.design #header .wrap { 4005 border-color: #33b5e5; 4006} 4007 4008.develop #header .wrap { 4009 border-color: #F80; 4010} 4011 4012.distribute #header .wrap { 4013 border-color: #9C0; 4014} 4015 4016.logo a { 4017 width:123px; 4018 float:left; 4019} 4020 4021#header .logo { 4022 margin-top: -6px; 4023 margin-left: 0px; 4024 margin-bottom:0px; 4025 width: 160px; 4026 padding-right:10px; 4027} 4028 4029 4030#header .logo-wear { 4031 width:220px; 4032 margin:0; 4033} 4034#header .logo-wear img { 4035 padding:0 0 0 10px; 4036} 4037 4038.search { 4039 height:25px; 4040 margin-top: -3px; 4041 margin-bottom: 0px; 4042} 4043 4044 4045 4046/* Quicknav */ 4047.btn-quicknav { 4048 width:20px; 4049 height:28px; 4050 float:left; 4051 margin-left:6px; 4052 padding-right:10px; 4053 position:relative; 4054 cursor:pointer; 4055 border-right:1px solid #CCC; 4056} 4057 4058.btn-quicknav a { 4059 zoom:1; 4060 position:absolute; 4061 top:13px; 4062 left:5px; 4063 display:block; 4064 text-indent:-9999em; 4065 width:10px; 4066 height:5px; 4067 background:url(../images/quicknav_arrow.png) no-repeat; 4068} 4069 4070.btn-quicknav a.arrow-active { 4071 background-position: 0 -5px; 4072 display:none; 4073} 4074 4075#header-wrap.quicknav a.arrow-inactive { 4076 display:none; 4077} 4078 4079.btn-quicknav.active a.arrow-active { 4080 display:block; 4081} 4082 4083.nav-x li { 4084 display:block; 4085 float:left; 4086 margin-right:45px; 4087 -webkit-transition: all 0.25s linear; 4088 -moz-transition: all 0.25s linear; 4089 -ms-transition: all 0.25s linear; 4090 -o-transition: all 0.25s linear; 4091 transition: all 0.25s linear; 4092} 4093 4094#header-wrap.quicknav .nav-x li { 4095 min-width:160px; 4096 margin-right:20px; 4097} 4098 4099#header-wrap.quicknav li.last { 4100 margin-right:0px; 4101} 4102 4103#quicknav { 4104 float:none; 4105 clear:both; 4106 margin-left:180px; 4107 margin-top:-30px; 4108 display:none; 4109 overflow:hidden; 4110} 4111 4112#header-wrap.quicknav #quicknav { 4113 4114} 4115 4116#quicknav ul { 4117 margin:10px 0; 4118 padding:0; 4119} 4120 4121#quicknav ul li.design { 4122 border-top:1px solid #33b5e5; 4123} 4124 4125#quicknav ul li.develop { 4126 border-top:1px solid #FF8800; 4127} 4128 4129#quicknav ul li.distribute { 4130 border-top:1px solid #99cc00; 4131} 4132 4133#quicknav ul li { 4134 display:block; 4135 float:left; 4136 margin:0 20px 0 0; 4137 min-width:140px; 4138} 4139 4140#quicknav ul li.last { 4141 margin-right:0px; 4142} 4143 4144#quicknav ul li ul li { 4145 float:none; 4146} 4147 4148#quicknav ul li ul li a { 4149 color:#222; 4150} 4151 4152#quicknav ul li li ul, 4153#quicknav ul li li ul li { 4154 margin:0; 4155} 4156 4157#quicknav ul li li ul li:before { 4158 content:"\21B3"; 4159} 4160 4161#header-wrap { 4162 -webkit-transition: all 0.25s ease-out; 4163 -moz-transition: all 0.25s ease-out; 4164 -ms-transition: all 0.25s ease-out; 4165 -o-transition: all 0.25s ease-out; 4166 transition: all 0.25s ease-out; 4167 4168} 4169 4170#header-wrap.quicknav { 4171 height:196px; 4172 4173} 4174 4175/* SEARCH AND MORE */ 4176.search { 4177 position: absolute; 4178 width: 50px; 4179 height:28px; 4180 display: block; 4181 margin-top:-3px; 4182 margin-bottom:7px; 4183 overflow:hidden; 4184 z-index:100; 4185 right:54px; 4186 -webkit-transition: width 0.4s ease; 4187 -moz-transition: width 0.4s ease; 4188 -o-transition: width 0.4s ease; 4189 transition: width 0.4s ease; 4190} 4191 4192.search #search-btn { 4193 width:50px; 4194 height:28px; 4195 background:url(../images/icon_search.png) no-repeat; 4196 float:left; 4197} 4198 4199.search-inner { 4200 width:245px; 4201} 4202 4203.search:hover, .search.active { 4204 width:245px; 4205} 4206 4207.search .bottom, .search .left, .search .right { 4208 position: absolute; 4209 background-color: #a2a2a2 4210} 4211 4212.search .bottom { 4213 width: 214px; 4214 height: 1px; 4215 top: 24px; 4216 left: 0 4217} 4218 4219.search .left, .search .right { 4220 height: 5px; 4221 width: 1px 4222} 4223 4224.search .left { 4225 top: 22px; 4226 left: 56px; 4227 background-color:#CCC; 4228} 4229 4230.search .right { 4231 top: 22px; 4232 left: 238px; 4233 background-color:#CCC; 4234} 4235 4236.search form { 4237 margin-top: 2px; 4238 width: 162px; 4239 float:left; 4240} 4241 4242.search form input { 4243 color: #2f2f2f; 4244 font-size: 0.95em; 4245 width: 178px; 4246 border: none; 4247 margin-left: 6px; 4248 z-index: 1500; 4249 position: relative; 4250 background-color: transparent; 4251 border-bottom:1px solid #CCC; 4252 padding:0 0 0 4px; 4253 outline:none; 4254 height:24px; 4255} 4256 4257.search:hover form input { 4258 border-bottom:1px solid #33B5E5; 4259} 4260 4261.search:hover .bottom, .search:hover .left, .search:hover .right { 4262 background-color: #33b5e5; 4263} 4264 4265.search:hover #search-btn { 4266 background-position: 0 -28px 4267} 4268 4269.search form input:focus { 4270 color: #222; 4271 font-weight: bold 4272} 4273 4274.moremenu { 4275 float: right; 4276 position: relative; 4277 width: 50px; 4278 height:28px; 4279 display: block; 4280 margin-top:-3px; 4281 margin-bottom:7px; 4282 overflow:hidden; 4283 -webkit-transition: width 0.25s ease; 4284 -moz-transition: width 0.25s ease; 4285 -o-transition: width 0.25s ease; 4286 transition: width 0.25s ease; 4287} 4288 4289.moremenu #more-btn { 4290 width:40px; 4291 height:28px; 4292 background:url(../images/icon_more.png) no-repeat; 4293 border-left:1px solid #CCC; 4294 float:left; 4295 cursor:pointer; 4296} 4297 4298.moremenu:hover #more-btn { 4299 background-position:0 -28px; 4300} 4301 4302.morehover { 4303 position:absolute; 4304 right:6px; 4305 top:-9px; 4306 width:40px; 4307 height:35px; 4308 z-index:99; 4309 overflow:hidden; 4310 4311 -webkit-opacity:0; 4312 -moz-opacity:0; 4313 -o-opacity:0; 4314 opacity:0; 4315 4316 -webkit-transform-origin:100% 0%; 4317 -moz-transform-origin:100% 0%; 4318 -o-transform-origin:100% 0%; 4319 transform-origin:100% 0%; 4320 4321 -webkit-transition-property: -webkit-opacity; 4322 -webkit-transition-duration: .25s; 4323 -webkit-transition-timing-function:ease; 4324 4325 -moz-transition-property: -moz-opacity; 4326 -moz-transition-duration: .25s; 4327 -moz-transition-timing-function:ease; 4328 4329 -o-transition-property: -o-opacity; 4330 -o-transition-duration: .25s; 4331 -o-transition-timing-function:ease; 4332 4333 transition-property: opacity; 4334 transition-duration: .25s; 4335 transition-timing-function:ease; 4336} 4337 4338.morehover:hover, 4339.morehover.hover { 4340 opacity:1; 4341 height:385px; 4342 width:268px; 4343 -webkit-transition-property:height, -webkit-opacity; 4344} 4345 4346.morehover .top { 4347 width:268px; 4348 height:39px; 4349 background:url(../images/more_top.png) no-repeat; 4350} 4351 4352.morehover .mid { 4353 width:228px; 4354 background:url(../images/more_mid.png) repeat-y; 4355 padding:10px 20px 0 20px; 4356} 4357 4358.morehover .mid .header { 4359 border-bottom:1px solid #ccc; 4360 font-weight:bold; 4361} 4362 4363.morehover .bottom { 4364 width:268px; 4365 height:6px; 4366 background:url(../images/more_bottom.png) no-repeat; 4367} 4368 4369.morehover ul { 4370 margin:10px 10px 20px 0; 4371} 4372 4373.morehover ul li { 4374 list-style:none; 4375} 4376 4377.morehover ul li.active a, 4378.morehover ul li.active a:hover { 4379 color:#222 !important; 4380} 4381 4382.morehover ul li.active img { 4383 margin-right:4px; 4384} 4385 4386 4387 4388 4389/* MARQUEE */ 4390.slideshow-container { 4391 width:100%; 4392 overflow:hidden; 4393 position:relative; 4394} 4395.slideshow-container .slideshow-prev { 4396 position:absolute; 4397 top:50%; 4398 left:0px; 4399 margin-top:-36px; 4400 z-index:99; 4401} 4402.slideshow-container .slideshow-next { 4403 position:absolute; 4404 top:50%; 4405 margin-top:-36px; 4406 z-index:99; 4407 right:0px; 4408} 4409 4410.slideshow-container .pagination { 4411 position:absolute; 4412 bottom:20px; 4413 width:100%; 4414 text-align:center; 4415 z-index:99; 4416} 4417.slideshow-container .pagination ul { 4418 margin:0; 4419} 4420.slideshow-container .pagination ul li{ 4421 display: inline-block; 4422 width:12px; 4423 height:12px; 4424 text-indent:-8000px; 4425 list-style:none; 4426 margin: 0 2px; 4427 border-radius:6px; 4428 background-color:#ccc; 4429 cursor:pointer; 4430 -webkit-transition:color .5s ease-in; 4431 -moz-transition:color .5s ease-in; 4432 -o-transition:color .5s ease-in; 4433 transition:color .5s ease-in; 4434} 4435.slideshow-container .pagination ul li:hover { 4436 background-color:#999; 4437} 4438.slideshow-container .pagination ul li.active { 4439 background-color:#33b5e5; 4440} 4441.slideshow-container .pagination ul li.active:hover { 4442 background-color:#33b5e5; 4443} 4444.slideshow-container ul li { 4445 display:inline; 4446 list-style:none; 4447} 4448 4449 4450 4451 4452a.download-sdk { 4453 float:right; 4454 margin:-10px 0; 4455 height:30px; 4456 padding-top:4px; 4457 padding-bottom:0px; 4458} 4459 4460#nav-x { 4461 padding-top: 14px; 4462} 4463 4464#nav-x .wrap { 4465 min-height:34px; 4466} 4467 4468#nav-x .wrap, 4469#searchResults.wrap { 4470 max-width:940px; 4471 border-bottom:1px solid #CCC; 4472} 4473 4474#searchResults.wrap #leftSearchControl { 4475 min-height:700px 4476} 4477.nav-x { 4478 margin-left:0; 4479 margin-bottom:0; 4480} 4481 4482 4483 4484 4485 4486 4487 4488 4489 4490 4491/* 4492 * CSS Styles that are needed by jScrollPane for it to operate correctly. 4493 */ 4494 4495.jspContainer { 4496 overflow: hidden; 4497 position: relative; 4498} 4499 4500.jspPane { 4501 position: absolute; 4502 width:100% !important; /* to avoid cut-off api names in reference in horiz scroll */ 4503} 4504 4505.jspVerticalBar { 4506 position: absolute; 4507 top: 0; 4508 right: 0; 4509 width: 4px; 4510 height: 100%; 4511 background: #f5f5f5; 4512} 4513 4514.jspHorizontalBar { 4515 position: absolute; 4516 bottom: 0; 4517 left: 0; 4518 width: 100%; 4519 height: 4px; 4520 background: #f5f5f5; 4521} 4522 4523.jspVerticalBar *, 4524.jspHorizontalBar * { 4525 margin: 0; 4526 padding: 0; 4527} 4528.jspCap { 4529 display: block; 4530} 4531 4532.jspVerticalBar .jspCap { 4533 height: 4px; 4534} 4535 4536.jspHorizontalBar .jspCap { 4537 width: 0; 4538 height: 100%; 4539} 4540 4541.jspHorizontalBar .jspCap { 4542 float: left; 4543} 4544 4545.jspTrack { 4546 position: relative; 4547} 4548 4549.jspDrag { 4550 background: #bbb; 4551 position: relative; 4552 top: 0; 4553 left: 0; 4554 cursor: pointer; 4555} 4556 4557.jspDrag:hover, 4558.jspDrag:active { 4559 border-color: #09c; 4560 background-color: #4cadcb; 4561 background-image: -webkit-gradient(linear, left top, right top, from(#5dbcd9), to(#4cadcb)); 4562 background-image: -webkit-linear-gradient(left, #5dbcd9, #4cadcb); 4563 background-image: -moz-linear-gradient(left, #5dbcd9, #4cadcb); 4564 background-image: -ms-linear-gradient(left, #5dbcd9, #4cadcb); 4565 background-image: -o-linear-gradient(left, #5dbcd9, #4cadcb); 4566 background-image: linear-gradient(left, #5dbcd9, #4cadcb); 4567 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#5dbcd9', EndColorStr='#4cadcb'); 4568} 4569 4570.jspHorizontalBar .jspTrack, 4571.jspHorizontalBar .jspDrag { 4572 float: left; 4573 height: 100%; 4574} 4575 4576.jspArrow { 4577 background: #999; 4578 text-indent: -20000px; 4579 display: block; 4580 cursor: pointer; 4581} 4582 4583.jspArrow.jspDisabled { 4584 cursor: default; 4585 background: #ccc; 4586} 4587 4588.jspVerticalBar .jspArrow { 4589 height: 16px; 4590} 4591 4592.jspHorizontalBar .jspArrow { 4593 width: 16px; 4594 float: left; 4595 height: 100%; 4596} 4597 4598.jspVerticalBar .jspArrow:focus { 4599 outline: none; 4600} 4601 4602.jspCorner { 4603 float: left; 4604 height: 100%; 4605} 4606 4607/* Yuk! CSS Hack for IE6 3 pixel bug :( */ 4608* html .jspCorner { 4609 margin: 0 -3px 0 0; 4610} 4611/******* end of jscrollpane *********/ 4612 4613 4614 4615 4616 4617/************ DEVELOP HOMEPAGE ******************/ 4618 4619/* Slideshow */ 4620.slideshow-develop { 4621 height: 300px; 4622 width: 940px; 4623 position: relative; 4624 overflow:hidden; 4625} 4626.slideshow-develop .frame { 4627 width: 940px; 4628 height: 300px; 4629} 4630.slideshow-develop img.play { 4631 max-width:350px; 4632 max-height:240px; 4633 margin:20px 0 0 90px; 4634 -webkit-transform: perspective(800px ) rotateY( 35deg ); 4635 box-shadow: -16px 20px 40px rgba(0, 0, 0, 0.3); 4636 -moz-box-shadow: -16px 20px 40px rgba(0, 0, 0, 0.3); 4637 -webkit-box-shadow: -16px 20px 40px rgba(0, 0, 0, 0.3); 4638} 4639.slideshow-develop img.play.no-shadow { 4640 box-shadow: none; 4641 -moz-box-shadow: none; 4642 -webkit-box-shadow: none; 4643} 4644.slideshow-develop img.play.no-transform { 4645 -webkit-transform: none; 4646} 4647.slideshow-develop a.slideshow-next { 4648 background: url(../images/arrow-right-develop.png); 4649} 4650.slideshow-develop a.slideshow-prev { 4651 background: url(../images/arrow-left-develop.png); 4652} 4653.slideshow-develop .content-right { 4654 float: left; 4655} 4656.slideshow-develop .content-right h2 { 4657 padding:0; 4658 margin-bottom:10px; 4659 border:none; 4660} 4661.slideshow-develop .item { 4662 height: 300px; 4663 width: 940px; 4664} 4665.slideshow-develop .pagination ul li.active { 4666 background-color: #F80; 4667} 4668.slideshow-develop .pagination ul li.active:hover { 4669 background-color: #F80; 4670} 4671.slideshow-develop .item hr { 4672 margin:5px 0 10px; 4673} 4674.slideshow-develop .item p { 4675 margin:10px 0; 4676} 4677.slideshow-develop .item p.title-intro { 4678 position:absolute; 4679 margin:0; 4680} 4681 4682/* Feeds */ 4683.feed ul { 4684 margin: 0; 4685} 4686.feed .feed-nav { 4687 height: 25px; 4688 border-bottom: 1px solid #CCC; 4689} 4690.feed .feed-nav li { 4691 list-style: none; 4692 float: left; 4693 height: 21px; /* +4px bottom border = 25px; same as .feed-nav */ 4694 margin-right: 25px; 4695 cursor: pointer; 4696} 4697.feed .feed-nav li.active { 4698 color: #000; 4699 border-bottom: 4px solid #F80; 4700} 4701.feed .feed-container { 4702 overflow: hidden; 4703 width: 460px; 4704} 4705.feed .feed-container .feed-frame { 4706 width: 1000px; 4707} 4708.feed .feed-container .feed-frame ul { 4709 float: left; 4710 width:460px; 4711} 4712.feed .feed-container .feed-frame ul ul { 4713 float: none; 4714 margin:10px 0 0 30px; 4715} 4716.feed .feed-container .feed-frame li { 4717 list-style: none; 4718 margin: 20px 0 20px 0; 4719 width: 460px; 4720 height:93px; 4721} 4722.feed .feed-container .feed-frame li.playlist { 4723 height:auto; 4724} 4725.feed .feed-container .feed-frame li.playlist a { 4726 height:93px; 4727 display:block; 4728} 4729.feed .feed-container .feed-frame li.more { 4730 height:20px; 4731 margin:10px 0 5px 5px; 4732} 4733.feed .feed-container .feed-frame li.more a { 4734 height:inherit; 4735} 4736.feed .feed-container .feed-frame li.playlist-video { 4737 list-style: none; 4738 margin: 0; 4739 width: 460px; 4740 height:55px; 4741 font-size:12px; 4742} 4743.feed .feed-container .feed-frame li.playlist-video a { 4744 height:45px; 4745 padding:5px; 4746} 4747.feed .feed-container .feed-frame li.playlist-video h5 { 4748 font-size:12px; 4749 line-height:13px; 4750 margin:0; 4751} 4752.feed .feed-container .feed-frame li.playlist-video p { 4753 margin:5px 0 0; 4754 line-height:15px; 4755} 4756.feed-container .feed-frame div.feed-image { 4757 float: left; 4758 border: 1px solid #999; 4759 margin:0 20px 0 0; 4760 width:122px; 4761 height:92px; 4762 background:url('../images/blog-default.png') no-repeat 0 0; 4763 background-size:180px; 4764} 4765#jd-content .feed .feed-container .feed-frame li img { 4766 float: left; 4767 border: 1px solid #999; 4768 margin:0 20px 0 0; 4769 width:122px; 4770 height:92px; 4771} 4772#jd-content .feed .feed-container .feed-frame li.playlist-video img { 4773 width:inherit; 4774 height:inherit; 4775} 4776 4777.feed .feed-container .feed-frame li a, 4778.feed .feed-container .feed-frame li a:active { 4779 color:#555 !important; 4780} 4781 4782.feed .feed-container .feed-frame li a:hover, 4783.feed .feed-container .feed-frame li a:hover * { 4784 color:#7AA1B0 !important; 4785} 4786 4787/* Video player */ 4788#player-wrapper { 4789 display:none; 4790 margin: -1px auto 0; 4791 position: relative; 4792 width: 940px; 4793 height: 0px; 4794} 4795#player-frame { 4796 background: #EFEFEF; 4797 border: 1px solid #CCC; 4798 padding: 0px 207px; 4799 z-index: 10; /* stay above marque, but below search suggestions */ 4800 width: 525px; 4801 height: 330px; 4802 position: relative; 4803} 4804 4805 4806 4807/************ DISTRIBUTE HOMEPAGE ***************/ 4808 4809.marquee { 4810 width: 760px; 4811} 4812.marquee .main-img { 4813 float: left; 4814 margin-top: 20px; 4815 width: 490px; 4816} 4817.marquee .copy { 4818 width: 270px; 4819 float: left; 4820 margin-top: 30px; 4821} 4822.distribute-features { 4823 margin: 0; 4824} 4825.distribute-features ul { 4826 margin: 0; 4827} 4828.distribute-features ul li { 4829 list-style: none; 4830 float: left; 4831 border-top: 1px solid #9C0; 4832 width: 220px; 4833 margin-right: 50px; 4834} 4835.distribute-features ul li.last { 4836 margin-right: 0px; 4837} 4838 4839.distribute-features .distribute-link li a { 4840 color:red !important; 4841} 4842 4843.distribute-features .distribute-link li a, 4844.distribute-features .distribute-link li a:active { 4845 color:#555 !important; 4846} 4847 4848.distribute-features .distribute-link li a:hover, 4849.distribute-features .distribute-link li a:hover * { 4850 color:#7AA1B0 !important; 4851} 4852 4853 4854/************ DEVELOP TOPIC CONTAINERS ************/ 4855 4856.landing-banner, 4857.landing-docs { 4858 margin:20px 0; 4859} 4860.landing-banner > div:first-child, 4861.landing-docs > div:first-child, 4862.landing-docs > .col-12 { 4863 margin-left:0; 4864 min-height:280px; 4865} 4866.landing-banner.short > div { 4867 min-height:50px; 4868} 4869.landing-banner > div:last-child, 4870.landing-docs > div:last-child, 4871.landing-docs > .col-12 { 4872 margin-right:0; 4873} 4874 4875.landing-banner > div > *:last-child { 4876 margin-bottom:0; 4877} 4878.landing-banner h1 { 4879 margin-top:0; 4880} 4881.landing-docs, 4882.landing-banner { 4883 clear:both; 4884 overflow:hidden; 4885} 4886.landing-docs h3 { 4887 font-size:14px; 4888 line-height:21px; 4889 color:#555; 4890 text-transform:uppercase; 4891 border-bottom:1px solid #CCC; 4892 margin:0 0 20px; 4893} 4894.landing-docs a { 4895 color:#333 !important; 4896} 4897 4898.landing-docs a:hover, 4899.landing-docs a:hover * { 4900 color:#7AA1B0 !important 4901} 4902 4903.landing-docs .normal-links a { 4904 color:#258aaf !important; 4905} 4906 4907.plusone { 4908 float:right; 4909} 4910 4911 4912 4913.next-docs { 4914 border-top:1px solid #ccc; 4915 margin:40px 0 0; 4916 padding:5px 0 0; 4917 clear:left; 4918 overflow:hidden; 4919} 4920.next-docs div:first-child { 4921 margin-left:0; 4922} 4923.next-docs div:last-child { 4924 margin-right:0; 4925} 4926 4927.next-docs h2 { 4928 font-size:14px; 4929 line-height:21px; 4930 color:#555; 4931 text-transform:uppercase; 4932 border-bottom:none; 4933 margin:0 0 1em; 4934 padding:5px 0 0; 4935} 4936 4937 4938 4939/************* HOME/LANDING PAGE *****************/ 4940 4941.slideshow-home { 4942 height: 500px; 4943 width: 940px; 4944 border-bottom: 1px solid #CCC; 4945 position: relative; 4946 margin: 0; 4947} 4948.slideshow-home .frame { 4949 width: 940px; 4950 height: 500px; 4951} 4952.slideshow-home .content-left { 4953 float: left; 4954 text-align: center; 4955 vertical-align: center; 4956 margin: 0 0 0 35px; 4957} 4958.slideshow-home .content-right { 4959 margin: 80px 0 0 0; 4960} 4961.slideshow-home .content-right p { 4962 margin-bottom: 10px; 4963} 4964.slideshow-home .content-right p:last-child { 4965 margin-top: 15px; 4966} 4967.slideshow-home .content-right h1 { 4968 padding:0; 4969} 4970.slideshow-home .item { 4971 height: 500px; 4972 width: 940px; 4973} 4974.home-sections { 4975 padding: 30px 20px 20px; 4976 margin: 20px 0; 4977 background: -webkit-linear-gradient(top, #F6F6F6,#F9F9F9); 4978} 4979.home-sections ul { 4980 margin: 0; 4981} 4982.home-sections ul li { 4983 float: left; 4984 display: block; 4985 list-style: none; 4986 width: 170px; 4987 height: 35px; 4988 border: 1px solid #ccc; 4989 background: white; 4990 margin-right: 10px; 4991 border-radius: 1px; 4992 -webkit-border-radius: 1px; 4993 -moz-border-radius: 1px; 4994 box-shadow: 1px 1px 5px #EEE; 4995 -webkit-box-shadow: 1px 1px 5px #EEE; 4996 -moz-box-shadow: 1px 1px 5px #EEE; 4997 background: white; 4998} 4999.home-sections ul li:hover { 5000 background: #F9F9F9; 5001 border: 1px solid #CCC; 5002} 5003.home-sections ul li a, 5004.home-sections ul li a:hover { 5005 font-weight: bold; 5006 margin-top: 8px; 5007 line-height: 18px; 5008 float: left; 5009 width: 100%; 5010 text-align: center; 5011 color: #09c !important; 5012} 5013.home-sections ul li a { 5014 font-weight: bold; 5015 margin-top: 8px; 5016 line-height: 18px; 5017 float: left; 5018 width:100%; 5019 text-align:center; 5020} 5021.home-sections ul li img { 5022 float: left; 5023 margin: -8px 0 0 10px; 5024} 5025.home-sections ul li.last { 5026 margin-right: 0px; 5027} 5028.fullpage #footer { 5029 margin-top: -40px; 5030} 5031