/*farben*/


/*:root {*/
/*    --variable-black: hsl(200, 0%, 15%);*/
/*    --variable-grey-darkest: hsl(200, 0%, 50%);*/
/*    --variable-grey-dark: hsl(200, 0%, 65%);*/
/*    --variable-grey-light: hsl(200, 0%, 95%);*/

/*    !*--variable-spot-color: hsl(180, 39%, 83%);*!*/

/*    --variable-spot-color: yellow;*/
/*    !*--variable-year-color: hsl(152, 100%, 45%);*!*/
/*    --variable-year-color: hsl(160, 90%, 41%);*/

/*    !*--variable-year-color: #ff48af;*!*/
/*    --variable-link-color: black;*/
/*    !*--variable-hover-color: hsl(1, 84%, 65%);*!*/
/*    --variable-hover-color: hsl(-10, 100%, 70%);*/


/*--variable-sinus-color: rgb(215, 246, 34);*/
/*}*/


/*    !**!*/

/*    !*--variable-link-color: hsl(275, 87%, 45%);*!*/

/*}*/

#d-logo, #m-logo, #d-byline, #m-byline, #d-date, #m-date {
    color: white;
    background-color: var(--variable-black);
    /*background-color: white;*/

}



#d-date-archive {
    background-color: var(--variable-hover-color);
    border: var(--variable-border) solid white;
    border-radius: var(--variable-border-radius);
}


#d-date-archive:hover {
  filter: brightness(130%);
}

#m-date-archive {
    background-color: var(--variable-hover-color);
    border: var(--variable-border) solid white;
    border-radius: var(--variable-border-radius);
}


.logo-home {
    color: white;

}

.logo-home:hover {
    color: var(--variable-hover-color);
}





#d-logo, #d-byline, #d-date, #d-menu-icon, .d-nav-item, .level-2,
#m-logo, #m-byline, #m-date, #m-menu-icon, .m-nav-item, .dropdown-btn, .sub-nav-title {
    border: var(--variable-border) solid white;
    border-radius: var(--variable-border-radius);
}

.m-img-container {
    border: var(--variable-border) solid transparent;
    border-radius: var(--variable-border-radius);

}

#d-menu-icon, #m-menu-icon, #d-close-menu-btn, #m-close-menu-btn {
    color: white;
    border-radius: 5px;
}



.img-grey {
    filter: grayscale(100%);
}


.level-1 {
    background-color: var(--variable-grey-darkest);
    /*background-color: hsl(275, 87%, 45%);*/
    /*background-color: #176838;*/
    /*background-color: #ff48af;*/

    color: white;

}

.level-2 {
    background-color: var(--variable-grey-light);

}

.menu-today {
    border: var(--variable-border) solid rgb(0, 0, 0);
    border-radius: var(--variable-border-radius);
}



.flexbox-item {
}

.selected {
    background-color: var(--variable-year-color);
    /*color: var(--variable-black);*/
    color: black;
}

.main-nav-active {
    background-color: var(--variable-year-color);
    color: black;
}

.colored {
    display: flex;
    background-color: var(--variable-year-color);
    border: var(--variable-border);
    border-radius: var(--variable-border-radius);
    color: black;
    font-weight: 400;
}

.arrow {
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--variable-black);
}


.artist-over-pic {
     /*color: #ff48af;*/
    color: var(--variable-hover-color);
    z-index: 1;

}



.level-3 {
       background-color: var(--variable-grey-dark)

}


:root {


    --initial-menu-level-1-lightness: 50%;
    --menu-level-1-lightness: var(--initial-menu-level-1-lightness);

    --initial-news-lightness: 64%;
    --news-lightness: var(--initial-news-lightness);

    --initial-projects-lightness: 47%;
    --projects-lightness: var(--initial-projects-lightness);

    --initial-artists-lightness: 44%;
    --artists-lightness: var(--initial-artists-lightness);

    --initial-media-lightness: 42%;
    --media-lightness: var(--initial-media-lightness);

    --initial-archive-lightness: 70%;
    --archive-lightness: var(--initial-archive-lightness);

    --initial-agenda-lightness: 50%;
    --agenda-lightness: var(--initial-agenda-lightness);

}

.menu-level-1 {
    background-color: hsl(240, 100%, var(--menu-level-1-lightness));
}





.menu-level-1:hover {
    --menu-level-1-lightness: calc(var(--initial-menu-level-1-lightness) - var(--initial-menu-level-1-lightness) * 0.3);
    --news-lightness: calc(var(--initial-news-lightness) - var(--initial-news-lightness) * 0.3);
    --projects-lightness: calc(var(--initial-projects-lightness) - var(--initial-projects-lightness) * 0.2);
    --artists-lightness: calc(var(--initial-artists-lightness) - var(--initial-artists-lightness) * 0.2);
    --media-lightness: calc(var(--initial-media-lightness) - var(--initial-media-lightness) * 0.2);
    --archive-lightness: calc(var(--initial-archive-lightness) - var(--initial-archive-lightness) * 0.2);
    --agenda-lightness: calc(var(--initial-agenda-lightness) - var(--initial-agenda-lightness) * 0.2);

}

/*.hover-link:hover {*/
/*    --about-lightness: calc(var(--initial-about-lightness) - var(--initial-about-lightness) * 0.2);*/
/*    --news-lightness: calc(var(--initial-news-lightness) - var(--initial-news-lightness) * 0.2);*/
/*    --projects-lightness: calc(var(--initial-projects-lightness) - var(--initial-projects-lightness) * 0.05);*/
/*    --artists-lightness: calc(var(--initial-artists-lightness) - var(--initial-artists-lightness) * 0.2);*/
/*    --media-lightness: calc(var(--initial-media-lightness) - var(--initial-media-lightness) * 0.2);*/
/*    --archive-lightness: calc(var(--initial-archive-lightness) - var(--initial-archive-lightness) * 0.2);*/
/*    --agenda-lightness: calc(var(--initial-agenda-lightness) - var(--initial-agenda-lightness) * 0.2);*/

/*}*/


.white-text {
    color: var(--variable-grey);
}
.grey-color-text {
    color: var(--variable-grey-dark);
}

.year-color-text {
    color: var(--variable-year-color);
}

.black {
    color: black;
}

.black-back {
    background-color: var(--variable-black);
}

/*   hover-image Schopfen Home :after :before ?*/

.hover-img:hover, .menu-level-news:hover {
    filter: brightness(1.10);
}


.d-nav-item:hover, #d-menu-icon:hover, #d-close-menu-btn:hover, #m-close-menu-btn:hover .dropdown-btn:hover, .dropdown-title-icon:hover, .arrow:hover {
    /*background-color: #ff48af;*/
    background-color: var(--variable-hover-color);
}

a:hover {
    color: var(--variable-hover-color);

}

.d-subnav-container a:hover {
    color: black;
}

.flexbox-item-day:hover {
    /*background-color: var(--variable-hover-color);*/
    transition: 0.3s;
}

.flex-container-days a:hover {
   color: var(--variable-hover-color);
}

.dropdown-item {
}

.no-margin-top {
    margin-top: 0;
}

.with-btn-icon {
  display: flex;
  justify-content: space-between;
  padding-right: 0;
}


footer {
    border-radius: var(--variable-border-radius);
}
