@charset "UTF-8";



a img { border-style: none; }



#wrap {

	/*width: 1000px;

	padding-top: 20px;

	margin: 0 20px;*/

}



#codesample #wrap { width: auto; }



/*#header {

	margin-bottom: 2em;

	text-align: left;

	padding-left: 0.5em;

}

#LeftColumn {

  margin:0 10px 0 0;

  padding:0;

  width: 200px;

  float: left;

}

#LeftColumn, #articles {

  border-left: solid 1px #404040;

  border-right: solid 1px #404040;

  border-bottom: solid 1px #404040;

}

#articles {	margin-bottom: 10px; }



#RightColumn {

	margin:0;

	padding:0;

	height: 600px;

	float: left;

	width: 750px;

}

#content, #sidebar {

	float: left;

	text-align: left;

}

#content {

	width: 600px;

	margin-right: 15px;

	padding-top: 5px;

}

#sidebar {

	width: 240px;

	margin-top: 0;

}

.SpryHiddenRegion {

   visibility: hidden;

}*/



/* Form Elements

----------------------------------------------- */

label, select { 

	font-size:0.8em;

	font-family:sans-serif;

}

select {

	color: #FFFFFF;

	background-color: #CCCCCC;

	border: 1px solid #b1b1bc;

}



/* Table Rules

----------------------------------------------- */

td.rank { }



#products { 

	border-collapse:collapse;

	empty-cells:show;

	width:100%;

	margin: 0;

}

#products caption {

	color: #FF0000;

	text-transform:uppercase;

	text-align: left;

	font-weight: bold;

	letter-spacing: 0.1em;

	background-color: #999999;

	padding: 0.375em;

	border-top: solid 1px #999;

	border-bottom: solid 1px #3a3a3a;

}

#products th {

	/*background: url('../demos/images/bg_grad_gray2.gif') repeat-x;*/

	padding: 6px 0.25em;

	color: #333333;	

	font-weight: bold;

	margin: 0;

	cursor: pointer;

}



#products th.infocus { background-color: #E6E6E6; }

#products th.selected {	color: #EAEAEA; }



#products td, #products th { 

	margin: 0; 

	padding: 0.25em 0.375em 0.45em 0.375em;

	text-align: left;

}

#products tr {

	border-bottom: solid 1px #202020;

	-moz-user-select: none;

	-khtml-user-select: none;

}

#products tr.infocus {

	background-color:#dfdfdf;

	cursor: pointer;

}



#products tr.notinfocus { background-color:#fff; }

#products tr.selected { color:#fc0; }

#products tbody { margin-top: 0; }

.even { background-color: #151515; }



.rowHover {

	color: #000;

	background-color: #777;

	cursor: pointer;

}



.rowSelected { color: #fc0; }



/* Gallery and Playback Controls

----------------------------------------------- */

#gallerySelect { width: 180px; }

#controls {	margin:0 auto 10px auto; }

#galleries {	margin:0 auto 20px auto; }

#galleries label { padding-bottom: 2px; }



#transport {

	margin: 0;

	padding: 0;

	list-style: none;

}

#transport li {

	float: left;

	margin: 0;

	padding: 0;

	text-align: center;

}

#transport a {

	text-decoration: none;

	text-transform: uppercase;

	font-size: 85%;

	font-weight: bold;

	letter-spacing: 0.1em;

	margin: 0 1px 0 0;

	padding: 4px 8px;

	width: 64px;

	float: left;

	display: block;

	-moz-user-select: none;

	-khtml-user-select: none;

}

#transport a:link {

	background: #666 url('../demos/images/bg_grad_gray1.gif') repeat-x;

	color: #fff;

	border-top: solid 1px #999;

	border-right: solid 1px #404040;

	border-bottom: solid 1px #3a3a3a;

	border-left: solid 1px #404040;

}

#transport a:visited {

	background: #666 url('../demos/images/bg_grad_gray1.gif') repeat-x;

	color: #fff;

	border-top: solid 1px #999;

	border-right: solid 1px #404040;

	border-bottom: solid 1px #3a3a3a;

	border-left: solid 1px #404040;

}

#transport a:hover {

	background: #666 url('../demos/images/bg_grad_gray2.gif') repeat-x;

	color: #000;

	border-top: solid 1px #999;

	border-right: solid 1px #404040;

	border-bottom: solid 1px #3a3a3a;

	border-left: solid 1px #404040;

}

#transport a:focus {

	-moz-user-select: none;

	-khtml-user-select: none;

}



#previews {

	border-top: solid 1px #404040;

	border-right: solid 1px #404040;

	border-bottom: solid 1px #3a3a3a;

	border-left: solid 1px #404040;

	padding: 10px 10px 20px 10px;

	margin-bottom: 5px;

	background-image: url('../demos/images/bg.gif');

	width: 250px;

	float: left;

	margin-right: 10px;

}

#thumbnails {

	clear: both;

	margin: 10px auto;

}

#thumbnails div {

	position: relative;

	width: 24px;

	height: 24px;

	float: left;

	margin: 8px;

	padding: 0;

	float: left;

	display:inline;

}

#thumbnails img {

	width: 24px;

	height: 24px;

	position: absolute;

	border-top: solid 1px #999;

	border-right: solid 1px #404040;

	border-bottom: solid 1px #333;

	border-left: solid 1px #404040;

}

#picture {

	padding: 0px;

	width: 500px;

	float: left;

}

#mainImageOutline {

	

	background-color: #F3F3F3;

	border-top: solid 1px #999999;

	border-right: solid 1px #999999;

	border-bottom: solid 1px #999999;

	border-left: solid 1px #999999;

	padding: 1em; 

	 

}

#mainImage {

	width: 100%;

	height: 100%;

}



#picture img {	border: 1px solid #CCCCCC; }

.selectedThumbnail {  border: solid 2px #fc0 !important; }

.inFocus {  border: solid 1px #fc0 !important; }



/* Spry Validation Widgets Demo*/

#MovieList{

  height: 600px;

  overflow: auto;

}

/* RSS Reader Rules

----------------------------------------------- */

#RSSFeedsList{ 

  height: 570px;

  overflow: auto;

}

#MovieTitle h2, #RSSFeedsTitle h2, #RSSChannelTitle h2 {

	color: #fff;

	font-size: 110%;

	text-transform:uppercase;

	text-align: left;

	font-weight: bold;

	letter-spacing: 0.1em;

	background-color: #ff2700;

	border-top: solid 1px #999;

	border-bottom: solid 1px #3a3a3a;

	margin: 0;

	height: 20px;

	padding-left: 3px;

}

#columnHeadings {

	background: url('../demos/images/bg_grad_gray1.gif') repeat-x;

	color: #fff;

	font-weight: bold;

	font-size: 110%;

	width: 100%;

	height: 24px;

	text-transform:uppercase;

	margin: 0;

	padding: 0;

	border-top: solid 1px #999;

	border-bottom: solid 1px #3a3a3a;

	cursor: pointer;

}

#SubjectTitle, .SubjectColumn { width: 500px; margin: 0; }

#PubDateTitle, .PubDateColumn {	width: auto; margin: 0; }

.ListBoxItemGroup .ListBoxItem { padding:3px 0 5px 0.25em; }



#SubjectTitle, #PubDateTitle, .SubjectColumn, .PubDateColumn { 

	padding:3px 0 5px 0.25em; 

	float: left;

 	cursor: pointer;

	white-space: nowrap;

	overflow: hidden;

	-moz-user-select: none;

	-khtml-user-select: none;

}

#RSSItemsList {

  width: 100%;

  height: 195px;

  overflow: auto;

  clear: both;

}

#RSSItemContent {

	width: 100%;

	white-space: nowrap;

	overflow: hidden;

}

.RSSItemListRow {

	float: left;

	border-bottom: solid 1px #202020;

	background-color: #000;

	width: 100%;

	white-space: nowrap; 

	overflow: hidden; 

}

.ListBoxItemTitle {

	background: url('../demos/images/bg_grad_gray1.gif') repeat-x;

	border-top: solid 1px #999;

	border-bottom: solid 1px #3a3a3a;

	padding: 3px 0 5px 0.25em;

	color: #fff;	

	font-weight: bold;

	margin: 0;

	cursor: pointer;

}

.ListBoxCategTitle {

	background: url('../demos/images/bg_grad_gray1.gif') repeat-x;

	border-top: solid 1px #999;

	border-bottom: solid 1px #3a3a3a;

	padding: 3px 0 5px 0.25em;

	color: #fff;	

	font-weight: bold;

	margin: 0;

}

.ListBoxItem {

	border-bottom: solid 1px #202020;

	cursor: pointer;

	clear: both;

	background-color: #000;

	white-space: nowrap;

	overflow: hidden;

	-moz-user-select: none;

	-khtml-user-select: none;

}



.EvenRow { background-color: #151515; }

.ListBoxItemHover {	background-color: #777; color: #000; }

.SelectedListBoxItem { color: #fc0; }



.RSSItemListFeedback {

	height: 32px;

	margin: 75px auto auto auto;

	background-color: #151515;

	border: solid 1px #202020;

}

.RSSItemListFeedback td {

	padding: 10px;

}

td.RSSItemListLoading {

	height: 32px;

	background-image: url(../demos/images/throbber.gif);

	background-repeat: no-repeat;

	background-position: left center;

	padding-left: 36px;

}



/* iFrame Stuff

----------------------------------------------- */

iframe { 

	border: none; 

	background: #3a3a3a; 

	width: 100%; height: 365px;

	border-top: solid 1px #404040;

	border-left: solid 1px #404040;

	border-right: solid 1px #404040;

	border-bottom: solid 1px #404040;

  }



/* Utility IDs, classes, and HTML selectors

----------------------------------------------- */

#boxshot {

	background-color: #fff;

	border-top: solid 1px #999;

	border-bottom: solid 1px #3a3a3a;

	border-left: solid 1px #3a3a3a;

	border-right: solid 1px #3a3a3a;

	text-align: center;

 }

.clear {

	visibility: hidden;

	display: block;

	clear: both;

	height: 0px;

	margin: 0;

	padding: 0;

	}

.ClearAll {

	clear: both;

	height: 0;

	font-size: 0;

	line-height: 0;

}



code { color: #000; }

pre { font-size: small; color: #000; }



.highlightedcode {background-color: #ff9;}



.sample {

	background: #eee;

	padding: 20px;

	border: 2px solid #666;

	margin-top: 20px;

	overflow: scroll;

}



/* Accordion Classes

----------------------------------------------- */

.Accordion {

	border-left: solid 1px #404040;

	border-right: solid 1px #404040;

	border-bottom: solid 1px #404040;

	overflow: hidden;

}

.AccordionPanelTab {

	color: #ccc;

	border-top: solid 1px #999;

	border-bottom: solid 1px #3a3a3a;

	cursor: pointer;

	-moz-user-select: none;

	-khtml-user-select: none;

	background: #080808 url('../demos/images/bg_grad_gray1.gif') repeat-x;

}

.AccordionPanelTab h3 {

	margin: 0;

	padding: 2px 2px 4px 36px;

	font-size: 110%;

	background: url('../demos/images/blt_panel_exp.gif') no-repeat left 50%;

} 

.AccordionPanelContent {

	overflow: auto;

	height: 200px;

	font-size: 90%;

	line-height: 140%;

}

.AccordionPanelContent ul { margin: 0;	padding: 1.375em; }

.AccordionPanelTabHover { color: #fff; }

.AccordionPanelClosed .AccordionPanelTab h3 { background: url('../demos/images/blt_panel_clps.gif') no-repeat left 50%; }

.AccordionPanelContent div { margin: 5px 8px; }



/* Home Page Classes

----------------------------------------------- */

.screen {

	background-color: #bbb;

	border-top: solid 1px #999;

	border-bottom: solid 1px #3a3a3a;

	border-left: solid 1px #3a3a3a;

	border-right: solid 1px #3a3a3a;

	margin: 5px 5px 5px 0;

	padding: 1em 1em 0.5em 1em;

	float: left;

	display: block;

	text-decoration: none;

}

.screen:hover {

	background-color: #fff;

	color: #000;

	border-top: solid 1px #999;

	border-right: solid 1px #404040;

	border-bottom: solid 1px #3a3a3a;

	border-left: solid 1px #404040;

	text-decoration: none;

}

.imgcaption {

	font-size: 90%;

	font-weight: bold;

	margin: 0em 0 1em 0;

	line-height: 1.1em;

	color: #333333;

	border: none;

	text-decoration: none;

}

/* Navigation Classes

----------------------------------------------- */

.demo a, .return a, .demo a, .source a {

	text-decoration: none; 

	font-size: small;

	font-weight: normal;

	margin-left: 24px;

	padding-left: 16px;

}



.return a:link { color: #fff; background: url('../demos/images/btn_return_link.gif') no-repeat left 50%; }

.return a:visited { color: #fff; background: url('../demos/images/btn_return_link.gif') no-repeat left 50%; }

.return a:hover {

	color: #fc0; 

	border-bottom:dotted 1px #fc0; 

	background: url('../demos/images/btn_return_hover.gif') no-repeat left 50%;

}

.return a:active { 

	color: #fff; 

	border-bottom:dotted 1px #fff; 

	background: url('../demos/images/btn_return_link.gif') no-repeat left 50%;

	}



.demo a:link { color: #fff; background: url('../demos/images/btn_demo_link.gif') no-repeat left 50%; }

.demo a:visited { color: #fff; background: url('../demos/images/btn_demo_link.gif') no-repeat left 50%; }

.demo a:hover {

	color: #fc0; 

	border-bottom:dotted 1px #fc0; 

	background: url('../demos/images/btn_demo_hover.gif') no-repeat left 50%;

}

.demo a:active { 

	color: #fff; 

	border-bottom:dotted 1px #fff; 

	background: url('../demos/images/btn_demo_link.gif') no-repeat left 50%; 

	}



.source a:link { color: #fff; background: url('../demos/images/btn_source_link.gif') no-repeat left 50%; }

.source a:visited { color: #fff; background: url('../demos/images/btn_source_link.gif') no-repeat left 50%; }

.source a:hover {

	color: #fc0; 

	border-bottom:dotted 1px #fc0; 

	background: url('../demos/images/btn_source_hover.gif') no-repeat left 50%;

}

.source a:active { 

	color: #fff; 

	border-bottom:dotted 1px #fff;  

	background: url('../demos/images/btn_source_link.gif') no-repeat left 50%;

	}