3D Box CSS3.

<style type="text/css">

body {
background: #33b5e5;
}

.foo {
position: relative;
display: inline-block;
-webkit-perspective: 1000px;
-moz-perspective: 1000px;
persepctive: 1000px;
margin: 20px;
margin-top: 50px;
}

.foo .box {
transform: rotateY(-40deg);
height: 350px;
width: 250px;
background-color: black;
}

.foo:before {
content: "";
top: -15px;
position: absolute;
width: 55px;
height: 375px;
background-color: grey;
transform: translateX(215px) translateY(2.7px) rotateY(55deg)
}

</style>

<div class="foo">
    <div class="box"></div>
</div>


Output :)