<style type="text/css">  
 function Barva(koda){  
   document.bgColor = koda; 
   var coincidencia = true; 
   var color = "#000000"; 
   switch (koda) { 
      case "#333333": color = "#FFFFFF"; break; 
      case "#AC58FA": color = "#ff8000"; break; 
      case "#5858FA": color = "#FF0000"; break; 
      default: coincidencia = false; 
   } 
   if (coincidencia) { 
      var x; 
      var logo = document.getElementById("logo"); 
      logo.style.color = color; 
      var lislogos = logo.getElementsByTagName("li"); 
      for (x in lislogos) { 
         lislogos.item(x).style.color = color; 
      } 
   } 
   }   
 </style>  
  
<script language="javascript">  
#logo {position: absolute;top:30%;left:30%;color:#000000;font-size:50px;font-weight: bold;}   
#logo ul li{position: absolute;color:#000000;font-size:25px;}   
</script>  
<table width="235" border="0" cellspacing="1" cellpadding="0" align="center">  
<tr height="9">  
<td bgColor="#5858FA" onClick="Barva(this.bgColor)">&nbsp;</td>  
<td bgColor="#AC58FA" onClick="Barva(this.bgColor)">&nbsp;</td>  
<td bgColor="#333333" onClick="Barva(this.bgColor)">&nbsp;</td>  
</tr>  
</table>  
  
<div id="logo">  
   <span>HOLA MUNDO</span> 
   <ul>  
      <li>HOLA USUARIO</li>  
   </ul>  
</div>