/* structural markup */
#content 
{
position: absolute; width: 430px; top: 195px; left: 43px; float:left;
font-size:.85em;
line-height:170%;
}

div#outercontainer {
width:800px;
}

#sidebox {
position: absolute; width: 310px; top:200px; left:496px;
}

#footer, .footer {

color: #aaa;
font: normal 12px/1.3em Verdana, Arial, Helvetica, sans-serif;letter-spacing:.05em; 
}

/* universal styles */

body {padding:0;margin:0;
background: #000;
color: #fff;
font-family:Verdana, Arial, Helvetica, sans-serif;}


a, a:link, a:visited {
text-decoration:none;
font-weight:bold;
letter-spacing:.07em;
} 

#navbuttons a, li a {
text-decoration:none;
}

#content a:link, #content a:visited {
color:#6699CC;
border-bottom:1px #FFFFFF dotted;
 }
 
 #sidebox a:link, #sidebox a:visited {
 color:#99CCFF;
 border-bottom:1px #FFFFFF dotted;

 }


#content a:hover, #content a:active, #sidebox a:hover, #sidebox a:active {
color:#CCCCCC;
border-bottom:0;
}

a:hover img, a:active img {
border:0px;
}

img {
border: 0px; 
}

h1, h2, h3, h4, h5, h6 {
letter-spacing:.15em; line-height:140%;color:#6699CC;}
}

h1 {font-size:21px;}
h2 {font-size:18px;}
h3 {font-size:16px;}
h4 {font-size:14px;}


/* these may be phased out */
.title {
color: #fff;
font: normal 24px/1.3em Arial Black, sans-serif;
}

.subtitle {
color: #FFFFFF;
font: normal 900 14px/1.3em Verdana, Arial, Helvetica, sans-serif;
}


.body {
color: #fff;
font-variant: normal;
font-weight: normal;
}

/* various functional styles that don't fit into any particular category */

.toggle {
color:#99CCFF;
font-weight:bold;
border-bottom:1px #FFFFFF dotted;
}

span.text_storage, div.text_storage {
display: none;}

div.spacer {
height:5px;
}

select,input {font-size: 100%;}

/* header */

#flickrbox {
z-index:5000;
position:relative;

}

#logobar {
position:relative;
top:0;
height:75px;
left:0;
z-index:300;
width:800px;
background-color:#CCCCCC;
}


#sitetitle {
padding: 73px 0 0 0;
overflow: hidden;
background-image: url("/images/logo.png");
background-position:14px 0;
background-repeat: no-repeat;
height: 0px !important;
height /**/:73px;
}

#headerbar {
width:800px;
background-image:url(/images/iconbar-background.gif);
background-repeat: repeat-x;
margin: 0;
padding: 0;
height: 95px;
position:relative;

left:0;
z-index:50;
}

#headerbar a {
border:0;
}
/* unused
#sitelogo {
position: relative; width: 800px; height: 40px; top: 0; left: 20px;
}
*/
/* navigation row buttons */
div#navbar {
position: absolute; top:10px; width: 800px; height: 80px; left: 0px;z-index:100;
}

/* #navbar img {
z-index:200;
}
*/

ul#navbuttons {
height:70px;
width:800px;
}

#navbuttons li a {
display:block;
text-decoration:none;
height:70px;
width:60px;
font-size:1px;
z-index:0;
}

li#home, li#examples, li#blog, li#contact, li#chat, li#faq, li#wiki {
height:90px;
width:60px;
list-style:none;
background-repeat: no-repeat;
position:absolute;
top:5px;
}


li#home {
left:10px;
background-image: url(/images/navbar-60pxtall/home.png);
}

body#homebody li#home {
left:10px;
background-image: url(/images/navbar-60pxtall/home-trans.png);
}


li#examples
{
left:85px;
background-image: url(/images/navbar-60pxtall/examples.png);
}

body#examplesbody li#examples
{
left:85px;
background-image: url(/images/navbar-60pxtall/examples-trans.png);
}  

li#faq
{
left:160px;
background-image: url(/images/navbar-60pxtall/faq.png);
}

body#faqbody li#faq
{
left:160px;
background-image: url(/images/navbar-60pxtall/faq-trans.png);
}

li#blog
{
left:235px;
background-image: url(/images/navbar-60pxtall/blog.png);
}

body#blogbody li#blog
{
left:235px;
background-image: url(/images/navbar-60pxtall/blog-trans.png);
}


li#chat 

{
left:310px;
background-image: url(/images/navbar-60pxtall/chat.png);
}

body#chatbody li#chat 

{
left:310px;
background-image: url(/images/navbar-60pxtall/chat-trans.png);
}

li#contact 

{
left:385px;
background-image: url(/images/navbar-60pxtall/contact.png);
}

body#contactbody li#contact 

{
left:385px;
background-image: url(/images/navbar-60pxtall/contact-trans.png);
}


li#wiki 

{
left:385px;
background-image: url(/images/navbar-60pxtall/wiki.png);
}

body#wikibody li#wiki 

{
left:310px;
background-image: url(/images/navbar-60pxtall/wiki-trans.png);
}


div#navdivider {
position: absolute; width: 100%; height: 20px; left:0; top: 78px; background-color:#333333;
}

/* to make the site logo clickable to return home */
a#home {
position:absolute;width:800px; left:0;top:0;display:block;font-decoration:none;height:74px;font-size:1px; z-index:1001;
}

/* For the examples page. Ideally, this page will eventually be database-powered...*/
div.content-item {
border-bottom:1px #CCCCCC dotted;
}


/* forms */

.cleardefault {
color:#666666;
}

input {
border:1px solid #9999FF;
background-color:#CCCCFF;
}

/* to sign up for the mailing list on the home page */
form#signup {
text-align:center;
background-color:#212121;
border:1px #333333 dotted;
padding:5px;
}

form h2 {
font-size:13px;
letter-spacing:.08em;
text-transform:none;
}


/* the feeds */

img.rss {
padding:10px 0 0 0;
margin:0;
float:right;

}

#google_wrapper, #blog_wrapper, #delicious_wrapper {
font-size: .7em;}

#google_wrapper h2, #blog_wrapper h2, #delicious_wrapper h2 {
font-size:1.1em;
text-transform:uppercase;
padding-top:20px;
margin: 0;
text-align: center;}


#google_wrapper h3 {
font-size:1.0em;
text-transform:none;
padding-top:12px;
margin: 0;
}

#google_wrapper form {
text-align:center;
}

div.feed_entry { 
padding: 2px;
margin: 5px 0;
}

.feed_entry .entry_title {
font-style: italic;
}

.feed_entry .entry_meta {
color: #eee;
}

.feed_entry blockquote.entry_text {
padding: 0;
margin: 2px 0;
}


/* Related to javascript display */
/* JAVASCRIPT/PHP - intended to complement HTML color scheme */

.script {
font-family:"Courier New", Courier, monospace;
}

.html .script , .html * .script {
color: black;
}

.script .statement {
color: blue ;
}

.script .literal {
color:#FF9900;
}

.script .keyword {
font-weight: bold ;
}

.script .operator {
font-weight: normal ;
}

.script .operator , .script .declaration {
color:#6699CC;
}

.script .regexp , .script .builtin {
color:#6699FF;
}

.php .global {
color: 3FF3366;
}