*,
*::before,
*::after {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: "effra-cc-variable", sans-serif;
    --feg-text: rgb(32 54 78);
    --feg-black: #0b0d1e;
    --feg-white: hsl(25 0% 89% / 1);
    --salmon: #f9dad0;
    --baby: #e0dbcf;
    --sand: #f6e2d3;
    --peach: #fee0d0;
    --blue: #d6d6d6;

    color: var(--feg-text);

    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

[data-bg="sand"] {
    --bg: var(--sand)
}

[data-bg-2="sand"] {
    --bg2: var(--sand)
}

[data-bg="peach"] {
    --bg: var(--peach)
}

[data-bg-2="peach"] {
    --bg2: var(--peach)
}

[data-bg="salmon"] {
    --bg: var(--salmon)
}

[data-bg-2="salmon"] {
    --bg2: var(--salmon)
}

[data-bg="baby"] {
    --bg: var(--baby)
}

[data-bg-2="baby"] {
    --bg2: var(--baby)
}

[data-bg="blue"] {
    --bg: var(--blue);
}

[data-bg-2="blue"] {
    --bg2: var(--blue);
}

.noise {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 99;
    top: 0;
    left: 0;
    overflow: hidden;
    mix-blend-mode: overlay;
    pointer-events: none;
}

.noise::before {
    animation: grain 8s steps(10) infinite;
    background-image: url(noise-pattern.png);
    content: '';
    height: 200%;
    left: -25%;
    opacity: 0.6;
    position: fixed;
    top: -50%;
    width: 150%;
    overflow: hidden;
    background-size: 150px 150px;
}

@keyframes grain {
    0%, 100% {
        transform: translate(0, 0);
    }
    10% {
        transform: translate(-5%, -10%);
    }
    20% {
        transform: translate(-15%, 5%);
    }
    30% {
        transform: translate(7%, -20%);
    }
    40% {
        transform: translate(-5%, 20%);
    }
    50% {
        transform: translate(-15%, 10%);
    }
    60% {
        transform: translate(15%, 0%);
    }
    70% {
        transform: translate(0%, 15%);
    }
    80% {
        transform: translate(3%, 25%);
    }
    90% {
        transform: translate(-10%, 10%);
    }
}


h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: "effra-cc-variable", sans-serif;
    font-weight: 700;
    font-variation-settings: "wght" 700;
}

.popover, .tooltip {
    font-family: "effra-cc-variable", sans-serif;
}

.blog-content.blog-teaser h4 {
    font-family: "effra-cc-variable", sans-serif;
}


.btn {
    border-radius: 9999px;
    font-weight: 700;
    font-variation-settings: "wght" 700;
    min-width: 14rem;
}

.btn-primary {
    border-color: transparent !important;
}

.media-object.icon {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
}

.media-object.icon {
    background-color: #787581;
    color: #b4b2bf;
}

.media-object.icon i {
    margin: 0;
    font-size: 50px;
}

/* ######################### */
/* CONTENT */
/* ######################### */

section#content {
    flex-grow: 1;
}

dl.headlines dt.date a {
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

dl.headlines dt.date div:first-child {
    font-size: 20px;
    line-height: 1;
    letter-spacing: 0;
    font-weight: 700;
    font-variation-settings: "wght" 700;
    padding-top: 2px;
}

.img-rounded {
    border-radius: 8px;
}

/* ######################### */
/* DIVIDER */
/* ######################### */

.feg-divider {
    position: relative;
    pointer-events: none;
    overflow: hidden;
}

.feg-divider img {
    width: 100%;
    position: relative;
    z-index: 1;
    vertical-align: top;
    display: block;
    height: auto;
}

.feg-divider:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 80%;
    top: 0;
    left: 0;
    background: var(--bg, transparent);
}

.feg-divider:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 20%;
    bottom: 0;
    left: 0;
    background: var(--bg2, transparent);
}

.feg-svg-divider:before {
    height: 45%;
}

.feg-svg-divider:after {
    height: 55%;
}

.feg-svg-divider img {
    width: 140%;
    max-width: 140%;
    left: -10%;
}

svg {
    fill: currentColor;
    display: block;
    width: 100%;
    height: 100%;
}

@media screen and (min-width: 1000px) {
    .feg-svg-divider {
        margin-bottom: -3rem;
    }
}

@media screen and (max-width: 767px) {
    .feg-svg-divider {
        margin-bottom: -2rem;
    }
}

@media screen and (max-width: 699px) {
    .feg-svg-divider img {
        width: 200%;
        max-width: 200%;
        left: -50%;
    }
}

header {
    order: 1;
}

section#content {
    order: 2;
}

.feg-footer-divider {
    order: 3;
}

footer {
    order: 4;
}

section#copyright {
    order: 5;
}

.tab-pane > *:first-child,
.profile-picture + fieldset {
    margin-top: 0;
}

.tab-content {
    background: rgba(255, 255, 255, 0.5);
    padding: 16px;
    border-radius: 0 8px 8px 8px;
}

.tab-content + hr {
    border: none;
    margin-top: 16px;
    margin-bottom: 16px;
}

.nav-tabs,
.nav-tabs > li > a {
    border: none !important;
}

.nav-tabs > li {
    margin-bottom: 0;
}

.aside ul#submenu li a:hover, .aside ul.submenu li a:hover, .aside ul#submenu li a:focus, .aside ul.submenu li a:focus,
.nav > li > a:hover, .nav > li > a:focus {
    background: rgba(255, 255, 255, 0.32);
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    background: linear-gradient(180deg, #fff, rgba(255, 255, 255, 0.5)) !important;
}

.aside ul#submenu li.active > a, .aside ul.submenu li.active > a {
    background: rgba(255, 255, 255, 0.5);
}

.nav-tabs > li > a {
    border-radius: 8px 8px 0 0;
}

.aside ul#submenu li a, .aside ul.submenu li a {
    border-bottom: none;
    padding: 8px 15px 6px !important;
    border-radius: 8px;
}

section#content .content-header h2 {
    font-size: 32px;
}

@media screen and (max-width: 540px) {
    .tab-content {
        margin-left: -20px;
        margin-right: -20px;
        padding-left: 20px;
        padding-right: 20px;
        border-top-right-radius: 0;
    }

    .nav-tabs {
        margin-left: -12px;
        margin-right: -12px;
    }

    .nav > li > a {
        padding-left: 12px;
        padding-right: 12px;
    }

    section#content .content-header h2 {
        font-size: 30px;
    }
}

/* ######################### */
/* TABLES */
/* ######################### */

.text-muted {
    color: #535965;
}

.badge {
    background: rgb(63 104 148);
}

.table > thead > tr > td.warning, .table > tbody > tr > td.warning, .table > tfoot > tr > td.warning, .table > thead > tr > th.warning, .table > tbody > tr > th.warning, .table > tfoot > tr > th.warning, .table > thead > tr.warning > td, .table > tbody > tr.warning > td, .table > tfoot > tr.warning > td, .table > thead > tr.warning > th, .table > tbody > tr.warning > th, .table > tfoot > tr.warning > th {
    background-color: #00fffb1f !important;
}

.table th {
    padding: 6px 12px !important;
}

.table td {
    line-height: 1.4 !important;
    padding: 6px 12px !important;
}

.table tr {
    border-top: none !important;
    border-bottom: none !important;
}

.table tr td {
    border-top: none !important;
}

.table tr td:first-child > a:first-child {
    font-weight: 550;
    font-variation-settings: "wght" 550;
}

.table > thead > tr > th {
    border-bottom: 2px solid transparent;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.5);
}

.table-striped > tbody > tr:nth-of-type(even) {
    background-color: rgba(255, 255, 255, 0.32);
}

.table tbody > tr:first-child td:first-child {
    border-top-left-radius: 8px;
}

.table tbody > tr:first-child td:last-child {
    border-top-right-radius: 8px;
}

.table tbody > tr:last-child td:first-child {
    border-bottom-left-radius: 8px;
}

.table tbody > tr:last-child td:last-child {
    border-bottom-right-radius: 8px;
}

.alert {
    border-radius: 8px;
}

.fc table .fc-row {
    background-color: rgba(255, 255, 255, 0.5);
}

/* ######################### */
/* FORMS */
/* ######################### */

.form-signin .form-control,
.form-control {
    margin-bottom: 4px;
}

input, select, textarea {
    border-radius: 8px !important;
}

.input-group input:not(:last-child) {
    border-radius: 8px 0 0 8px !important;
}

.row:has(>.col-sm-4>#primary_last_name_prefix) .col-sm-8 {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

.col-sm-4:has(>#primary_last_name_prefix) {
    display: none;
}

.col-sm-8:has(>#primary_last_name_main) #primary_last_name_main::placeholder {
    opacity: 0;
    color: rgba(0, 0, 0, 0);
}

.col-sm-8:has(>#primary_last_name_main) #primary_last_name_main::-webkit-input-placeholder {
    opacity: 0;
    color: rgba(0, 0, 0, 0);
}

.col-sm-8:has(>#primary_last_name_main) #primary_last_name_main::-moz-placeholder {
    opacity: 0;
    color: rgba(0, 0, 0, 0);
}

/* ######################### */
/* CONTENT */
/* ######################### */

h1,
h2,
h3,
h4,
legend {
    background-size: 100%;
    background-repeat: repeat;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(330deg, rgb(124, 70, 127), rgb(67, 127, 138));
}


strong,
legend {
    font-weight: 700;
    font-variation-settings: "wght" 700;
}

legend {
    border-bottom: none;
    padding-bottom: 0;
}

section#content .content-header h2 {
    background-image: linear-gradient(330deg, #7c467f, #437f8a);
}

section#content .content-header {
    padding-top: 6rem;
    background-color: transparent;
}

body.no-template section#content {
    padding-top: 6rem;
}

body.no-template section#content > .container:first-child > .row:first-child {
    padding-top: 6px;
}

section#content .content-header .breadcrumb, section#content .content-header h2 {
    line-height: 1.1;
    padding-bottom: 0;
}


section#content .content-header .breadcrumb {
    display: none;
}

.aside .publication-item h5 {
    margin-bottom: 0;
}

h3 {
    background-image: linear-gradient(346deg, rgb(231, 152, 112), rgb(61, 111, 148), rgb(213, 111, 141));
}

h4 {
    background-image: linear-gradient(142deg, rgb(44, 63, 129), rgb(180, 74, 122), rgb(243, 131, 97));
}

legend {
    background-image: linear-gradient(122deg, rgb(232, 116, 89), rgb(240, 94, 103), rgb(200, 61, 52));
}

section#content .container .headline,
section#content .container .headline h2, section#content .container .headline h3, section#content .container .headline h4, section#content .container .headline h5, section#content .container .headline h6 {
    border-bottom: 0;
}

/* ######################### */
/* HEADER */
/* ######################### */

body header .container .header-nav .header-logo a h1 {
    background-image: url('https://assets.freude-eg.de/logo-feg.svg') !important;
}

body.no-template section#content,
section#content .content-header {
    position: relative;
}

body.no-template section#content:before,
section#content .content-header:before {
    content: "";
    position: absolute;
    height: 12px;
    width: 100%;
    left: 0;
    top: 0;
    background: linear-gradient(90deg, rgb(97, 76, 112), rgb(192 58 84), rgb(184 93 34), rgb(191 138 41));
}

header {
    box-shadow: none !important;
    background-color: var(--feg-black);
    color: var(--feg-white);
}

.sf-menu a {
    color: var(--feg-white);
}

.sf-menu > li {
    border-bottom: none !important;
}

.sf-menu > li.active > a, .sf-menu > li.path > a, .sf-menu > li:hover > a, .sf-menu > li:focus > a {
    text-decoration: underline;
    text-underline-offset: 0.4em;
}

header ul.sf-menu li.active a {
    color: var(--feg-white) !important;
}

.top-mobile a {
    color: #d2c07a !important;
}

#carousel-homepage.carousel .carousel-inner .item:before {
    background: transparent;
}

header .container .header-nav-top .login p a {
    color: #d2c07a;
}

header .container .header-nav-top .login p a:hover {
    color: #f8e7ac;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.help-block {
    line-height: 1.3;
    margin-top: 2px;
}

@media (min-width: 1200px) {
    .header-menu {
        font-size: 20px;
    }

    body {
        font-size: 18px;
    }

    label {
        font-size: 16px;
    }

    h1, .h1 {
        font-size: 46px
    }

    section#content .content-header h2,
    h2, .h2 {
        font-size: 36px
    }

    h3, .h3 {
        font-size: 32px
    }

    legend,
    h4, .h4 {
        font-size: 24px
    }

    h5, .h5 {
        font-size: 18px
    }

    label,
    .help-block,
    h6, .h6 {
        font-size: 16px
    }

    .btn {
        font-size: 18px;
    }

    .btn-lg, .btn-group-lg > .btn {
        font-size: 20px;
    }

    .btn-sm, .btn-group-sm > .btn {
        font-size: 16px;
    }

    .btn-xs, .btn-group-xs > .btn {
        font-size: 16px;
    }
}


@media (min-width: 992px) {
    header .container .header-nav .header-menu .sf-menu > li:last-child {
        margin-right: -1em;
    }
}

@media (max-width: 991px) {
    header ul.sf-menu {
        line-height: 1;
    }

    header .container .header-nav .header-menu {
        padding-top: 12px;
    }

    .top-mobile {
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .steps li {
        font-size: 12px;
    }

    .noise {
        display: none;
    }
}

.webpage-73196 .sign-up-member-status .radio-inline h4 {
    color: white;
    background: none;
    -webkit-text-fill-color: white;
}

.webpage-73196 .sign-up-member-status .radio-inline {
    border-radius: 8px;
    background: linear-gradient(330deg, #7c467f, #437f8a);
    color: #fff;
    display: block;
    max-width: 612px;
    margin-bottom: 14px;
    line-height: 1.3;
    padding-top: 20px;
    padding-right: 16px;
    filter: saturate(0.9);
}

.webpage-73196 .sign-up-member-status .controls > div:nth-child(2) .radio-inline {
    background: linear-gradient(122deg, #c68d5a, #e45c64, #4750cb);
}

.webpage-73196 .sign-up-member-status .controls > div:nth-child(3) .radio-inline {
    background: linear-gradient(142deg, #2c3f81, #b44a7a, #f3b961);
}

.webpage-73196 .sign-up-member-status .controls > div:nth-child(4) .radio-inline {
    background: linear-gradient(144deg, #a6466d, #4c898c, #64963d);
}

.webpage-73196 .sign-up-member-status .controls > div:last-child .radio-inline {
    margin-bottom: 0;
}

.webpage-73196 .sign-up-member-status .radio-inline:hover {
    filter: brightness(1.1);
}

.webpage-73196 .sign-up-member-status .radio-inline:has(input:checked) {
    filter: brightness(1.1);
    box-shadow: 0 0 0 2px var(--baby), 0 0 0 4px var(--feg-black);
}


.webpage-73196 .sign-up-member-status .radio-inline .text-muted {
    color: white;
}

.webpage-73196 .sign-up-member-status .radio-inline input {
    margin-left: -26px;
    margin-top: 5px;
}

.webpage-73196 form[action="/become-a-member"] > fieldset > legend:first-child {
    background-image: linear-gradient(142deg, rgb(54, 73, 131), rgb(152, 73, 110), rgb(220, 123, 94));
}

/* ######################### */
/* FOOTER */
/* ######################### */
footer {
    background-color: var(--blue);
    color: var(--feg-text);
    position: relative;
    padding-top: 30px;
    z-index: 2;
}

footer:before {
    content: "";

}

footer .headline,
footer .headline h2, footer .headline h3, footer .headline h4, footer .headline h5, footer .headline h6 {
    border-bottom: none;
}

/* ######################### */
/* COPYRIGHT */
/* ######################### */

section#copyright {
    border-top: none;
    background-color: var(--feg-black);
    color: var(--feg-white);
}

section#copyright .cg-reference svg {
    fill: var(--feg-white) !important;
}