.brick-outer-wrap{

}
.brick-wrap{
    letter-spacing:-0.31em !important;*letter-spacing:normal !important;word-spacing:-0.43em !important;
    width:100%;
    height:100%;
    position:fixed;
    overflow:hidden;
    padding-top:50px;
}
.brick{
    display:inline-block;zoom:1;*display:inline;letter-spacing:normal;word-spacing:normal;vertical-align:top;
    position:relative;
    
 -webkit-perspective: 500px;
    -moz-perspective: 500px;
      -o-perspective: 500px;
         perspective: 500px;
}
.brick .inner{
    background-color:#222277;
    border:1px solid #ddd;
    position:absolute;
    width:100%;
    height:100%;
    overflow:hidden;
}
.brick:hover .inner{


-webkit-transition: all 0.3s ease-in-out; 
     -moz-transition: all 0.3s ease-in-out; 
       -o-transition: all 0.3s ease-in-out; 
          transition: all 0.3s ease-in-out; 

/*
   -webkit-transform-style: preserve-3d;
     -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
          transform-style: preserve-3d;
          
        transform-origin:center top;
    -ms-transform-origin:center top;
-webkit-transform-origin:center top;
   -moz-transform-origin:center top;
     -o-transform-origin:center top;
          
  -webkit-transform: rotateX(-20deg); 
     -moz-transform: rotateX(-20deg);
      -ms-transform: rotateX(-20deg);
          transform: rotateX(-20deg);
*/
}
.brick .inner .colorBlock{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    
}