
a.button,
.button a {
    position:relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-block: 1rem;
    font: var(--font_size04) var(--standard);
    padding:1rem 2rem;
    border: 0px solid transparent;
    border-radius: var(--radius_half);
    font-weight:bold;
    text-decoration:none;
    color: var(--white100);
    transition: var(--animation_05) !important;
}

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

a.button.button--color1,
.button.button--color1 a {
    background: var(--gradient-head-links-03);
}
a.button.button--color1:hover,
a.button.button--color1:focus,
.button.button--color1 a:hover, 
.button.button--color1 a:focus {
    background: var(--gradient-head-links-04);
    color: var(--white100);
}

a.button.button--color2,
.button.button--color2 a {
    background: var(--gradient-head-links-01);
}

a.button.button--color2:hover, 
a.button.button--color2:focus,
.button.button--color2 a:hover, 
.button.button--color2 a:focus {
    background: var(--gradient-head-links-02);
    color: var(--white100);
}

a.button.button--color3,
.button.button--color3 a {
    background: var(--gradient-head-links-08);
}

a.button.button--color3:hover, 
a.button.button--color3:focus,
.button.button--color3 a:hover, 
.button.button--color3 a:focus {
    background: var(--gradient-head-links-09);
    color: var(--white100);
}

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

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


a.button i,
.button a i {
    padding-right: .5rem;
}

a.button.buttonFull,
.button.buttonFull a {
    display: flex !important;
}

.buttonShadow {
    box-shadow: var(--boxShadowSmall);
}

