[Summary view] [Print] [Text view]

   1  /* Site

   2     -------------------------------- */
   3  
   4  html {
   5      overflow-y: scroll;
   6      background: #5f5f5f url('../images/html_bg.png') repeat-x scroll;
   7  }
   8  
   9  body {
  10      margin: 0;
  11      padding: 0 0 20px;
  12      background: transparent url('../images/body_bg.jpg') no-repeat center top;
  13      min-height: 100%;
  14      /* font-family: "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; */

  15      font-family: "Arial", "Helvetica", "Verdana", "sans-serif";
  16  }
  17  
  18  #wrapper {

  19      margin: 0 auto;
  20      width: 956px;
  21      position: relative;
  22      /* 

  23      background: url('../images/body_footer_bg.jpg') no-repeat center bottom;

  24      padding-bottom: 365px;

  25       */
  26  }
  27  
  28  #banner {

  29      height: 125px;
  30  }
  31  
  32  #content .bg {

  33      opacity: 0;
  34      -moz-opacity: 0;
  35      filter: alpha(opacity=0);
  36  }
  37  
  38  table.layout-grid a.disabled, table.layout-grid a.disabled:hover {
  39      color: #aaa;
  40      cursor: default;
  41      text-decoration: line-through;
  42  }
  43  
  44  div.notice {
  45      background: #FFF1AF;
  46      padding: 3px;
  47      margin-bottom: 5px;
  48      font-size: 12px;
  49      border: 1px solid #EFD500;
  50  }
  51  
  52  
  53  /* Logo

  54     -------------------------------- */
  55  
  56  h1.logo {
  57      position: absolute;
  58      top: 55px;
  59      left: 28px;
  60      margin: 0;
  61  }
  62  
  63  h1.logo,
  64  h1.logo a {
  65      width: 235px;
  66      height: 55px;
  67  }
  68  
  69  h1.logo a {
  70      display: block;
  71      background: url('../images/logo.gif') no-repeat;
  72  }
  73  
  74  h1.logo a span {
  75      display: none;
  76  }
  77  
  78  /* Navigation

  79     -------------------------------- */
  80  
  81  #navigation {

  82      height: 41px;
  83      float: left;
  84      position: absolute;
  85      top: 62px;
  86      right: 0px;
  87  }
  88  
  89  #navigation .left {

  90      float: left;
  91      width: 5px;
  92      height: 41px;
  93      /* background: url('/images/navigation.png') no-repeat left top; */

  94      background: url('/images/navigation_l.png') no-repeat left top;
  95  }
  96  
  97  #ie6 #navigation .left {

  98      background: transparent none;
  99      filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/navigation_l.png', sizingMethod='scale');
 100      zoom: 1;
 101  }
 102  
 103  #navigation .right {

 104      float: left;
 105      width: 3px;
 106      height: 41px;
 107      background: url('/images/navigation.png') no-repeat right top;
 108  }
 109  
 110  #navigation ul,

 111  #navigation ul li {

 112      float: left;
 113      list-style-type: none;
 114      margin: 0;
 115      padding: 0;
 116      font-size: 13px;
 117      line-height: 38px;
 118  }
 119  
 120  #navigation ul {

 121      height: 41px;
 122      background: url('/images/navigation.png') repeat-x 0 -41px;
 123  }
 124  
 125  #navigation ul li a {

 126      float: left;
 127      display: block;
 128      height: 41px;
 129      padding: 0 18px;
 130      color: #ccc;
 131      text-decoration: none;
 132      background: url('/images/navigation_s.png') no-repeat right top;
 133  }
 134  
 135  #navigation ul li.selected a {

 136      color: #fff;
 137  }
 138  
 139  #navigation ul li.last a{

 140      background-image: none;
 141  }
 142  
 143  #navigation ul li a:hover {

 144      color: #fff;
 145  }
 146  
 147  
 148  /* Dock

 149     -------------------------------- */
 150  
 151  #dock {

 152      height: 25px;
 153      float: left;
 154      position: absolute;
 155      top: 0;
 156      right: 2px;
 157  }
 158  
 159  #dock .left {

 160      float: left;
 161      width: 3px;
 162      height: 25px;
 163      background: url('../images/dock.png') no-repeat left top;
 164  }
 165  
 166  #dock .right {

 167      float: left;
 168      width: 3px;
 169      height: 25px;
 170      background: url('../images/dock.png') no-repeat right top;
 171  }
 172  
 173  #dock ul,

 174  #dock ul li {

 175      float: left;
 176      list-style-type: none;
 177      margin: 0;
 178      padding: 0;
 179  }
 180  
 181  #dock ul {

 182      padding: 0 6px;
 183      height: 25px;
 184      background-color: #000;
 185  }
 186  
 187  #dock ul li {

 188      padding: 0 6px;
 189      position: relative;
 190  }
 191  
 192  #dock ul li a {

 193      float: left;
 194      display: block;
 195      padding: 0 5px;
 196      color: #ccc;
 197      text-decoration: none;
 198      font-size: 12px;
 199      line-height: 22px;
 200  }
 201  
 202  #dock ul li a:hover,

 203  #dock ul li.selected a {

 204      color: #fff;
 205      border-bottom: 2px solid #ff9c08;
 206  }
 207  
 208  #dock ul li.selected a {

 209      font-weight: bold;
 210  }
 211  
 212  
 213  /* Navigation

 214     -------------------------------- */
 215  
 216  #navigation {

 217      height: 41px;
 218      float: left;
 219      position: absolute;
 220      top: 62px;
 221      right: 0px;
 222  }
 223  
 224  #navigation .left {

 225      float: left;
 226      width: 5px;
 227      height: 41px;
 228      /* background: url('../images/navigation.png') no-repeat left top; */

 229      background: url('../images/navigation_l.png') no-repeat left top;
 230  }
 231  
 232  #ie6 #navigation .left {

 233      background: transparent none;
 234      filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/navigation_l.png', sizingMethod='scale');
 235      zoom: 1;
 236  }
 237  
 238  #navigation .right {

 239      float: left;
 240      width: 3px;
 241      height: 41px;
 242      background: url('../images/navigation.png') no-repeat right top;
 243  }
 244  
 245  #navigation ul,

 246  #navigation ul li {

 247      float: left;
 248      list-style-type: none;
 249      margin: 0;
 250      padding: 0;
 251      font-size: 13px;
 252      line-height: 38px;
 253  }
 254  
 255  #navigation ul {

 256      height: 41px;
 257      background: url('../images/navigation.png') repeat-x 0 -41px;
 258  }
 259  
 260  #navigation ul li a {

 261      float: left;
 262      display: block;
 263      height: 41px;
 264      padding: 0 18px;
 265      color: #ccc;
 266      text-decoration: none;
 267      background: url('../images/navigation_s.png') no-repeat right top;
 268  }
 269  
 270  #navigation ul li.selected a {

 271      color: #fff;
 272  }
 273  
 274  #navigation ul li.last a{

 275      background-image: none;
 276  }
 277  
 278  #navigation ul li a:hover {

 279      color: #fff;
 280  }
 281  
 282  
 283  /* Content

 284     -------------------------------- */
 285  
 286  #content-wrapper {

 287      background: #FFF url('../images/content_bg.png') repeat-y 0 0;
 288  }
 289  
 290  #content {

 291      background: url('../images/content_body_bg.png') no-repeat 0 13px;
 292      zoom: 1;
 293  }
 294  
 295  .content-top {
 296      font-size: 1px;
 297      height: 13px;
 298      background: url('../images/content_top_bg.png');
 299  }
 300  
 301  .content {
 302      padding: 0 3px 0 3px;
 303      overflow: hidden;
 304  }
 305  
 306  #content .content {

 307      min-height: 380px;
 308      background: url('../images/dot.png') repeat-y 203px 0;
 309  }
 310  
 311  #home #content .content,

 312  #download #content .content,

 313  #demos #content .content {

 314      background: none;
 315  }
 316  
 317  #ie6 #content .content {

 318      height: 380px;
 319      overflow-y: visible;
 320  }
 321  
 322  /* Layout */

 323  
 324  .content-head {
 325      height: 74px;
 326      border-bottom: 1px solid #ccc;
 327      background-color: #fff;
 328  }
 329  
 330  .content-head h2 {
 331      float: left;
 332      margin: 0;
 333      padding: 20px 0 20px 24px;
 334      color: #ff9c08;
 335      font: normal 29px/30px "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif";
 336      letter-spacing: .5px;
 337  }
 338  
 339  .content-head h2 span {
 340      padding-right: 16px;
 341      border-right: 1px solid #ccc;
 342  }
 343  
 344  .content-head p {
 345      margin: 0;
 346      padding: 28px 0 0 12px;
 347      float: left;
 348      font: normal 15px "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif";
 349      letter-spacing: .5px;
 350  }
 351  
 352  
 353  /* Layout

 354     -------------------------------- */
 355  
 356  .themes {
 357      background: url('../images/themes_bg.png') repeat-x scroll 0 -1px;
 358  }
 359  
 360  
 361  /* Layout

 362     -------------------------------- */
 363  
 364  .layout-grid {
 365      width: 100%;
 366  }
 367  
 368  .layout-grid td {
 369      vertical-align: top;
 370  }
 371  
 372  .layout-grid td.home {
 373      background: url('../images/home_bg.jpg') no-repeat scroll right top;
 374      height: 412px;
 375      padding: 0 600px 0 24px;
 376  }
 377  
 378  .layout-grid td.left-nav {
 379      width: 200px;
 380  }
 381  
 382  .layout-grid td.normal {
 383      border-left: 1px solid #ccc;
 384      padding: 20px 24px;
 385      font-family:  "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif";
 386  }
 387  
 388  .layout-grid td.demos {
 389      background: url('../images/demos_bg.jpg') no-repeat;
 390      height: 337px;
 391      overflow: hidden;
 392  }
 393  
 394  .layout-grid td.download {
 395      background: url('../images/demos_bg.jpg') no-repeat;
 396      height: 337px;
 397  }
 398  
 399  
 400  /* Home

 401     -------------------------------- */
 402  
 403  .home h3 {
 404      margin: 0;
 405      padding: 17px 0 11px 0;
 406      color: #ff9c08;
 407      font: normal 30px "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif";
 408      letter-spacing: .5px;
 409  }
 410  
 411  .home p.large {
 412      padding-bottom: 15px;
 413      color: #000;
 414      font: bold 13px/19px "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif";
 415      letter-spacing: .2px;
 416      line-height: 16px;
 417  }
 418  
 419  .home p {
 420      margin: 0;
 421      padding-bottom: 14px;
 422      color: #333;
 423      font: normal 11px/14px 'Trebuchet MS', 'Arial', 'Helvetica', sans-serif;
 424  }
 425  
 426  .teaserbox {
 427      position: absolute;
 428      top: 265px;
 429      left: 452px;
 430      width: 450px;
 431  }
 432  
 433  .teaserbox ul {
 434      list-style-type: square;    
 435  }
 436  
 437  .teaserbox p {
 438      margin: 5px;
 439      padding: 0px;
 440  }
 441  
 442  .teaserbox h4 {
 443      margin-bottom: 0px;
 444      position: relative;
 445      left: 1px;
 446      top: 1px;
 447      color: #fff;
 448  }
 449  
 450  .teaserbox h4 span {
 451      position: absolute;
 452      top: -1px;
 453      left: -1px;
 454      color: #000;
 455  }
 456  
 457  
 458  /* Side Menu

 459     -------------------------------- */
 460  
 461  .section {
 462      padding: 24px 23px 8px 22px;
 463      border-bottom: 1px dashed #ccc;
 464  }
 465  
 466  
 467  
 468  ul.side-menu,
 469  ul.side-menu li,
 470  p.side-menu-title {
 471      list-style-type: none;
 472      margin: 0;
 473      padding: 0;
 474      letter-spacing: 0.75pt;
 475  }
 476  
 477  ul.side-menu li a {
 478      font: normal 11px 'Arial', 'Helvetica', sans-serif;
 479      text-decoration: none;
 480      color: #000;
 481  }
 482  
 483  ul.side-menu li a:hover {
 484      color: #e87b10;
 485  }
 486  
 487  p.side-menu-title {
 488      font: bold 15px 'Arial', 'Helvetica', sans-serif;
 489      color: #e87b10;
 490  }
 491  
 492  ul.side-menu {
 493      padding: 5px 2px 0;
 494  }
 495  
 496  
 497  /* Normal

 498     -------------------------------- */
 499  
 500  .normal h3,
 501  .normal h4 {
 502      margin: 0;
 503      font-weight: normal;
 504  }
 505  
 506  .normal h3 {
 507      padding: 0 0 9px;
 508  }
 509  
 510  .normal h4 {
 511      padding-bottom: 21px;
 512      border-bottom: 1px dashed #999;
 513      font-size: 12px;
 514      font-weight: bold;
 515  }
 516  
 517  .normal .pull-quote {
 518      padding: 6px 0;
 519      line-height: 20px;
 520      text-transform: uppercase;
 521      font-size: 12px;
 522  }
 523  
 524  .normal p {
 525      font-size: 12px;
 526  }
 527  
 528  
 529  /* Download

 530     -------------------------------- */
 531  
 532  td.download {
 533      /*height: 650px !important;*/

 534  }
 535  
 536  .download .click-to-download {
 537      position: relative;
 538      margin: 61px 3px 0;
 539      padding: 0 19px;
 540      background: url('../images/download-top.gif') no-repeat left top;
 541      width: 270px;
 542      height: 226px;
 543      float: left;
 544      font-family:  "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif";
 545  }
 546  
 547  .download .click-to-download .bg-footer,
 548  .download .click-to-download .bg {
 549      position: absolute;
 550      bottom: 0;
 551      left: 0;
 552      width: 308px;
 553      height: 102px;
 554      background: url('../images/download-bottom.png') no-repeat left top;
 555  }
 556  
 557  .download .click-to-download .bg {
 558      background-position: left bottom;
 559  }
 560  
 561  .download .click-to-download h3 {
 562      margin: 0;
 563      padding: 14px 0 10px;
 564      font-weight: normal;
 565      font-size: 21px;
 566  }
 567  
 568  .download .click-to-download h3 span {
 569      font-size: 10px;
 570  }
 571  
 572  .download .click-to-download p {
 573      margin: 0;
 574      padding: 12px 0 0;
 575      font-size: 12px;
 576  }
 577  
 578  .download .click-to-download a.download {
 579      display: block;
 580      position: absolute;
 581      left: 65px;
 582      top: 136px;
 583      height: 38px !important;
 584      width: 240px;
 585      font-size: 16px;
 586      font-weight: bold;
 587  }
 588  
 589  .download .click-to-download a.download:link {
 590      color: #333;
 591      text-decoration: none;
 592  }
 593  
 594  .download .click-to-download a.download:visited {
 595      color: #333;
 596      text-decoration: none;
 597  }
 598  
 599  .download .builder {
 600      position: absolute;
 601      top: 475px;
 602      right: 16px;
 603      width: 612px;
 604      font-family:  "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif";
 605      font-size: 12px;
 606      opacity: 0;
 607      filter: alpha(opacity=0);
 608  }
 609  
 610  .download .builder h3 {
 611      margin: 0;
 612      padding: 5px 10px 10px;
 613      font-weight: normal;
 614      font-size: 21px;
 615  }
 616  
 617  .download .builder p {
 618      margin: 0;
 619      padding: 0 0 0 12px;
 620      font-size: 12px;
 621  }
 622  
 623  .download .builder .top {
 624      height: 8px;
 625      background-image: url('../images/builder_top.png');
 626  }
 627  
 628  .download .builder .bottom {
 629      height: 8px;
 630      background-image: url('../images/builder_bottom.png');
 631  }
 632  
 633  .download .builder .content {
 634      background-image: url('../images/builder_bg.png');
 635  }
 636  
 637  .download .p {
 638      padding: 5px 10px 10px;
 639  }
 640  
 641  .components-list {
 642      font-size: 12px;
 643  }
 644  
 645  .components-list table {
 646      width: 100%;
 647  }
 648  
 649  .components-list th,
 650  .components-list td {
 651      text-align: left;
 652      vertical-align: middle !important;
 653      padding: 3px;
 654  }
 655  
 656  .components-list th {
 657      line-height: 22px;
 658      padding: 0 0 4px 2px;
 659      cursor: default;
 660  }
 661  
 662  .components-list label {
 663      padding-left: 5px;
 664  }
 665  
 666  .list-section {
 667      border-bottom: 1px dashed #bbb;
 668      background: #EAEAEA;
 669      padding: 10px 10px 10px 10px;
 670      width: 715px;
 671      line-height: 18px;
 672  }
 673  
 674  .list-padding {
 675      padding: 5px;
 676      line-height: 18px;
 677  }
 678  
 679  .list-component {
 680      background-color: #F4F4F4;
 681  }
 682  
 683  .list-component-selected {
 684      font-weight: bold;
 685  }
 686  
 687  .text-bg-up,
 688  .text-bg-down {
 689      background:#FFFFFF url(../images/text-bg-up.gif) repeat-x scroll 0pt;
 690      background-position:0px 0px;
 691  }
 692  
 693  .text-bg-down { background:#FFFFFF url(../images/text-bg-down.gif) repeat-x scroll 0pt !important; }
 694  
 695  .ui-transparent {
 696      opacity:0;
 697      filter:Alpha(Opacity=0);
 698  }
 699  .text-align-right {
 700      text-align: right !important;
 701  }
 702  .text-align-left {
 703      text-align: left !important;
 704  }
 705  .text-align-center {
 706      text-align: center !important;
 707  }
 708  .label-files {
 709      background: url(../images/group.png) no-repeat;
 710      padding-left: 19px;
 711      line-height: 20px;
 712      cursor: pointer;
 713  }
 714  
 715  .download #total-size {
 716      width: 160px;
 717      margin-left: 90px;
 718      text-align: right;
 719  }
 720  
 721  .big {
 722      font-size: 13px;
 723      font-weight: bold;
 724  }
 725  
 726  .title-big {
 727      font-size: 14px;
 728      font-weight: bold;
 729      letter-spacing: .3px;
 730  }
 731  
 732  
 733  /* Launch Pad

 734     -------------------------------- */
 735  
 736  #launch-pad {

 737      height: 127px;
 738      overflow: hidden;
 739      background: url('../images/launch-pad_bg.png') repeat-y center top;
 740      padding: 11px 0px 11px 16px;
 741  }
 742  
 743  #launch-pad .launch-pad-button {

 744      float: left;
 745      width: 255px;
 746      height: 106px;
 747      background: url('../images/launch-pad_button.png') no-repeat;
 748      padding: 21px 22px 0 23px;
 749      margin: 0 6px;
 750      cursor: pointer;
 751      cursor: hand;
 752      position: relative;
 753  }
 754  
 755  #ie6 #launch-pad .launch-pad-button {

 756      height: 106px;
 757  }
 758  
 759  #launch-pad .launch-pad-button .bg {

 760      position: absolute;
 761      top: 0;
 762      left: 0;
 763      width: 310px;
 764      height: 127px;
 765      background: url('../images/launch-pad_button.png') no-repeat left bottom;
 766  }
 767  
 768  #launch-pad .launch-pad-button h3,

 769  #launch-pad .launch-pad-button p {

 770      position: relative;
 771  }
 772  
 773  #launch-pad .launch-pad-button.left {

 774      margin-left: 0;
 775  }
 776  
 777  #launch-pad .launch-pad-button.right {

 778      margin-right: 0;
 779  }
 780  
 781  #launch-pad .launch-pad-button h3 {

 782      margin: 0;
 783      padding: 0 0 4px;
 784      color: #ff9c08;
 785      font: normal 18px 'Arial', 'Helvetica', sans-serif;
 786      letter-spacing: .8px
 787  }
 788  
 789  #launch-pad .launch-pad-button h3 a,

 790  #launch-pad .launch-pad-button h3 a:hover {

 791      color: #ff9c08;
 792      text-decoration: none;
 793  }
 794  
 795  #launch-pad .launch-pad-button p {

 796      margin: 0;
 797      padding: 0 2px;
 798      color: #cbcbcb;
 799      font: normal 11px/15px 'Arial', 'Helvetica', sans-serif;
 800      letter-spacing: .2px;
 801  }
 802  
 803  
 804  /* Footer

 805     -------------------------------- */
 806  
 807  #footer {

 808      height: 45px;
 809      padding: 10px 0;
 810      position: relative;
 811  }
 812  
 813  #footer .inner {

 814      position: relative;
 815      z-index: 2;
 816  }
 817  
 818  #ie6 #footer .inner {

 819      zoom: 1;
 820  }
 821  
 822  #footer .bg {

 823      background: url('../images/footer_bg.png') no-repeat left top;
 824      width: 100%;
 825      height: 65px;
 826      position: absolute;
 827      top: 0;
 828      left: 0;
 829      z-index: 1;
 830  }
 831  
 832  #ie6 #footer .bg {

 833      background: transparent none;
 834      filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/footer_bg.png', sizingMethod='scale');
 835      zoom: 1;
 836  }
 837  
 838  #footer p {

 839      margin: 0;
 840      padding: 0;
 841      color: #5e5e5e;
 842      font: normal 9px 'Arial', 'Helvetica', sans-serif;
 843      text-transform: uppercase;
 844  }
 845  
 846  #footer p a {

 847      color: #bbb;
 848  }
 849  
 850  #footer span.first {

 851      display: block;
 852      float: left;
 853      padding: 6px 0 0 16px;
 854  }
 855  
 856  #footer .block {

 857      display: block;
 858      float: left;
 859  }
 860  
 861  #footer .block span,

 862  #footer span.empty {

 863      display: none;
 864  }
 865  
 866  #footer .liferay {

 867      margin: 3px 22px 0px 3px;
 868      background: url('../images/icon_liferay.gif');
 869      width: 98px;
 870      height: 22px;
 871      border: 0;
 872  }
 873  
 874  #footer .adobe {

 875      margin: 2px 0 0 0;
 876      background: url('../images/icon_adobe.png');
 877      width: 28px;
 878      height: 28px;
 879  }
 880  
 881  /* Demoflow

 882     -------------------------------- */
 883  
 884  div.demoflow-button-left {
 885      position: absolute;
 886      left: -3px;
 887      top: 371px;
 888      background: url('../images/demos_arrows.png') no-repeat left top;
 889      width: 52px;
 890      height: 45px;
 891      cursor: pointer; cursor: hand;
 892      z-index: 999;
 893  }
 894  
 895  div.demoflow-button-left .bg {
 896      background: url('../images/demos_arrows.png') no-repeat left bottom;
 897      width: 52px;
 898      height: 45px;
 899      position: absolute;
 900      top: 0;
 901      left: 0;
 902  }
 903  
 904  div.demoflow-button-right {
 905      position: absolute;
 906      right: -4px;
 907      top: 371px;
 908      background: url('../images/demos_arrows.png') no-repeat right top;
 909      width: 52px;
 910      height: 45px;
 911      cursor: pointer; cursor: hand;
 912      z-index: 999;
 913  }
 914  
 915  div.demoflow-button-right .bg {
 916      position: absolute;
 917      left: 0;
 918      top: 0;
 919      background: url('../images/demos_arrows.png') no-repeat right bottom;
 920      width: 52px;
 921      height: 45px;
 922  }
 923  
 924  .demoflow {
 925      position: relative;
 926      top: 22px;
 927      left: 0;
 928      width: 950px;
 929      height: 337px;
 930  }
 931  
 932  .demoflow div {
 933      float: left;
 934      height: 100px;
 935      width: 75px;
 936      cursor: pointer; cursor: hand;
 937  }
 938  
 939  .ie .demoflow div {
 940      zoom: 1;
 941  }
 942  
 943  .demoflow div {
 944      border: 1px solid #666;
 945  }
 946  
 947  
 948  .demoflow div:hover {
 949      border: 1px solid #666;
 950      /*opacity: 1 !important;*/

 951  }
 952  
 953  .demoflow div img {
 954      height: 100%;
 955      width: 100%;
 956  }
 957  
 958  .demoflow div.shadow {
 959      height: 100%;
 960      width: 100%;
 961      position: absolute;
 962      top: 0px;
 963      left: 0px;
 964      background-color: black;
 965  }
 966  
 967  .ie .demoflow div.shadow {
 968      display: none;
 969  }
 970  
 971  /* Functional Demos */

 972  
 973  #links {

 974      float:left;
 975      width:155px;
 976      font-size: 13px;
 977  }
 978  
 979  #functional ul {

 980      list-style: none;
 981      padding: 0;
 982      margin: 0;
 983  }
 984  
 985  #functional #links ul {

 986    margin-top:10px;
 987    line-height:1.2em;
 988  }
 989  
 990  #functional #links ul li a{

 991      border-bottom: 1px solid #F4F4F4;
 992      display:block;
 993      padding: 3px 3px 3px 12px;
 994      font-size: 95%;
 995      text-decoration: none;
 996      color: #000;
 997      height: 15px;
 998  }
 999  
1000  #functional #links ul li a:hover,

1001  #functional #links ul li a:focus {

1002      background: #EAEAEA;
1003      border-color: #BBBBBB;
1004  }
1005  
1006  /* About */

1007  
1008  div.about ul {
1009      list-style-type: square;
1010      margin-bottom: 50px;
1011  }
1012  
1013  div.about ul li h5 {
1014      font-size: 16px;
1015      margin-bottom: 10px;
1016  }
1017  
1018  div.about ul li a:link, div.about ul li a:visited {
1019      text-decoration: none;
1020      color: #666;
1021  }
1022  
1023  div.about ul li a:hover {
1024      color: #000;
1025  }
1026  
1027  div.about ul li p {
1028      padding-right: 40px;
1029      padding-left: 20px;
1030  }