.button {
    position:relative;
    margin-top:.5rem;
    margin-bottom:.5rem;
}

a.button,
.button a {
    font: var(--font_size04) var(--standard);
    padding:1rem 2rem;
    text-align:center;
    background-color: var(--ci100);
    border:0 solid transparent;
    border-radius: var(--radius_half);
    font-weight:bold;
    text-decoration:none;
    color: var(--white100) !important;
    transition: var(--animation_05);
}

a.button:hover,
.button a:hover {
    background-color: var(--ci400);
    color: var(--white100);
    transition: var(--animation_05);
}

a.button--color1,
.button--color1 a {
    background: var(--gradient-green-01);
    background-color: var(--ci100);
}
a.button--color1:hover,
a.button--color1:focus,
.button--color1 a:hover, 
.button--color1 a:focus {
    background: transparent;
    background-color: var(--ci400);
}

.button.button--color2 a {
    background: var(--gradient-green-05);
    background-color: var(--ci100);
}

.button.button--color2 a:hover, 
.button.button--color2 a:focus {
    background: transparent;
    background-color: var(--ci400);
}

.button.button--color3 a {
    background-color: var(--ci400);
}

.button.button--color3 a:hover, 
.button.button--color3 a:focus {
    background-color: var(--ci100);
    color: var(--white100);
}

.button.button--color4 a {
    background-color: var(--ci200);
}

.button.button--color4 a:hover, 
.button.button--color4 a:focus {
    background-color: var(--ci400);
    color: var(--white100);
}



.button.buttonCenter {
    text-align:center;
}

.button.buttonRight {
    text-align:right;
}
