html body {
  margin: 0;
  padding: 0;
  border: 0;
  color: #333;
  background: url(../images/site/bg_body.gif) #fcfcfc 775px 0 repeat-y;
  font: x-small verdana, helvetica, arial, sans-serif;
  voice-family: "\"}\"";
  voice-family: inherit;
  font-size: small;
}
html>body {
  font-size: small;
}


table, th, tr, td, form {
  margin: 0;
  padding: 0;
  }

#wrapper {
  position: relative;
  width: 775px;
  \width: 776px;
  w\idth: 775px;
  text-align: left;
  border-right: 1px solid #999;
  background: #fff;
  }


#topbanner {
  height: 105px;
  text-align: center;
  background: #369;
  }
#topbanner p {
  margin: 0;
  padding: 10px 0 0 0;
  }


/* Logo section
-----------------------------------------------------*/
#branding {
  height: 85px;
  background: url(../images/site/bg_branding.gif) #fff left top repeat-x;
  }
#branding #logo {
  margin: 0;
  padding: 38px 0 0 10px;
  }
#branding #searchbox {
  position: absolute;
  top: 131px;
  right: 0px;
  margin: 0;
  padding: 0 5px 0 0;
  }


/* Top navigation strip
-----------------------------------------------------*/
#primarynav {
  padding: 0;
  height: 30px;
  font-size: 86%;
  line-height: 100%;
  font-weight: bold;
  color: #69c;
  background: url(../images/site/bg_secondarynav.gif) #69c left top repeat-x;
  }
#topnav {
  margin: 0; 
  padding: 9px 0 0 10px;
  }
#topnav li {
  float: left;
  margin: 0; 
  padding: 0 5px 0 0;
  display: inline;
  list-style-type: square;
  }
#topnav a:link, #topnav a:visited, #topnav a:hover {
  text-decoration: none;
  color: #fff;
  }
#topnav a:hover {
  color: #daeaf8;
  }


/* Second top navigation strip
-----------------------------------------------------*/
#secondarynav {
  margin: 0;
  padding: 0;
  background: url(../images/site/bg_primarynav.gif) #369 left top repeat-x;
  }
#secondarynav p {
  margin: 0;
  padding: 5px 10px;
  font-size: 11px;
  color: #fff;
  font-weight: bold;
}
#secondarynav a {
  color: #fff;
}


/* Main content
-----------------------------------------------------*/
#content1cols {
  margin: 0;
  padding: 0 0 0 0;
  background: #fff;
   }
#content2cols {
  margin: 0 170px 0 0;
  padding: 0 0 0px 0;
  background: #fff;
   }
#content3cols {
  margin: 0 170px 0 130px;
  padding: 0 0 0px 0;
  background: #fff;
   }
.content {
  min-height: 620px;
  height: 620px;
  }
body[class] .content {
  height: auto;
  }
.content h1 {
  margin: 0;
  padding: 0px 10px 15px 10px;
  font-size: 146%;
  line-height: 1.3em;
  color: #333;
  }
.content h2 {
  margin: 0;
  padding: 15px 10px 15px 10px;
  font-size: 110%;
  line-height: 1.3em;
  color: #333;
  }
.content p {
  margin: 0;
  padding: 0 10px 15px 10px;
  font-size: 100%;
  line-height: 1.3em;
  color: #333;
  background: #fff;
  }
.content p.add {
  margin: 0 10px 40px 10px;
  padding: 20px 10px 20px 10px;
  font-size: 100%;
  line-height: 1.3em;
  color: #333;
  text-align: center;
  font-weight: bold;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  background: #fff;
  }
.content p.crumb {
  margin: 0;
  padding: 10px 10px 40px 10px;
  font-size: 68%;
  line-height: 1.6em;
  color: #369;
  }
.content pre {
  margin: 0 10px;
  padding: 0 0 1.6em 0;
  font-size: 88%;
  color: #00f;
  white-space: inherit;
  word-wrap: break-word; /* to make line breaks in ie for the code bits */
  }
.content textarea {
  margin: 0 10px 40px 10px;
  width: 450px;
  height: 70px;
  font: 11px verdana, arial, helvetica, sans-serif;
  }
.content a:link, .content a:visited, .content a:hover {
  color: #369;
  }

/* css tables using floating divs via http://css.nu/articles/table-in-css.html */
.content .table-container {
  width: auto;
  padding: 0 10px;
  background: #fff;
  }
.content .table-row {
  background: #fff; 
  color: #000000;
  margin: 0;
  padding: 0 0 10px 0; 
  width: 100%;
  }

.content .all-code-left-container {
  border: none; 
  float: left; 
  margin: 0; 
  padding: 0; 
  width: 80%; 
  background: red;
  }
.content .all-code-left-container p {
  margin: 0;
  padding: 0;
  }
.content .all-code-right-container {
  float: right; 
  margin: 0; 
  padding: 0; 
  width: 20%;
  text-align: right;
  }
.content .all-code-right-container p {
  margin: 0;
  padding: 0;
  }
.content .space-line {
  clear: both; margin: 0; padding: 0; width: auto;
}

.content .showcase {
  margin: 0 10px; 
  padding: 0;
  background: transparent;
  }
.showcase .table-row {
  background: #fff; 
  margin: 0;
  padding: 0 0 15px 0; 
  width: 625px;
  border-bottom: 1px solid #ccc;
  background: #fff;
  }
.showcase .image {
  border: none; 
  float: left; 
  margin: 0; 
  padding: 15px 0 0 0; 
  width: 120px;
  height: 60px;
  background: #fff;
  }
.showcase .text {
  border: none; 
  float: left; 
  margin: 0; 
  padding: 15px 0 0 0; 
  width: 505px;
  background: #fff;
  }
.showcase .text p {
  margin: 0;
  padding: 0 0 0 20px;
  font-size: 10px;
  line-height: 12px;
  color: #000;
  background: #fff;
  }
.showcase .space-line {
  clear: both;
  margin: 0;
  padding: 0;
  width: auto;
  background: #fff;
  }


.content ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  }
.content li {
  margin: 0;
  padding: 0 10px 0 10px;
  font-size: 100%;
  line-height: 1.6em;
  list-style-type: none;
  }  
.content dl {
  margin: 0;
  padding: 0;
  }
.content dt {
  margin: 0;
  padding: 0 10px 0 10px;
  font-size: 100%;
  line-height: 1.6em;
  font-weight: bold;
  }
.content dd {
  margin: 0;
  padding: 0 10px 10px 10px;
  font-size: 86%;
  line-height: 1.6em;
  }
.content dt.tutorial-jump {
  margin: 0;
  padding: 0 10px 0 10px;
  font-size: 78%;
  line-height: 1.4em;
  font-weight: bold;
  }
.content dd.tutorial-jump {
  margin: 0;
  padding: 0 10px 0 10px;
  font-size: 78%;
  line-height: 1.4em;
  }

.content form {
  margin: 0;
  padding: 0;
  }

.content .textinput {
  width: 350px;
  font: 11px verdana, arial, helvetica, sans-serif;
  color: #000;
  }


/* Left column
-----------------------------------------------------*/
#left {
  position: absolute;
  top: 245px;
  left: 0;
  width: 130px;
  border-top: 1px solid #fff;
  background: #fff;
  }
#left p {
  margin: 0;
  padding: 5px;
  text-align: center;
  background: #fff;
  }


/* Right column
-----------------------------------------------------*/
#right {
  position: absolute;
  top: 245px;
  right: 0;
  width: 170px;
  border-top: 1px solid #fff;
  background: #fff;
  }

#right3cols {
  position: absolute;
  top: 145px;
  right: 0;
  width: 130px;
  border-top: 1px solid #fff;
  background: #fff;
  }

#right h4 {
  margin: 1px 0 0 0;
  padding: 5px 2px;
  font-size: 86%;
  color: #fff;
  text-align: center;
  background: #369;
  }
#right p {
  margin: 0;
  padding: 5px;
  text-align: center;
  background: #fff;
  }
#right a:link, #right a:visited, #right a:hover {
  color: #048;
  }


/* Footer
-----------------------------------------------------*/
#footer {
  clear: both;
  padding: 0 0 10px 0;
  color: #666;
  background: url(../images/site/bg_footernav.gif) #fff left top repeat-x;
  }
#footer p {
  margin: 0;
  padding: 5px 10px 0 10px;
  font-size: 78%;
  line-height: 1.6em
  }
#footer p a:link, #footer p a:visited, #footer p a:hover {
  font-weight: bold;
  color: #666;
  }
#footer p.footernav {
  margin: 0;
  padding: 5px 10px;
  font-size: 78%;
  line-height: 1.6em;
  color: #fff;
  background-color: #6699cc;
  }
#footer p.footernav a:link, #footer p.footernav a:visited, #footer p.footernav a:hover {
  font-weight: bold;
  color: #fff;
  }