Customize the pop-up animation

Complete this procedure to change the time it takes for a pop up window animation to open.

The gbc-animation-duration style specifies the delay (in seconds) that pop up windows take to open and close. The lower the number, the faster the pop up window is likely to appear.

The style is defined in the theme.scss.json file.

Open project_dir/customization/customization_project/theme.scss.json file in a text editor.
To set the animation to a slower speed, set the gbc-animation-duration style to a high number of seconds.
```
{
  ...
  "gbc-sidebar-always-visible-min-width" : "1400px",
  "gbc-sidebar-default-width"            : "350px",
  "gbc-animation-duration"               : "4.200s"
}
```
In this example, the animation is set to 4.2 seconds (a high number). When a pop up window is called, it appears to move slowly as it drops down from the menu bar.
To set the animation to a faster speed, set the gbc-animation-duration style to a fraction of a second.
```
{
  ...
  "gbc-sidebar-always-visible-min-width" : "9999px",
  "gbc-sidebar-default-width"            : "350px",
  "gbc-animation-duration"               : "0.200s"
}
```
In this example, the animation is set to 0.2 seconds (a low number). Pop up windows appear much faster.
Rebuild using grunt.
Test the animation works as expected. Open the demos application and click on the Application information menu icon to open the Product identification pop up window.
Tip: You may need to use CTRL + F5 to clear the browser cache before you see your changes.