<div id="complete_example"></div>

<div id="e_example">
	<div class="palm-text-wrapper">
		<div class="palm-body-text" x-mojo-loc=''>
			Using the CSS transform properties, box elements can be translated, rotated, skewed and scaled.
		</div>
		
		<div class="palm-body-title" x-mojo-loc=''>
			Example
		</div>
		
		<div class="palm-body-text" x-mojo-loc=''>
			An example of using <em>-webkit-transform</em> property, to rotate an object (image) 10 degree from the origin. Plus, <em>-webkit-box-shadow</em> for another fancy effect.
		</div>
		
		<div style="margin:30px;background-color:#fff;width:200px;height:240px;padding:10px;-webkit-transform:rotate(10deg);-webkit-box-shadow:5px 8px 15px #666;">
			<img src="images/photo.jpg" alt="photo"/>
			<div style="text-align:center;color:#333">at work</div>
		</div>	
			
	</div>
</div>

<div id="e_about">
</div>

<div id="e_html">
<div id="photo">
	<img src="images/photo.jpg" alt="image here" style="width:200px;height:200px;overflow:hidden;"/>
	<div style="text-align:center;">label here</div>
</div>	
</div>

<div id="e_css">
#photo {
	background-color: #fff;
	width: 200px; 
	height: 240px;
	padding: 10px;
	-webkit-transform: rotate(10deg);
	-webkit-box-shadow: 5px 8px 15px #666; 
}
</div>