/*Basic CSS styles*/

header, nav, hgroup, section, footer, figure, figcaption { display: block; margin: 0; padding: 0; border: 0; }

strong { font-weight: bold;}

hr {
	color: #fff;
	border-top: dotted 2px #ccc;
	width: 600px;
	margin-left: 0;
}

section { margin: 0px 0 0 0px; border: #ccc; }

section h2 { margin: 0px 0px; }

section div {
	border-top: dotted .0px #ddd;
	margin: 0px 0;
	padding: 0 0px;
	overflow: visible;
	z-index: 5000;
	width: 70px;
	float: left;
}

figure { float: left; margin: 0px 0 0px 0px; padding: 0px; border: dotted .0px #ddd; 
z-index: 2000;}
figure figcaption { font: italic .90em georgia; color: #000; text-align: center; margin-top: 0px; z-index: 2000;}

#scale figure a img, #rotate figure a img, #skews figure a img {
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
		overflow: visible;

}

#transform	{
	transform: 
		translate(50px, 0px) 
		scale(1.5, 1.5)
	}

/*  -moz-transform-origin: 0 0;
    -moz-transform: scale(0.9);
    -moz-transition-duration: 1s;
    opacity: 0.5;
*/



#scale img {
/*    -moz-transform-origin: 0 0;
    -moz-transform: translate(0,0) /*scale(.2);*/
    -moz-transition-duration: 1s ease-in-out;
    opacity: .5;
    overflow: visible;

/*    
    filter: url(filters.svg#grayscale); /* Firefox 3.5+ */
/*    filter: gray; /* IE5+ */
/*    -webkit-filter: grayscale(1); /* Webkit Nightlies & Google Chrome Canary */

}



#scale img:hover {
    opacity: 1;
   -moz-transform: translate(00,0) scale(3);
    overflow: visible;

/*    filter: none;
    -webkit-filter: grayscale(.5);
*/    
}


#scale2 img {
    -moz-transition-duration: 1s ease-in-out;
    opacity: .5;
    overflow: visible;
}

#scale2 img:hover {
    opacity: 1;
   -moz-transform: translate(00,0) scale(3);
    overflow: visible;
  
}
	
#scale figure a:hover img {
	-webkit-transform: scale( 3 );
	-moz-transform: scale( 3 );
	-o-transform: scale( 3 );
	transform: scale( 3 );
	overflow: visible;
	z-index: 6000;

	
/*	-webkit-box-shadow: 4px 4px 10px rgba( 0, 0, 0, 0.5);
	-moz-box-shadow: 4px 4px 10px rgba( 0, 0, 0, 0.5);
	box-shadow: 4px 4px 10px rgba( 0, 0, 0, 0.5);
*/	
}

#translate_right {
	transform: translate(0px,100px);
	-ms-transform: translate(0px,100px); /* IE 9 */
	-webkit-transform: translate(0px,100px); /* Safari and Chrome */
	-o-transform: translate(0px,100px); /* Opera */
	-moz-transform: translate(0px,100px); /* Firefox */
}

#rotate figure a:hover img {
	-webkit-transform: scale( 1.5 ) rotate( -10deg );
	-moz-transform: scale( 1.5 ) rotate( -10deg );
	-o-transform: scale( 1.5 ) rotate( -10deg );
	transform: scale( 1.5 ) rotate( -10deg );

}

#skews figure a:hover img {
	-webkit-transform: skew( -45deg, 15deg );
	-moz-transform: skew( -45deg, 15deg );
	-o-transform: skew( -45deg, 15deg );
	transform: skew( -45deg, 15deg );

}