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