/*
	Some simple styles to ensure that the guide is not totally bland
	- Joe P
*/

/* Overall Style */
body {
	background-color: #333;
	font-family: Georgia, serif;
}
strong { color: white; font-weight: normal; }


/* Header */
#header {
	background: url(../images/header-background.png) repeat-x;
	height: 60px;
	width: 100%;
	text-align: center;
	padding-top: 10px;
	margin-bottom: 40px;
}

#header h1 {
	display: inline;
	color: rgb(121, 86, 37);
	font-family: Georgia;
	font-variant: small-caps;
	font-size: 1.7em;
}

#header h3 {
	display: inline;
	margin-left: 5px;
	color: rgb(148, 188, 24);
}


/* Wrapper */
#wrapper {
	width: 1000px;
	margin: 0 auto;
}


/* Sidebar */
#sidebar {
	float: left;
	margin-left: 20px;
	display: inline; /* IE6 Fix */
	width: 200px;
	padding: 20px;
	background-color: #555;
	margin-bottom: 20px;
}
#sidebar span.title, #content span.title {
	display: block;
	font-family: Georgia;
	font-size: 1.2em;
	color: white;
	margin-bottom: 20px;
}


/* Menu */
#menu li {
  margin: 0.5em 0 0.5em 0.5em;
}
#menu li a {
	padding: 0.2em;
	text-transform: lowercase;
	font-family: Georgia;
	font-variant: small-caps;
	font-size: 110%;
	text-decoration: none;
	color: rgb(148, 188, 24);
}
#menu li a:hover { color: rgb(198, 238, 74); }
#menu li a.selected { color: white; }
#menu li a.selected:before { content: "» "; }
/*#menu li a:hover:before { content: "» "; }*/


/* Inner Menu */
#menu li ul { margin-left: 1em; }
#menu li a.selected + ul { display: block; }
#menu li ul li a { text-transform: none; font-variant: normal; font-size: 90%; }


/* Content */
#content {
	float: left;
	width: 670px;
	margin-left: 50px;
	margin-bottom: 20px;
	display: inline; /* IE6 Fix */
	background-color: #555;
}
#content div.content-body { padding: 20px; }
#content div.content-code {
	border-top: 1px solid #444;
	border-bottom: 1px solid #444;
	margin-bottom: 20px;
	padding: 20px;
	background-color: #EBEBEB;
}
#content span.title { font-size: 1.8em; }
#content p {
	padding: 5px;
	color: #CACACA;
	line-height: 22px;
	margin-bottom: 10px;
	font-size: 0.9em;
}
#content pre { line-height: 15px; }
#content table {
	background-color: #EBEBEB;
	font-size: 1em;
	margin: 10px;
}
#content table th, #content table td {
	text-align: left;
	padding: 8px 10px;
}
#content table th {
	width: 150px;
	color: white;
	background-color: #777;
	font-family: Georgia;
	font-size: 1.2em;
	font-weight: normal;
	color: white;
	font-style: italic;
}
#content table td {
	font-family: monospace;
	font-style:	normal;
	white-space: pre;
	line-height: 20px;
}


/* Green Code, Orange Links */
#content code { background-color: #5A5A5A; color: rgb(148, 188, 24); font-size: 14px; padding: 2px 4px; font-style: normal; }
#content a { color: #E67832; }
#content a:hover { color: #FF9852; }


/* Ordered List Styles */
#content div.content-body ol {
	margin-left: 45px;
	margin-bottom: 10px;
	list-style-type: decimal;
	font-style: italic;
	font-size: 1.25em;
	color: white;
}
#content div.content-body ol p {
	color: #CACACA;
	line-height: 25px;
	font-style: normal;
	font-size: 14px;
	margin-bottom: 0;
	padding: 0;
}


/* Form Styles */
input[type=text], input[type=password], textarea, select {
	display: block;
	padding: 2px;
	margin-top: 5px;
	width: 250px;
}
textarea { width: 385px; padding: 5px; }
fieldset { padding: 10px; font-style: italic; }
form { width: 455px; color: #CACACA; }
label { display: block; padding: 15px; }
label#err { color: #F44; }

/* Styles for the Atom code samples */
span.header   { color: rgb(121, 86, 37); }
span.required { color: green; }
span.optional { color: #005BB1;  }
span.ignored  { color: #D00; }

/* Not Used Yet, but Nice Colors */
span.NOT_USED { color: #c65812; }