.card{
    margin-bottom: 5px;
    }

#rootcss{
    position: relative;
    top:10%;
    left:1%;
    width:30%;
    cursor: pointer; /* stem outline 2D7600 */
    display: block;
    z-index: 2;

}

#fingerthumbcss{
    position: absolute;
    top:20%;
    left:14%;
    width:7%;
    cursor: pointer; /* stem outline 2D7600 */
    display: block;
    z-index: 4;
}

#fingerindexcss{
    position: absolute;
    top:20%;
    left:14%;
    width:6%;
    cursor: pointer; /* stem outline 2D7600 */
    display: block;
}

#rootsectioncss{
    position: absolute;
    top:49.3%; /* 52*/
    left:38%; /* 46*/
    width:2%;
    cursor: pointer;
    display: none;
    z-index: 3;
}



#petridishcss {
    position: absolute;
    top: 55%;
    left:35%;
    width: 15%;
    cursor: pointer;
    display: block;
    
    
}

#bladecss {
    position: absolute;
    top: 5%; /* -5 -- 5 */
    left:25%; /* 25 -- 2*/
    width: 12%;  /* 12*/
 
    cursor: pointer;
    display: block;
    z-index: 2;
 
   
    
}

#glassslidecss {
    position: absolute;
    top: 55%;
    left:60%;
    width: 20%;
    cursor: pointer;
}

#coverslipcss {
    position: absolute;
    top: 25%;  /*25 -- 65 */
    left: 63%; /*63 -- 68 */
    width: 4.8%;
    cursor: pointer;
    opacity: 50%;
    z-index: 5;
}


#brushcss{
    position: absolute;
    top: 0%;  /*0*/
    left:90%; /*90*/
    width:1.4%;
    cursor: pointer;
    transform: rotate(20deg);
    z-index: 3;
}


#waterpetridishcss{
    position: absolute;
    top: 54.7%; 
    left: 35%; 
    width:15%;
    height:8%;
    cursor: pointer;
    display: block;
    opacity: 80%;
    z-index: 3;
}

#safraninbottlecss{
    position: absolute;
    top: 95%; /* 25- 68*/
    left: 92%; /*68- 75 */
    width:7%;
    cursor: pointer;
    display: block;
    z-index: 2;
}

#safranindroppercss{
    position: absolute;
    top: 87%; /* 25- 68*/
    left:93.85%; /*68- 75 */
    width:3%;
    cursor: pointer;
    display: block;
   
    
}
#safranindropcss{
    position: absolute;
    top: 57%;  /*45 */
    left:68%; 
    width:4%;
    cursor: pointer;
    display: none;
    z-index: 11;
    opacity: 85%;
    
}

#beakerbottlecss{
    position: absolute;
    top: 89%; /* 25- 68*/
    left: 45%; /*68- 75 */
    width:12%;
    cursor: pointer;
    display: block;
    z-index: 2;
}

#distbeakerbottlecss{
    position: absolute;
    top: 89%; /* 25- 68*/
    left: 62%; /*68- 75 */
    width:12%;
    cursor: pointer;
    display: block;
    z-index: 2;
}

#droppercss{
    position: absolute;
    top: 83%; /* 25- 68*/
    left: 78%; /*68- 75 */
    width:3.5%;
    cursor: pointer;
    display: block;
    z-index: 2;
}

#waterdroppercss{
    position: absolute;
    top: 80.5%; /* 25- 68*/
    left: 50%; /*68- 75 */
    width:3.5%;
    cursor: pointer;
    display: none;
    
}

#distwaterdroppercss{
    position: absolute;
    top: 80.5%; /* 25- 68*/
    left: 68%; /*68- 75 */
    width:3.5%;
    cursor: pointer;
    display: none;
    
}

#watercss{
    position: absolute;
    top: 57%;  /*45 */
    left:68%; 
    width:4%;
    cursor: pointer;
    display: none;
    z-index: 11;
    opacity: 85%;
}

#distwaterdropcss{
    position: absolute;
    top: 57%;  /*45 */
    left:68%; 
    width:4%;
    cursor: pointer;
    display: none;
    z-index: 11;
    opacity: 85%;
}


/* column 1 ends */

/* column 2 starts */

#mircoscopecss {
    cursor: pointer;
    position: relative;
    top: 5%;
    left:1%;
    width:40%
   
}

#labpersoncss {
    cursor: pointer;
    position: absolute;
    top: 90%;
    left:60%;
    width:30%
   
}

#mircoscopeslidecss {
    cursor: pointer;
    position:absolute;
    top:61%;
    left:16%;
    width:3.5%;
    height:3%;
    transform: rotate(90deg);
    display:none;
}

#rootshowimg{
    cursor: pointer;
    position:absolute;
    top:15%;
    left:0%; 
    display: none;
    z-index: 2;
    
}

/* column 2 ends */