Buttons

Button styles are devided to primary and secondary buttons. Depending on the browser the mouse cursor will either be shown as a hand icon or as a normal cursor.

Button​

Button-green.jpg
Button-hover2.jpg.png 

Primary button​:

Text: Arial, Regular,#fffffF
Button color: #529900
Rounded corners: 4 px

Hover:
Button color: #325911

Button-secondary.jpg
Button-secondary-hover.jpg


Secondary button:

Text: Arial, Bold, #fffffF
Border: 1 px slid, #DDD
Gradient: #000, #F0F0F0
Rounded corners: 4 px

Hover:
Arial Bold, 12 px, #F08C00
Border: 1 px solid #AAA
Gradient: #F0F0F0, #000

Buttons -marketing.png

Button in marketing oriented material (on Target page template)

Text: Corporate S, bold, #fffff
Text size: 43 px (sharp)
Width: 890
Height: 70
Button color: #529900
Rounded corners 4 px

 

​Device Text - primary button​ ​Text - secondary button
Wide desktop​ ​15 px ​12 px
​Tablet and desktop

​14 px

​?
​Phone ​14 px ​?
 
 

Example how to use marketing oriented button:

 

Buttons - marketing oriented page.png 

5/12/2016