Buttons - Simple Buttons
Notes: The button samples below can be used in your EvoGov website.
In your website's design theme, there should be a "Buttons" CSS template in the design admin.
If you don't see it listed, let us know and we can add it for you (older websites may not have it yet).
There are base color values in the CSS that can be changed to match your own website's color theme (we can help).
Those color variables let you change the colors of the buttons, including the border, background, text color, and hover color.
The "target=_blank" part of the code shown below is standard HTML that opens your button link in a new tab in the browser.
We are linking to Google.com in the examples below just to demonstrate the functionality of the buttons.
If you need any assistance, please let us know through our live chat system in your CMS.

Simple Button

We created these color options to save you time for most situations. If you need a custom color for you buttons let us know.
To create these button styles, simply add the classes listed below to any hyperlink.

Simple Button Green sample code: <a href="google.com" class="btn-simple-green" target="_blank">Google</a>

Simple Button OceanGreen sample code: <a href="google.com" class="btn-simple-oceangreen" target="_blank">Google</a>

Simple Button Blue sample code: <a href="google.com" class="btn-simple-blue" target="_blank">Google</a>

Simple Button Light Blue sample code: <a href="google.com" class="btn-simple-lightblue" target="_blank">Google</a>

Simple Button Slate sample code: <a href="google.com" class="btn-simple-slate" target="_blank">Google</a>

Simple Button Dark Blue sample code: <a href="google.com" class="btn-simple-darkblue" target="_blank">Google</a>

Simple Button Midnight sample code: <a href="google.com" class="btn-simple-midnight" target="_blank">Google</a>

Simple Button TealBlue sample code: <a href="google.com" class="btn-simple-tealblue" target="_blank">Google</a>

Simple Button Red sample code: <a href="google.com" class="btn-simple-red" target="_blank">Google</a>

Simple Button Orange sample code: <a href="google.com" class="btn-simple-orange" target="_blank">Google</a>

Simple Button Gray sample code: <a href="google.com" class="btn-simple-gray" target="_blank">Google</a>

Simple Button LightGray sample code: <a href="google.com" class="btn-simple-lightgray" target="_blank">Google</a>

Simple Button DarkGray sample code: <a href="google.com" class="btn-simple-darkgray" target="_blank">Google</a>

Simple Button dark sample code: <a href="google.com" class="btn-simple-dark" target="_blank">Google</a>

Simple Button Tan sample code: <a href="google.com" class="btn-simple-tan" target="_blank">Google</a>

Simple Button LightTan sample code: <a href="google.com" class="btn-simple-lighttan" target="_blank">Google</a>

Simple Button Brown sample code: <a href="google.com" class="btn-simple-brown" target="_blank">Google</a>

Simple Button DarkBrown sample code: <a href="google.com" class="btn-simple-darkbrown" target="_blank">Google</a>

Simple Button Gold sample code: <a href="google.com" class="btn-simple-gold" target="_blank">Google</a>

Simple Button GoldenSand sample code: <a href="google.com" class="btn-simple-goldensand" target="_blank">Google</a>

Simple Button SandyBrown sample code: <a href="google.com" class="btn-simple-sandybrown" target="_blank">Google</a>

Simple Button Crusta sample code: <a href="google.com" class="btn-simple-crusta" target="_blank">Google</a>

Simple Button Violet sample code: <a href="google.com" class="btn-simple-violet" target="_blank">Google</a>


Simple Grow Button 

To create this button, add a class of "btn-grow" to any hyperlink.
In code view, your hyperlink should look like this: <a href="google.com" class="btn-slide" target="_blank">Google</a>

Grow Button

Sliding Button

To create this button, add a class of "btn-slide" to any hyperlink.
In code view, your hyperlink should look like this: <a href="google.com" class="btn-slide" target="_blank">Google</a>

Preview:
Sliding Button

Glow Button

To create this button, add a class of "btn-glow" to any hyperlink.
In code view, your hyperlink code should look like this: <a href="google.com" class="btn-glow" target="_blank">Google</a>

Preview:

Glow Button


Pulse Button

This button is slightly different because instead of using this class on a typical hyperlink, you use it on an HTML button tag. Here is the sample code:
<a href="https://www.google.com" target="_blank"><button><span>Pulse Button</span></button></a>

Preview:


Push Button

To create this button, add a class of "btn-glow" to any hyperlink.
In code view, your hyperlink code should look like this: <a href="google.com" class="btn-push" target="_blank">Google</a>

Preview:

Button Push