/* CSS HEX */

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Code+Latin&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@400;700&display=swap');
html {
    scroll-behavior: smooth;
    --hunter-green: #386641ff;
    --light-coral: #e78f8eff;
    --prussian-blue: #0b3954ff;
    --parchment: #f2e8cfff;
    --bittersweet-shimmer: #bc4749ff;
}

html, body, * {
    font-family: 'Fira Sans', sans-serif !important;
}

.w3-theme-l5 {
    color: #000 !important;
    background-color: #ebfef4 !important
}

.w3-theme-l4 {
    color: #000 !important;
    background-color: #bdfddb !important
}

.w3-theme-l3 {
    color: #000 !important;
    background-color: #7cfcb7 !important
}

.w3-theme-l2 {
    color: #000 !important;
    background-color: #3afa94 !important
}

.w3-theme-l1 {
    color: #fff !important;
    background-color: #06eb71 !important
}

.w3-theme-d1 {
    color: #fff !important;
    background-color: #049849 !important
}

.w3-theme-d2 {
    color: #fff !important;
    background-color: #038741 !important
}

.w3-theme-d3 {
    color: #fff !important;
    background-color: #037639 !important
}

.w3-theme-d4 {
    color: #fff !important;
    background-color: #036531 !important
}

.w3-theme-d5 {
    color: #fff !important;
    background-color: #025529 !important
}

.w3-theme-light {
    color: #000 !important;
    background-color: #ebfef4 !important
}

.w3-theme-dark {
    color: #fff !important;
    background-color: #025529 !important
}

.w3-theme-action {
    color: #fff !important;
    background-color: #f65e1c !important
}

.w3-theme {
    color: #fff !important;
    background-color: #04aa51 !important
}

.w3-text-theme {
    color: #04aa51 !important
}

.w3-border-theme {
    border-color: #04aa51 !important
}

.w3-hover-theme:hover {
    color: #fff !important;
    background-color: #04aa51 !important
}

.w3-hover-text-theme:hover {
    color: #04aa51 !important
}

.w3-hover-border-theme:hover {
    border-color: #04aa51 !important
}

.w3-content {
    max-width: 1024px !important;
}

.no-text-decoration {
    text-decoration: none;
}

.w-animate-top {
    position: relative;
    animation: animatetop 1.5s
}

@keyframes animatetop {
    from {
        top: -300px;
        opacity: 0
    }
    to {
        top: 0;
        opacity: 1
    }
}

.w-animate-left {
    position: relative;
    animation: animateleft 1.5s
}

@keyframes animateleft {
    from {
        left: -300px;
        opacity: 0
    }
    to {
        left: 0;
        opacity: 1
    }
}

.w-animate-right {
    position: relative;
    animation: animateright 1.5s
}

@keyframes animateright {
    from {
        right: -300px;
        opacity: 0
    }
    to {
        right: 0;
        opacity: 1
    }
}
