*{ margin:0; padding:0;}

#content2 {
 width:960px;
 margin:10px auto;
 font:14px/21px Arial,Helvetica,sans-serif;
 }
 
#movieposters {
 list-style:none;
 margin:60px 0;
 height:400px;
 }
 
#movieposters li {
 padding:10px;
 display:inline;
 float:left;
 -webkit-perspective: 400;
 -webkit-transform-style: preserve-3d;
 -webkit-transition-property: perspective;
 -webkit-transition-duration: 0.5s;
 }
 
#movieposters li:hover {
 -webkit-perspective: 5000;
 }
 
#movieposters li img {
margin:15px 0 0 0;	
 border:10px solid #033a6B;
 -webkit-transform: rotateY(30deg);
 -moz-box-shadow:0 3px 10px #777;
 -webkit-box-shadow:0 3px 10px #777;
 -webkit-transition-property: transform;
 -webkit-transition-duration: 0.5s;
 }
 
#movieposters li:hover img {
 -webkit-transform: rotateY(0deg);
 }
 
.movieinfo {
 border:10px solid #033a6B;
 padding:5px;
 width:200px;
 height:160px;
 background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
 margin:-265px 0 0 55px;
 position:absolute;
 -moz-box-shadow:0 20px 25px #777;
 -webkit-box-shadow:0 20px 25px #777;
 -webkit-transform: translateZ(30px) rotateY(30deg);
 -webkit-transition-property: transform, box-shadow, margin;
 -webkit-transition-duration: 0.5s;
 }
 
#movieposters li:hover .movieinfo {
 -webkit-transform: rotateY(0deg);
 -webkit-box-shadow:0 5px 10px #777;
 margin:-165px 0 0 30px;
 }
 
.movieinfo h3 {
 color:#7a3f3a;
 font-variant: small-caps;
 font-family:Georgia,serif,Times;
 text-align:center;
 padding-bottom:2px;
 }
 
.movieinfo p {
 padding-bottom:5px;
 }
 
.movieinfo a {
 font-weight: bold;
	background: rgb(54,170,231); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(54,170,231,1) 0%, rgba(3,58,107,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(54,170,231,1)), color-stop(100%,rgba(3,58,107,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(54,170,231,1) 0%,rgba(3,58,107,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(54,170,231,1) 0%,rgba(3,58,107,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(54,170,231,1) 0%,rgba(3,58,107,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(54,170,231,1) 0%,rgba(3,58,107,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#36aae7', endColorstr='#033A6B',GradientType=0 ); /* IE6-9 */
    border: 1px solid #033a6B;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset;
    color: #ffffff;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset;
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    padding: 7px 15px;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
    z-index: 2;
 text-decoration:none;
 display:block;
 width:90px;
 text-align:center;
 margin:0 auto;

  -webkit-transform: rotateY(20deg);
 -moz-box-shadow:0 1px 1px #777;
 -webkit-box-shadow:0 1px 1px #777;
 -webkit-transition-property: transform;
 -webkit-transition-duration: 0.5s;
 }
 
.movieinfo a:hover, .movieinfo a:focus {
 padding: 10px 16px 5px 16px;
    background:#49505a;
    border-bottom: 1px solid #32373e;
    border-left: 1px solid #32373e;
    border-right: 1px solid #32373e;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
    color: #eeeeee;
    cursor: pointer;
    font-size: 16px;
    padding: 8px 15px 8px 15px;
    text-decoration: none;
    color: #eeeeee;
  -webkit-transform: rotateY(0deg);
 -webkit-box-shadow:0 2px 2px #777;
 }