body,html {
	font-family:arial;
	background-color:#FFFFFF;
  -moz-transition: background-color 500ms ease-in-out;
  -webkit-transition: background-color 500ms ease-in-out;
  -o-transition: background-color 500ms ease-in-out;
	transition: background-color 500ms ease-in-out;
}


p {
	text-align:justify;
	clear:both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

a {
	color:#000000;
	text-decoration: none;
	font-weight: bold;
}

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

div {
  width:934px;
  margin:1em auto;
}

ul {
  list-style:none;
  margin:0;
  padding:0;
}

body #zoom {
   background:transparent url(../img/default.png) no-repeat 50% 50%;
}
   body:hover #zoom {
      background-image:none;
   }

#zoom {
  margin-top:14px;
  float:right;
  height:452px;
  width:452px;
  overflow:hidden;
}


#thumbs {
  float:left;
  width:482px;
  height:482px;
}

#zoom:not(.ie) {
  overflow:visible;
  position:relative;
  z-index:2;
}

#zoom:not(.ie) img {
  position:absolute;
  opacity:0;
  z-index:2;
  height:144px;
  width:144px;
  -moz-transform:rotate(-360deg);
  -webkit-transform:rotate(-360deg);
  -o-transform:rotate(-360deg);
  transform:rotate(-360deg);
  -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  z-index:1;
}

img#art1,
img#art4,
img#art7 {
  left:-468px;
}

img#art2,
img#art5,
img#art8 {
  left:-314px;
}

img#art3,
img#art6,
img#art9 {
  left:-160px;
}

img#art4,
img#art5,
img#art6 {
  top:153px;
}

img#art7,
img#art8,
img#art9 {
  top:308px;
}


#zoom img:target {
  -moz-transform:rotate(0deg);
  -webkit-transform:rotate(0deg);
  -o-transform:rotate(0deg);
  transform:rotate(0deg);
  z-index:3;
  opacity:1;
  top:0;
  left:0;
  width:452px;
  height:452px;
}
  
  #thumbs li img {
    height:144px;
    width:144px;
  }
  
  #thumbs li a:active {
    outline:none;
  }
  
  #thumbs:not(.ie) li img {
    height:180px;
    width:180px;
  }

  #thumbs li {
    position:relative;
    z-index:2;
    float:left;
    display:inline;
    cursor:pointer;
    opacity:1;
    margin-right:10px;
    margin-bottom:10px;
    height:144px;
    width:144px;
	-moz-transform:scale(0.8);
	-webkit-transform:scale(0.8);
	-o-transform:scale(0.8);
	transform:scale(0.8);
	-moz-transition:all 250ms ease-in-out;
	-webkit-transition:all 250ms ease-in-out;
	-o-transition:all 250ms ease-in-out;
	transition:all 250ms ease-in-out;
  }
  
  #thumbs:hover li { opacity:0.3; }

  #thumbs:hover li:hover {
    opacity:1;
    position:relative;
    z-index:5;
	-moz-transform:translate(-10px, 0);
	-webkit-transform:translate(-10px, 0);
	-o-transform:translate(-10px, 0);
	transform:translate(-10px, 0)
  }
  
    #thumbs li img {
      border:none;
      -moz-box-shadow:0 0 0 rgba(255,255,255,0.5);
      -webkit-box-shadow:0 0 0 rgba(255,255,255,0.5);
      -moz-transition: all 250ms ease-in-out;
      -webkit-transition: all 250ms ease-in-out;
      -o-transition: all 250ms ease-in-out;
      transition: all 250ms ease-in-out;
    }
    
    #thumbs:hover li:hover img {
      -moz-box-shadow:0 0 30px rgba(255,255,255,0.5);
      -webkit-box-shadow:0 0 30px rgba(255,255,255,0.5);
    }
