<script type='text/javascript' src='js/prototype.js'></script>
<script type='text/javascript' src='/js/scriptaculous.js?load=effects'></script>
<script type='text/javascript' src='js/e24tabmenu.js'></script>
<script type="text/javascript">
function initApp() {
oe24TabMenu = new e24TabMenu( 'menu', { mode: 'uppertabs', duration: 1.0, transition: Effect.Transitions.sinoidal } );
}
Event.observe(window, 'load', initApp, false);
</script>

<div id="menu" ><!---menu container-->
<div id="item_3d" class="menutarget">

Contenido
</div>
<div id="item_gall" class="menutarget">
Contenido
</div>

<div id="item_menu" class="menutarget">
Contenido
</div>
<div id="item_efec" class="menutarget">
Contenido
</div>
<!---tabs del menu-->
<a id="3d" href="#3d" rel="e24menuitem[item_3d]"><img src="img/3d.gif" alt="Efectos 3D" /></a>
<a id="gall" href="#galerias" rel="e24menuitem[item_gall]"><img src="img/galerias.gif" alt="Galeria de fotos AJAX" /></a>
<a id="menus" href="#menus" rel="e24menuitem[item_menu]" ><img src="img/menus.gif" alt="Efectos de Menus" /></a>
<a id="efec" href="#efectos" rel="e24menuitem[item_efec]"><img src="img/efectos.gif" alt="Otros efectos ajax" /></a>
<!---tabs del menu-->
<div id="maincontent">
Contenido principal
</div><!--texto-->
</div><!--menu container--

<style type="text/css" media="screen">    
    html{    
    background: url(img/bg.jpg);    
    border: 0px;    
    margin: 0;    
    padding: 0;    
    }    
     body{    
     border: 0px;    
     margin: 0;    
     padding: 0;    
     }     
         
     #page {    
     margin: 0px auto;    
     width: 800px;    
     }    
         
     #menu {    
     position: relative;    
     height: 500px;    
     margin-left: 5px;    
     }    
         
         
     .gallery{    
     margin: 30px auto;    
     width: 80%;     
     padding-top: 10px;    

     }    
     .menuitem{    
     background: #afec77;    
     }    
     .menutarget{    
     background-color:#afec77;    
     display: none;    
     border-bottom: 5px solid white;    
     border-left: 5px solid white;    
     border-right: 5px solid white;    
         
     }    

         
     img{    
     border:0px;    
     }    
         
     </style>