#indented {
	position:relative;
	left:40px;
	margin: 0;
}

html {
   margin:0px;
	height:100%;
	font-family: Optima, "Lucida Grande", Lucida, Verdana, Geneva, Arial, sans-serif;
	font-size: medium;
	background:#fff;
	overflow-y: hidden ! important; overflow-x: auto ! important;
	background:white ;
}

#reference {
   height:100px;
   width:100px;
}

#programTitle {
   font-size: 30px;
margin-top: 8px;
text-align: center;
}

#programButtonBarInner {
   line-height:36px;
   float: left;
   position: absolute;
}

#buttonBarInner {
   margin-top:15px;
   line-height:36px;
   float: left;
   position: absolute;
}

#programWorldDrop {
   float:left;
}

.programButton {
   float: left;
   margin-right: 5px;
}

#programButtonBar {
   height:36px;
   margin-top:7px;
   margin-bottom:7px;
   display: block;
   margin-left: auto;
   margin-right: auto;
}

#referenceImg {
   width:100%;
   height:100%;
}

.inner {
   margin-left:24px;
   margin-right:24px;
}

#commetBox {
   float:right;
   background:#f1f1f1;
}

#featuredPrograms {
   font-size:30px;
   text-align:center;
   padding-top:30px;
   float:left;
}

#featuredProgram {
}

#centerAreaDiv {
   position:absolute;
}

#content {
   position:absolute;
}

body {
	margin:0px;
	height:100%;
	font-family: Optima, "Lucida Grande", Lucida, Verdana, Geneva, Arial, sans-serif;
	font-size: medium;
	background:#fff;
	
	min-width:850px;
	background:white ;
}

#content {
	margin: 0;
}

#title {
	font-size: 150%;
	
}

#lessonsDiv {
    float:left;
    width:150px;
    height:700px;
	padding:10px;
	border-right-color: #535352;
	border-right-style: solid;
	border-right-width: 1px;
	margin: 0;
	
	font-size: 85%;
	
	overflow:hidden;
}

#lessonsDiv a{
	color:#4E387E;
}

#lessonsDiv a:hover {
	text-decoration:underline;
}

#learnDiv {
	float:right;
    width:790px;
	padding:10px;
	padding-top:5px;
    height:100%;
	margin: 0;
}

#learnBody {
	height:650px;
	margin: 0;
}

#buttonBar {
	text-align: left;
	font-weight: bold;
	height:50px;
	margin: 0;
}

#deploy {
	width:100%;
	height:100%;
	margin-left: auto ;
  	margin-right: auto ;
}

.deployInput {
   font-size:x-large;
}

#deployError {
   color:red;
}

#nextButton {
	float:right;
	margin: 0;
}

#codeText {
	font-family:"Courier New";
	font-weight:bolder;
	vertical-align:top;
}

#codeText2 {
	font-family:"Courier New";
	font-weight:bolder;
}

#stepButton {
	font-size:medium;
	min-width:130px;
	min-height:50px;
	font-family:"Courier New";
	font-weight:bolder;
}


#smallLink:link {
	font-size:12px;
}

#dialogDeploySuccess {
   text-align: center;
   font-size: x-large;
}

.commLink {
font-size:30px;
   color:'blue'
   text-decoration:none;
}

.commLink : hover {
   color:darkblue;
}

#userProgramLink{
   font-size:40px;
   color:'blue'
   text-decoration:none;
}

#userProgramLink : hover{
   color:'darkblue'
}

.commLinkDiv {
   margin-top:20px;
   }

A:link {
	color:'blue';
	text-decoration:none;
}



A:visited {
	color:'blue';
	text-decoration:none;
}

A:hover {
	text-decoration: none; 
	color: steelblue;
}



#line {
	margin: 0;
}

* {
	margin: 0;
}


.stress {
	color:#D14545;
	font-weight:bolder;
}

.interactor {
   float:left;
   margin-right:5px;
}

.rightBar {
	
	font-size: 75%;
	float:right;
	height:700px;
	background:#FFF;
}

.programLink {
	width:130px;
	overflow:hidden;
	
}

.author {
	font-size: 75%;
}

.programLink a{

	color:#4E387E;
}

.programLink a:hover {
	text-decoration:underline;
}
/****************** Main IDE ********************/
#mainIde {
   width:100%;
   background:white;
}

#mainIdeButtonBar {
   width:100%;
   height:40px;
   margin-top:7px;
}

#mainIdeEditorDiv {
   width:45%;
   height:100%;
   position:absolute;
   border-width:1px;
   border-style:solid;
   background:white;
}

#mainIdeCanvasDiv {
   width:45%;
   height:100%;
   position:absolute;
}

#mainIdeCenter {
   position:absolute;
   /*border-top-width:1px;
   border-top-style:solid;
   */
}

#mainIdeCanvas {
   width:100%;
   height:100%;
   background-color:LightSteelBlue;
}

#mainIdeEditor {
   width:100%;
   height:100%;
   
}

#worldDiv {
   float: left;
   position: absolute;
   top: 70px;
   left: 220px;   
}

#learnBody {
   width:100%;
   height:100%;
   background:dimgrey;
}

#homeButton {
   background:#f1f1f1;
   width:100%;
   height:100%;
}

#homeButtonImage {
   border-style:none;
}

#headerBackground {
   background: black;
}
/***************** Learn ************************/
#content {
   position:absolute;
   
}

.innerImage {
   position:absolute;
}

.learn {
   background:white;
}

.lessons {
   background-image:url('../images/bg-body.jpg');
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

#progressBarDiv {
   position:absolute;
   width:100%;
   background-image:url('../images/bottomBar.png');
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

#headerDiv {
   position:absolute;
   width:100%;
   background:black;
}

#centerAreaDiv {
   position:absolute;
   width:100%;
}

.titleText {
   color:white;
}

.progressBox{
   position:absolute;
}

.absoluteDiv {
   position:absolute;
   display:none;
}

.nonFadeInDiv {
   position:absolute;
}

.resizableLink {
   position:absolute;
   float:right;
	line-height: 40px;
margin: 0;
margin-right:5px;
   color:#ccc;
}

.resizableLink:hover{
   color:#999;
}

.rounded {
   position:absolute;
   display:none;
   -moz-border-radius: 7px;
   border-radius: 7px;
   background:white;
   -moz-box-shadow: 3px 3px 3px dimgray;
  -webkit-box-shadow: 3px 3px 3px dimgray;
  box-shadow: 3px 3px 3px dimgray;
}

.roundedNoShadow {  
   position:absolute;
   display:none;
   -moz-border-radius: 7px;
   border-radius: 7px;
   background:white;
}

.imageButton {
   position:absolute;
   display:none;
   -moz-border-radius: 7px;
   border-radius: 7px;
   -moz-box-shadow: 3px 3px 3px dimgray;
  -webkit-box-shadow: 3px 3px 3px dimgray;
  box-shadow: 3px 3px 3px dimgray;
}

#ideMessage {
   background-color:black;
   z-index:99999;
   -moz-border-radius-bottomleft: 7px;
   border-bottom-left-radius: 7px;
   -moz-border-radius-bottomright: 7px;
   border-bottom-right-radius: 7px;
}

.imageButton:hover {
   
   margin:-3px;
   border-style:solid;
   border-width:3px;
   position:absolute;
}

.coverDivNoHighlight{
   position:absolute;
   -moz-border-radius: 7px;
   border-radius: 7px;
}

.coverDiv{
   position:absolute;
   -moz-border-radius: 7px;
   border-radius: 7px;
}

.coverDiv:hover {
   
   margin:-3px;
   border-style:solid;
   border-width:3px;
   
}

.disabledRoundedButton {
   position:absolute;
   display:none;
   -moz-border-radius: 7px;
   border-radius: 7px;
   
   -moz-box-shadow: 3px 3px 3px dimgray;
  -webkit-box-shadow: 3px 3px 3px dimgray;
  box-shadow: 3px 3px 3px dimgray;
   background:#bbb;
}

.unitBox {
   position:absolute;
   display:none;
   -moz-border-radius: 7px;
   border-radius: 7px;
   background:#f6f6f6 ;
}

.progressBox {
-moz-border-radius: 7px;
   border-radius: 7px;
}

.unitBox:hover{
   background:blue;
   color:white;
}

.roundedButton {
   position:absolute;
   display:none;
   -moz-border-radius: 7px;
   border-radius: 7px;
   background:#ddd ;
   -moz-box-shadow: 3px 3px 3px dimgray;
  -webkit-box-shadow: 3px 3px 3px dimgray;
  box-shadow: 3px 3px 3px dimgray;
}

.roundedButton:hover {
   position:absolute;
   -moz-border-radius: 7px;
   border-radius: 7px;
   background:lightsteelblue;
   -moz-box-shadow: 3px 3px 3px dimgray;
  -webkit-box-shadow: 3px 3px 3px dimgray;
  box-shadow: 3px 3px 3px dimgray;
}

.roundedButton:active {
   position:absolute;
   -moz-border-radius: 7px;
   border-radius: 7px;
   background:lightgreen;
   -moz-box-shadow: 3px 3px 3px dimgray;
  -webkit-box-shadow: 3px 3px 3px dimgray;
  box-shadow: 3px 3px 3px dimgray;
}

.centeredText {
    width: auto;
    text-align:center;
}


.code {
   background:white;
   border-width:1px;
   border-style:solid;
   background:white;
}

.topTooltip {
   background:transparent url(../images/black_arrow_up.png);
	display:none;
	font-size:24px;
	text-align:center;
	height:70px;
	line-height:70px;
	width:160px;
	padding:25px;
	color:#fff;	
	z-index:9999999999999999999;
}

/* tooltip styling. by default the element to be styled is .tooltip  */
.tooltip {
	background:transparent url(../images/black_arrow.png);
	display:none;
	font-size:24px;
	text-align:center;
	height:70px;
	line-height:70px;
	width:160px;
	padding:25px;
	color:#fff;	
	z-index:9999999999999999999;
}

/****************** Tabs ************************/
#header {
	height:40px;
	/*background:transparent url("../images/header.gif") repeat-x 0 0;*/
	position:relative;
	z-index:130;
	margin: 0;
	border-bottom: 2px solid #000;
	background:#F1F1F1;
}
#tabs {
   height:100%;
}
#social {
	float:left;
	height:22px;
	width:90px;
	text-align:center;
	font-size: 16px;
	
	display: block;
	margin-top: 9px;
	margin-left: 9px;
	margin-bottom: auto; 
	outline: none;
	border:none;
}

#logo{
	border-right-color: #535352;
	border-right-style: solid;
	border-right-width: 1px;
	padding: 0px 10px;
	float:left;
	height:40px;
	width:216px;
	text-indent:-5000px;
	background:transparent url(../images/logo.png) no-repeat 0 0; 
	margin: 0;
}

a.tab {
	height:100%;
			float:left;
			height:40px;
			overflow:hidden;
  	border-right-color: #535352;
border-right-style: solid;
border-right-width: 1px;
	width:100px;
	text-align:center;
float: left;
font-size: 16px;
height: 100%;
line-height: 40px;
padding: 0px 10px;
	color: #000;	
	margin: 0;
}

a.tab, a.tab:visited {
	text-decoration:none;
	margin: 0;
}

a.tab:hover {
  	color: #999;
	margin: 0;
}

a.selectedtab {
	height:100%;
			float:left;
			height:40px;
			overflow:hidden;
  	border-right-color: #535352;
border-right-style: solid;
border-right-width: 1px;
	width:100px;
	text-align:center;
float: left;
font-size: 16px;
height: 100%;
line-height: 40px;
padding: 0px 10px;	
	border-bottom: 2px solid #fff;
	color: #000;
	margin: 0;
	background:white;
}

a.selectedtab, a.selectedtab:visited {
	text-decoration:none;
	margin: 0;
}

a.selectedtab:hover {
  	color: #999;
	margin: 0;
}

.smallLink {
	float:right;
	line-height: 40px;
margin: 0;
margin-right:5px;
   color:black;
}

.smallLink:hover{
   color:#999;
}

/****************** Tests ************************/
.red {
   background-color:red;
}

.blue {
   background-color:blue;
}

.green {
   background-color:green;
}

.orange {
   background-color:orange;
}