body {
	background: #EEEECE;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	margin: 0;
	padding: 0;
	min-width: 850px;
}

div#Wrapper {
  padding: 0 23px 0 30px;
  margin: 0 auto;
}

.Container {
	margin: 12px auto 0 auto;
	text-align: center;
	min-width: 750px;
}

#ContentFrame, .ContentFrame {
	margin: 0;
	padding: 0px 0;
	width: 100%;
	text-align: left;
	/*position: relative;*/
	float: left;
}

table.layout {
  border-collapse: collapse;
  width: 100%;
}

table.layout td.left,
table.layout td.right {
  vertical-align: top;
  padding: 0;
}

table.layout td.left {
  width: 20%;
}

table.layout td.right {
  width: 80%;
}

div.Left {
	margin: 0 20px 0 0;
	padding: 0;
	text-align: left;
	width: 20%;
	float: left;
	}

div.Right {
	margin: 0px 0 0 0;
	padding: 0;
	text-align: left;
	/*position: absolute;*/
	float: left;
	width: 80%;
	}

table.layout td.left div.Left,
table.layout td.right div.Right {
  width: auto;
  float: none;
}

.bookImg {
	margin: 2px 2px 2px 2px;
}

.col {
	padding: 0 20px;
	text-align: left;
}

div.Right .col,
div.Full .col {
	padding: 15px 50px 10px 20px;
  background: #fff url(http://www.sigcse.org/sigcse2010/images/right-bg.gif) right repeat-y;
  position: relative;
}

div.Full .col {
	padding: 15px 30px 10px 20px;
}

div.Right .bottom,
div.Full .bottom {
  background: url(http://www.sigcse.org/sigcse2010/images/bottom-bg.gif) top right no-repeat;
  font-size: 8px;
}

div.Left .col {
	min-width: 200px;
	padding: 0 9px 0 0;
}

.left a {
	color: #000000;
	text-decoration: underline;
}

.left a:hover {
	color: #1463B4;
}


#Footer {
	clear: left;
	font-size: 10px;
	color: #111;
	margin: 4px 0 20px 20px;
	text-align: left;
	padding-bottom: 15px;
}

#Footer a:link, #Footer a:visited {
	color: #666;
}

#Footer a:hover {
	color: #fff;
	background: #666;
}



/* Navigation (Thanks SimpleBits) */
div#navcontainer {
	width: auto;
	margin: 0 auto;
	padding: 0 15px 0 0;
	background-color: #000000; /* #1463B4; */
	border-bottom: 1px solid #FFFFFF;
	background-image: url(/sigcse2010/images/header_background.png);
	background-repeat: repeat-x;
	min-width: 850px;
}

div#navcontainer ul {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: white;
	text-align: left;
	margin: 0;
	padding-bottom: 3px;
	padding-top: 0px;
}
div#navcontainer ul li {
	display: inline;
	margin-left: -3px;
}

div#navcontainer ul li a {
	margin: 0 0px 0 1px;
	padding: 5px 10px 5px 10px;
	color: #000;
	text-decoration: none;
	background-color: #DCDDDE;
}

div#navcontainer ul li a#current {
	padding: 5px 10px 5px 10px;
	background-color: #FF9201;
	color: #000000;
	text-decoration: none;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #DCDDDE;
}

div#navcontainer ul li a:hover {
	background-color: #FF9201;
	color: #000000;
	text-decoration: none;
}

div#headerleft {
	width: 50%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: left;
	font-size: 15px;
	color: #111111;
	padding: 0px 0 0 25px;
}


div#headerleft a {
	color: #111111;
	text-decoration: none;
}

div#headerleft a:hover {
    color: #EEEEEE;
	text-decoration: underline;
}

div#headerright {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: white;
	text-align: right;
	padding: 0px 30px 0 0;
}

div#headerright a {
	color: #ffffff;
	text-decoration: none;
}

div#headerright a:hover {
	text-decoration: underline;
}

#active a { border-left: 1px solid #1463B4; }


.imgRight {
	float: right;
	padding-left: 20px;
}

/** ERRORS **/

#GoodMessage {
	background-color: #E2F9E3;
	border: 2px solid #00FF33;
	border-left: none;
	border-right: none;
	padding: 2px 20px 2px 10px;
	margin: 10px 0px 10px 0px;
	color: #000;
}

.GoodMessage {
	background-color: #E2F9E3;
	border: 2px solid #00FF33;
	border-left: none;
	border-right: none;
	padding: 2px 20px 2px 10px;
	margin: 10px 0px 10px 0px;
	color: #000;
}

.errorExplanation {
	border: 2px solid #red;
	padding: 7px;
	padding-bottom: 12px;
	margin-bottom: 20px;
	background-color: #fcf0f0;
}

.errorExplanation h2 {
	text-align: left;
	font-weight: bold;
	padding: 5px 5px 5px 27px;
	font-size: 12px;
	margin: -7px;
	background: #cc0000;
	color: #ffffff;
}

.errorExplanation p {
	color: #333;
	margin-bottom: 0;
	padding: 5px;
}

.errorExplanation ul {
	margin-left: 30px;
}

.errorExplanation ul li {
	font-size: 12px;
	list-style: square;
}



/** MY STYLES **/

div.Left .col h2 {
	font-size: 15px;
	font-weight: bold;
	border-bottom: 1px solid #000;
	margin: 0 20px 4px 0;
}

div.Left li {
	margin-bottom: 10px;
}

/** FORMS **/
#form_area {
  font-family: verdana, sans-serif;
}

#form_area br {
	clear: left;
}

#form_area p.blockintro {
	color: #666;
	font-size: 11px;
  line-height: 14px;
  margin: 0;
}

#form_area table {}

#form_area table td {
	font-size: 10px;
}

#form_area table th {
  font-size: 10px;
	font-weight: normal;
	text-align: right;
}

#form_area table th.required {
  font-weight: bold;
}

#form_area div.block {
	color: #333;
	background: #DCDDDE;
	margin: 3px 0 25px 0;
	padding: 5px;
	font-size: 11px;
	font-weight: normal;
}

#form_area h2 {
	font-size: 14px;
	color: #333;
	margin-bottom: 10px;
	padding: 0;
	margin: 0 0 5px 0;
}

#form_area div.action, div.action {
	border-top: 2px solid #000;
	margin-bottom: 10px;
	text-align: right;
	padding-top: 8px;
	font-size: 12px;
}

#form_area div p {
  margin: 0;
}

#form_area label {
	float: left;
	margin-top: 5px;
	margin-right: 10px;
}

#form_area label.required {
	font-weight: bold;
}

#form_area .inputText {
	margin-top: 10px;
}
#form_area .inputPassword {
	margin-top: 10px;
}
#form_area select {
	margin-top: 10px;
	margin-top: 2px;
}
#form_area textarea {
	margin-top: 10px;
	clear:right;
}

#form_area textarea.short {
  height: 150px;

}

#form_area textarea.tall {
  height: 500px;

}

.growable {
	border: 1px dashed #f00;
	display: block;
}

#form_area a.bottab {
  background: #fff;
  border: 1px solid #ccc;
  border-top: 0;
  padding: 4px 10px 4px 25px;
  margin-top: 10px;
  margin-right: 10px;
}

#form_area a.more { background: #fff url(http://www.sigcse.org/sigcse2010/images/layout_add.png) 2% 50% no-repeat;}
#form_area a.less { background: #fff url(http://www.sigcse.org/sigcse2010/images/layout_delete.png) 2% 50% no-repeat;}


#form_area radioLabel {
	margin-top: 0px;	
}

#form_area .dynamicArea {
	border: 1px dashed #000;
	padding: 5px 5px 5px 5px;
	margin: 5px 5px 5px 5px;
}

#form_area .field, .text {
	margin-top: 5px;	
}

#form_area .submit {
  border-top: 2px solid #000;
  padding: 8px 0 12px 0;
  text-align: right;
}

.sub_form {
	margin: 5px 0 0 10px;
	padding: 0 0 0 5px;
	border-left: 2px solid #1463B4;
}

/** table **/

.forum {
	border:  1px solid #666666;
	width: 95%;
	text-align: center;
}

.forum .poster {
	background-color: #84CA82;
	border-right:  1px dashed #1463B4;
	padding: 2px 4px 2px 4px;
	margin: 0;
}

.forum .post {
	padding: 2px 4px 2px 4px;
	margin: 0;
}

.forum .headline {
	background-color: #CDE8FB;
	padding: 2px 4px 2px 4px;
	text-align:  center;
}


.forum .replies {
	background-color:  #F3B902;
	text-align: center;
	padding: 5px 0 5px 0;
}

.forum_control {
	border-bottom:  1px dashed #666666;
	padding: 0 5px 2px 5px;
	margin: 0 0 4px 0;
	text-align: right;
	width:  98%;
	display: block;
}

.quote {
	display:  block;
	background-color: #cccccc;
	border:  1px dashed #111111;
	padding: 4px 4px 4px 4px;
	text-align: left;
	margin: 15px;
}


.fancy {
	border: 1px solid #666666;
}

.fancy .cell {
	border-left: 1px solid #1463B4;
	padding-left: 2px;
	padding-right: 2px;
	text-align: right;
}

.fancy .summaryCell {
	border-top: 1px dashed #1463B4;
	border-left: 1px solid #1463B4;
	padding-left: 2px;
	padding-right: 2px;
	text-align: right;
}

.fancy tr.hover:hover
{
	background: #bfd5ff;
}

.fancy tr.fheader a
{
	color: #000000;
	font-weight: normal;
}

.fancy tr.fheader a:hover
{
	color: #000000;
	font-weight: normal;
	text-decoration: none;
}

.fancy td.selected {
	background-color: #3d80df;
	border-left: 1px solid #346DBE;
	border-bottom: 1px solid #7DAAEA;
}

.fancy td.selected a {
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
}

.fancy td.selected a:hover {
	color: #ffffff;
	font-weight: bold;
	text-decoration: underline;
}

.fancy a:visited {
	color: #000000;
}

.fancy tr.odd
{
	background-color: #edf3fe;
}

.fancy tr.even
{
	background-color: #fff;
}

.fancy td.total 
{
	border-top: 1px dashed #666666;
}

.fancy tbody tr td {
	font-family: "lucida grande", verdana, sans-serif;
	font-size: 9pt;
	padding: 3px 8px;
	border-left: 1px solid #D9D9D9;
}

.fancy .codeB {
	font-family: "courier", verdana, sans-serif;
	font-size: 9pt;
	background: #A4B7C8;
	border: 1px solid #FE6600;
}

.fancy .codeA {
	font-family: "courier", verdana, sans-serif;
	font-size: 9pt;
	background: #EEEEEE;
	border: 1px solid #84CA82;
}

.fancy .codeC {
	font-family: "courier", verdana, sans-serif;
	font-size: 9pt;
	background: #A4B7C8;
	border: 1px solid #EE2022;
}

/* message / announcements */

.announcement {
	padding: 3px 0px 5px 5px;
	border-left: 1px dashed #1463B4;
	border-bottom: 1px dashed #1463B4;
}



/** general content */
.SectionHeader {
	margin: 10px 0 0px 0;
	border-bottom: 1px solid #000000;
	padding-bottom: -1px;
	padding-top: 20px;
}

.SectionHeader h2 {
	margin: 0 0 0 0;
}

.SectionHeader .Full {
	text-align: center;
}

/* fade table */

.FadeTable {
	margin: 5px 0 5px 0;
	border: none;
	width: 100%;
	border-left: 1px solid #1463B4;
}

.FadeTable tr.header {
	background-color: #d9d9d9;
}

.FadeTable th {
	padding: 5px 0 5px 5px;
	text-align: left;
	font-weight: normal;
}

.FadeTable th.full {
	text-align: center;
}

.FadeTable tr.row1 {
	background-color: #e4e4e4;
}

.FadeTable tr.row2 {
	background-color: #e4e4e4;
}

.FadeTable tr.row3 {
	background-color: #e4e4e4;
}

.FadeTable tr.row4 {
	background-color: #f3f3f3;
}

.FadeTable tr.row5 {
	background-color: #f3f3f3;
}

.FadeTable td {
	padding: 4px 5px 4px 5px
}


/* blog */

.BlogPost {
	margin: 5px 0 0 0;
	border-bottom: 1px dashed #DCDDDE;
}

.BlogPost h2 {
	margin: 0 0 0 0;
	border-bottom: 1px solid #1463B4;
}

.BlogPost p.author {
	margin: 0 0 0 15px;
	font-weight: italic;
}

.BlogPost p {
	margin: 5px 5px 5px 5px;
}

.BlogPost p.summary {
	text-align: right;
}

a img {
	text-decoration: none;
	border: none;
}

.Comment {
	margin: 5px 0 0 10px;
	padding: 0 0 0 5px;
	border-left: 2px solid #1463B4;
}

.Comment p.commentAuthor {
	margin: 0;
	font-weight: italic;
	border-bottom: 1px solid #DCDDDE;
}

.Comment p.commentBody {
	padding: 0px 0px 0px 10px;
}
	
#leave_comment {
	border: 1px dotted #1463B4;
	padding: 5px 5px 5px 5px;
	margin: 5px 5px 5px 5px;
}

#featured {
	border: 3px solid #DCDDDE;
	border: 2px solid #1463B4;
	padding: 10px 10px 10px 10px;
}

/* Assignent */

#Assignment {
	font-family: verdana, sans-serif;
}

#Assignment br {
	clear: left;
}

#Assignment div.blockintro {
	color: #333;
    margin: 5px 0 0 0;
    border-bottom: 1px solid #1463B4;
}

#Assignment div.blockintro p {
	margin: 0;
	padding: 0;
}

#Assignment div.block {
	color: #333;
	background: #DCDDDE;
	margin: 3px 0 25px 0;
	padding: 5px 5px 5px 5px;
	font-size: 11px;
	font-weight: normal;
}

#Assignment div.block table {
	border: 0;
}

#Assignment div.block td.label {
	text-align: right;
	font-weight: bold;
}

#Assignment .required {
  font-weight: bold;
}

.fixedWidth {
	font-family:  times, verdana, sans-serif;
	font-size:  10pt;
}

.has_comment {
	background: #6BBA70;
}

.has_style {
	background: #FF0084;
}

.hidden_style {
	background: #F3B802;
}

.fixedFont {
	font-family: "Courier", verdana, sans-serif;
	font-size: 10pt;	
}

.code {
	background: #EEEEEE;
	border: 1px solid #84CA82;
	margin: 2px 2px 2px 2px;
	padding: 2px 2px 2px 2px;
	font-family: "courier", verdana, sans-serif;
	font-size: 10pt;
}

.code_example {
	background: #CDEB8B;
	border: 1px solid #84CA82;
	margin: 2px 2px 2px 2px;
	padding: 2px 2px 2px 2px;
	font-family: "courier", verdana, sans-serif;
	font-size: 10pt;
}

.codeout {
	background: #EEEEEE;
	border: 1px solid #1463B4;
	margin: 5px 5px 5px 5px;
	padding: 10px 10px 10px 10px;
	font-family: "courier", verdana, sans-serif;
	font-size: 10pt;
}

.codecomment {
	background: #FFFFCC;
	border: 1px dashed #009900;
	margin: 1px 1px 1px 1px;
	padding: 1px 10px 1px 10px;	
}

.codestyle {
	background: #C3D9FF;
	border: 1px dashed #009900;
	margin: 1px 1px 1px 1px;
	padding: 1px 10px 1px 10px;
}

.standout {
	background: #FFFFCC;
	border: 1px solid #1463B4;
	margin: 5px 5px 5px 5px;
	padding: 10px 10px 10px 10px;
}

.menuout {
	background: #EDEBD6;
	border: 1px solid #000;
	margin: 5px 1px 5px 1px;
	padding: 5px 1px 5px 10px;
}

.standout a {
	color: #0000FF;
}

.codetable {
	border: 1px solid #666666;
}

.codetable tr.hover:hover
{
	background: #bfd5ff;
}

.codetable tr.fheader a
{
	color: #000000;
	font-weight: normal;
}

.codetable tr.fheader a:hover
{
	color: #000000;
	font-weight: normal;
	text-decoration: none;
}

.codetable a:visited {
	color: #000000;
}

.codetable tr.odd
{
	background-color: #fff;
}

.codetable tr.even
{
	background-color: #fff;
}

.codetable tbody tr td {
	font-family: "times", verdana, sans-serif;
	font-size: 10pt;
	padding: 0px 2px 0px 2px;
	border-left: 1px solid #D9D9D9;
}

.codetable .formcell {
	padding-left: 50px;
	background: #DCDDDE;
}


/** DIFF **/


.diffReport {
	max-width: 500px;
	background: #EEEEEE;
	border: 1px solid #84CA82;
	font-family: "courier", verdana, sans-serif;
	font-size: 9pt;
}

.diffReport2 {
	background: #EEEEEE;
	border: 1px solid #84CA82;
	margin: 2px 2px 2px 2px;
	font-family: "courier", verdana, sans-serif;
	font-size: 10pt;
}

.diffSub {
	border-bottom: 2px solid #EE2022;
	margin-bottom: 3px;
}

.diffAdd {
	border-bottom: 2px solid #0262DB;
	margin-bottom: 3px;
}

.diffChange {
	border-bottom: 2px solid #F0BA02;
	margin-bottom: 3px;
}

/* lightbox */
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/sigcse2010/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/sigcse2010/images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }