/**********************
***********************
*** SIMPLE ELEMENTS ***
***********************
**********************/

/* Grid element span 2 cols on desktop else 1 */
.element_preset_grid_span_two_cols_on_desktop_else_one
{
    grid-column: span 1;
}

@media (min-width: 1300px)
{
    .element_preset_grid_span_two_cols_on_desktop_else_one
    {
        grid-column: span 2;
    }
}

/* END Grid element span 2 cols on desktop else 1 */

/* Projekte Abschnitt */

.element_preset_projekte_abschnitt
{
    color: var(--color_white);
    background-color: var(--accent_color_secondary);

    padding-top: var(--spacing_standard);
    padding-bottom: var(--spacing_standard);
    padding-left: var(--spacing_standard);
    padding-right: var(--spacing_standard);
}

.element_preset_projekte_abschnitt_inverted
{
    color: var(--accent_color_secondary);
    background-color: var(--color_white);

    border: 1px solid var(--accent_color_secondary);

    padding-top: var(--spacing_standard);
    padding-bottom: var(--spacing_standard);
    padding-left: var(--spacing_standard);
    padding-right: var(--spacing_standard);
}

/* END Projekte Abschnitt */

/* Projekte Titel */

.element_preset_projekte_titel
{
    font-size: var(--font_size_xxxl);
    text-align: center;
}

/* END Projekte Titel */

/* Projekte Referent */

.element_preset_projekte_referent_text
{
    font-style: italic;

    padding-top: var(--spacing_standard);
    padding-bottom: var(--spacing_standard);
    padding-left: var(--spacing_standard);
    padding-right: var(--spacing_standard);

    background-color: var(--color_white);
    border: 1px solid var(--accent_color_secondary_faint);
}

.element_preset_projekte_referent_format
{
    padding-top: var(--spacing_standard);
    padding-bottom: var(--spacing_standard);
    padding-left: var(--spacing_standard);
    padding-right: var(--spacing_standard);

    background-color: var(--color_white);
    border: 1px solid var(--accent_color_secondary_faint);
    border-radius: var(--spacing_standard);
}

.element_preset_projekte_referent_format_subtitel
{
    color: var(--accent_color_secondary);
    font-size: var(--font_size_s);
}

.element_preset_projekte_referent_format_highlighted
{
    color: var(--color_white);
    background-color: var(--accent_color_secondary);

    h4
    {
        color: var(--color_white);
    }

    .element_preset_projekte_referent_format_subtitel
    {
        color: var(--accent_color_secondary_faint);
    }

    .element_chiplist_chip
    {
        color: var(--accent_color_secondary);
    }

    .element_call_to_action
    {
        color: var(--accent_color_secondary);
        background-color: var(--color_white);
    }

    .element_call_to_action:hover
    {
        color: var(--color_white);
        background-color: var(--accent_color_secondary);
        border-color: var(--color_white);
    }
}

/* END Projekte Referent */

/* Miscellaneous */

.element_preset_simplelink_style_a
{
    display: flex;
    
    font-size: var(--font_size_l);

    justify-content: center;
    align-items: center;

    text-align: center;
}

/* END Miscellaneous */

/************
*************
*** GRIDS ***
*************
************/

.element_grid_preset_table
{
    gap: 0px !important;

    border-bottom: 2px solid var(--grid_preset_table_head_row_color);

    border-radius: var(--spacing_standard);
}

.element_grid_preset_table_head
{
    font-weight: bold;

    color: var(--grid_preset_table_head_font_color) !important;
    background-color: var(--grid_preset_table_head_row_color) !important;
}

.element_grid_preset_table_head:first-of-type { border-top-left-radius: var(--spacing_standard); }
/* Note: Last of type only works if there are no other same-tag-siblings. Need the workaround otherwise. */
.element_grid_preset_table > .element_grid_preset_table_head:last-of-type,
.element_grid_preset_table > .element_grid_preset_table_head:has(+ :not(.element_grid_preset_table_head))
{
    border-top-right-radius: var(--spacing_standard);
}

.element_grid_preset_table > *
{
    padding-left: var(--spacing_xl);
    padding-right: var(--spacing_xl);
    padding-top: var(--spacing_xl);
    padding-bottom: var(--spacing_xl);

    background-color: var(--grid_preset_table_odd_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="2"] > *:nth-child(4n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="2"] > *:nth-child(4n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="3"] > *:nth-child(6n - 2),
.element_grid_preset_table[data-grid_size_horizontal_mobile="3"] > *:nth-child(6n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="3"] > *:nth-child(6n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="4"] > *:nth-child(8n - 3),
.element_grid_preset_table[data-grid_size_horizontal_mobile="4"] > *:nth-child(8n - 2),
.element_grid_preset_table[data-grid_size_horizontal_mobile="4"] > *:nth-child(8n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="4"] > *:nth-child(8n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="5"] > *:nth-child(10n - 4),
.element_grid_preset_table[data-grid_size_horizontal_mobile="5"] > *:nth-child(10n - 3),
.element_grid_preset_table[data-grid_size_horizontal_mobile="5"] > *:nth-child(10n - 2),
.element_grid_preset_table[data-grid_size_horizontal_mobile="5"] > *:nth-child(10n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="5"] > *:nth-child(10n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="6"] > *:nth-child(12n - 5),
.element_grid_preset_table[data-grid_size_horizontal_mobile="6"] > *:nth-child(12n - 4),
.element_grid_preset_table[data-grid_size_horizontal_mobile="6"] > *:nth-child(12n - 3),
.element_grid_preset_table[data-grid_size_horizontal_mobile="6"] > *:nth-child(12n - 2),
.element_grid_preset_table[data-grid_size_horizontal_mobile="6"] > *:nth-child(12n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="6"] > *:nth-child(12n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="7"] > *:nth-child(14n - 6),
.element_grid_preset_table[data-grid_size_horizontal_mobile="7"] > *:nth-child(14n - 5),
.element_grid_preset_table[data-grid_size_horizontal_mobile="7"] > *:nth-child(14n - 4),
.element_grid_preset_table[data-grid_size_horizontal_mobile="7"] > *:nth-child(14n - 3),
.element_grid_preset_table[data-grid_size_horizontal_mobile="7"] > *:nth-child(14n - 2),
.element_grid_preset_table[data-grid_size_horizontal_mobile="7"] > *:nth-child(14n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="7"] > *:nth-child(14n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="8"] > *:nth-child(16n - 7),
.element_grid_preset_table[data-grid_size_horizontal_mobile="8"] > *:nth-child(16n - 6),
.element_grid_preset_table[data-grid_size_horizontal_mobile="8"] > *:nth-child(16n - 5),
.element_grid_preset_table[data-grid_size_horizontal_mobile="8"] > *:nth-child(16n - 4),
.element_grid_preset_table[data-grid_size_horizontal_mobile="8"] > *:nth-child(16n - 3),
.element_grid_preset_table[data-grid_size_horizontal_mobile="8"] > *:nth-child(16n - 2),
.element_grid_preset_table[data-grid_size_horizontal_mobile="8"] > *:nth-child(16n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="8"] > *:nth-child(16n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 8),
.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 7),
.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 6),
.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 5),
.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 4),
.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 3),
.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 2),
.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="9"] > *:nth-child(18n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 9),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 8),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 7),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 6),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 5),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 4),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 3),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 2),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 1),
.element_grid_preset_table[data-grid_size_horizontal_mobile="10"] > *:nth-child(20n - 0)
{
    background-color: var(--grid_preset_table_even_row_color);
}

/**********************
***********************
*** ROLLING CONTENT ***
***********************
**********************/

.element_rolling_content_preset_inverted
{
    color: var(--color_white);
}

.element_rolling_content_preset_inverted .element_rolling_content_startpause_button
{
    border: 1px solid var(--color_faint_gray);
    background: conic-gradient(var(--color_white) calc(100%), transparent 0);
}

.element_rolling_content_preset_inverted .element_rolling_content_startpause_button::before
{
    background-color: var(--accent_color_secondary);
}

.element_rolling_content_preset_inverted .element_rolling_content_startpause_button:hover::before { background-color: var(--color_white); }
.element_rolling_content_preset_inverted .element_rolling_content_startpause_button:hover > .element_rolling_content_startpause_button_text {color: var(--accent_color_secondary); }

.element_rolling_content_preset_inverted .element_rolling_content_button
{
    border: 1px solid var(--color_white);
    background-color: var(--accent_color_secondary);
}

.element_rolling_content_preset_inverted .element_rolling_content_button:hover { background-color: var(--color_gray); }
.element_rolling_content_preset_inverted .element_rolling_content_button[data-is_active] { background-color: var(--color_white); }