/* common styling 
a {color:#000;}
a:hover {text-decoration:none;}
a:visited {color:#111;}


/* estilo del DIV cuadrado que contiene todo. Lo que se ve cuando no hay nada seleccionado */
.photo {
	width: 580px;
	height: 500px;
	text-align: left;
	position: absolute;
	background-color: transparent;
	margin-right: auto;
	margin-left: auto;
	background-image: url('../../Images/site/fotografia/fondoFotografia.jpg');
	background-repeat: no-repeat;
	top:0px;
	right:0px;
}
/* FIN de estilo del cuadrado que contiene todo. Lo que se ve cuando no hay nada seleccionado */

/* estilos para el texto que aparece cuando no hay nada seleccionado */
.photo dl {font-size:0.9em; position:absolute; width:500px; top:100px; left:50px;}
.photo dl dt {
	font-family: "times new roman", serif;
	font-size: 25px;
	margin-bottom: 2em;
	color: #999999;
	text-decoration: none;
	line-height: 40px;
	text-align: center;
}
.photo dl dd {font-family:verdana, arial, sans-serif;  padding:0; margin:0; line-height:1.7em; margin-bottom:2em; font-size:11px;}
.photo dl dd:first-letter {font-weight:bold;}
/* FIN estilos para el texto que aparece cuando no hay nada seleccionado */


/* estilo para (TOPIC). El espacio para los botones */
.photo ul.topic {padding:0; margin:0; list-style:none; width:601px; height:auto; position:absolute; z-index:10;	top: 0px; left: 0px;
}
/* FIN de estilo para (TOPIC) */

/* ancho de la zona activa de los botones */
.photo ul.topic li {display:block; width:115px; _width:113px; height:31px; float:left; }
/* FIN ancho de la zona activa de los botones */

/* estilo para el texto de los botones */
.photo ul.topic li a.set {display:block; font-size:13px; font-weight:normal; width:120px; _width:116px; height:30px; text-align:center; line-height:30px; color:#000000; text-decoration:none; /*border:1px solid #fff; border-width:1px 1px 0 0; */background:#999999; font-family:verdana, arial, sans-serif; }
/* estilo para el texto de los botones */

.photo ul.topic li a ul, .photo ul.topic li ul 
{display:none; }

/* color y fondo del boton cuando esta en rollOver */
.photo ul.topic li a:hover,.photo ul.topic li:hover a
{
	color: #fff;
	background: #333333;
	border-bottom: 2px;
	border-bottom-style: solid;
	border-bottom-color: #333333;
}
/* FIN color y fondo del boton cuando esta en rollOver */

/* informacion para la gran zona activa donde estan las fotos */
.photo ul.topic li a:hover ul, .photo ul.topic li:hover ul 
{
	display: block;
	position: absolute;
	left: -80px;
	top: 31px;
	list-style: none;
	padding-top: 30px;
	padding-left: 80px;
	margin: 0;
	height: 440px;
	width: 695px;
	background: transparent;
	background-image: url('../../Images/Site/fotografia/fondoImagenesFirefox.gif');
	#background-image: url('../../Images/Site/fotografia/fondoImagenesExplorer.gif');
	background-repeat: no-repeat;
	background-position: 80px 0px;
	#cursor:pointer;
}
/* FIN informacion para la gran zona activa donde estan las fotos */


/* espacio para la foto NORMAL */
.photo ul.topic li a:hover ul li, .photo ul.topic li:hover ul li 
{display:inline; width:120px; height:80px; float:left; padding-left:20px; padding-top:18px; _padding-top:14px;}
/* FIN tamaño de la foto normal */

/* espacio para la zona activa de la foto NORMAL */
.photo ul.topic li a:hover ul li a, .photo ul.topic li:hover ul li a 
{display:block; width:110px; height:85px; cursor:pointer; float:left; text-decoration:none; _border:1px solid #333333;}
/* FIN espacio para la zona activa de la foto normal */

/* tamaño de la foto NORMAL */
.photo ul.topic li a:hover ul li a img, .photo ul.topic li:hover ul li a img 
{display:block; width:100px; height:75px;}
/* FIN tamaño de la foto normal */

/* no se que hace */
.photo ul.topic li a:hover ul li a img.large, .photo ul.topic li:hover ul li a img.large 
{position:absolute; display:block; width:0; height:0; overflow:hidden; border:0;}
/* FIN no se que hace */

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

/* ROLLOVER imagen- tamaño, ubicacion, color borde */
.photo ul.topic li a:hover ul li a:hover img, .photo ul.topic li:hover ul li a:hover img 
{position:absolute; left:-70px; top:-45px; width:255px; height:170px; /* border-color:lime;*/}
/* FIN rollover imagen- tamaño, ubicacion, color borde */

/* no se que hace */
.photo ul.topic li a:hover ul li a:hover img.large, .photo ul.topic li:hover ul li a:hover img.large
{position:absolute; display:block; width:0; height:0; overflow:hidden; border:0;}
/* FIN no se que hace */

/* no se que hace */
.photo ul.topic li:hover ul li a:focus,
.photo ul.topic li:hover ul li a:active,
.photo ul.topic li a:hover ul li a:active 
{position:static; outline:0;}
/* FIN no se que hace */

/* tamaño de la foto normal cuando se esta en la foto grande (cuando se hace click) */
.photo ul.topic li:hover ul li a:focus img, 
.photo ul.topic li:hover ul li a:active img, 
.photo ul.topic li a:hover ul li a:active img 
{position:absolute; left:200px; top:170px; width:200px; height:150px; padding:0; background:#000; border:0; z-index:5;}
/* FIN tamaño de la foto rollover cuando se esta en la foto grande (cuando se hace click */


/* tamaño y borde para la foto GRANDE */
.photo ul.topic li:hover ul li a:focus img.large, 
.photo ul.topic li:hover ul li a:active img.large, 
.photo ul.topic li a:hover ul li a:active img.large 
{position:absolute; #cursor:default; left:90px; #left:92px; _left:80px; top:48px; _top:44px; width:555px; height:370px; padding:0; border-bottom:4px solid #333333; _border-bottom:15px solid #333333; border-top:6px solid #333333; _border-left:10px solid #333333; border-right:15px solid #333333; #border-right:12px solid #333333; z-index:10;}
/* FIN tamaño y borde para la foto grande */