/* Demo styles, page-specific - not needed for your use. */

html {
 background:white;
 height:100%;
 align:center;
}

body {
 background:transparent white;
 font:normal 90% verdana,tahoma,arial;
 margin: 0px 0px auto;
}

a {
 color:#DDDDDD;
}

a:hover {
 color:#ffff00;
}

h1, h2 {
 font:normal 1em arial;
 letter-spacing:-0.5px; /* it isn't web 2.0 otherwise, right? ;) */
}

h2 {
 font-size:2em;
 letter-spacing:0px;
 font: arial;
 
}

h2.compact {
 margin-top:0.05em;
 margin-bottom:1em;
}

h2.tight {
 margin-top:0em;
 margin-bottom:0em;
}

h2 em {
 text-decoration:underline;
}

h2 {
 font-size:1.50em;
 letter-spacing:0px;
 font: arial;
 
}
ul {
 margin:0.5em 0px 0px 1.5em;
 padding:0px;
}

ul li {
 line-height:1.9em;
}

p {
 margin:0em 0px 0em 0px;
 padding:0px;
 line-height:1.7em;
}

p.last {
 margin-bottom:0px;
}

p.compact {
 margin:0px;
 padding:0px;
}
p, ul {
 font-size:0.9em;
}

/* demo layout (columns, etc.)  */
    
}
#demo {
 position:relative;
 margin:0px auto;

 width=100%;
 _width:100%; /* IE 6 sucks. */

}

.col {
 float:left;
 display:inline;
 width:70%;
 _width:70%;
 margin:0px 5px 0px 35px;
}

.col.last {
 float:right;
 display:inline;
 width:22%;
 _width:22%;
 margin:0 25px 0 0px;
}

/* content-specific */

.dialog .content {
 padding:1.5em 1.5em 1.5em 0.5em;
}

.dialog .wrapper {
 min-height:100px; /* minimum content height, so bottom shade fills in nicely - can ignore if no gradient in dialog, etc. */
}

.dialog h1 {
 /* header */
 font-size:2em;
 margin:0px;
 padding:0px;
 padding-top:0.25em;
}

html>body .dialog pre {
 font-size:1.1em;
 *font-size:0.9em;
}

code {
 font-size:1.1em;
 color:#ccffff;
}