/* CSS Document */

      /* undohtml.css */
   
      /* (CC) 2004 Tantek Celik. Some Rights Reserved. */
   
      /* http://creativecommons.org/licenses/by/2.0 */

      /* This style sheet is licensed under a Creative Commons License. */
   
      /* http://www.tantek.com/log/2004/undohtml.css */
 
      /* Purpose: undo some of the default styling of common (X)HTML browsers */

      /* link underlines tend to make hypertext less readable,
 
        because underlines obscure the shapes of the lower halves of words */
 
      :link,:visited { text-decoration:none }

       
 
      /* no list-markers by default, since lists are used more often for semantics */

      ul,ol { list-style:none }
     

      /* avoid browser default inconsistent heading font-sizes */

      /* and pre/code too */

      h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }

       

      /* remove the inconsistent (among browsers) default ul,ol padding or margin */
 
      /* the default spacing on headings does not match nor align with
 
        normal interline spacing at all, so let's get rid of it. */

      /* zero out the spacing around pre, form, body, html, p, blockquote as well */
 
      /* form elements are oddly inconsistent, and not quite CSS emulatable. */
      /* nonetheless strip their margin and padding as well */

      ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input

      { margin:0; padding:0 }

      /* whoever thought blue linked image borders were a good idea? */
 
      a img,:link img,:visited img { border:none }
  
      /* de-italicize address */
 
      address { font-style:normal }
  
      /* more varnish stripping as necessary... */
	  a {outline:none;}


/* ================================================================ 
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.stunicholls.com/gallery/simple.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.
=================================================================== */

/* The outer container with a relative position */
#gallery {width:750px; height:355px; position:relative; background:#eee; border:1px solid #aaa; margin-left:25px;}

/* Float the ul to the right with a width to give 3 thumbnail images per row */
#gallery ul {list-style:none; padding:0; margin:8px 0 0 0; width:180px; float:right;}

/* Place the list items inline using display:inline for IE and float:left */
#gallery ul li {display:inline; width:50px; height:50px; float:left; margin:0 0 5px 5px; border:1px solid #333; cursor:pointer;}
#c
{
color:
}

/* Set up the thumbnail images as the background images */
/*#gallery ul li.tb1 {background:url(imgs/1.jpg) -120px -90px;}
#gallery ul li.tb2 {background:url(imgs/2.jpg) -110px -110px;}
#gallery ul li.tb3 {background:url(imgs/3.jpg) -250px -100px;}
#gallery ul li.tb4 {background:url(imgs/4.jpg) -170px -180px;}
#gallery ul li.tb5 {background:url(imgs/5.jpg) -120px -40px;}
#gallery ul li.tb6 {background:url(imgs/6.jpg) -20px -120px;}
#gallery ul li.tb7 {background:url(imgs/7.jpg) -320px -190px;}
#gallery ul li.tb8 {background:url(imgs/13.jpg) -70px -70px;}
#gallery ul li.tb9 {background:url(imgs/14.jpg) -120px -210px;}
#gallery ul li.tb10 {background:url(imgs/15.jpg) -190px -180px;}
#gallery ul li.tb11 {background:url(imgs/18.jpg) -20px -240px;}
#gallery ul li.tb12 {background:url(imgs/21.jpg) -90px -100px;}
#gallery ul li.tb13 {background:url(imgs/21a.jpg) -220px -160px;}
#gallery ul li.tb14 {background:url(imgs/57.jpg) -120px -160px;}
#gallery ul li.tb15 {background:url(imgs/50.jpg) -120px -80px;}
#gallery ul li.tb16 {background:url(imgs/52.jpg) -130px -80px;}
#gallery ul li.tb17 {background:url(imgs/55.jpg) 0 0;}
#gallery ul li.tb18 {background:url(imgs/56.jpg) -130px -30px;}
*/
/* Hide the full size images, esconde imágenes grandes*/
#gallery ul li span i img {display:none;}

/* set up the .click style which will be added using javascript */

/* Change the li border to white */
#gallery ul li.click {border-color:#000; cursor:default;}

/* Position the span using an absolute position and specify the width and height */
#gallery ul li.click span {position:absolute; left:0; top:0; width:570px; height:355px;}

/* Set up the i so that it is the same size as the span BUT this has a static position so that the image can be both vertically and horizontally centered in all browsers except IE using display:table-cell */
#gallery ul li.click span i {width:570px; height:355px; display:table-cell; vertical-align:middle; text-align:center;} 

/* Make the image actual size using auto width and height */
#gallery ul li.click span i img {display:block; width:auto; height:auto; border:1px solid #fff; margin:0 auto;}

/* set up the default image */
#gallery ul li.default {width:0; height:0; border:0;}
#gallery ul li.default span {position:absolute; left:0; top:0; width:570px; height:355px;}
#gallery ul li.default span i {width:570px; height:355px; display:table-cell; vertical-align:middle; text-align:center;} 
/* specify the image width and height for IE6 */
#gallery ul li.default span i img {display:block; width:320px; height:240px; border:1px solid #fff; margin:0 auto;}
#gallery ul li.off {display:none;}