/*
 * Feel free to edit any of the styles below.
 */

/* ensure all the elements styled below use border-box */
body {
    margin: 0;
    padding: 0;
}
s

.block, #grid {
    box-sizing: border-box;
}

/* The object before it is transformed */
#o1 {
    background: #ffcccc;
}

/* The object after it has been transformed */
#o2 {
    background: #ffffff;
    
    pointer-events: all;
	
	-webkit-transform: matrix3d(0.688886, -0.032061, 0, 0.000073, 
                    -0.00868, 0.569926, 0, -0.00017, 
                    0, 0, 1, 0, 
                    164, 136, 0, 1);
   -moz-transform: matrix3d(0.688886, -0.032061, 0, 0.000073, 
                    -0.00868, 0.569926, 0, -0.00017, 
                    0, 0, 1, 0, 
                    164, 136, 0, 1);
	 transform: matrix3d(0.688886, -0.032061, 0, 0.000073, 
                    -0.00868, 0.569926, 0, -0.00017, 
                    0, 0, 1, 0, 
                    164, 136, 0, 1);
                    
   -webkit-transform-origin: 0px 0px 0px;
   -moz-transform-origin: 0px 0px 0px;
 	 transform-origin: 0px 0px 0px;
		 
	 /* Need to make sure you define the width and height */
	 width: 1024px;
	 height: 768px;
     
     
     -webkit-transform-style: preserve-3d; 
     transform-style: preserve-3d; 
     outline: 1px solid transperent;
     image-rendering: auto;
     -webkit-backface-visibility: hidden;
     perspective: 1px;       
	 filter: url("data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><filter id="gaussian_blur"><feGaussianBlur in="SourceGraphic" stdDeviation="0" /></filter></defs></svg>#gaussian_blur");
}

video {
	outline 1px solid transperent;
	 
}

/* Common styles for box objects. */
.block {
    font-size: inherit;
} 

/* CSS for the grid */
#grid {
    background: url("../images/iPad2.jpg") no-repeat scroll 0 0 white;
	  width: 1024px;
    height: 768px;
    position: relative; 	
    
    outline: 1px solid transparent;
    
    transform-style: preserve-3d; 
    image-rendering: auto;
    -webkit-backface-visibility: hidden;
    perspective: 1px;
    filter: url("data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><filter id="gaussian_blur"><feGaussianBlur in="SourceGraphic" stdDeviation="0" /></filter></defs></svg>#gaussian_blur");
    
}