| /* file: android-developer-core.css |
| author: smain |
| date: september 2008 |
| info: core developer styles (developer.android.com) |
| */ |
| |
| |
| /* RESET STYLES */ |
| |
| html,body,div,h1,h2,h3,h4,h5,h6,p,img, |
| dl,dt,dd,ol,ul,li,table,caption,tbody, |
| tfoot,thead,tr,th,td,form,fieldset, |
| embed,object,applet { |
| margin: 0; |
| padding: 0; |
| border: 0; |
| } |
| |
| /* BASICS */ |
| |
| html, body { |
| overflow:hidden; /* keeps scrollbar off IE */ |
| background-color:#fff; |
| } |
| |
| body { |
| font-family:arial,sans-serif; |
| color:#000; |
| font-size:13px; |
| color:#333; |
| background-image:url(images/bg_fade.jpg); |
| background-repeat:repeat-x; |
| } |
| |
| a, a code { |
| color:#006699; |
| } |
| |
| |
| a:active, |
| a:active code { |
| color:#f00; |
| } |
| |
| a:visited, |
| a:visited code { |
| color:#006699; |
| } |
| |
| input, select, |
| textarea, option { |
| font-family:inherit; |
| font-size:inherit; |
| } |
| |
| p { |
| padding:0; |
| margin:0 0 1em; |
| } |
| |
| code, pre { |
| color:#007000; |
| font-family:monospace; |
| line-height:1em; |
| } |
| |
| var { |
| color:#007000; |
| font-style:italic; |
| } |
| |
| pre { |
| border:1px solid #ccc; |
| background-color:#fafafa; |
| padding:10px; |
| margin:0 0 1em 1em; |
| overflow:auto; |
| } |
| |
| h1,h2,h3,h4,h5 { |
| margin:1em 0; |
| padding:0; |
| } |
| |
| p,ul,ol,dl,dd,dt,li { |
| line-height:1.3em; |
| } |
| |
| ul,ol { |
| margin:0 0 .8em; |
| padding:0 0 0 2em; |
| } |
| |
| li { |
| padding:0 0 .5em; |
| } |
| |
| dl { |
| margin:0 0 1em 0; |
| padding:0; |
| } |
| |
| dt { |
| margin:0; |
| padding:0; |
| } |
| |
| dd { |
| margin:0 0 1em; |
| padding:0 0 0 2em; |
| } |
| |
| li p, dd p { |
| margin:1em 0 0; |
| } |
| |
| li pre, li table, li img, |
| dd pre, dd table, dd img { |
| margin:1em 0 0 1em; |
| } |
| |
| li ul, |
| li ol { |
| margin:.5em 0 0 0; |
| padding: 0 0 0 2em; |
| } |
| |
| dl li { |
| padding:.5em 0 0 0; |
| } |
| |
| dl dl, |
| ol dl, |
| ul dl { |
| margin:0 0 1em; |
| padding:0; |
| } |
| |
| table { |
| font-size:1em; |
| margin:0 0 1em; |
| padding:0; |
| border-collapse:collapse; |
| border-width:0; |
| empty-cells:show; |
| } |
| |
| td,th { |
| border:1px solid #ccc; |
| padding:6px 12px; |
| text-align:left; |
| vertical-align:top; |
| background-color:inherit; |
| } |
| |
| th { |
| background-color:#dee8f1; |
| } |
| |
| hr.blue { |
| background-color:#DDF0F2; |
| border:none; |
| height:5px; |
| margin:20px 0 10px; |
| } |
| |
| /* LAYOUT */ |
| #body-content { |
| margin:0; |
| position:relative; |
| width:100%; |
| } |
| |
| #header { |
| height: 114px; |
| position:relative; |
| z-index:100; |
| min-width:576px; |
| padding:0 10px; |
| border-bottom:3px solid #94b922; |
| } |
| |
| #headerLeft{ |
| padding: 25px 0 0; |
| } |
| |
| #headerRight { |
| position:absolute; |
| right:0; |
| top:0; |
| text-align:right; |
| } |
| |
| /* Tabs in the header */ |
| #header ul { |
| list-style: none; |
| margin: 7px 0 0; |
| padding: 0; |
| height: 29px; |
| } |
| |
| #header li { |
| float: left; |
| margin: 0px 2px 0px 0px; |
| padding:0; |
| } |
| |
| #header li a { |
| text-decoration: none; |
| display: block; |
| background-image: url(images/bg_images_sprite.png); |
| background-position: 0 -58px; |
| background-repeat: no-repeat; |
| color: #666; |
| font-size: 13px; |
| font-weight: bold; |
| width: 94px; |
| height: 29px; |
| text-align: center; |
| margin: 0px; |
| } |
| |
| #header li a:hover { |
| background-image: url(images/bg_images_sprite.png); |
| background-position: 0 -29px; |
| background-repeat: no-repeat; |
| } |
| |
| #header li a span { |
| position:relative; |
| top:7px; |
| } |
| |
| /* TAB HIGHLIGHTING */ |
| .home #home-link a, |
| .publish #publish-link a, |
| .guide #guide-link a, |
| .reference #reference-link a, |
| .sdk #sdk-link a, |
| .community #community-link a, |
| .about #about-link a { |
| background-image: url(images/bg_images_sprite.png); |
| background-position: 0 0; |
| background-repeat: no-repeat; |
| color: #fff; |
| font-weight: bold; |
| cursor:default; |
| } |
| |
| .home #home-link a:hover, |
| .publish #publish-link a:hover, |
| .guide #guide-link a:hover, |
| .reference #reference-link a:hover, |
| .sdk #sdk-link a:hover, |
| .community #community-link a:hover, |
| .about #about-link a:hover { |
| background-image: url(images/bg_images_sprite.png); |
| background-position: 0 0; |
| } |
| |
| #headerLinks { |
| margin:10px 10px 0 0; |
| height:13px; |
| } |
| |
| #headerLinks .text { |
| text-decoration: none; |
| color: #7FA9B5; |
| font-size: 11px; |
| vertical-align: top; |
| } |
| |
| #headerLinks a { |
| text-decoration: underline; |
| color: #7FA9B5; |
| font-size: 11px; |
| vertical-align: top; |
| } |
| |
| #search { |
| height:45px; |
| margin:15px 10px 0 0; |
| } |
| |
| /* main */ |
| |
| #mainBodyFluid { |
| margin: 20px 10px; |
| color:#333; |
| } |
| |
| #mainBodyFixed { |
| margin: 20px 10px; |
| color: #333; |
| width:930px; |
| } |
| |
| #mainBodyFixed h3, |
| #mainBodyFluid h3 { |
| color:#336666; |
| font-size:1.25em; |
| margin: 0em 0em 0em 0em; |
| padding-bottom:.5em; |
| } |
| |
| #mainBodyFixed h2, |
| #mainBodyFluid h2 { |
| color:#336666; |
| font-size:1.25em; |
| margin: 0; |
| padding-bottom:.5em; |
| } |
| |
| #mainBodyFixed h1, |
| #mainBodyFluid h1 { |
| color:#435A6E; |
| font-size:1.7em; |
| margin: 1em 0; |
| } |
| |
| #mainBodyFixed .green, |
| #mainBodyFluid .green, |
| #jd-content .green { |
| color:#7BB026; |
| background-color:none; |
| } |
| |
| #mainBodyLeft { |
| float: left; |
| width: 600px; |
| margin-right: 20px; |
| color: #333; |
| } |
| |
| div.indent { |
| margin-left: 40px; |
| margin-right: 70px; |
| } |
| |
| #mainBodyLeft p { |
| color: #333; |
| font-size: 13px; |
| } |
| |
| #mainBodyLeft p.blue { |
| color: #669999; |
| } |
| |
| #mainBodyLeft #communityDiv { |
| float: left; |
| background-image:url(images/bg_community_leftDiv.jpg); |
| background-repeat: no-repeat; |
| width: 581px; |
| height: 347px; |
| padding: 20px 0px 0px 20px; |
| } |
| |
| #mainBodyRight { |
| float: left; |
| width: 300px; |
| color: #333; |
| } |
| |
| #mainBodyRight p { |
| padding-right: 50px; |
| color: #333; |
| } |
| |
| #mainBodyRight table { |
| width: 100%; |
| } |
| |
| #mainBodyRight td { |
| border:0px solid #666; |
| padding:0px 5px; |
| text-align:left; |
| } |
| |
| #mainBodyRight .blueBorderBox { |
| border:5px solid #ddf0f2; |
| padding:18px 18px 18px 18px; |
| text-align:left; |
| } |
| |
| #mainBodyFixed .seperator { |
| background-image:url(images/hr_gray_side.jpg); |
| background-repeat:no-repeat; |
| width: 100%; |
| float: left; |
| clear: both; |
| } |
| |
| #mainBodyBottom { |
| float: left; |
| width: 100%; |
| clear:both; |
| color: #333; |
| } |
| |
| #mainBodyBottom .seperator { |
| background-image:url(images/hr_gray_main.jpg); |
| background-repeat:no-repeat; |
| width: 100%; |
| float: left; |
| clear: both; |
| } |
| |
| /* Footer */ |
| #footer { |
| float: left; |
| width:90%; |
| margin: 20px; |
| color: #aaa; |
| font-size: 11px; |
| } |
| |
| #footer a { |
| color: #aaa; |
| font-size: 11px; |
| } |
| |
| #footer a:hover { |
| text-decoration: underline; |
| color:#aaa; |
| } |
| |
| #footerlinks { |
| margin-top:2px; |
| } |
| |
| #footerlinks a, |
| #footerlinks a:visited { |
| color:#006699; |
| } |
| |
| #homeBottom td { |
| border:0px solid #666; |
| padding: 8px 18px 8px 18px; |
| } |
| |
| #homeBottom table { |
| width: 100%; |
| } |
| |
| |
| #homeBottom { |
| padding: 0px 0px 0px 0px; |
| float: left; |
| width: 585px; |
| height: 165px; |
| background-image:url(images/home/bg_home_bottom.jpg); |
| background-repeat: no-repeat; |
| } |
| |
| .groupTable { |
| width: 100%; |
| } |
| |
| .groupTable th { |
| padding: 10px; |
| color: #ffffff; |
| background-color: #6D8293; |
| border: 2px solid #fff; |
| } |
| |
| .groupTable td { |
| padding: 10px; |
| color: #333333; |
| background-color: #d9d9d9; |
| border: 2px solid #fff; |
| } |
| |
| .groupTable .evenRow td { |
| background-color: #ededed; |
| } |
| |
| span.BigBlue { |
| color:#336666; |
| font-size:1.25em; |
| margin: 0em 0em 0em 0em; |
| padding-bottom:.5em; |
| font-weight: bold; |
| } |
| |
| span.emBlue { |
| color: #336666; |
| font-style:italic; |
| } |
| |
| .pageTable { |
| width: 95%; |
| border: none; |
| } |
| |
| .pageTable img { |
| vertical-align: bottom; |
| } |
| |
| .pageTable td { |
| border: none; |
| } |
| |
| .pageTable td.leftNav { |
| width: 100px; |
| } |
| |
| .greenBox { |
| margin: 10px 30px 10px 30px; |
| padding: 10px 20px 10px 20px; |
| background-color: #EBF3DB; |
| width: 75%; |
| } |
| |
| .blueBox { |
| margin: 10px 30px 10px 30px; |
| padding: 10px 20px 10px 20px; |
| background-color: #DDF0F2; |
| width: 75%; |
| } |
| |
| .blueHR { |
| margin: 10px 30px 10px 30px; |
| height: 5px; |
| background-color: #DDF0F2; |
| width: 75%; |
| } |
| |
| /* SEARCH FILTER */ |
| #search_autocomplete { |
| color:#aaa; |
| } |
| |
| #search-button { |
| display:inline; |
| } |
| |
| #search_filtered_div { |
| position:absolute; |
| margin-top:-1px; |
| z-index:101; |
| border:1px solid #BCCDF0; |
| background-color:#fff; |
| } |
| |
| #search_filtered { |
| min-width:100%; |
| } |
| #search_filtered td{ |
| background-color:#fff; |
| border-bottom: 1px solid #669999; |
| line-height:1.5em; |
| } |
| |
| #search_filtered .jd-selected { |
| background-color: #94b922; |
| cursor:pointer; |
| } |
| #search_filtered .jd-selected, |
| #search_filtered .jd-selected a { |
| color:#fff; |
| } |
| |
| .no-display { |
| display: none; |
| } |
| |
| .jd-autocomplete { |
| font-family: Arial, sans-serif; |
| padding-left: 6px; |
| padding-right: 6px; |
| padding-top: 1px; |
| padding-bottom: 1px; |
| font-size: .8em; |
| border: none; |
| margin: 0; |
| line-height: 1.05em; |
| } |
| |
| .show-row { |
| display: table-row; |
| } |
| .hide-row { |
| display: hidden; |
| } |
| |
| /* SEARCH */ |
| |
| /* restrict global search form width */ |
| #searchForm { |
| width:350px; |
| } |
| |
| #searchTxt { |
| width:200px; |
| } |
| |
| /* disable twiddle and size selectors for left column */ |
| #leftSearchControl div { |
| width: 100%; |
| } |
| |
| #leftSearchControl .gsc-twiddle { |
| background-image : none; |
| } |
| |
| #leftSearchControl td, #searchForm td { |
| border: 0px solid #000; |
| } |
| |
| #leftSearchControl .gsc-resultsHeader .gsc-title { |
| padding-left : 0px; |
| font-weight : bold; |
| font-size : 13px; |
| color:#006699; |
| display : none; |
| } |
| |
| #leftSearchControl .gsc-resultsHeader div.gsc-results-selector { |
| display : none; |
| } |
| |
| #leftSearchControl .gsc-resultsRoot { |
| padding-top : 6px; |
| } |
| |
| #leftSearchControl div.gs-visibleUrl-long { |
| display : block; |
| color:#006699; |
| } |
| |
| .gsc-webResult div.gs-visibleUrl-short, |
| table.gsc-branding, |
| .gsc-clear-button { |
| display : none; |
| } |
| |
| .gsc-cursor-box .gsc-cursor div.gsc-cursor-page, |
| .gsc-cursor-box .gsc-trailing-more-results a.gsc-trailing-more-results, |
| #leftSearchControl a, |
| #leftSearchControl a b { |
| color:#006699; |
| } |
| |
| .gsc-resultsHeader { |
| display: none; |
| } |
| |
| /* Disable built in search forms */ |
| .gsc-control form.gsc-search-box { |
| display : none; |
| } |
| table.gsc-search-box { |
| margin:6px 0 0 0; |
| border-collapse:collapse; |
| } |
| |
| td.gsc-input { |
| padding:0 2px; |
| width:100%; |
| vertical-align:middle; |
| } |
| |
| input.gsc-input { |
| border:1px solid #BCCDF0; |
| width:99%; |
| padding-left:2px; |
| font-size:.95em; |
| } |
| |
| td.gsc-search-button { |
| text-align: right; |
| padding:0; |
| vertical-align:top; |
| } |
| |
| #search-button { |
| margin:0 0 0 2px; |
| font-size:11px; |
| height:1.8em; |
| } |
| |
| |
| /* CAROUSEL */ |
| |
| #homeMiddle { |
| padding: 0px 0px 0px 0px; |
| float: left; |
| width: 584px; |
| height: 580px; |
| background:url(images/home/bg_home_middle.png) no-repeat 0 0; |
| } |
| |
| #homeTitle { |
| margin:15px 15px 0; |
| height:30px; |
| background:url(images/hr_gray_side.jpg) no-repeat 0 29px; |
| } |
| |
| #homeTitle h2 { |
| padding:0; |
| } |
| |
| #announcement-block { |
| margin:15px 15px 0; |
| height:125px; |
| } |
| |
| #announcement-block img { |
| float:left; |
| margin:0 30px 0 0; |
| } |
| |
| #announcement { |
| float:left; |
| margin:0; |
| } |
| |
| .clearer { clear:both; } |
| |
| #arrow-left, #arrow-right { |
| display:block; |
| width:42px; |
| height:42px; |
| background-image:url(images/home/carousel_buttons_sprite.png); |
| background-repeat:no-repeat; |
| } |
| #arrow-left { |
| float:left; |
| margin:35px 3px 0 10px; |
| } |
| #arrow-right { |
| float:left; |
| margin:35px 10px 0 0; |
| } |
| .arrow-left-off, |
| #arrow-left.arrow-left-off:hover { |
| background-position:0 0; |
| } |
| .arrow-right-off, |
| #arrow-right.arrow-right-off:hover { |
| background-position:-42px 0; |
| } |
| #arrow-left:hover { |
| background-position:0 -42px; |
| } |
| #arrow-right:hover { |
| background-position:-42px -42px; |
| } |
| .arrow-left-on { |
| background-position:0 0; |
| } |
| .arrow-right-on { |
| background-position:-42px 0; |
| } |
| |
| .arrow-right-off, |
| .arrow-left-off { |
| cursor:default; |
| } |
| |
| .app-list-container { |
| clear:both; |
| text-align: center; |
| margin:37px 20px 0; |
| _margin-top:33px; |
| border:0px solid #ccc; |
| position:relative; |
| width:100%; |
| } |
| |
| div#list-clip { |
| height:110px; |
| width:438px; |
| overflow:hidden; |
| position:relative; |
| float:left; |
| } |
| |
| div#app-list { |
| left:0; |
| z-index:1; |
| position:absolute; |
| margin:11px 0 0; |
| _margin-top:13px; |
| width:1000%; |
| } |
| |
| #app-list a { |
| display:block; |
| float:left; |
| height:90px; |
| width:90px; |
| margin:0 24px 0; |
| padding:3px; |
| background:#99cccc; |
| -webkit-border-radius:7px; |
| -moz-border-radius:7px; |
| border-radius:7px; |
| text-decoration:none; |
| text-align:center; |
| font-size:11px; |
| } |
| |
| #app-list img { |
| width:90px; |
| height:70px; |
| margin:0; |
| } |
| |
| #app-list a.selected, |
| #app-list a:active.selected, |
| #app-list a:hover.selected { |
| background:#A4C639; |
| color:#fff; |
| cursor:default; |
| text-decoration:none; |
| } |
| |
| #app-list a:hover, |
| #app-list a:active { |
| background:#ff9900; |
| } |
| |
| #app-list a:hover span, |
| #app-list a:active span { |
| text-decoration:underline; |
| } |
| |
| #droid-name { |
| padding-top:.5em; |
| color:#666; |
| padding-bottom:.25em; |
| } |
| |
| #carouselMain { |
| margin: 25px 21px 0; |
| height:185px; |
| background-position:top; |
| background-repeat:no-repeat; |
| overflow:hidden; |
| } |
| |
| #carouselMain img { |
| margin:0; |
| } |
| |
| /*carousel bulletin layouts*/ |
| /*460px width*/ |
| /*185px height*/ |
| .img-left { |
| float:left; |
| width:230px; |
| height:165px; |
| overflow:hidden; |
| margin:8px 0 8px 8px; |
| } |
| .desc-right { |
| float:left; |
| width:270px; |
| margin:10px; |
| } |
| .img-right { |
| float:right; |
| width:220px; |
| height:165px; |
| overflow:hidden; |
| margin:8px 8px 8px 0; |
| } |
| .desc-left { |
| float:right; |
| width:280px; |
| margin:10px; |
| text-align:right; |
| } |
| .img-top { |
| height:80px; |
| text-align:center; |
| } |
| .desc-bottom { |
| height:100px; |
| margin:10px; |
| } |
| |
| |
| |