odk/docs/sdk_styles.css

   1 /* Core Styles */
   2 /*
   3  * This file is part of the LibreOffice project.
   4  *
   5  * This Source Code Form is subject to the terms of the Mozilla Public
   6  * License, v. 2.0. If a copy of the MPL was not distributed with this
   7  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
   8  *
   9  * This file incorporates work covered by the following license notice:
  10  *
  11  *   Licensed to the Apache Software Foundation (ASF) under one or more
  12  *   contributor license agreements. See the NOTICE file distributed
  13  *   with this work for additional information regarding copyright
  14  *   ownership. The ASF licenses this file to you under the Apache
  15  *   License, Version 2.0 (the "License"); you may not use this file
  16  *   except in compliance with the License. You may obtain a copy of
  17  *   the License at http://www.apache.org/licenses/LICENSE-2.0 .
  18  */
  19
  20 * {
  21         margin: 0;
  22         padding: 0;
  23 }
  24
  25 body {
  26         font: 87.5% sans-serif;
  27         background: url(https://api.libreoffice.org/themes/libo/images/background-page.png) repeat-x #FFF;
  28 }
  29
  30 /* Styles go from the top of the page to the bottom (generally) */
  31
  32 #Container {
  33         width: 900px;
  34         margin: auto;
  35 }
  36
  37 #Logo {
  38         display: inline-block;
  39         width: 218px;
  40         height: 45px;
  41         padding: 18px 20px;
  42         background: url(https://api.libreoffice.org/themes/libo/images/logo.png) no-repeat 18px 20px;
  43         *float:left;/* hack for IE7 that doesn't respect inline-block */
  44 }
  45 #TopHeader { height: 88px;/* needed for IE7 */}
  46 #TopHeader, #BottomHeader {
  47         padding-left: 5px;
  48         padding-right: 5px;
  49         background-image: url(https://api.libreoffice.org/themes/libo/images/header.png);
  50         background-repeat: no-repeat;
  51 }
  52 #Layout {
  53         padding: 0 5px;
  54 }
  55 #HeaderTagLine {
  56         float: right;
  57         padding-top: 30px;
  58         padding-right: 20px;
  59         color: #18A303;
  60         font-size: 1.2em;
  61 }
  62
  63 #BottomHeader {
  64         background-position: 0 bottom;
  65         margin-bottom: 1.25em;
  66 }
  67
  68 #FirstNavigation, #SecondNavigation {
  69         width: 100%;
  70         display: block;
  71         list-style: none;
  72         white-space: nowrap;
  73         word-spacing: -1em;
  74         letter-spacing: -4px;
  75 }
  76
  77 #FirstNavigation {
  78         background: #18A303;
  79         border-bottom: 6px solid #43C330;
  80 }
  81 #SecondNavigation {
  82         margin-top: -6px;
  83 }
  84
  85 .SingleMenu {
  86         padding-bottom: 10px;
  87 }
  88
  89 #FirstNavigation li, #SecondNavigation li {
  90         display: inline-block;
  91         zoom:1; *display:inline;/* for ie6/7 */
  92         word-spacing: normal;
  93         letter-spacing: normal;
  94         margin: 0;
  95         padding: 0;
  96         list-style: none;
  97 }
  98 #FirstNavigation li a, #SecondNavigation li a {
  99         display: block;
 100         text-decoration: none;
 101         color: #FFF;
 102 }
 103 #FirstNavigation li a {
 104         padding: 9px 18px;
 105         margin-bottom: -6px;
 106         background: #18A303;
 107         border-bottom: 6px solid #43C330;
 108 }
 109 #SecondNavigation li a {
 110         padding: 8px 16px;
 111         margin-bottom: 10px;
 112         font-size: .95em;
 113         background: #43C330;
 114 }
 115 #FirstNavigation li a span, #SecondNavigation li a span {
 116         opacity: .75;
 117 }
 118 #FirstNavigation li a:hover span, #SecondNavigation li a:hover span, #ThirdNavigation li a:hover {
 119         opacity: 1;
 120         text-decoration: none;
 121 }
 122 #FirstNavigation li.current a span, #SecondNavigation li.current a span, #SecondNavigation li.section a span {
 123         opacity: 1;
 124         font-weight: bold;
 125 }
 126 #FirstNavigation li.section > a span {
 127         opacity: 1;
 128 }
 129 #FirstNavigation li.current a, #FirstNavigation li.section > a {
 130         background-color: #43C330;
 131 }
 132 #SecondNavigation li.current, #SecondNavigation li.section {
 133         background: url(https://api.libreoffice.org/themes/libo/images/navigation-second-current.png) center bottom no-repeat;
 134 }
 135
 136 #Layout #ThirdNavigation {
 137         float: left;
 138         width: 17.5%;
 139         margin: .6em 0 0 0;
 140 }
 141 #Layout[dir="rtl"] #ThirdNavigation {
 142         float: right;
 143 }
 144
 145 #Layout #ThirdNavigation > li {
 146         margin-bottom: 0.25em;
 147         display: block;
 148         padding: 0;
 149         background-image: none;
 150         position: relative;
 151 }
 152
 153 #ThirdNavigation >li>ul {
 154         position: absolute;
 155         z-index: 50;
 156         top: 0;
 157         left: 100%;
 158         background-color: white;
 159         display: none;
 160         white-space: nowrap;
 161 }
 162 #ThirdNavigation >li:hover >ul {
 163         display: block;
 164 }
 165
 166 #Layout #ThirdNavigation li a {
 167         margin: 0;
 168         display: block;
 169         padding: 3px 10px 3px 0;
 170         border-bottom: 1px solid #92E285;
 171 }
 172
 173 #Layout #ThirdNavigation li a:hover {
 174         background: url(https://api.libreoffice.org/themes/libo/images/heading-green.png) repeat-x 0 bottom;
 175 }
 176
 177 #Layout #ThirdNavigation li a.current {
 178         color: #106802;
 179         /*text-shadow: #18A303 0px 1px 1px;*/
 180         font-weight: bold;
 181         border-bottom: 1px solid #18A303;
 182 }
 183
 184 #DownloadButton {
 185         display: block;
 186         padding: 20px 0 0 64px;
 187         width: 360px;
 188         height: 44px;
 189         font-size: 1.5em;
 190         color: #18A303;
 191         background: url(https://api.libreoffice.org/themes/libo/images/download-button.png) no-repeat;
 192 }
 193
 194 #DownloadButton:hover {
 195         background-position: 0 -64px;
 196         color: #106802;
 197 }
 198
 199 #Footer {
 200         margin: 0 5px;
 201         clear: both;
 202         border-top: 6px solid #43C330;
 203         padding: 1.25em 0 2.2em 0;
 204         font-size: 80%;
 205 }
 206
 207 #FooterText {
 208         display: inline-block;
 209 }
 210
 211 #FooterText p {
 212         line-height: 150%;
 213         margin: 0;
 214 }
 215
 216 #FooterText ul {
 217         margin: 0 0 10px 0;
 218         float: left;
 219 }
 220
 221 #FooterText ul li {
 222         display: inline-block;
 223         margin: 0 0 0 18px;
 224 }
 225
 226 #CreativeCommons {
 227         float: right;
 228         display: block;
 229         margin: 3px 0 20px 18px;
 230         width: 88px;
 231         height: 30px;
 232         background: url(https://api.libreoffice.org/themes/libo/images/creative-commons-license.png) no-repeat;
 233 }
 234
 235 div.HalfBlockLeft, div.HalfBlockRight {
 236         width: 440px;
 237         float: left;
 238         display: block;
 239 }
 240
 241 div.HalfBlockRight {
 242         float: right;
 243 }
 244
 245 .ThirdLevelPage {
 246         width: 80%;
 247         margin: 0 0 0 1%;
 248 }
 249
 250 div#screenshot-slide, a#toTop {
 251         background-repeat: no-repeat;
 252 }
 253
 254 div#filtered {
 255         margin-top: 0.8em;
 256 }
 257
 258 div.faqsList {
 259         margin-top: 1em;
 260         margin-bottom: 1.2em;
 261 }
 262
 263 a#toTop {
 264         background-image: url(https://api.libreoffice.org/themes/libo/images/tango_totop.png);
 265         text-indent: 48px;
 266         white-space: nowrap;
 267         width: 48px;
 268         height: 48px;
 269         position: fixed;
 270         top: 5px;
 271         right: 0px;
 272 }
 273 div#translations p, ul.translations, ul.translations li {
 274         display: inline-block;
 275 }
 276 div#translations > ul.translations> li:first-letter {
 277         text-transform: uppercase;
 278 }
 279 ul.translations li:not(:last-child):after {
 280         content: ", ";
 281 }
 282
 283 /**
 284  * LibreOffice theme
 285  * initially based on SilverStripe Black Candy Theme
 286  *
 287  * This typography file is included in the WYSIWYG editor and the front end. It provides
 288  * a place to add link styles and font styles you would like in the CMS and the Front End.
 289  */
 290
 291 /* PARAGRAPHS & BLOCKQUOTES
 292 -------------------------------------------- */
 293 p, blockquote, .HalfBlockLeft, .HalfBlockRight {
 294         margin-bottom: 1.2em;
 295 }
 296
 297 .typography ul {
 298         margin-bottom: 1.5em;
 299 }
 300
 301 .typography ol {
 302         margin-left: 3em;
 303         line-height: 170%;
 304 }
 305
 306 .typography p, .typography blockquote {
 307         text-align: justify;
 308         line-height: 175%;
 309         color: #333;
 310 }
 311
 312 .typography blockquote {
 313         border-left: 10px solid #92E285;
 314         margin: 0 0 1.5em 25px;
 315         padding: 0 0 0 18px;
 316         color: #333;
 317 }
 318
 319 .typography blockquote p {
 320         margin: 0;
 321         padding: 5px 0;
 322         color: #333;
 323 }
 324
 325 /* LINKS
 326 -------------------------------------------- */
 327 a, .typography a {
 328         color: #18A303;
 329         text-decoration: none;
 330 }
 331
 332 a:hover, .typography a:hover {
 333         color: #106802;
 334         text-decoration: underline;
 335 }
 336 a:visited, .typography a:visited  {
 337         color: #106802;
 338 }
 339 /* LINK ICONS - shows type of file
 340 ------------------------------------ */
 341 .typography a[href$=".pdf"],
 342 .typography a[href$=".PDF"],
 343 .typography a.pdf {
 344         padding: 2px;
 345         padding-left: 20px;
 346         background: url(https://api.libreoffice.org/themes/libo/images/icons/page_white_acrobat.png) no-repeat left center;
 347 }
 348 .typography a[href$=".doc"],
 349 .typography a[href$=".DOC"],
 350 .typography a.doc {
 351         padding: 2px;
 352         padding-left: 20px;
 353         background: url(https://api.libreoffice.org/themes/libo/images/icons/page_word.png) no-repeat left center;
 354 }
 355 .typography a[href$=".xls"],
 356 .typography a[href$=".XLS"],
 357 .typography a.xls {
 358         padding: 2px;
 359         padding-left: 20px;
 360         background: url(https://api.libreoffice.org/themes/libo/images/icons/page_excel.png) no-repeat left center;
 361 }
 362 .typography a[href$=".gz"],
 363 .typography a[href$=".GZ"],
 364 .typography a[href$=".gzip"],
 365 .typography a[href$=".GZIP"],
 366 .typography a[href$=".zip"],
 367 .typography a[href$=".ZIP"],
 368 .typography a.archive {
 369         padding: 2px;
 370         padding-left: 20px;
 371         background: url(https://api.libreoffice.org/themes/libo/images/icons/page_white_zip.png) no-repeat left center;
 372 }
 373 .typography a[href$=".exe"],
 374 .typography a[href$=".EXE"],
 375 .typography a.application {
 376         padding: 2px;
 377         padding-left: 20px;
 378         background: url(https://api.libreoffice.org/themes/libo/images/icons/application.png) no-repeat left center;
 379 }
 380
 381 /* LIST STYLES
 382 -------------------------------------------- */
 383 ul, .typography ul {
 384         list-style: none;
 385 }
 386
 387 .typography ul li {
 388         background: url(https://api.libreoffice.org/themes/libo/images/bullet-green.png) no-repeat 0 6px;
 389         color: 333;
 390         line-height: 170%;
 391         padding: 0 0 8px 18px;
 392 }
 393 #Layout[dir="rtl"] ul li {
 394         padding-left: 0;
 395         padding-right: 18px;
 396         background-position: right 6px;
 397 }
 398
 399 .typography ul ul {
 400         margin-top: 10px;
 401         margin-bottom: 10px;
 402 }
 403
 404 .typography ul ul li {
 405         background: url(https://api.libreoffice.org/themes/libo/images/bullet-blue.png) no-repeat 0 6px;
 406 }
 407
 408 .typography .Widget a {
 409         color: #106802;
 410 }
 411
 412 .typography #Blog li h2 a, .typography .Widget a.TweetAuthor, .typography .Widget small a {
 413         color: #1C99E0;
 414 }
 415
 416 .typography #Twitter li {
 417         background: url(https://api.libreoffice.org/themes/libo/images/tweet.png) no-repeat 0 12px !important;
 418         padding: 6px 0 6px 40px !important;
 419         direction: ltr;
 420         font-size: .9em;
 421         border-bottom: 1px solid #CCF4C6;
 422 }
 423
 424 .typography #Blog li {
 425         display: block;
 426         background: url(https://api.libreoffice.org/themes/libo/images/bullet-large-blue.png) no-repeat 0 10px !important;
 427         padding: 6px 0 6px 30px !important;
 428         direction: ltr;
 429         border-bottom: 1px solid #CCF4C6;
 430 }
 431
 432 .typography #Blog li h2 {
 433         background: none;
 434         border: none;
 435         font-size: 1.1em;
 436         margin: 0;
 437         padding: 0;
 438 }
 439
 440 .typography #Blog li p {
 441         line-height: 150%;
 442         font-size: .9em;
 443         text-align: left;
 444         padding: 0;
 445         margin: 0;
 446 }
 447
 448 .typography .Widget li small {
 449         display: block;
 450         font-size: .85em;
 451 }
 452
 453 /* used by FolderPage */
 454 .typography li.folder {
 455         background: url(https://api.libreoffice.org/themes/libo/images/icons/folder_open.png) no-repeat left top;
 456         margin-left: -12px;
 457         padding-left: 22px;
 458         list-style-type: none;
 459 }
 460
 461 .typography .ButtonBar {
 462         clear: both;
 463         display: block;
 464         width: 100%;
 465 }
 466
 467 .typography .ButtonBar li {
 468         display: block;
 469         float: left;
 470         width: 17%;
 471         height: 50px;
 472         margin: 0 2.5% 1.25em 0;
 473         padding: 0 !important; /* important because of rtl rules */
 474         background-image: none;
 475 }
 476
 477 .typography .ButtonBar li a {
 478         padding: 0 0 0 24px;
 479         background-repeat: no-repeat;
 480         display: block;
 481         font-size: .95em;
 482 }
 483
 484 .typography .ButtonBar li a.irc {
 485         background-image: url(https://api.libreoffice.org/themes/libo/images/chat.png);
 486 }
 487
 488 .typography .ButtonBar li a.facebook {
 489         background-image: url(https://api.libreoffice.org/themes/libo/images/facebook.png);
 490 }
 491
 492 .typography .ButtonBar li a.template {
 493         background-image: url(https://api.libreoffice.org/themes/libo/images/template.png);
 494 }
 495
 496 .typography .ButtonBar li a.extension {
 497         background-image: url(https://api.libreoffice.org/themes/libo/images/extension.png);
 498 }
 499
 500
 501 /* HEADER STYLES
 502 -------------------------------------------- */
 503 .typography h1, .typography h2, .typography h3, .typography h4, .typography h5, .typography h6 {
 504         margin-bottom: .5em;
 505         font-weight: normal;
 506 }
 507
 508 .typography h1 {
 509         background: url(https://api.libreoffice.org/themes/libo/images/heading-green.png) 0 bottom repeat-x;
 510         border-bottom: 1px solid #92E285;
 511         padding: .2em 0 .1em 2px;
 512         color: #18A303;
 513         font-weight: bold;
 514         font-size: 1.4em;
 515         text-shadow: #FFF 0px 1px 1px;
 516 }
 517
 518 .typography h2 {
 519         border-bottom: 1px solid #CCF4C6;
 520         color: #18A303;
 521         font-size: 1.3em;
 522 }
 523
 524 .typography h3 {
 525         color: #18A303;
 526         font-size: 1.2em;
 527 }
 528
 529 .typography h4 {
 530         color: #18A303;
 531         font-size: 1.15em;
 532 }
 533
 534 .typography h5 {
 535         color: #18A303;
 536         font-size: 1.1em;
 537 }
 538
 539 .typography h6 {
 540         color: #18A303;
 541         font-size: 1.05em;
 542 }
 543
 544 /* PRE STYLES
 545 -------------------------------------------- */
 546 .typography pre {
 547         font-family:"Courier New",Courier;
 548         display:block;
 549         font-size:1.2em;
 550         margin:2em 5em;
 551         padding:0.5em;
 552         border:1px #ccc solid;
 553         background:#eee;;
 554 }
 555
 556 /* TABLE STYLING
 557 -------------------------------------------- */
 558 .typography table {
 559         margin: 0 0 18px 0;
 560         border-collapse:collapse;
 561 }
 562         .typography tr {}
 563                 .typography td {
 564                         padding:5px;
 565                 }
 566
 567 /* WYSIWYG EDITOR ALIGNMENT CLASSES
 568 -------------------------------------------- */
 569 .typography .left {
 570         text-align: left;
 571 }
 572 .typography .center {
 573         text-align: center;
 574 }
 575 .typography .right {
 576         text-align: right;
 577 }
 578
 579 /* IMAGES
 580 -------------------------------------------- */
 581 .typography img {
 582         border: none;
 583 }
 584         .typography img.right {
 585                 float: right;
 586                 margin-left: 20px;
 587         }
 588         .typography img.left {
 589                 float: left;
 590                 margin-right: 20px;
 591         }
 592         .typography img.leftAlone {
 593                 float: left;
 594                 margin-right: 100%;
 595         }
 596         .typography img.center {
 597                 float: none;
 598                 margin-left: auto;
 599                 margin-right: auto;
 600                 display: block;
 601         }
 602
 603 ul.ul-libreoffice li {
 604         position: relative;
 605         list-style: none;
 606         margin-left: 0px;
 607         background: url(https://api.libreoffice.org/themes/libo/images/li-bullet-single-dark.png) no-repeat;
 608         background-position: 4px 3px;
 609         padding-left: 30px;
 610         display: block;
 611         color: #000;
 612         margin-bottom: 20px;
 613         margin-top: 10px;
 614 }
 615 .typography kbd {
 616         color: #000;
 617         font-family: monospace;
 618         background: #ddd;
 619 }
 620 #supporters td {
 621         border-width: 0px;
 622         vertical-align:top;
 623         padding-bottom: 50px;
 624 }
 625 .foundationtable th {
 626         font-size: 140%;
 627         padding: 6px;
 628         vertical-align: middle;
 629         background: #eee;
 630 }
 631 .foundationtable tbody tr:first-child td  {
 632         padding-top: 20px;
 633 }
 634 .foundationtable tbody tr td:first-child  {
 635         padding-left: 0px;
 636         padding-right: 15px;
 637 }
 638 p.roles {
 639         font-variant: small-caps;
 640 }
 641
 642 /* STRONG
 643 --------------------------------------------
 644 .typography strong {
 645         color: #18A303;
 646 }*/
 647 .highlight {
 648         background: yellow;
 649 }
 650
 651 /* for translation status sitemap */
 652 div.missing {
 653         background-color: red;
 654 }
 655 div.live {
 656         background-color: green;
 657 }
 658 div.unpublished {
 659         background-color: orange;
 660 }
 661 div.changed {
 662         background-color: yellow;
 663 }
 664
 665 /* for horizontally aligned li-children */
 666 ul.table {
 667         display: table;
 668 }
 669 ul.table > li {
 670         display: table-row;
 671         background: none;
 672 }
 673 ul.table > li > * {
 674         display: table-cell;
 675         padding-right: 1em;
 676 }
 677 .clear{
 678         clear:both;
 679 }
 680
 681 hr {
 682         display: block;
 683         clear: both;
 684         height: .1em;
 685         border: none;
 686         width: 100%;
 687 }
 688
 689 .FloatLeft {
 690         float: left;
 691 }
 692
 693 .FloatRight {
 694         float: right;
 695 }
 696
 697 .RightMargin {
 698         margin-right: 10px;
 699 }
 700
 701 .captionImage.FloatRight {
 702         margin-left: 1em;
 703 }
 704
 705 .captionImage.FloatLeft {
 706         margin-right: 1em;
 707 }
 708 /* pending - not final */
 709 .typography p.greenbox {
 710         border: 1px solid #43C330;
 711         background-color: #CCF4C6;
 712         padding: 10px;
 713         margin: 10px 0;
 714 }
 715
 716 .typography p.bluebox {
 717         border: 1px solid #1C99E0;
 718         background-color: #AADCF7;
 719         padding: 10px;
 720         margin: 10px 0;
 721 }
 722
 723 .typography p.orangebox {
 724         border: 1px solid #D36118;
 725         background-color: #F9CFB5;
 726         padding: 10px;
 727         margin: 10px 0;
 728 }
 729
 730 .typography p.purplebox {
 731         border: 1px solid #C254D2;
 732         background-color: #F2CBF8;
 733         padding: 10px;
 734         margin: 10px 0;
 735 }
 736
 737 .typography p.yellowbox {
 738         border: 1px solid #E9B913;
 739         background-color: #FDE9A9;
 740         padding: 10px;
 741         margin: 10px 0;
 742 }
 743
 744 .typography p.intro {
 745         font-size: 1.1em;
 746         border-bottom: 1px solid #CCC;
 747         padding-bottom: .75em;
 748 }
 749
 750 .typography p.excerpt {
 751         width: 200px;
 752         margin-bottom: 0;
 753         padding: 0 0 0 40px;
 754         display: block;
 755         float: right;
 756         color: #777;
 757         font-style: italic;
 758         text-align: left;
 759 }
 760
 761 .typography p.tick {
 762         padding-left: 50px;
 763         background-image: url(https://api.libreoffice.org/themes/libo/images/tick.png);
 764         background-position: 10px 5px;
 765         background-repeat: no-repeat;
 766 }
 767 .typography ul.tick {
 768         background: url(https://api.libreoffice.org/themes/libo/images/tick.png) no-repeat;
 769         padding-left: 40px;
 770 }
 771
 772 .typography p.information {
 773         padding-left: 50px;
 774         background-image: url(https://api.libreoffice.org/themes/libo/images/information.png);
 775         background-position: 10px 5px;
 776         background-repeat: no-repeat;
 777 }
 778 .typography ul.information {
 779         background: url(https://api.libreoffice.org/themes/libo/images/information.png) no-repeat;
 780         padding-left: 40px;
 781 }
 782
 783 .typography p.warning {
 784         padding-left: 50px;
 785         background-image: url(https://api.libreoffice.org/themes/libo/images/warning.png);
 786         background-position: 10px 5px;
 787         background-repeat: no-repeat;
 788 }
 789 .typography ul.warning {
 790         background: url(https://api.libreoffice.org/themes/libo/images/warning.png) no-repeat;
 791         padding-left: 40px;
 792 }
 793
 794 .typography p.error {
 795         padding-left: 50px;
 796         background-image: url(https://api.libreoffice.org/themes/libo/images/error.png);
 797         background-position: 10px 5px;
 798         background-repeat: no-repeat;
 799 }
 800 .typography ul.error {
 801         background: url(https://api.libreoffice.org/themes/libo/images/error.png) no-repeat;
 802         padding-left: 40px;
 803 }
 804
 805 .typography p.excerpt:before {
 806         content: '\201C';
 807         color: #18A303;
 808         font-size: 4em;
 809         line-height: 0.1em;
 810         margin-left: -25px;
 811         margin-right: 8px;
 812         position: relative;
 813         top: .5em;
 814         font-style: normal;
 815 }
 816 .typography p.excerpt:after {
 817         content: '\201D ';
 818         color: #18A303;
 819         font-size: 4em;
 820         line-height: 1px;
 821         margin-left: 8px;
 822         margin-bottom: 0;
 823         position: relative;
 824         top: .45em;
 825         font-style: normal;
 826 }
 827
 828 .typography div.box {
 829         width: 150px;
 830         margin: 10px;
 831         display: block;
 832         float: left;
 833         box-shadow: 0 1px 2px #777;
 834         -webkit-box-shadow: 0 1px 2px #777;
 835         -moz-box-shadow: 0 1px 2px #777;
 836         border-radius: 2px;
 837         -moz-border-radius: 2px;
 838         -webkit-border-radius: 2px;
 839         text-align: center;
 840 }
 841
 842 .typography div.box img {
 843         height: 80px;
 844         padding: 10px 10px 10px 10px;
 845 }
 846
 847 .typography div.box p {
 848         margin: 0;
 849         padding: 10px;
 850         background: #EEE;
 851         text-align: left;
 852 }
 853
 854
 855 .sdkbody { background-color: #FFFFFF;
 856            color: #000000;
 857            margin-top: 0;
 858            margin-bottom: 0;
 859            margin-left: 0;
 860            margin-right: 0;
 861            font-family: Arial, Helvetica, sans-serif; }
 862
 863 .note { font-size: 20;
 864         font-weight: bold;
 865         font-style: italic;
 866         text-align: center; }
 867
 868 .table1 { width: 100%;
 869           border-style: none;
 870           border-spacing: 0;
 871           padding: 0; }
 872
 873 .table2 { width: 100%;
 874           border-style: none;
 875           border-spacing: 8;
 876           padding: 5; }
 877
 878 .table3 { width: 100%;
 879           border-style: none;
 880           border-spacing: 6;
 881           padding: 0; }
 882
 883 .table4 { width: 100%;
 884           border-width: 2px;
 885           border-style: groove;
 886           border-color: #CCCCCC;
 887           border-spacing: 0;
 888           border-collapse: collapse; }
 889
 890 .cell15 { width: 15%;
 891           border-width: 2px;
 892           border-style: groove;
 893           border-color: #CCCCCC;
 894           border-spacing: 0;
 895           border-collapse: collapse;
 896           padding: 4;
 897           color: #000000; }
 898
 899 .cell20 { width: 20%;
 900           border-width: 2px;
 901           border-style: groove;
 902           border-color: #CCCCCC;
 903           border-spacing: 0;
 904           border-collapse: collapse;
 905           padding: 4;
 906           color: #000000; }
 907
 908 .cell80 { width: 80%;
 909           border-width: 2px;
 910           border-style: groove;
 911           border-color: #CCCCCC;
 912           border-spacing: 0;
 913           border-collapse: collapse;
 914           padding: 4;
 915           color: #000000; }
 916
 917 .cell85 { width: 85%;
 918           border-width: 2px;
 919           border-style: groove;
 920           border-color: #CCCCCC;
 921           border-spacing: 0;
 922           border-collapse: collapse;
 923           padding: 4;
 924           color: #000000;}
 925
 926 .nothing1 { width: 20;
 927            height: 1; }
 928
 929 .nothing8 { width: 20;
 930             height: 8; }
 931
 932 .nothing10 { width: 20;
 933             height: 10; }
 934
 935 .nothing30 { width: 20;
 936             height: 30; }
 937
 938
 939 .appicon { width: 32;
 940            height: 32;
 941            border: 0; }
 942
 943 .line { width: 100%;
 944         height: 5;
 945         border: 0;
 946         vertical-align: middle; }
 947
 948
 949 .arrow { width: 16;
 950          height: 13; }
 951
 952 .head1 { font-size: 20;
 953          font-weight: bold; }
 954
 955 .head2 { font-size: 18;
 956          font-weight: bold; }
 957
 958 .head3 { font-size: 17;
 959          font-weight: bold; }
 960
 961 .head4 { font-size: 16;
 962          font-weight: bold; }
 963
 964 .thead { font-weight: bold;
 965          background-color:#18a303;
 966          background-position: middle; }
 967
 968 .navigate { border: 0; }
 969
 970 .content1 { width: 1%; }
 971 .content3 { width: 3%; }
 972 .content4 { width: 4%; }
 973 .content10 { width: 10%; }
 974 .content20 { width: 20%; }
 975 .content70 { width: 70%; }
 976 .content75 { width: 75%; }
 977 .content80 { width: 80%; }
 978 .content87 { width: 87%; }
 979
 980 .centertext {align:center; text-align:center; font-size: 12;}
 981
 982