How to copy CSS for this button?

Question

theres the download app button here https://www.templatemonster.com/demo/52146.html

that id like to mimic closely but because of these pseudo elements with stuff like :before and :before:hover i just dont have the capability to follow

help would be great

i know how to create the basic button (i think) but i dont understand their :before code, their div class is .btn, and im assuming the elements describing this class make up the button i see before i hover anything...so whats .btn:before? and how is that different from .btn:hover

also not sure how they got their transition effect where it fades vertically from blue to white....i assume its the 2nd technique here http://www.developerdrive.com/2015/01/8-simple-css-hover-effects/ where they use some trick with the height and transition timing

Answer 1

Information about the :before selector:

http://www.w3schools.com/cssref/sel_before.asp

More than likely, the fade effect is being performed by javascript. (The webpage you linked to has a number of JS scripts running on it).

Here's a previous Stack Overflow question regarding div fading:

How to do fade-in and fade-out with JavaScript and CSS