:root {
    --color-gruen: rgba(77, 150, 45, 1);
    --color-nav: rgb(125, 125, 125);
    --color-nav-activ: #4d962d;
    --color-nav-hover: #CB2042;
}

body {
    font-family: "trebuchet ms", arial, sans-serif;
}

.nav-link {
    color: var(--color-nav) !important;
    font-size:1.2rem;
}

.nav-link.active {
    color: var(--color-nav-activ) !important;
}

.nav-link:hover {
    color: var(--color-nav-hover) !important;
}

.dropdown-toggle::after {
    content: none;
}

.bg-green {
    background-color: rgba(77, 150, 45, 0.5);
}

.dropdown-menu {
    border-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    margin-left: -10px;
    border-color: var(--color-nav-hover);
    padding-top: 0;
    padding-bottom: 0;
}

.dropdown-item {
    color: var(--color-nav);
}

a.dropdown-item:hover, a.dropdown-item:focus, a.dropdown-item.active, a.dropdown-item:active  {
    background-color: var(--color-gruen);
    color: white;
    border-bottom-left-radius: 0.375rem;
    border-bottom-right-radius: 0.375rem;
}

a {
    color: var(--color-gruen);
}

a:hover, a:focus, a:active {
    color: var(--color-nav-hover);
}

h1, h2 {
    color: var(--color-gruen);
}

.color-green {
    color: var(--color-gruen);
}

footer a, footer a:hover {
    color: black;
}


@media (min-width: 1200px) {
    .h1, h1 {
        font-size: 2.2rem;
    }

    .h2, h2 {
        font-size: 1.8rem;
    }
}