/* 
Document   : Galeriaimagen
Created on : 16/10/2009, 13:17:15
Author     : hector
Description:
Purpose of the stylesheet follows.
*/

/* 
TODO customize this sample style
Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/
#info {background:#f8f8f8; border:0;}
ul.download {list-style-image:url(../menus/zip.gif);}
ul.download li {padding-left:5px; font-size:12px; line-height:1.5em;}



/* ================================================================
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/lightbox.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any
way to fit your requirements.
=================================================================== */
/* common styling */

a {color:#000;}
a:hover {text-decoration:none;}
a:visited {color:#000;}

/* slides styling */

.photo {
        position:relative;
       float:left;
        width:380px;
        height:550px;
        text-align:left;
        
        margin:0 auto;}

.photo ul.topic {
        

        padding:0;
        margin:0;
        list-style:none;
        
        height:auto;
        position:relative;
        z-index:10;
      width:380px;
    }


.photo ul.topic li {

     visibility:visible;
        display:inline;            
        width:125px;
        height:31px;
        float:left;
        
        font-size:11px;
        width:124px;
        height:30px;
        text-align: center;
        line-height:30px;
        color:#000;
        text-decoration:none;
        border:1px solid #fff;
        border-width:1px 1px 0 0;
        background:#ccc;
              
       
  
        color:#fff;
        background:#aaa;
    }


.photo ul.topic li ul
{
         position:absolute;
        left:0;
        top:31px;
        list-style:none;
        padding:0;
        margin:0;
        height:375px;
        background:#ddd;
        width:380px;
        padding:40px 60px;
        border:10px solid #bbb;
        z-index:1;}

.photo ul.topic li a:hover ul,
.photo ul.topic li:hover ul
{
        display: inline;
        position:absolute;
        left:0;
        top:30px;
        list-style:none;
        padding:0;
        margin:0;
        height:375px;
        background:#ddd;
        width:380px;
        padding:40px 60px;
        border:10px solid #aaa;
        z-index:100;}

.photo ul.topic li ul li
{
        visibility:visible;
        display:inline;
        width:112px;
        height:112px;
        float:left;
        border:1px solid #fff;
        margin:1px;

    }

.photo ul.topic li ul li a
{
         visibility:visible;
        display:inline;
        width:110px;
        height:110px;
        cursor: default;
        float:left;
        text-decoration: none;
        background:#444;
        border:1px solid #888;
       
    }

 

.photo ul.topic li ul li a img
{
        visibility:visible;
         display: inline;
        width:100px;
        height:100px;
        border:5px solid #fff;     
     }



.photo ul.topic li a:hover ul li a:hover,
.photo ul.topic li:hover ul li a:hover
{
        white-space:normal;
        position: relative; 
        
    }

.photo ul.topic li a:hover ul li a:hover img,
.photo ul.topic li:hover ul li a:hover img
{
        position:absolute;
        left:-50px;
        top:-32px;
        width:200px;
        height:auto;
        border-color:#fff;
        
    }