Box gradient using CSS

.menu{

/* Safari 4-5, Chrome 1-9
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(#43aedb));*/

/* Safari 5.1, Chrome 10+
background: -webkit-linear-gradient(top, #43aedb, #1a82f7);*/

/* Firefox 3.6+
background: -moz-linear-gradient(top, #43aedb, #1a82f7);*/

/* IE 10
background: -ms-linear-gradient(top, #43aedb, #1a82f7);*/

/* Opera 11.10+
background: -webkit-linear-gradient(top, #E0E9ED, #43aedb); */

}

gredient

CSS for box shadow

.tx
{
position: relative;
}
.tx:before, .tx:after
{
z-index: -1;
position: absolute;
content: “”;
bottom: 25px;
left: 10px;
width: 50%;
top: 80%;
max-width:300px;
background: #777;
-webkit-box-shadow: 0 35px 20px #777;
-moz-box-shadow: 0 35px 20px #777;
box-shadow: 0 35px 20px #777;
-webkit-transform: rotate(-8deg);
-moz-transform: rotate(-8deg);
-o-transform: rotate(-8deg);
-ms-transform: rotate(-8deg);
transform: rotate(-8deg);
}
.tx:after,
{
-webkit-transform: rotate(8deg);
-moz-transform: rotate(8deg);
-o-transform: rotate(8deg);
-ms-transform: rotate(8deg);
transform: rotate(8deg);
right: 10px;
left: auto;
}

shadow