text zoom animation angularjs animation

<!DOCTYPE html>
<html>

  <head>
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.js"></script>
  
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
    <style>
   
 .newClass-add, .newClass-remove{
   transition: all cubic-bezier(0.250,0.450,0.460,0.940) 0.5s;
   
 }
   .newClass, .newClass-add.newClass-add-active{
     font-size: 40px;
     color:#000;
     width: 300px;
     text-shadow: 2px 2px 4px black;
   }    
   .newClass-add.newClass-remove-active{
     font-size: 14px;
     
   }
      </style>
      </head>

  <body ng-app="ngAnimate">
   <input type="button" value="Show" ng-click="myClass='newClass'">
   <input type="button" value="Hide" ng-click="myClass=''">
   <div ng-class="myClass"><h4>This is a Div</h4></div>
  </body>

</html>

// Code goes here

/* Styles go here */