/*
========================================================
 VOLTCORE AFRICA
 GREEN READABILITY
========================================================
*/


/* ======================================================
   PRIMARY GREEN
   Softer than the previous bright neon green
====================================================== */

:root {

    --voltcore-green:
        #45c92a;

    --voltcore-green-soft:
        #6bd957;

    --voltcore-green-dark:
        #29951d;

    --voltcore-green-bg:
        rgba(69,201,42,.08);

}


/* ======================================================
   GREEN TEXT
====================================================== */

.green,
.highlight,
.accent,
.kicker,
.label,

.hero .green,
.hero .highlight,
.hero .accent,

section .green,
section .highlight,
section .accent {

    color:
        var(--voltcore-green-soft) !important;

}


/* ======================================================
   HEADINGS WITH GREEN SPANS
====================================================== */

h1 span,
h2 span,
h3 span,

.hero h1 span,
.hero h2 span,
.hero h3 span {

    color:
        var(--voltcore-green-soft) !important;

}


/* ======================================================
   NAVIGATION
====================================================== */

nav a:hover,
nav a.active {

    color:
        var(--voltcore-green-soft) !important;

}


/* ======================================================
   GREEN BORDERS
====================================================== */

.green-border,
.green-line,
.service-card,
.services-card,
.product-card,
.products-card {

    border-color:
        rgba(69,201,42,.20) !important;

}


/* ======================================================
   GREEN BACKGROUNDS
====================================================== */

.green-bg,
.green-panel {

    background:
        var(--voltcore-green-bg) !important;

}


/* ======================================================
   BUTTONS
====================================================== */

button,
.btn,
.button,
.cta,
.quote,
a.btn,
a.button {

    background:
        #45c92a !important;

    color:
        #061006 !important;

}


/* ======================================================
   BUTTON HOVER
====================================================== */

button:hover,
.btn:hover,
.button:hover,
.cta:hover,
.quote:hover,
a.btn:hover,
a.button:hover {

    background:
        #55d83b !important;

    color:
        #061006 !important;

}


/* ======================================================
   OUTLINE BUTTONS
====================================================== */

.btn-outline,
.button-outline {

    background:
        transparent !important;

    color:
        #6bd957 !important;

    border:
        1px solid
        rgba(69,201,42,.45) !important;

}


/* ======================================================
   ICONS
====================================================== */

.service-icon,
.card-icon,
.icon {

    color:
        #6bd957 !important;

    border-color:
        rgba(69,201,42,.25) !important;

    background:
        rgba(69,201,42,.06) !important;

}


/* ======================================================
   BADGES
====================================================== */

.badge,
.tag,
.product-badge,
.spec {

    color:
        #6bd957 !important;

    border-color:
        rgba(69,201,42,.30) !important;

    background:
        rgba(69,201,42,.06) !important;

}


/* ======================================================
   LINKS
====================================================== */

a:hover {

    color:
        #6bd957 !important;

}


/* ======================================================
   GREEN GLOW
   Reduce excessive neon effect
====================================================== */

.glow,
.green-glow {

    text-shadow:
        none !important;

    box-shadow:
        none !important;

}


/* ======================================================
   MOBILE
====================================================== */

@media (max-width:699px) {

    .green,
    .highlight,
    .accent,
    .kicker,
    .label,

    h1 span,
    h2 span,
    h3 span {

        color:
            #70d85e !important;

    }

}