<! DOCTYPE html> "Content-type"Content="text/html; Charset=utf-8"/> <title>css3 3D shadow effects </title> <style>/*-----------Reset-----------*/*{margin:0; padding:0; } body {background: #000000; } A {color: #FF6600; Font: -14px/30px Helvetica, Verdana, sans-serif; } h1.title_name {font-family:"trebuchet MS","Myriad Pro", arial,sans-serif; Font-Weight:normal; Font-Size:4em; Color: #FAFAFA; Margin:0; padding:20px0 0 0; Text-Align:center; Line-height:1em; } h1.title_name span {font-family:normal Georgia,'Times New Roman', Times,serif; Color: #FF6600; Font-size:0. 9em; } h1.title_name Small {display:block; Font-family:normal verdana,arial,helvetica,sans-serif; Font-size:0. 3em; Font-Weight:bold; Letter-spacing:0. 5em; Text-transform:uppercase; Color: #AAA; Text-Shadow:none; } #container {width:750px; background: #FAFAFA; margin:100px auto; padding-bottom:50px; border-radius:5px;} Footer {background: #FFF; padding:10px; bottom:50px; margin-top:10px; Color: #333;} . demo {widows:750px; Margin:0Auto; } h2,h3 {padding:10px020px; font:50px/1 "trebuchet MS","Myriad Pro", arial,sans-serif; Text-Align:center; Text-Shadow:01px 1px #bbb,02px0#999, 03px0#888, 04px0#777, 05px0#666, 06px0#555, 07px0#444, 08px0#333, 09PX 7PX #302314; }. Box-Shadow {width:200px; height:100px; Margin-top:50px; Box-shadow:0 010px 5px Black, 20px-20px 10px red, 20px 20px 10px yellow, -20px 20px 10px Blue, -20px-20px 10px Green; } </style> <!--[ifIe]> <script src="Http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <! [endif]--> class="Title_name">CSS3 Shadow research<small>by Sunflowa Media cinema seats </small>"Container"> <section> <divclass="Demo"> class="Demo Box-shadow"> </div> </section> </div> </body> 3D shadow effect made by CSS3