body {
font-family: arial, sans-serif;
background-color:#fff;
font-size: small;
margin: 24px 8px 8px;
color:#000;
}

#wrapper{
width:100%;
}

/* ########## PAGE LAYOUT ########## */

#header {
  position: relative;
height:50px;
margin:0 0 11px;
}

#pagecontent{
padding-bottom:5em;
border-left:1px dotted silver;
margin:0 0 0 169px;
}

#footer{
  height: 55px;
  padding-top: 20px;
clear:both;
}

#sidenav {
float:left;
width:160px;
margin:0 ;
background:#fff;
padding:0;
left:0;
}

/* ########## END PAGE LAYOUT ########## */

/* ########## SIDE NAV ########## */

#sidenav ul{
padding:0;
margin:0 0 1em 0;
}

#sidenav ul li ul{
padding:0;
margin:0 0 1em .6em;
}

#sidenav ul li{
list-style:none;
padding:0;
margin:.4em 0 0 0;
}

#sidenav p {
margin: 0 .3em 0 0;
padding:1em 0 0 0;
}

#sidenav ul li a, #sidenav ul ul li a, #sidenav ul ul ul li a{
  color: #0000cc;
display:block;
width:92%;
height:100%;
padding:0;
}

#sidenav ul li a:hover{
  color: #0000cc;
}

#sidenav h1{
font-weight:bold;
font-size:100%;
color:#000;
position:relative;
background-color:#fff;
border:none;
margin:0;
padding:0 2px 0 2px;
width:100%;
left:-2px;
}

#sidenav .top{margin-top:0;}

.other{  /* little box for side nav */
border-top:thin dotted #bbb;
border-bottom:thin dotted #bbb;
margin:3em 0 3em 0;
padding: 0 0 10px 0;
}

.line{  /* dotted line for division */
border-top:thin dotted #bbb;
margin:1em 0 0 0;
padding:0;
height:5px;
}

/* Search box */

#sidenav div#search {
  margin-top: 2em;
}

#sidenav div#search .header {
  font-weight: bold;
  font-size: 90%;
  margin-bottom: 1px;
}

#sidenav div#search .button {
  margin-top: 1px;
}

#sidenav div#search .input input {
  width: 125px;
}

/* ########## END SIDE NAV ########## */

/* ########## OTHER ELEMENTS ########## */

#logo{  /* in header */
float:left;
width: 175px;
top:-5px;
  left:0;
padding:0;
margin:0;
position:absolute;
}

#logo img{
border:none;
margin:0;
}

#doc_title{  /* in header */
font-size:large;
font-weight:bold;
border-top: 1px solid;
background-color: #e5ecf9;
border-color: #3366CC;
margin:5px 0 0 174px;
padding:1px 0 1px 3px;
}

#page_title{
font-size:large;
font-weight:bold;
background-color: #fff;
border: 0; 
margin:5px 0 5px 10px;
padding-left:0;
border-bottom: none;
}

.sidebox{
width:20em;
margin: 20px 0 0 22px;
padding:0 0 1em 0;
border-left:thin dotted #bbb;
float:right;
clear:right;
position:relative;
background-color:#fff;
} 

.sidebox h2 {
font-size:110%;
font-weight:bold;
background-color: #e5ecf9;
border-color: #3366CC;
margin: 0 5px 0 4%;
padding:.1em 3px .1em 5px;
border:none;
}

.sidebox p {
margin: 0 0 0 25px;
padding:1em 0 0 0;
}

#footerlogo{  /* in footer */
position: absolute;
width: 175px;
padding:0;
margin:0;
left:10px;
}

#copyright {  /* in footer */
text-align: center;
margin:0px 0 0 175px;
padding-top:30px;
}

/* ########## END OTHER ELEMENTS ########## */

/* ########## HYPERLINKS ########## */

a{
  color: #0000cc;
}

a:active {
  color: #cc0000;
  text-decoration:none;
}

a:visited {
  color: #551a8b;
}

.backtotop{
float:right;
clear:both;
margin: 1.5em 0 1em 4em;
position:relative;
padding:0;
font-size:x-small;
}

.linkbox a{
font-size:100%;
font-weight:bold;
border:1px solid;
padding: 5px 10px 7px 10px;
background-color: #e5ecf9;
border-color: #3366CC;
}

.linkbox{
margin: 1em 25px 1em 25px;
padding: 5px 10px 7px 0;
}

.anchor, .anchor:hover, .anchor:active, .anchor:visited{
color:#000000;
}

/* ########## END HYPERLINKS ########## */

/* ########## FONT FORMATS ########## */

h1, h2, h3, h4, h5 {
font-weight:bold;
margin-bottom:0;
}

h2, h3, h4, h5 {
margin-left:25px;
}

h1 {
font-size:130%;
margin:2em 0 0 10px; 
padding:0 3px 0 3px;
border-top: 1px solid;
background-color: #e5ecf9;
border-color: #3366CC;
}

h2 {
font-size:120%;
margin-top:1.5em;
border-bottom: 1px solid;
border-color: #3366CC;
}

h3 {
font-size:110%;
margin-top:.7em;
position:relative;
left:0;
top:.7em;
z-index:5; /*to avoid falling behind other elements due to lowered position*/
}

h4 {
margin-top:.5em;
font-size:100%;
font-weight:bold;
position:relative;
left:0;
top:.8em;
z-index:5; /*to avoid falling behind other elements due to lowered position*/
}

h5 {
margin-top:.4em;
font-size:100%;
font-weight:100;
font-style:italic;
text-decoration:underline;
position:relative;
left:0;
top:.8em;
z-index:5; /*to avoid falling behind other elements due to lowered position*/
}

p {
margin: 1em 0 0 25px;
padding:0;
}

ol, ul, dl{
padding-top:.5em;
margin-top:0;
margin-bottom:0;
}

li ol, li ul{
padding:.1em 0 0 0;
margin:0;
}

li{
 margin: .4em 0 0 1.5em;
padding:0;
}

dt{  
font-weight:bold;
margin:.75em 0 0 25px;
padding:0;
}

dd{
margin: .4em 0 0 4em;
padding:0;
font-weight:normal;
}

ul li p, ol li p{
margin: 0;
padding:.4em 0 0 0;
font-weight:normal;
}

.listhead li{
font-weight:bold;
margin:.75em 0 0 1.5em;
}

.listhead li p{
font-weight:normal;
margin: 0;
}

ol.alpha{list-style:lower-alpha;}
ol.alphacap{list-style:upper-alpha;}
ol.roman{list-style:lower-roman;}
ol.romancap{list-style:upper-roman;}

.nolist{list-style: none;}
.nolist li{margin-left: 0;}

.new{
font-size:inherit;
font-weight:bold;
color:#FF0000;
text-decoration:none;
}

.trail{
list-style:none;
margin-left: 174px;
padding:3px 0 0 3px;
}

.trail li{
display:inline;
padding:0 0 0 0;
margin:0;
}

code{
font-family: "Courier New", Courier, monospace;
font-size: 100%;
}

.code li{ 
font-family: "Courier New", Courier, monospace;
font-size: 100%;
margin-top:.75em;
}

.code li p{
font-family:Arial, Helvetica, sans-serif;
font-size: 100%;
margin: 0;
}

.alert {
  border: 1px solid;
  padding: .9em;
  margin: 1em 0 1em 25px;
  background-color: #e5ecf9;
  border-color: #3366CC;
}

.alert p{padding:0; margin:0;}

.note {
padding:.2em .5em .2em .9em;
margin: 1em 0 0 25px;
background-color: #efefef;
border-top: #aaa 1px solid; 
border-bottom: #aaa 1px solid; 
}

.caution{
padding:.2em .5em .2em .9em;
margin: 1em 0 0 25px;
background-color: #efefef;
border-top: #ffcc33 1px solid;  
border-bottom: #ffcc33 1px solid; 
}

.warning{
padding:.2em .5em .2em .9em;
margin: 1em 0 0 25px;
background-color: #efefef;
border-top: #aa0033 1px solid;  
border-bottom: #aa0033 1px solid; 
}

.warning b, .warning em{
color:#aa0033;
}

ul li p.note, ul li p.warning, ul li p.caution,
ol li p.note, ol li p.warning, ol li p.caution{
margin: .8em 0 0 0;
padding:.2em .5em .2em .9em;
background-color: #efefef;
border-top: #ccc 1px solid; 
}

.sidebox .note, .sidebox .caution, .sidebox .warning{
padding:.2em .5em .2em .7em;
margin: 1em 0 0 25px;
}

.notice {
padding:.5em;
margin: 1em 0 0 25px;
background-color: #efefef;
border-top: #fff; 
}

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

form {
padding:0;
margin:2em 0 0 0;
}

pre {
background-color: #eee;
border: 1px solid #bbb;
color: #000000;
font-family: "Courier New", Courier, monospace;
font-size: 100%;
margin: 1em 0 0 25px;
padding: .9em;
text-align:left;
overflow: auto;
}

li pre{
margin: 1em 0 0 0;
padding: .9em;
}

blockquote {
text-align:justify;
padding:10px 20px 5px 20px;
margin:1em 90px 0 70px;
}

.sidebox blockquote {
padding:15px 20px 0 20px;
margin:5px 20px 5px 20px;
}

#date{
text-align:left;
margin: 3em 0 0 1.5em;
padding:0;
font-style:italic;
font-size:x-small;
}

/* ########## END FONT FORMATS ########## */

/* ########## TOC ########## */

ol.toc, div.toc ol{
  margin:1.5em 0 0 25px;
  padding:0;
  list-style:none;
}

ol.toc li, div.toc ol li{
  font-weight:bold;
  margin:.5em 0 0 1.5em;
  padding:0;
}

ol.toc li ol, div.toc ol li ol{
margin:0;
padding:0;
}

ol.toc li ol li, div.toc ol li ol li{
  padding:0;
  margin:.1em 0 0 1em;
  font-weight:normal;
  list-style:none;
}

table ol.toc{
margin-left:0;
}

/* ########## END TOC ########## */

/* ########## TABLES ########## */

table {
border: 1px solid;
border-color: #3366CC;
border-spacing:0;
margin: 1em 0 0 26px;
border-collapse:collapse;
clear:right;
}

th {
font-weight:bold;
text-align:left;
margin-left:3%;
border: 1px solid #3366CC;
text-align: left;
padding: 6px 6px 6px 12px;
background-color: #e5ecf9;
}

td {
border: 1px solid #3366CC; 
background: #fff;
text-align:left;
margin-left:3%;
padding: 6px 6px 6px 12px;
vertical-align:top;
}

td.alt {
background: #eee;
}

.columns {
border: none;
margin-top:0;
margin-bottom:0;
margin-left:0;
/* margin-right omitted to avoid IE6 bug */
}

.columns td{
border: none; 
padding:0 0 0 25px;
}

td p, td ul, td ol, td dl,
td h1, td h2, td h3, td h4, td h5 {
margin-left: 0;
}

/* ########## END TABLES ########## */

/* ######### (INDEX) UPDATES SECTION ########### */

table#updates {
border:none;
padding:0;
}

table#updates td {
border:none;
padding:0;
margin:0;
}

table#updates div.section {
border-top: 1px dotted silver;
margin:1em 0 0 0;
padding:5px 0 0 0;
}

table#updates h2 {
border:none;
margin:0 0 .5em 0;
padding:0;
}

#updates .title {
font-size:medium;
margin:0;
}

/* ------ blog feed section ------ */

#updates div.entry {
margin:0 0 1.5em 0;
}

#updates div.author {
color:#999;
margin:0 0 .5em 0;
}

#updates .subscribe a, #updates .subscribe a:visited {
float:right;
color:#BB4900;
text-decoration:none;
}

#pagecontent #updates .subscribe a img {
border:none;
margin:0;
padding:0;
vertical-align:middle;
}

#updates subscribe a span {
color:#BB4900;
text-decoration:underline;
}

/* ------ examples section ------ */

#updates #featuredsection {
padding:0 0 0 40px;
}

#updates .project {
margin-bottom:1.5em;
width:330px;
}

#updates .project .screenshot {
float:left;
margin:0 10px 0 0;
padding:0;
}

#pagecontent #updates .project .screenshot img {
border:1px solid;
width:130px;
height:108px;
margin:0;
}

#updates .info {
margin:0 0 0 140px;
padding:0;
}

#updates .project:after {
clear:both;
content:".";
display:block;
height:0pt;
visibility:hidden;
}

#updates p.snippet {
padding:0;
margin:0;
}

#updates p.apis {
padding:0;
margin:.5em 0 0 0;
}

#updates .info ul {
padding:0;
margin:0;
}

#updates .info li {
list-style:none;
padding:0 0 0 1em;
margin:0;
}

/* ######### SECONDARY NAV ######### */

#secondnav {
margin:20px 0 0 10px;
padding:0;
}

#secondnav table {
border-top:none;
border-left:none;
border-right:none;
border-bottom:solid 4px #C3D9FF;
margin:0;
padding:0;
}

#secondnav th {
background-color:#e5ecf9;
font-weight:bold;
margin:0;
padding:0;
text-align:center;
border:0;
border-collapse: collapse;
}

#secondnav td {
border:0;
border-collapse: collapse;
padding:0;
margin:0;
}

#secondnav a {
text-decoration:none;
color:#000;
}

#secondnav .tc1 {
background:transparent url(http://code.google.com/images/corner_tl_sharp.gif) no-repeat scroll left top;
height:4px;
padding:0;
margin:0;
}

#secondnav .tcr {
background:transparent url(http://code.google.com/images/corner_tr_sharp.gif) no-repeat scroll right top;
height:4px;
padding:0;
margin:0;
}

#secondnav .h_link {
padding:0 1em 2px;
}

/* ########## MISCELLANEOUS ########## */

img {
border:none;
margin:1em 0;
}

.button {
  margin-top: 2px;
}

.input input {


  width: 90%;
}

hr{
border: 1px solid;
border-color: #3366CC;
margin: 20px 10px 20px 10px;
}

#pagecontent img{
margin: 1em 0 0 25px;
}

/* a11y */

.hidden, .hidden *, #skipto, #skipto *,
#skipto a, #skipto a:hover, #skipto a:visited {
  position:relative;
  top: -4444px;
  left: -4444px;
  height: 1px;
  width: 1px;
  overflow: hidden;
  z-index: 4444;
}

#skipto a:focus {
  position:fixed;
  top: 5px;
  left: 5px;
  height: auto;
  width: auto;
  background-color: white;
  border: 2px solid #0000CC;
  font-weight:bold;
  padding: 5px;
}

/* ########## END MISCELLANEOUS ########## */

/* ######### PRINT PAGE STYLE ########### */

@media print{

h1, h2, h3, h4, h5, h6 { /*keep headings with the text that belongs with them*/
page-break-after: avoid;
}

#sidenav, #footer { /* don't show page navigation */
visibility:hidden;
position:absolute;
}

#pagecontent{  /* nudge page content over to fill page */
float:left;
position:relative;
top:0;
left:-175px;
width:100%;
}

#doc_title{  /* add another border since bg-color doesn't show */
border-bottom:1px solid;
padding-bottom:2px;
}

pre {
  overflow: visible;
  text-wrap: unrestricted;
  white-space: -moz-pre-wrap; /* Moz */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
  white-space: pre-wrap; /* CSS3  */
  word-wrap: break-word; /* IE 5.5+ */
}

.backtotop, #date{ 
visibility:hidden;
}

}