how to use 2 box-shadow on a single button - css

Question

I want exactly matched button with gradient and Box-shadow.
I tried gradient css3 properties (box-shadow: 2px 3px 3px #333;) but couldn't meet the expected result. Can anyone Suggest me the proper way.

Answer 1

I'm not getting what you want but I'm trying according to your question.
You can use 2 color box-shadow and advance gradient use like this:-
.answer-btn {
color: #fff;
font-family: Arial, sans-serif;
min-width: 267px;
padding: 18px 0 19px;
text-align: center;
border: none;
border-bottom: inset 1px #2894cc;
border-color: -moz-use-text-color -moz-use-text-color rgba(38, 144, 202, 0.11);
background-color: #278abe;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHJhZGlhbEdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9Ii0yNSUiIHI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM0MWJlZTgiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyNjhhYmQiLz48L3JhZGlhbEdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA=');
background-size: 100%;
background-image: -moz-radial-gradient(50% -25%, ellipse farthest-side, #41bee8, #268abd 100%);
background-image: -webkit-radial-gradient(50% -25%, ellipse farthest-side, #41bee8, #268abd 100%);
background-image: radial-gradient(ellipse farthest-side at 50% -25%, #41bee8, #268abd 100%);
-moz-border-radius: 5px !important;
-webkit-border-radius: 5px;
border-radius: 5px !important;
-moz-box-shadow: 0px 7px 0px 0px #1b6b9e, 0px 0px 10px 1px #b3b3b4;
-webkit-box-shadow: 0px 7px 0px 0px #1b6b9e, 0px 0px 10px 1px #b3b3b4;
box-shadow: 0px 7px 0px 0px #1b6b9e, 0px 0px 10px 1px #b3b3b4;
-moz-transition: all 0.1s;
-o-transition: all 0.1s;
-webkit-transition: all 0.1s;
transition: all 0.1s;
font-size: 25px;
font-size: 1.5625rem;
}
.answer-btn:active {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
-moz-transform: translate(0px, 5px);
-ms-transform: translate(0px, 5px);
-webkit-transform: translate(0px, 5px);
transform: translate(0px, 5px);
}
https://jsfiddle.net/kant707/9zLLpLbg/