/* Basic tags */
* {
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
}

body {
  background: #fff url(../images/back.gif) top repeat-x;
  color: #222;
  font: normal 14px Arial, Verdana, Tahoma, Helvetica, Geneva, sans;
}

a {
  color: #456;
}

a:hover {
  color: #693;
}

a span {
  display: none;
}

a img {
  border: 0;
}

input {
  margin-bottom: 8px;
}

blockquote {
  text-align: center;
  font-size: 14px;
  font-style: italic;
  font-weight: bold;
}

pre {
  width: 584px;
  padding: 8px;
  overflow: auto;
  background: #f0f0f0;
}


/* Main Template */

#container {
  width: 940px;
  height: 100%;
  margin: 0 auto;
}

#header  {
  height: 140px;
}

#header #logo {
  display: block;
  float: left;
  width: 200px;
  height: 100px;
  margin-top: 16px;
  background: url(../images/logo.gif) top left no-repeat;
}

#header #top-banner {
  float: right;
  width: 728px;
  height: 90px;
}

#header #toplinks {
  clear: right;
  float: right;
  width: 620px;
  height: 30px;
  margin-top: 16px;
  list-style: none;
}

#header #toplinks li {
  float: left;
  list-style: none;
}

#header #toplinks a {
  display: block;
  float: left;
  width: 99px;
  height: 30px;
  margin-left: 1px;
  background: #796 url(../images/toplinks-back.jpg) top repeat-x;
  text-decoration: none;
}

#header #toplinks a:hover {
  background: #796 url(../images/toplinks-back-hover.jpg) top repeat-x;
}

#header #toplinks a.selected {
  background: #796 url(../images/toplinks-back-hover.jpg) top repeat-x;
}

#header #toplinks span{
  display: block;
  margin-top: 6px;
  text-align: center;
  font-size:15px;
  font-weight: bold;
  color: #fff;
}

#main {
}

#content {
  min-height: 500px;
  _height: 500px;
  padding: 8px;
  background: url(../images/main-back.gif) bottom no-repeat;
}

#footer {
  clear: both;
  margin-top: 8px;
  padding-top: 16px;
  background: url(../images/footer-back.gif) center top no-repeat;
  text-align: center;
  font-size: 12px;
}

#footer ul {
  height: 28px;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#footer li {
  display: inline;
  padding: 4px;
  margin: 2px;
  border: solid 1px #ccc;
  font-weight: bold;
}

/* Content */

#content h2 {
  color: #222;
  font-size: 22px;
  font-weight: normal;
  margin: 12px 0 6px 0;
}

#content h3 {
  color: #222;
  font-size: 18px;
  font-weight: normal;
}

#content a span {
  display: inline;
}

#content p {
  margin-bottom: 8px;
}

#content p.actions {
  width: 50%;
}
#content p.actions a {
  margin: 0 8px;
}

#content ul, #content li {
  margin: 4px;
  padding: 4px;
}

#index-left {
  clear: left;
  float: left;
  width: 500px;
}

#index-right {
  clear: right;
  float: right;
  width: 400px;
  padding-top: 320px;
  background: url(../images/clipart-3d_blocks.png) top no-repeat;
}

#button-download { 
  display: block;
  width: 180px;
  height: 50px;
  margin: 0 auto;
  margin-bottom: 48px;
  background: url(../images/button-download.gif);
}

.button-download-small { 
  display: block;
  width: 32px;
  height: 25px;
  margin: 0 auto;
  background: url(../images/button-download-small.gif);
}

#content #button-download span, #content .button-download-small span { 
  display: none;
}

#download-box{
  float: right; 
  width: 300px; 
  padding: 8px; 
  padding-top: 32px; 
  background: #f6f6f6 url(/images/download_icon.gif) 10px 30px no-repeat;
  border-radius: 8px; 
  -moz-border-radius: 8px; 
  text-align: center;
}

#download-box #button-download {
  margin-bottom: 8px;
}

#download-box .details {
  margin-bottom: 24px;
  font-size: 11px;
}

#download-sources{ 
  width: 800px;
  margin: 8px auto;
  text-align: center;
  font-weight: bold;
}

#download-sources td { 
  padding: 8px;
  border-bottom: solid 1px #ccc;
}


/* Forms */

#content form input.textfield, #content form textarea {
  width: 100%;
}

#signu-up-form input.submit {
  width: 50%;
}

#submit, #blog_title, #user_email {
  width: 100%;
  font-size: 24px;
  color: #333;
}

/* Features */

#features {
  list-style-type: none;
}

#features li {
  display: block; 
  min-height: 70px; 
  _height: 70px;
  padding-left: 70px;
}

#features .feature-visual-interface {
  background: url(../images/features/visual_interface.gif) left no-repeat; 
}

#features .feature-good4all {
  background: url(../images/features/good4all.gif) left no-repeat; 
}

#features .feature-offline-use {
  background: url(../images/features/offline_use.gif) left no-repeat; 
}

#features .feature-no-semantics {
  background: url(../images/features/no_semantics.gif) left no-repeat; 
}

#features .feature-lightweight {
background: url(../images/features/lightweight.gif) left no-repeat; 
}

#features .feature-efficient {
  background: url(../images/features/efficient.gif) left no-repeat; 
}

#features .feature-extensible {
  background: url(../images/features/extensible.gif) left no-repeat; 
}

#features .feature-customizable-interface {
  background: url(../images/features/customizable_interface.gif) left no-repeat; 
}

#features .feature-organized-filing {
  background: url(../images/features/organized_filing.gif) left no-repeat; 
}

#features .feature-fluid-structure {
  background: url(../images/features/fluid_structure.gif) left no-repeat; 
}

#features .feature-standards-compliant {
  background: url(../images/features/standards_compliant.gif) left no-repeat; 
}

#features .feature-se-friendly {
  background: url(../images/features/se_friendly.gif) left no-repeat; 
}

#features .feature-smart-editing {
  background: url(../images/features/smart_editing.gif) left no-repeat; 
}

#features .feature-auto-formatting {
background: url(../images/features/auto_formatting.gif) left no-repeat; 
}

/* Support */

#content-main {
  float: left;
  width: 600px;
}

#content-sidebar {
  float: right;
  width: 250px;
}

#content-sidebar ul {
  list-style-image: url(../images/bullet.gif);
}

#content-footer {
  clear: both;
  text-align: center;
}

.navigation {
  height: 30px;
}

.strike {
  text-decoration: line-through;
}


/* Common styles */ 

.clear {
  clear: both;
}

.outside-link {
  background: url(../images/outside_link.gif) right no-repeat;
  padding-right: 12px;
}

.align-center {
  text-align: center;
}

.align-right { 
  text-align: right;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

.error {
  color: #f00;
  font-weight: bold;
}

.line {
  border:0;
  height: 1px;
  background-color: #796;
}

.line hr {
  display: none;
}

.notes {
  font-size: 12px;
  padding: 32px;
}

#content .notes h3 {
  font-size: 32px;
}

#content .notes blockquote {
  width: 60%;
  margin: 0 auto 8px auto;
}