html{
  position: absolute;
   top: 0px;
   left: 0px;
   width:1300px;
   height:750px;
}
 #title{
  position: absolute;;
  left:190px;
   top:5px; 
 }
 #blackboard{
  position: absolute;;
  left:235px;
   top:10px; 
 }
 #blackboard1{
  position: absolute;;
  left:235px;
   top:10px; 
   visibility: hidden;
 }
 #parent1 {
  position: absolute;
  top: 355px;
  left:275px;
  width: 466px;
  height:226px
}
#cup1{
  position: absolute;
  left:0px;
  top:0px; 
 }
 #line1{
  position: absolute;
  left:235px;
   top:9px;
   cursor: pointer;
 }
 #canvasOne{
  position: absolute;
  top:5px;
  left: 8px;
  width: 459px;
  height: 226px;
  visibility: hidden;
}
#osmosis1{
visibility: hidden;
  cursor: pointer;

}
#d1{
  position: absolute;
  top:303px;
  left:307px;
 visibility: hidden
}
#d2{
  position: absolute;
  top:303px;
  left:535px;
  visibility: hidden
}
#osmosis3{
  position: absolute;
  top:704px;
  left:745px;
  cursor: pointer;
  opacity: 0.5;
}
#metro{
  position: absolute;
  top:594px;
  left:280px;
}
#canvasMetroColor{
  position: absolute;
  top:594px;
  left:436px;
width: 78px;
height: 21px;
}
#production{
  position: absolute;
  top:598px;
  left:820px;
}
.content{
	position:absolute;
	font-family: Arial, Helvetica, sans-serif;
	background-color:#fffdeb;
	left:830px;
	top:10px;
	width: 390px;
	height: 570px;
	text-align: center;
	box-shadow: -5px -5px 15px rgba(58, 61, 65, 0.2);  
  }
  #canvasFace{
    width:122px;
    height:136px
  }
  #fname{
    width:22px;
  }
  #fname1{
    text-align: center;
   font-size: large;
   visibility: hidden;
 color: brown;
  }
  #calculatorS{
    cursor: pointer;
    visibility: hidden;
  }
  #click{
    cursor: pointer;
  }
 #content1{
visibility: hidden;
  }
  #balls{
    position:absolute;
         left:70px;
         top:421px;
         visibility: hidden;
            }