.galeriacasa {
      width: 600px;
      height: 338px;
      margin: auto;
      padding: 0px 40px 40px 40px;
      position: absolute;
}   

.galeriacasa2 {
      width: 600px;
      height: 450px;
      margin: auto;
      padding: 0px 40px 40px 40px;
      position: absolute;
}   

/*Luego unos estilos específicos para cada imagen:*/

.galeriacasa div, .galeriacasa2 div {
   position: absolute;
   overflow: hidden;
   opacity: 0.9;
   -webkit-transition: all 0.5s linear;
   -webkit-border-radius: 15px;
   border-radius: 15px;
   -webkit-box-shadow: -3px -3px 50px #666;
   box-shadow: -3px -3px 50px #666;
   -webkit-transform: scale(0.20);
}   

/*Aquí lo que hacemos es crear un borde alrededor de cada imagen, dejarla un poco transparente y bajarla el tamaño, para que luego cuando pasemos el ratón crezca a su tamaño real.
Nota: Como venimos advirtiendo, las animaciones CSS 3 todavía no se encuentran disponibles en todos los navegadores. En estos ejemplos estamos trabajando a modo de demostración, con los atributos de CSS 3 propios del navegador Chrome o Safari. En breve podremos usar los atributos propios de CSS 3, que serían simplemente los mismos, pero quitando el prefijo -webkit. Pero de momento, para ver los ejemplos en funcionamiento y que se vean todas las animaciones CSS, hay que ejecutarlos en Google Chrome o Safari.*/
.galeriacasa div:hover {
   z-index: 999;
   -webkit-transform: rotate(0deg);
   opacity: 1;
   top: -80px;
   left: 370px;
}   

.galeriacasa2 div:hover {
   z-index: 999;
   -webkit-transform: rotate(0deg);
   opacity: 1;
   top: -160px;
   left: 370px;
}   

/*Con este código conseguimos que la imagen vaya al primer plano de la pantalla y se vea sin transparencia, al pasar el ratón por encima de la imagen.*/

.casa1, .casa1b {
   top: -100px;
   left: 110px;
   z-index:1;
}
.casa1b {top: -160px;}
         
.casa2, .casa2b {
   top: -100px;
   left: 240px;
   z-index:2;
}
.casa2b {top: -160px;}
         
.casa3, .casa3b {
   top: -100px;
   left: 370px;
   z-index:3;
}.casa3b {top: -160px;}
         
.casa4, .casa4b {
   top: -100px;
   left: 500px;
   z-index:4;
}
.casa4b {top: -160px;}
         
.casa5, .casa5b {
   top: -100px;
   left: 630px;
   z-index:5;
}
.casa5b {top: -160px;}

.casa6, .casa6b {
   top: -20px;
   left: 110px;
   z-index:1;
}
.casa6b {top: -60px;}
         
.casa7, .casa7b {
   top: -20px;
   left: 240px;
   z-index:2;
}
.casa7b {top: -60px;}
         
.casa8, .casa8b {
   top: -20px;
   left: 370px;
   z-index:3;
}
.casa8b {top: -60px;}
         
.casa9, .casa9b {
   top: -20px;
   left: 500px;
   z-index:4;
}
.casa9b {top: -60px;}
         
.casa10, .casa10b {
   top: -20px;
   left: 630px;
   z-index:5;
}
.casa10b {top: -60px;}