3D text style with shadow

Intoduction :- 
Hii Friends... 
Today I explain how to make 3D text style with shadow with the help of css. The solution to the shadow is to have 3D text. There are many models available which allow us to input their text in to the 3D model and use such in the site. Additionally, you could hire a 3D artist to make your logo from scratch or to animate your existing typography, specifically if it is to be used for marketing videos on the webpage.

Demo:-

Example :- 
<div class="Dotnet-text">Dotnet-Modules</div>
<link async href="http://fonts.googleapis.com/css?family=Arizonia" rel="stylesheet" type="text/css"/>
<style>
.Dotnet-text {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  background-color:#ff44c7;
  border: none;
  width:50%;
  padding-top:20px;
  height:30%;
  font: normal 75px/normal "Arizonia", Helvetica, sans-serif;
  color: rgba(255,255,255,1);
  text-align: center;
  -o-text-overflow: clip;
  text-overflow: clip;
  text-shadow: 0 15px 29px rgba(0,0,0,0.0980392) , 10px 20px 5px rgba(0,0,0,0.0470588) , -10px 20px 5px rgba(0,0,0,0.0470588) ;
  -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms;
  -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms;
  -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms;
  transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms;
}

.Dotnet-text:hover {
  text-shadow: 0 -15px 29px rgba(0,0,0,0.0980392) , 10px -20px 5px rgba(0,0,0,0.0470588) , -10px -20px 5px rgba(0,0,0,0.0470588) ;
}

</style>