#container{
   position:absolute;
   left:0px;
   height:0px;
   width: 1100px; 
   height:768px;
   border:0px solid #73AD21;
}
#container1{
    position:absolute;
    left:270px;
    top:230px;
    border: 0px solid #73AD21;
    width:554px;
    height: 272px;;
 }
#blackboard{
    position:absolute;
    left: 0px; 
    top:0px;
 }
 #demo1{
    position:absolute;
    left: 150px; 
    top:158px;
    color: #ffffff;
 }
 #demo1a{
   position:absolute;
   left: 230px; 
   top:156px;
   color: #ffffff;
}
#demo1b{
   position:absolute;
   left:290px; 
   top:156px;
   color: #ffffff;
}
#demo1c{
   position:absolute;
   left: 350px; 
   top:156px;
   color: #ffffff;
}
 #demo2{
    position:absolute;
    left: 150px; 
    top:178px;
    color: #ffffff;
 }
 #demo2a{
   position:absolute;
   left: 230px; 
   top:176px;
   color: #ffffff;
}
#demo2b{
   position:absolute;
   left: 290px; 
   top:176px;
   color: #ffffff;
}
#demo2c{
   position:absolute;
   left: 350px; 
   top:176px;
   color: #ffffff;
}
 #demo3{
    position:absolute;
    left: 150px; 
    top:198px;
    color: #ffffff;
 }
 #demo3a{
   position:absolute;
   left: 230px; 
   top:195px;
   color: #ffffff;
}
#demo4a{
    position:absolute;
    left: 230px; 
    top:215px;
    color: #ffffff;
 }
 #demo5a{
    position:absolute;
    left: 230px; 
    top:235px;
    color: #ffffff;
 }
#demo3b{
   position:absolute;
   left: 290px; 
   top:195px;
   color: #ffffff;
}
#demo4b{
    position:absolute;
    left: 290px; 
    top:215px;
    color: #ffffff;
 }
 #demo5b{
    position:absolute;
    left: 290px; 
    top:235px;
    color: #ffffff;
 }
 #demo5c{
    position:absolute;
    left: 350px; 
    top:235px;
    color: #ffffff;
 }
#demo3c{
   position:absolute;
   left: 350px; 
   top:195px;
   color: #ffffff;
}
#demo4c{
    position:absolute;
    left: 350px; 
    top:215px;
    color: #ffffff;
 }
 #demo4{
    position:absolute;
    left: 150px; 
    top:216px;
    color: #ffffff;
 }
 #demo5{
    position:absolute;
    left: 150px; 
    top:235px;
    color: #ffffff;
 }
#desk1{
    position:absolute;
    left: 15px; 
    top:90px;
 }
#a{
    position:absolute;
    left: 47px; 
    top:20px;
 }
 #b{
    position:absolute;
    left: 120px; 
    top:20px;
 }
 #c{
    position:absolute;
    left: 193px; 
    top:20px;
 }
 #d{
    position:absolute;
    left: 266px; 
    top:20px;
 }
 #e{
    position:absolute;
    left: 335px; 
    top:20px;
 }
 #desk2{
    position:absolute;
    left: 690px; 
    top:90px;
 }
 #d1{
    position:absolute;
    left: 738px; 
    top:20px;
    cursor: pointer;
 }
 #d2{
    position:absolute;
    left: 874px; 
    top:66px;
    cursor: pointer;
 }
 #d3{
    position:absolute;
    left: 960px; 
    top:20px;
    cursor: pointer;
 }
 #desk{
    position:absolute;
    left: 270px; 
    top:656px;
 }
 #cup1{
    position:absolute;
    left: 300px; 
    top:582px;
 }
 #myCanvas1{
    position:absolute;
    left: 310px; 
    top:615px;
 }
 #myCanvas1a{
    position:absolute;
    left: 319px; 
    top:638px;
 }
 #demoCup1{
    position:absolute;
    left: 340px; 
    top:567px;
 }
 #cup2{
    position:absolute;
    left: 400px; 
    top:582px;
 }
 #myCanvas2{
    position:absolute;
    left: 410px; 
    top:615px;
 }
 #myCanvas2a{
    position:absolute;
    left: 419px; 
    top:638px;
 }
 #demoCup2{
    position:absolute;
    left: 440px; 
    top:567px;
 }
 #cup3{
    position:absolute;
    left: 500px; 
    top:582px;
 }
 #myCanvas3{
   position:absolute;
   left: 510px; 
   top:615px;
}
#myCanvas3a{
    position:absolute;
    left: 519px; 
    top:638px;
 }
#demoCup3{
    position:absolute;
    left: 540px; 
    top:567px;
 }
#cup4{
    position:absolute;
    left: 600px; 
    top:582px;
 }
 #myCanvas4{
   position:absolute;
   left:610px; 
   top:615px;
}
#myCanvas4a{
    position:absolute;
    left: 619px; 
    top:638px;
 }
#demoCup4{
    position:absolute;
    left: 640px; 
    top:567px;
 }
 #cup5{
    position:absolute;
    left: 700px; 
    top:582px;
 }
 #myCanvas5{
   position:absolute;
   left:710px; 
   top:615px;
}
#myCanvas5a{
    position:absolute;
    left: 718px; 
    top:638px;
 }
#demoCup5{
    position:absolute;
    left: 740px; 
    top:567px;
 }
#cupUp{
   position:absolute;
   left: 585px; 
   top:623px;
   visibility: hidden;
}
#d1a{
   position:absolute;
   left: 235px; 
   top:130px;
   color: #ffffff;
}
#d2a{
   position:absolute;
   left: 295px; 
   top:130px;
   color: #ffffff;
}
#d3a{
    position:absolute;
    left: 355px; 
    top:130px;
    color: #ffffff;
 }
#odigies{
   position:absolute;
   left: 21px; 
   top:230px;
}
#production{
   position:absolute;
   left: 858px; 
   top:650px;
   visibility: visible;
}
#clean{
    position:absolute;
    left: 168px; 
    top:633px;
    cursor: pointer;
    visibility: hidden;
 }
 .tooltip {
   position:absolute;
   display: inline-block;
   border-bottom: 1px dotted black;
 }
 
 .tooltip .tooltiptext {
   visibility: hidden;
   width: 120px;
   background-color: black;
   color: #fff;
   text-align: center;
   border-radius: 6px;
   padding: 5px 0;
   left: 710px; 
   top:135px;
   /* Position the tooltip */
   position: absolute;
   z-index: 1;
 }
 
 .tooltip:hover .tooltiptext {
   visibility: visible;
 }
 .tooltip1 {
   position:absolute;
   display: inline-block;
   border-bottom: 1px dotted black;
 }
 
 .tooltip1 .tooltiptext1 {
   visibility: hidden;
   width: 120px;
   background-color: black;
   color: #fff;
   text-align: center;
   border-radius: 6px;
   padding: 5px 0;
   left: 827px; 
   top:135px;
   /* Position the tooltip */
   position: absolute;
   z-index: 1;
 }
 
 .tooltip1:hover .tooltiptext1 {
   visibility: visible;
 }
 .tooltip2 {
   position:absolute;
   display: inline-block;
   border-bottom: 1px dotted black;
 }
 
 .tooltip2 .tooltiptext2 {
   visibility: hidden;
   width: 120px;
   background-color: black;
   color: #fff;
   text-align: center;
   border-radius: 6px;
   padding: 5px 0;
   left: 944px; 
   top:135px;
   /* Position the tooltip */
   position: absolute;
   z-index: 1;
 }
 
 .tooltip2:hover .tooltiptext2 {
   visibility: visible;
 }
 #A{
   position:absolute;
   left:17px; 
   top:120px;
}
#B{
   position:absolute;
   left:90px; 
   top:120px;
}
#C{
   position:absolute;
   left:163px; 
   top:120px;
}
#D{
   position:absolute;
   left:236px; 
   top:120px;
}
#E{
    position:absolute;
    left:308px; 
    top:120px;
 }
#calculator{
   position:absolute;
   left:50px; 
   top:607px;
   cursor: pointer;
   visibility: hidden;
}
#digmata{
   position:absolute;
   left:440px; 
   top:735px; 
}
#restart{
   position:absolute;
   left:10px; 
   top:665px; 
   cursor: pointer;
   visibility:hidden ;
}
.tooltipClean {
   position:absolute;
   display: inline-block;
   border-bottom: 1px dotted black;
 }
 
 .tooltipClean .tooltiptextClean {
   visibility: hidden;
   width: 120px;
   background-color: black;
   color: #fff;
   text-align: center;
   border-radius: 6px;
   padding: 5px 0;
   left: 120px; 
   top:697px;
   /* Position the tooltip */
   position: absolute;
   z-index: 1;
 }
 .tooltipClean:hover .tooltiptextClean {
   visibility: visible;
 }
 .tooltipSolution {
   position:absolute;
   display: inline-block;
   border-bottom: 1px dotted black;
 }
 
 .tooltipSolution .tooltiptextSolution {
   visibility: hidden;
   width: 120px;
   background-color: black;
   color: #fff;
   text-align: center;
   border-radius: 6px;
   padding: 5px 0;
   left: 12px; 
   top: 699px;
   /* Position the tooltip */
   position: absolute;
   z-index: 1;
 }
 .tooltipSolution:hover .tooltiptextSolution {
   visibility: visible;
 }
 .tooltipTheory  {
   position:absolute;
   display: inline-block;
   border-bottom: 1px dotted black;
 }
 
 .tooltipTheory .tooltiptextTheory {
   visibility: hidden;
   width: 250px;
   background-color: black;
   color: #fff;
   text-align: center;
   border-radius: 6px;
   padding: 5px 0;
   left: 430px; 
   top:147px;
   /* Position the tooltip */
   position: absolute;
   z-index: 1;
 }
 .tooltipTheory:hover .tooltiptextTheory  {
   visibility: visible;
 }
 #book{
   position: absolute;
   left:507px; 
    top:24px;
   cursor: pointer;
 }
#pdf1, #pdf2, #pdf3{
   position: absolute;
   left:829px; 
    top:230px;
   visibility: hidden;
 }
 #pdf0{
   position: absolute;
   left:920px; 
    top:230px;
   visibility: hidden;
 }
 #confirm,#confirm1,#confirm1a,#confirm1b,#confirm1c,#confirm1d,#confirm1e,#confirm1h,#confirm1g,#confirm1j,#confirm1l {
   display: none;
   background-color: #FFFFFF;
   border: 2px solid #363232;
   position: fixed;
   width: 250px;
   left: 85%;
   margin-left: -100px;
   padding: 6px 8px 8px;
   box-sizing: border-box;
   text-align: center;
}
#confirm button {
   background-color: #f4fdfd;
   display: inline-block;
   border-radius: 5px;
   border: 1px solid #aaa;
   padding: 5px;
   text-align: center;
   width: 40px;
   cursor: pointer;
}
#confirm .message {
   text-align: center;
}
#clean1{
   position:absolute;
  top:60px;
  left:189px;
}
#book{
   position: absolute;
   left:507px; 
    top:24px;
   cursor: pointer;
 }

