:root
{
	--color-main: #059669;
    --color-main-light: #26a681;
    --color-main-10: #e6f4f0;
    --color-main-dark: #00835a;
    --color-main-text: #324244;
    --color-main-text-light: #fff;
	--color-green: #059669;
	--color-blue: #155dfc;
}

.ui-button
{
	position: relative;
	display: block;
    padding: 15px 30px;
    font-size: 14px;
    font-weight: 700;
    color: var(--color-main-text-light);
    background: linear-gradient(to right, var(--color-green) 0%, var(--color-blue) 50%, var(--color-green) 100%);
    background-size: 300% 100%;
    background-position: 100% 0%;
	border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
    -o-transition: 0.3s;
    -webkit-transition: 0.3s;
}

.ui-button:hover
{
    background-position: 0% 0%;
}

.ui-button:active
{
    background-position: 100% 0%;
}

@-webkit-keyframes gradient-shift
{
	0%
	{
		background-position: 0% 50%;
	}
	
	50%
	{
		background-position: 100% 50%;
	}
	
	100%
	{
		background-position: 0% 50%;
	}
}