From 2007.igem.org

Note: After saving, you may have to bypass your browser's cache to see the changes. Mozilla / Firefox / Safari: hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (Command-R on a Macintosh); Konqueror: click Reload or press F5; Opera: clear the cache in Tools → Preferences; Internet Explorer: hold Ctrl while clicking Refresh, or press Ctrl-F5.

.rollover a {
display: block;
height: 479px;
width: 480px;
padding:10px 10px 10px 7px;
font: bold 13px sans-serif;;
color:#333;
background: url("https://static.igem.org/mediawiki/2007/2/21/Rollover_adelman.png") 0 0 no-repeat;
text-decoration: none;
}
.rollover a:hover { 
background-position: -500px 0;
color: #049;
}

#roll {
 width: 895px;
 height: 750px;
 background: url() no-repeat;
 margin: 50px auto; padding: 0;
 position: center;

}

#roll li {margin: 0; padding: 0; list-style: none; display: block; position: relative;}

#roll a {display: block; text-indent: -9999px; text-decoration: none;}

#true {left: 155px; top: -315px; width: 700px; height: 25px;}
#true a {height: 80px;}
#true a:hover {background: url(https://static.igem.org/mediawiki/2007/c/c8/Agarose_gel_info.png) -0px -115px no-repeat;}

#false {left: 205px; top: -450px; width: 450px; height: 75px;}
#false a {height: 112px;}
#false a:hover {background: url(https://static.igem.org/mediawiki/2007/c/c8/Agarose_gel_info.png) -50px -0px no-repeat;}

#negative {left: 355px; top: -330px; width: 300px; height: 25px;}
#negative a {height: 73px;}
#negative a:hover {background: url(https://static.igem.org/mediawiki/2007/c/c8/Agarose_gel_info.png) -200px -200px no-repeat;}




#plates {
 height: 600px;
 width: 600px;
 background: url() no-repeat;
 margin: 10px auto; padding: 0;
 position: left;
 /*border: 2px solid #999;*/

}

#plates li {margin: 0; padding: 0; list-style: none; display: block; position: relative;}

#plates a {display: block; text-indent: -9999px; text-decoration: none;}

#red {left: 15px; top: -300px; width: 400px; height: 0px;}
#red a {height: 490px;}
#red a:hover {background: url(https://static.igem.org/mediawiki/2007/3/38/Redcolony.png) 0px 0px no-repeat;}



/*
#green1 {left: 205px; top: -450px; width: 450px; height: 75px;}
#green1 a {height: 112px;}
#green1 a:hover {background: url(https://static.igem.org/mediawiki/2007/c/c3/Greencolony1.png) -50px -0px no-repeat;}

#green2 {left: 205px; top: -450px; width: 450px; height: 75px;}
#green2 a {height: 112px;}
#green2 a:hover {background: url(https://static.igem.org/mediawiki/2007/e/ea/Greencolony2.png) -50px -0px no-repeat;}

#orange2 {left: 355px; top: -330px; width: 300px; height: 25px;}
#orange2 a {height: 73px;}
#orange2 a:hover {background: url(https://static.igem.org/mediawiki/2007/2/27/Orangecolony2.png) -200px -200px no-repeat;}

#orange1 {left: 355px; top: -330px; width: 300px; height: 25px;}
#orange1 a {height: 73px;}
#orange1 a:hover {background: url(https://static.igem.org/mediawiki/2007/8/8c/Orangecolony1.png) -200px -200px no-repeat;}

#normal {left: 355px; top: -330px; width: 300px; height: 25px;}
#normal a {height: 73px;}
#normal a:hover {background: url(https://static.igem.org/mediawiki/2007/a/a6/Normalcolonies.png) -200px -200px no-repeat;}

*/

.rolloverOWW a {
display: block;
height: 222px;
width: 250px;
padding:10px 10px 10px 7px;
font: bold 13px sans-serif;;
color:#333;
background: url("https://static.igem.org/mediawiki/2007/2/21/Rollover_adelman.png") 0 0 no-repeat;
text-decoration: none;
}
.rolloverOWW a:hover { 
background-position: -500px 0;
color: #049;
}